assets/scss/common/grid.scss

@@ -17,18 +17,6 @@
     border: 0 !important;
   }
 
-  // &-body-container {
-  //   width: 100% !important;
-  // }
-
-  // &-table {
-  //   width: 100% !important;
-  // }
-
-  // &-lside-area .tui-grid-body-area {
-  //   margin-right: -11px;
-  // }
-
   &-lside-area .tui-grid-scrollbar-left-bottom {
     display: none;
   }
@@ -150,50 +138,28 @@
 
       &-body-container{
         border-right: 0;
-        // border-right-color: map-deep-get($config,
+        // position: relative;
-        //   #{$theme},
-        //   "tui-grid-cell-borderColor"
-        // );
         width: auto !important;
+
         .tui-grid-table-container{
-          width: 100% !important;
+          // width: 100% !important;
           .tui-grid-table {
-            width: 100% !important;
+            // width: 100% !important;
+            // table-layout: fixed;
+            // th, td {
+            //   &:last-child{
+            //     width: auto !important;
+            //   }
+            // }
           }
         }
       }
 
-      &-container,
+      &-summary-area,
-      &-summary-area {
+      &-container {
         font-family: Inter;
-        // color: #000000E0;
- 
-        & ::-webkit-scrollbar {
-          width: 0 !important;
-          height: $scrollbar-width !important;
-          -webkit-appearance: initial;
-          background-color: rgba(0, 0, 0, 0) !important;
-          border-radius: 3px !important;
-        }
-
-        & ::-webkit-scrollbar-track {
-          // background-color: map-deep-get($config,
-          //   #{$theme},
-          //   "tui-grid-cell-borderColor"
-          // ) !important;
-          background-color: rgba(0, 0, 0, 0) !important;
-        }
-
-        & ::-webkit-scrollbar-thumb {
-          // width: 50px !important;
-          height: 50px !important;
-          background-color: map-deep-get($config, #{$theme}, "scrollbar-thumb");
-          // background-color: rgba(0, 0, 0, 0);
-          border-radius: 3px;
-        }
  
         .tui-grid-cell {
-
           &.tui-grid-cell-summary {
             color: map-deep-get($config,
               #{$theme},
@@ -203,6 +169,32 @@
         }
       }
 
+      &-body-area {
+        overflow: auto;
+
+        &::-webkit-scrollbar {
+          width: $scrollbar-width !important;
+          height: $scrollbar-width !important;
+          -webkit-appearance: initial;
+          background-color: rgba(0, 0, 0, 0) !important;
+          border-radius: 3px !important;
+          // border-right: 1px solid;
+          // border-right-color: map-deep-get($config, #{$theme}, "tui-grid-cell-borderColor");
+        }
+
+        &::-webkit-scrollbar-track {
+          background-color: rgba(0, 0, 0, 0) !important;
+        }
+
+        &::-webkit-scrollbar-thumb {
+          height: 50px !important;
+          background-color: map-deep-get($config, #{$theme}, "scrollbar-thumb");
+          border-radius: 3px;
+          // width: 50px !important;
+          // background-color: rgba(0, 0, 0, 0);
+        }
+      }
+
       &-rside-area {
         background-color: map-deep-get($config, #{$theme}, "scrollbar-track");
       }
@@ -241,13 +233,13 @@
       &-scrollbar-right-bottom {
         width: $scrollbar-width !important;
         height: $scrollbar-width !important;
-        // display: none !important;
         border-color: map-deep-get($config, #{$theme}, "cardBackground");
         background-color: map-deep-get($config, #{$theme}, "cardBackground");
+        box-sizing: border-box;
+        // display: none !important;
         // border: none !important;
         // bottom: -1px;
         // right: -2px;
-        box-sizing: border-box;
         // display: none;
       }
 
@@ -358,10 +350,10 @@
           #{$theme},
           "tui-grid-cell-backgroundColor"
         );
-        width: 100% !important;
+        // width: 100% !important;
-        .tui-grid-table {
+        // .tui-grid-table {
-          width: 100% !important;
+        //   width: 100% !important;
-        }
+        // }
       }
 
       &-row-odd,

assets/scss/datepicker.scss

@@ -15,8 +15,9 @@
       border-radius: 6px;
       border: solid 1px;
       height: 32px;
-      // border-color: #424242;
+      color: map-deep-get($config, #{$theme}, "v-input-fieldset-color") !important;
-      border-color: map-deep-get($config, #{$theme}, "tui-datepicker-border-color");
+      border-color: currentColor;
+      // border-color: map-deep-get($config, #{$theme}, "tui-datepicker-border-color");
 
       &.datepicker-large {
         height: 40px;

components/common/modal/EqpmSelectPop.vue

@@ -36,21 +36,21 @@
 					<!-- <v-card class="searchFilter">
 					</v-card> -->
 					<v-row align="end" class="searchFilter">
-						<v-col :cols="3.5">
+						<v-col>
 							<!-- 설비그룹 -->
 							<component :is="'SelectBox'" :propsValue="selectValue01" :itemList="selectValueList01"
 								:label="'설비그룹'" :disabled="eqpmGrpDisabled"
 								@update:propsValue="selectValue01 = $event" :labelCols="12" :textCols="12"
 								:iconShow="true" />
 						</v-col>
-						<v-col :cols="3.5">
+						<v-col>
 							<!-- FAB -->
 							<component :is="'SelectBoxMulti'" :propsValue="selectValue02"
 								:itemList="selectValueList02" :label="'FAB'" :labelCols="12" :multiple="true"
 								:disabled="fabDisabled" @update:propsValue="selectValue02 = $event" :textCols="12"
 								:iconShow="true" />
 						</v-col>
-						<v-col :cols="3.5">
+						<v-col >
 							<v-row>
 								<v-col :cols="12" class="py-0">
 									<label for="" class="search-box-label">
@@ -70,7 +70,7 @@
 
 							</v-row>
 						</v-col>
-						<a-button icon="search" type="primary" @click="search()" class="search-button">조회</a-button>
+						<a-button icon="search" type="primary" @click="search()" class="mb-1 mr-2">조회</a-button>
 					</v-row>
 
 					<!-- <v-row align="center" no-gutters style="margin-top: 14px;">

components/pages/ems/EqpmInfo/EqpmAddInfoTab.vue

@@ -8,7 +8,7 @@
 				:btnActionsFnc="btnActions"
 			/>
 		</div>
-		<div ref="gridParent" style="height: calc(100vh - 520px);">
+		<div ref="gridParent" class="w100" style="height: calc(100vh - 520px);">
 			<Grid
 				:ref="gridName"
 				:is="loadGrid ? 'Grid' : null"
@@ -296,7 +296,7 @@ export default {
 				{
 					header: '추가 정보 값',
 					name: 'addInfoVal',
-					align: 'center',
+					align: 'left',
 					renderer: {
 						type: CustomRenderer,
 					},

components/pages/ems/EqpmInfo/EqpmIaoTab.vue

@@ -8,7 +8,7 @@
 				:btnActionsFnc="btnActions"
 			/>
 		</div>
-		<div ref="gridParent" style="height: calc(100vh - 800px);">
+		<div ref="gridParent" style="height: calc(100vh - 700px);">
 			<Grid
 				:ref="gridName"
 				:is="loadGrid ? 'Grid' : null"
@@ -18,7 +18,7 @@
 				:innerTabGridInfo="innerTabGridInfo"
 			/>
 		</div>
-		<div style="min-height: calc(100vh - 900px);" class="mt-4">
+		<div style="height: 60vh;" class="mt-5">
 			<component
 				:is="'Form'"
 				:parentPrgmId="parentPrgmId"
@@ -114,7 +114,7 @@ export default {
 				this.detailList[2].class = 'py-3 d-none';
 				this.detailList[3].class = 'py-3 pl-4 pt-1 d-none';
 
-				this.detailList[4].class = 'py-3';
+				this.detailList[4].class = 'py-3 pl-4';
 				this.detailList[5].class = 'py-3 pl-4';
 				this.detailList[6].class = 'py-3 pl-4 pt-0';
 			} else {
@@ -230,7 +230,7 @@ export default {
 				{
 					header: '대상 유형',
 					name: 'objKind',
-					align: 'center',
+					align: 'left',
 					formatter({ value }) {
 						var retVal = '';
 
@@ -261,7 +261,7 @@ export default {
 				{
 					header: '계산여부',
 					name: 'calcFg',
-					align: 'center',
+					align: 'left',
 					formatter({ value }) {
 						value = value === true ? '1' : '0';
 						const newValue = _this.pageData.useFgList.filter(
@@ -612,3 +612,10 @@ const myEqpmIaoDetail = [
 	},
 ];
 </script>
+<style lang="scss" scoped >
+::v-deep {
+	.tui-grid-layer-state {
+		top: 40px !important;
+	}
+}
+</style>

pages/comm/auth/MenuRoleMngPage.vue

@@ -55,7 +55,7 @@
 							<ActionButtons :parentPrgmId="myPrgmId" :leftGridName="gridName2" :rightGridName="gridName3"
 								:btnActionsFnc="dualGridBtnActions" />
 						</v-col> -->
-						<div class="px-2">
+						<div class="pr-2">
 							<ActionButtons :parentPrgmId="myPrgmId" :leftGridName="gridName2" :rightGridName="gridName3"
 								:btnActionsFnc="dualGridBtnActions" />
 						</div>

pages/ems/base/EquipmentMasterMngPage.vue

@@ -382,7 +382,7 @@ export default {
 					header: '사용 여부',
 					name: 'useFg',
 					width: 100,
-					align: 'center',
+					align: 'left',
 					formatter({ value }) {
 						const newValue = _this.pageData.useFgList.filter(
 							item => item.commCd == value,