hotfix grid

Reviewed-on: #15

assets/scss/common.scss

@@ -144,7 +144,7 @@ a {
 
   & .router-tab__container {
     overflow-y: auto;
-    min-height: calc(100vh - 105px);
+    height: calc(100vh - 105px);
     max-height: calc(100vh - 105px);
     padding: 20px;
   }

assets/scss/common/text.scss

@@ -63,6 +63,12 @@
   line-height: 1.25 !important;
 }
 
+.custom-title-7 {
+  font-size: 0.875rem !important;
+  font-weight: 400 !important;
+  line-height: 22px !important;
+}
+
 .custom-title-8 {
   font-size: 0.75rem !important;
   font-weight: 700 !important;
@@ -76,15 +82,15 @@
 
 .custom-text-2 {
   opacity: 0.6;
-  font-family: SpoqaHanSansNeo;
   font-size: 14px;
-  font-weight: normal;
-  font-stretch: normal;
-  font-style: normal;
   line-height: 2.17;
-  letter-spacing: normal;
-  text-align: right;
-  color: #fff;
+  // font-weight: normal;
+  // font-stretch: normal;
+  // font-style: normal;
+  // letter-spacing: normal;
+  // text-align: right;
+  // color: #fff;
+  // font-family: SpoqaHanSansNeo;
 }
 
 .text-color--white-0 {

components/pages/ems/EqpmInfo/EqpmAddInfoTab.vue

@@ -20,7 +20,6 @@
 				:editorGrid="true"
 				:innerTabGridInfo="innerTabGridInfo"
 				@getRowsData="getRowData"
-				:dataPath="dataPathMock"
 			/>
 		</div>
 	</div>
@@ -52,7 +51,7 @@ export default {
 	},
 	data() {
 		return {
-			loadGrid: true,
+			loadGrid: false,
 			gridName: 'rowDetailGrid',
 			rowKey: null,
 			edtingFinishFlag: 'Y',
@@ -343,7 +342,9 @@ export default {
 				value: myColumns,
 			});
 
-			this.loadGrid = true;
+			this.$nextTick(() => {
+				this.loadGrid = true;
+			});
 		},
 		async btnActions(action) {
 			let dataArr = [];

components/pages/ems/EqpmInfo/EqpmConstTab.vue

@@ -6,7 +6,7 @@
 		</div>
 		<div ref="gridParent" style="min-height: calc(100vh - 800px);">
 			<Grid :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="parentPrgmId"
-				@getRowsData="getRowData" :innerTabGridInfo="innerTabGridInfo" :dataPath="dataPathMock" />
+				@getRowsData="getRowData" :innerTabGridInfo="innerTabGridInfo" />
 		</div>
 		<div style="min-height: calc(100vh - 900px);" class="mt-4">
 			<component :is="'Form'" :parentPrgmId="parentPrgmId" :bindingData="gridName" :detailList="detailList"
@@ -41,7 +41,7 @@ export default {
 	},
 	data() {
 		return {
-			loadGrid: true,
+			loadGrid: false,
 			gridName: 'rowEqpmConstGrid',
 			detailList: myEqpmConstDetail,
 
@@ -232,7 +232,9 @@ export default {
 				value: myColumns,
 			});
 
-			this.loadGrid = true;
+			this.$nextTick(() => {
+				this.loadGrid = true;
+			});
 		},
 		async getRowData(data, gridName) {
 			if (data.rowStat === 'I') {

components/pages/ems/EqpmInfo/EqpmIaoTab.vue

@@ -19,7 +19,6 @@
 				:parentPrgmId="parentPrgmId"
 				@getRowsData="getRowData"
 				:innerTabGridInfo="innerTabGridInfo"
-				:dataPath="dataPathMock"
 			/>
 		</div>
 		<div style="min-height: calc(100vh - 900px);" class="mt-4">
@@ -60,7 +59,7 @@ export default {
 	},
 	data() {
 		return {
-			loadGrid: true,
+			loadGrid: false,
 			gridName: 'rowEqpmIaoGrid',
 			detailList: myEqpmIaoDetail,
 
@@ -297,7 +296,9 @@ export default {
 				value: myColumns,
 			});
 
-			this.loadGrid = true;
+			this.$nextTick(() => {
+				this.loadGrid = true;
+			});
 		},
 		async getRowData(data, gridName) {
 			if (data.rowStat === 'I') {

mixin/global.js

@@ -58,7 +58,7 @@ export default {
 		layoutInit() {
 			if (this.$refs.searchFilter) {
 				const searchFilterHeight = this.$refs.searchFilter.offsetHeight;
-				this.$refs.contents.style.minHeight = `calc(100% - ${searchFilterHeight + 20}px)`;
+				this.$refs.contents.style.height = `calc(100% - ${searchFilterHeight + 20}px)`;
 			}
 		},
 		//init() {}

pages/comm/base/NoticeMngPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<!-- 리스트 페이지 시작 -->
 		<div v-if="pageActionFlag == 'list'" class="h1001">
 			<v-card class="" >
@@ -16,11 +16,9 @@
 							</div>
 						</v-col>
 						<v-col :cols="12" ref="contents" class="mt-5" style="min-height: calc(100% - 76px);">
-							<div ref="gridParent" class="h100 px-50">
-								<!-- <component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="myPrgmId"
-									 @getRowsData="getRowData" /> -->
+							<div ref="gridParent" class="px-50" style="min-height: 70vh;">
 								<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="myPrgmId"
-                  @getRowsData="getRowData" :selectedRowDataWatchFlag="true" />
+									 @getRowsData="getRowData" />
 							</div>
 						</v-col>
 					</v-row>
@@ -29,7 +27,7 @@
 		</div>
 		<!-- 리스트 페이지 끝 -->
 		<!-- 상세보기 페이지 시작 -->
-		<div v-if="pageActionFlag == 'view'" class="h1001">
+		<div v-if="pageActionFlag == 'view'" >
 			<v-card>
 				<v-row class="pa-5">
 					<v-col :cols="12" class="d-flex align-center justify-space-between ">
@@ -47,25 +45,25 @@
 							<a-button @click="viewPageButtonGroupClickEvent('delete')" type="danger" ghost icon="delete">삭제</a-button>
 						</div>
 					</v-col>
-					<v-col :cols="12">
-						<p class="custom-title-3 mb-2"> 제목 </p>
-						<v-text-field v-model="viewActionData.title" class="v-input__custom" hide-details :readonly="true">
-						</v-text-field>
+					<v-col :cols="12" class="mt-5">
+						<v-card-title class="custom-title-6 pa-0">{{ viewActionData.title }}</v-card-title>
 					</v-col>
-					<v-col :cols="12" style="min-height:calc(90vh - 218px);" class="pa-5">
+					<v-col :cols="12" style="min-height: 30vh;" class="pa-0">
 						<viewer v-if="viewActionData.viewerFlag" ref="tuiViewer" height="inherit"
 							:initialValue="viewActionData.content" theme="white"
-							:class="isDarkMode ? 'theme--white' : 'theme--black'" />
+							:class="[isDarkMode ? 'theme--white' : 'theme--black', 'custom-view pa-3']" />
 					</v-col>
-					<v-col :cols="6">
-						<p class="custom-title-3 mb-2">파일목록</p>
+					<v-col :cols="6" class="mt-5">
+						<v-card-title class="custom-title-7 pa-0">
+							파일목록
+						</v-card-title>
 						<div v-for="fileData in viewActionData.fileData" 
 							:key="fileData.apndFileId" 
 							class="file-item">
 							<a @click.prevent="downloadFile(fileData)">
-								<div class="d-flex justify-space-between search-box-label">
+								<div class="d-flex justify-start search-box-label">
 									<v-icon>mdi-paperclip</v-icon>
-									<span class="file-item-name">{{ fileData.apndFileNm + '.' + fileData.apndFileExt }}</span>
+									<span class="file-item-name ml-2">{{ fileData.apndFileNm + '.' + fileData.apndFileExt }}</span>
 								</div>
 							</a>
 						</div>
@@ -75,28 +73,24 @@
 		</div>
 		<!-- 상세보기 페이지 끝 -->
 		<!-- 작성 페이지 시작 -->
-		<div v-if="pageActionFlag == 'write'" class="h1001">
+		<div v-if="pageActionFlag == 'write'" >
 			<v-card>
 				<div class="pa-5">
 					<v-row class="pa-50">
 						<v-col :cols="12" class="">
 							<v-card-title class="custom-title-4 pa-0">공지사항</v-card-title>
 						</v-col>
-						<v-col :cols="12" class="custom-title-4-new mt-4">
-							<p class="custom-title-3 mb-2">제목</p>
+						<v-col :cols="12" class="mt-4">
+							<v-card-title class="custom-title-7 pa-0">제목</v-card-title>
 							<v-text-field v-model="writeActionData.title" class="v-input__custom" hide-details outlined>
 							</v-text-field>
 						</v-col>
-						<v-col :cols="12" style="min-height: calc(90vh - 270px);">
+						<v-col :cols="12" style="min-height: calc(100vh - 450px);">
 							<editor ref="tuiEditor" height="100%" initialEditType="wysiwyg" />
 						</v-col>
 	
-						<v-col :cols="12" class="mt-2">
-							<p class="custom-title-3 mb-2">
-								파일첨부
-							</p>
-						</v-col>
-						<v-col :cols="6">
+						<v-col :cols="6" class="mt-5">
+							<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
 							<div class="" v-if="writeActionData.fileData">
 								<div 
 									v-for="(fileData, index) in writeActionData.fileData" 
@@ -132,25 +126,23 @@
 		</div>
 		<!-- 작성 페이지 끝 -->
 		<!-- 답글 작성 페이지 시작 -->
-		<div v-if="pageActionFlag == 'reply'" class="h1001">
+		<div v-if="pageActionFlag == 'reply'" >
 			<v-card class="pa-5">
 				<v-row align="center" class="mt-0">
 					<v-col :cols="12" class="">
 						<v-card-title class="custom-title-4 pa-0">공지사항</v-card-title>
 					</v-col>
-					<v-col :cols="12">
-						<p class="custom-title-3 mb-2">제목</p>
-						<v-text-field v-model="replyActionData.title" class="v-input__custom" placeholder="제목" outlined
+					<v-col :cols="12" class="mt-4">
+						<v-card-title class="custom-title-7 pa-0">제목</v-card-title>
+						<v-text-field v-model="replyActionData.title" class="v-input__custom" outlined
 							hide-details>
 						</v-text-field>
 					</v-col>
 					<v-col :cols="12" style="height: calc(100vh - 270px);" class="mt-2">
 						<editor ref="tuiReplyEditor" height="100%" initialEditType="wysiwyg" />
 					</v-col>
-					<v-col :cols="6" class="mt-4">
-						<p class="custom-title-3 mb-2">
-							파일첨부
-						</p>
+					<v-col :cols="6" class="mt-5">
+						<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
 						<div class="" v-if="replyActionData.fileData">
 							<div 
 								v-for="(fileData, index) in replyActionData.fileData" 
@@ -178,7 +170,7 @@
 		</div>
 		<!-- 답글 작성 페이지 끝 -->
 		<!-- 수정 페이지 시작 -->
-		<div v-if="pageActionFlag == 'update'" class="h1001">
+		<div v-if="pageActionFlag == 'update'" >
 			<v-card>
 				<div class="pa-5">
 					<v-row align="center" no-gutters>
@@ -186,16 +178,16 @@
 							<v-card-title class="custom-title-4 pa-0">공지사항</v-card-title>
 						</v-col>
 						<v-col :cols="12" class="mt-4">
-							<p class="custom-title-3 mb-2">제목</p>
-							<v-text-field v-model="updateActionData.title" class="v-input__custom" placeholder="" hide-details outlined>
+							<v-card-title class="custom-title-7 pa-0">제목</v-card-title>
+							<v-text-field v-model="updateActionData.title" class="v-input__custom" hide-details outlined>
 							</v-text-field>
 						</v-col>
 						<v-col :cols="12" style="height: calc(90vh - 270px);" class="mt-4" >
 							<editor ref="tuiUpdateEditor" height="100%" initialEditType="wysiwyg"
 								:initialValue="updateActionData.content" />
 						</v-col>
-						<v-col :cols="6">
-								<p class="pa-0 mb-2 custom-title-4-new-1">파일첨부</p>
+						<v-col :cols="6" class="mt-5">
+								<v-card-title class="custom-title-7 pa-0">파일첨부</v-card-title>
 								<div class="" v-if="updateActionData.fileData">
 									<div 
 										v-for="(fileData, index) in updateActionData.fileData"
@@ -406,7 +398,6 @@ export default {
 			this.getGridData();
 		},
 		gridInit() {
-			this.loadGrid = false;
 			const gridHeight = this.$refs.contents.offsetHeight - 76;
 
 			const myOptions = {};
@@ -470,13 +461,6 @@ export default {
 				gridKey: this.gridName,
 				value: columnList,
 			});
-
-			// // -----------------------TEST------------------
-			// this.dataPathMock[this.gridName] = {
-			// 	column: columnList,
-			// 	data: dataPathDataExample,
-			// }
-			// // -----------------------END TEST--------------
 			this.getGridData();
 		},
 		async getGridData() {
@@ -491,26 +475,15 @@ export default {
 				resKey: 'postData',
 				sendParam: params,
 			});
-
-			// console.log('----------DEBUG--------res: ', res);
-			const newRes = res.map(item => {
-        const newObj = {
-          ...item,
-          rowStat: null,
-          dataSetId: item.dataSetId,
-          dataSetNm: item.dataSetNm,
-          useFg: item.useFg === '1' ? true : false, // 화면 개발 편의를 위해 boolean 타입으로 교체, 저장시 "1", "0" 으로 바꿔 보내야 함
-        };
-        return newObj;
-      });
-
+			
 			this.setGridData({
 				gridKey: this.gridName,
-				value: newRes,
+				value: res,
+			});
+			this.$nextTick(() => {
+				this.loadGrid = true;
 			});
-
 			this.setPageData({ isFind: false });
-			this.loadGrid = true;
 		},
 		getRowData(data) {
 			this.selectedRowKey = data.rowKey;
@@ -1073,4 +1046,19 @@ const dataPathDataExample = getPathDataExample({
 		color: #1677FF;
 	}
 }
+::v-deep {
+	.v-input__slot {
+		padding-left: 8px;
+		padding-right: 8px;
+	}
+	.custom-view {
+		border: 1px solid;
+		border-radius: 6px;
+		height: 100%;
+		@each $theme in dark, light {
+			@include theme($theme);
+			border-color: map-deep-get($config, #{$theme}, "v-input-textarea-border");;
+		}
+	}
+}
 </style>

pages/ems/base/EffcIdxMngPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter" class="mt-2">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/base/EnrgReadPlaceMngPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter" class="mt-2">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/base/EqpmGrpPysclQtyMngPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div ref="mainDiv" class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter" class="mt-2">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/base/EquipmentMasterMngPage.vue

@@ -1,5 +1,6 @@
 <template>
 	<div class="l-layout">
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">
@@ -34,23 +35,23 @@
 			</v-col>
 		</v-row>
 		<v-row ref="contents">
-			<v-col :cols="5" class="h100">
+			<v-col :cols="5" >
 				<v-card class="pb-5">
 					<div class="d-flex align-center justify-space-between pa-5">
 						<v-card-title class="pa-0 custom-title-4">설비 정보</v-card-title>
 						<Buttons :parentPrgmId="myPrgmId" :bindingData="gridName" :detailList="detailList"
 							:btnActionsFnc="btnActions" />
 					</div>
-					<div class="px-5" style="min-height:calc(100% - 76px)">
-						<div ref="gridParent" class="w100 h100">
-							<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="myPrgmId"
-								@getRowsData="getRowData" @sendSelectedRowStatInfo="getSelectedRowStatInfo"
-								:selectedRowDataWatchFlag="true" :preventFocusChangeEventFlag="false" :dataPath="dataPathMock" />
-						</div>
+					<div ref="gridParent" class="px-5" style="min-height:60vh;">
+						<component :ref="gridName" :is="loadGrid ? 'Grid' : null" :gridName="gridName" :parentPrgmId="myPrgmId"
+							@getRowsData="getRowData" @sendSelectedRowStatInfo="getSelectedRowStatInfo"
+							:selectedRowDataWatchFlag="true" :preventFocusChangeEventFlag="false" />
+						<!-- <div ref="gridParent" class="w100 h100">
+						</div> -->
 					</div>
 				</v-card>
 			</v-col>
-			<v-col :cols="7" class="h100">
+			<v-col :cols="7" >
 				<v-card class="pb-5">
 					<v-card-title class="custom-title-4" style="min-height:76px;">설비 상세</v-card-title>
 					<div class="px-5" style="min-height:calc(100% - 76px)">
@@ -287,7 +288,7 @@ export default {
 					blocId: this.userInfo.blocId,
 				},
 			});
-			console.log('res : ', res);
+			// console.log('res : ', res);
 			res.map(item => {
 				const it = { text: item.ercNm, value: item.ercId };
 				ercList.push(it);

pages/ems/base/GdIdxMngPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div ref="mainDiv" class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter" class="mt-2">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/base/GdStndMngPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div ref="mainDiv" class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter" class="mt-2">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/base/ReadObjectMngPage.vue

@@ -59,18 +59,16 @@
 							:btnActionsFnc="btnActions"
 						/>
 					</div>
-					<div class="h100 px-5" style="height:calc(100% - 70px)">
-						<div ref="gridParent" class="w100 h100">
-							<component
-								:ref="gridName"
-								:is="loadGrid ? 'Grid' : null"
-								:gridName="gridName"
-								:parentPrgmId="myPrgmId"
-								@getRowsData="getRowData"
-								@sendSelectedRowStatInfo="getSelectedRowStatInfo"
-								:selectedRowDataWatchFlag="true"
-							/>
-						</div>
+					<div ref="gridParent" class="h100 px-5" style="height:calc(100% - 70px)">
+						<component
+							:ref="gridName"
+							:is="loadGrid ? 'Grid' : null"
+							:gridName="gridName"
+							:parentPrgmId="myPrgmId"
+							@getRowsData="getRowData"
+							@sendSelectedRowStatInfo="getSelectedRowStatInfo"
+							:selectedRowDataWatchFlag="true"
+						/>
 					</div>
 				</v-card>
 			</v-col>

pages/ems/base/ReadResultCloseMngPage.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="l-layout">
-    <common-page-title />
+    <CommonPageTitle />
     <v-row ref="searchFilter">
       <!-- 조회조견 -->
       <v-col :cols="12">

pages/ems/effc/EnrgMapPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">

pages/ems/effc/EnrgUsePlanPage.vue

@@ -1,6 +1,6 @@
 <template>
 	<div ref="mainDiv" class="l-layout">
-		<common-page-title />
+		<CommonPageTitle />
 		<v-row ref="searchFilter">
 			<v-col :cols="12">
 				<v-card class="searchFilter">