diff --git a/assets/scss/common/grid.scss b/assets/scss/common/grid.scss index 095009b..aced6bc 100644 --- a/assets/scss/common/grid.scss +++ b/assets/scss/common/grid.scss @@ -56,25 +56,35 @@ font-weight: 400; } - + th[data-column-name="_checked"] { padding-left: 0; } + } -.tui-grid-table{ +.tui-grid-table { + .tui-grid-cell-header, .tui-grid-cell-has-input .tui-grid-cell-content { padding: 8px; } th[data-column-name="_checked"] { - &.tui-grid-cell-header { + &.tui-grid-cell-header { padding-left: 0; } - + + } + + .tui-grid-cell { + &:last-child { + input[type=checkbox] { + margin-top: 8px; + } + } } } @@ -99,8 +109,8 @@ @include theme($theme); .v-application.#{$theme}-mode { - .tui-grid-content-area{ - .tui-grid-header-area{ + .tui-grid-content-area { + .tui-grid-header-area { height: auto !important; } } @@ -115,9 +125,9 @@ "tui-grid-title-color" ); } - - .grid-toggle-section{ - .tui-grid-rside-area{ + + .grid-toggle-section { + .tui-grid-rside-area { .tui-grid-body-area { height: auto !important; @@ -145,16 +155,17 @@ } } - &-border-line-right{ + &-border-line-right { opacity: 0; } - &-body-container{ + &-body-container { border-right: 0; // position: relative; width: auto !important; - .tui-grid-table-container{ + .tui-grid-table-container { + // width: 100% !important; .tui-grid-table { // width: 100% !important; @@ -166,12 +177,19 @@ // } } } + + .tui-grid-layer-editing { + border-color: map-deep-get($config, + #{$theme}, + "tui-grid-border-vertical-color" + ); + } } &-summary-area, &-container { font-family: Inter; - + .tui-grid-cell { &.tui-grid-cell-summary { color: map-deep-get($config, @@ -285,7 +303,8 @@ #{$theme}, "ant-btn-primary-color" ); - .radio-mark{ + + .radio-mark { border-color: map-deep-get($config, #{$theme}, "arow-line-color" @@ -294,6 +313,7 @@ #{$theme}, "arow-line-btn-bg-color" ); + &::after { content: ""; position: absolute; @@ -311,12 +331,39 @@ } } } + + .tui-grid-cell-content { + + input[type='text'], + input[type='password'] { + border-color: map-deep-get($config, + #{$theme}, + "v-input-fieldset-color" + ); + background: map-deep-get($config, + #{$theme}, + "v-input-backgroundColor" + ); + border-radius: 4px; + color: map-deep-get($config, + #{$theme}, + "tui-grid-cell-color" + ); + } + + &.tui-grid-layer-editing { + background:map-deep-get($config, + #{$theme}, + "tui-grid-cell-insert-color" + ); + } + } } &-cell { &:last-child { padding-right: 1px; - border-right: 1px solid ; + border-right: 1px solid; border-right-color: map-deep-get($config, #{$theme}, "tui-grid-cell-borderColor" @@ -349,7 +396,7 @@ "tui-grid-border-vertical-color" ); color: map-deep-get($config, - #{$theme}, + #{$theme}, "tui-grid-header-color" ); @@ -395,14 +442,14 @@ background-color: map-deep-get($config, #{$theme}, "tui-grid-cell-insert-color" - ); + ) !important; } &.row-modify { background-color: map-deep-get($config, #{$theme}, "tui-grid-cell-modify-color" - ); + ) !important; } &.row-removed { @@ -497,6 +544,7 @@ &-tree-button-expand { z-index: 9999; + .tui-grid-btn-tree { i { width: 16px; @@ -516,6 +564,7 @@ &-tree-button-collapse { z-index: 9999; + .tui-grid-btn-tree { i { width: 16px; diff --git a/assets/scss/var.scss b/assets/scss/var.scss index 84c7cfa..94607bc 100644 --- a/assets/scss/var.scss +++ b/assets/scss/var.scss @@ -113,7 +113,7 @@ $config: ( tui-grid-cell-color: #FFFFFFD9, tui-grid-cell-insert-color: #2B2111, tui-grid-cell-selected-color: #0A224F, - tui-grid-cell-modify-color: #13636c, + tui-grid-cell-modify-color: #2B2111, tui-grid-cell-removed-color: #2A1215, tui-grid-cell-disabled-color: rgb(170, 170, 170), tui-grid-cell-hover-backgroundColor: #2d4571, @@ -263,7 +263,7 @@ $config: ( tui-grid-cell-color: #000000E0, tui-grid-cell-insert-color: #FFFBE6, tui-grid-cell-selected-color: #E6F4FF, - tui-grid-cell-modify-color: #e6f5f7, + tui-grid-cell-modify-color: #FFFBE6, tui-grid-cell-removed-color: #FFF1F0, tui-grid-cell-hover-backgroundColor: #f5f5f5, v-tabs-items-border-color: #0000000F, diff --git a/components/common/Grid.vue b/components/common/Grid.vue index 7e42752..e77da25 100644 --- a/components/common/Grid.vue +++ b/components/common/Grid.vue @@ -301,7 +301,7 @@ export default { // console.log('startEditing2...') if (this.editorGrid && e.rowKey >= 0) { this.editorStartKey = e.rowKey; - this.gridInstance.invoke('startEditing', e.rowKey, e.columnName); + this.gridInstance.invoke('startEditing', e.rowKey, e.columnName, 'row-modify'); this.$emit( 'getRowsData', this.gridInstance.invoke('getRow', e.rowKey), diff --git a/components/common/modal/PlanPop.vue b/components/common/modal/PlanPop.vue index ec2306b..e7ba0d6 100644 --- a/components/common/modal/PlanPop.vue +++ b/components/common/modal/PlanPop.vue @@ -238,7 +238,13 @@ export default { type: Object, require: false, default: () => { - return {}; + return { + selectTimeValue1: "00 : 00", // selectBoxTime에 필요한 prop + selectTimeValueList1: [], // selectBoxTime에 필요한 prop + selectTimeValue2: "01 : 00", // selectBoxTime에 필요한 prop + selectTimeValueList2: [], // selectBoxTime에 필요한 prop + minInterval: 10, + }; }, }, }, @@ -536,8 +542,8 @@ export default { let returnData = res[0]; this.strtDt = Utility.setFormatDate(returnData.strtDt, 'YYYY-MM-DD'); this.endDt = Utility.setFormatDate(returnData.endDt, 'YYYY-MM-DD'); - this.selectTimeValue1 = returnData.strtHh+' : '+ returnData.strtMm; - this.selectTimeValue2 = returnData.endHh+' : '+ returnData.endMm; + this.selectTimeValue1 = returnData.strtHh + ' : ' + returnData.strtMm; + this.selectTimeValue2 = returnData.endHh + ' : ' + returnData.endMm; this.planTitle = returnData.planTitle; this.planCntn = returnData.planCntn; this.planColor = returnData.planColor; diff --git a/components/common/select/SelectBoxTime.vue b/components/common/select/SelectBoxTime.vue index 1046a54..ceffd67 100644 --- a/components/common/select/SelectBoxTime.vue +++ b/components/common/select/SelectBoxTime.vue @@ -20,7 +20,7 @@ item-value="value" solo outlined - :menu-props="{ auto: true, offsetY: true }" + :menu-props="{ top: false, offsetY: true }" :hide-details="true" :class="['v-select__custom', customClass]" :disabled="disabled"