From 1d6c49f944df4f2ca8ecee7a0b6be5f406bbcf86 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Pham=20Hoang=20Manh/=28Pham=20Hoang=20Manh=29/=ED=98=84?= =?UTF-8?q?=EC=9E=A5=EB=8C=80=EB=A6=AC=EC=9D=B8/SK?= <20074606@skcc.com> Date: Wed, 20 Aug 2025 12:38:22 +0900 Subject: [PATCH] add paging for screen 2 12 --- pages/comm/base/NoticeMngPage.vue | 109 ++++++++++++++---------- pages/ems/base/PastRsltDataReadPage.vue | 2 +- pages/ems/effc/EnrgUsePlanPage.vue | 55 +++++++++--- store/modules/list.js | 4 + 4 files changed, 116 insertions(+), 54 deletions(-) diff --git a/pages/comm/base/NoticeMngPage.vue b/pages/comm/base/NoticeMngPage.vue index 6f38061..ab7e251 100644 --- a/pages/comm/base/NoticeMngPage.vue +++ b/pages/comm/base/NoticeMngPage.vue @@ -4,7 +4,7 @@
-
+
공지사항 @@ -15,11 +15,15 @@
- -
+ +
+
+ +
@@ -37,7 +41,7 @@ class="mr-1" icon="unordered-list">목록 - $icoSend + $icoSend 답글 파일목록 -
+
mdi-paperclip @@ -93,15 +94,14 @@ + :class="[isDarkMode ? 'toastui-editor-dark' : 'toastui-editor-light']" /> 파일첨부
+ :class="['file-item d-flex justify-space-between', isDarkMode ? 'dark' : 'light']">
mdi-paperclip {{ fileData.name }} @@ -110,17 +110,16 @@ @click="writeActionData.업로드fileData.splice(index, 1)" />
- + 업로드 - 취소 + 취소 등록 @@ -142,15 +141,14 @@ - + 파일첨부
+ :class="['file-item d-flex justify-space-between', isDarkMode ? 'dark' : 'light']">
mdi-paperclip {{ fileData.name }} @@ -159,7 +157,8 @@ @click="replyActionData.fileData.splice(index, 1)" />
- + 업로드 - 취소 + 취소 등록 @@ -195,14 +192,13 @@ + :class="[isDarkMode ? 'toastui-editor-dark' : 'toastui-editor-light']" /> 파일첨부
+ :class="['file-item d-flex justify-space-between', isDarkMode ? 'dark' : 'light']">
mdi-paperclip {{ fileData.name }} @@ -214,8 +210,7 @@
+ :class="['file-item d-flex justify-space-between', isDarkMode ? 'dark' : 'light']">
mdi-paperclip
- + 업로드 - 취소 + 취소 등록 @@ -258,6 +252,7 @@ import '@toast-ui/editor/dist/toastui-editor.css'; import { Editor } from '@toast-ui/vue-editor'; import '@toast-ui/editor/dist/toastui-editor-viewer.css'; import { Viewer } from '@toast-ui/vue-editor'; +import pagination from '~/components/common/Pagination'; let myTitle; // const myPrgmId = "PRG0034"; @@ -284,6 +279,7 @@ export default { Utility, Editor, Viewer, + pagination, }, data() { return { @@ -298,6 +294,11 @@ export default { loadGrid: false, selectedRowKey: null, selectedRowData: null, + itemsPerPage: 10, + itemsPerPageArray: [10, 20, 30], + limit: 20, + page: 1, + totalCount: 0, writeActionData: { title: '', postNo: null, @@ -339,7 +340,10 @@ export default { }, watch: { chkIsFind(val) { - if (val) this.search(); + if (val) { + this.page = 1; + this.search(); + } }, }, async beforeCreate() { @@ -425,7 +429,7 @@ export default { this.getGridData(); }, gridInit() { - const gridHeight = this.$refs.contents.offsetHeight - 76; + const gridHeight = this.$refs.contents.offsetHeight - 120; const myOptions = { header: { @@ -497,16 +501,29 @@ export default { async getGridData() { var params = { bordNo: 'BORD0001', + limit: this.limit, + page: this.page, + offset: (this.page - 1) * this.limit, // MariaDB Query에서 직접 계산이 안됨 }; this.loadGrid = false; const res = await this.postApiReturn({ - apiKey: 'selectPostList', - resKey: 'postData', + apiKey: 'selectPostPage', + resKey: 'postPage', sendParam: params, }); + const res2 = await this.postApiReturn({ + apiKey: 'selectPostPageTotal', + resKey: 'postPageTotal', + sendParam: { + bordNo: 'BORD0001', + } + }); + + this.totalCount = res2[0].totalcount; + this.setGridData({ gridKey: this.gridName, value: res, @@ -1038,6 +1055,12 @@ export default { return resultFlag; }, + changeGrid: async function (pageNum, limit) { + this.page = pageNum; + this.limit = limit; + + this.search(); + }, }, }; @@ -1090,7 +1113,7 @@ const defaultData = { @each $theme in dark, light { @include theme($theme); - + ::v-deep { .toastui-editor-#{$theme} { .toastui-editor-mode-switch { @@ -1098,7 +1121,7 @@ const defaultData = { border: none; background-color: transparent; color: map-deep-get($config, #{$theme}, "card-title-color") !important; - + &.active { color: map-deep-get($config, #{$theme}, "card-text-info-color") !important; border-top: 1px solid map-deep-get($config, #{$theme}, "card-text-info-color"); @@ -1106,7 +1129,7 @@ const defaultData = { } } - + } } diff --git a/pages/ems/base/PastRsltDataReadPage.vue b/pages/ems/base/PastRsltDataReadPage.vue index 3679e8a..1c8ca9b 100644 --- a/pages/ems/base/PastRsltDataReadPage.vue +++ b/pages/ems/base/PastRsltDataReadPage.vue @@ -38,7 +38,7 @@
-
+
diff --git a/pages/ems/effc/EnrgUsePlanPage.vue b/pages/ems/effc/EnrgUsePlanPage.vue index e86ff17..599579e 100644 --- a/pages/ems/effc/EnrgUsePlanPage.vue +++ b/pages/ems/effc/EnrgUsePlanPage.vue @@ -32,15 +32,19 @@ - +
설비별 에너지 계획 리스트
-
+
+
+ +
@@ -57,7 +61,7 @@ import Grid from '~/components/common/Grid'; import Utility from '~/plugins/utility'; import Buttons from '~/components/common/button/Buttons'; import EnrgUsePlanModiPop from '~/components/common/modal/EnrgUsePlanModiPop'; -import DateUtility from '~/plugins/dateUtility'; +import pagination from '~/components/common/Pagination'; let myTitle; let myPrgmId; @@ -86,6 +90,7 @@ export default { Grid, Buttons, EnrgUsePlanModiPop, + pagination }, data() { return { @@ -104,7 +109,11 @@ export default { fromDt: new Date().getFullYear(), rowKey: null, edtingFinishFlag: 'Y', - // gridName: 'rowGrid', + itemsPerPage: 10, + itemsPerPageArray: [10, 20, 30], + limit: 20, + page: 1, + totalCount: 0, }; }, computed: { @@ -134,7 +143,10 @@ export default { this.fromDt = val; }, chkIsFind(val) { - if (val) this.search(); + if (val) { + this.page = 1; + this.search(); + } }, async selectValue01(val) { if (this.initedFlag) { @@ -265,7 +277,7 @@ export default { gridInit() { this.loadGrid = false; let _this = this; - const gridHeight = this.$refs.gridParent.offsetHeight - 50; + const gridHeight = this.$refs.gridParent.offsetHeight - 40; let yyyyCol = this.pageData.fromDt + '년'; let childCols1 = []; let myComplexColumns = [ @@ -358,14 +370,14 @@ export default { { header: 'FAB', name: 'fab', - width: 100, + width: 85, align: 'left', // hidden: true, }, { header: '공정명', name: 'eccNm', - width: 100, + width: 150, align: 'left', hidden: true, }, @@ -415,7 +427,7 @@ export default { { header: '구분', name: 'gubun', - width: 200, + width: 150, align: 'left', // hidden: true, formatter({ value }) { @@ -447,7 +459,7 @@ export default { myColumns.push({ header: i.toString() + '월', name: qty, - width: 80, + width: 70, align: 'right', editor: 'text', formatter: this.numberFormatter, @@ -500,8 +512,25 @@ export default { pastDt: parseInt(this.fromDt) - 1, eqpmGrpId: this.selectValue03, eccId: this.selectValue01, + limit: this.limit, + page: this.page, + offset: (this.page - 1) * this.limit, // MariaDB Query에서 직접 계산이 안됨 }, }); + + const res2 = await this.postApiReturn({ + apiKey: 'selectEnrgUsePlanPageTotal', + resKey: 'enrgUsePlanPageTotal', + sendParam: { + fromDt: this.fromDt, + pastDt: parseInt(this.fromDt) - 1, + eqpmGrpId: this.selectValue03, + eccId: this.selectValue01, + }, + }); + + this.totalCount = res2[0].totalcount; + let fabText = this.pageData.eccIdList.filter(item => { return item.value == this.selectValue01; })[0]['text']; @@ -734,6 +763,12 @@ export default { } } }, + changeGrid: async function (pageNum, limit) { + this.page = pageNum; + this.limit = limit; + + this.search(); + }, }, }; const dt = new Date(); diff --git a/store/modules/list.js b/store/modules/list.js index 8b7fe8a..74b5f0b 100644 --- a/store/modules/list.js +++ b/store/modules/list.js @@ -514,6 +514,8 @@ const INIT_URL_STATE = { // prgmId: "PRG0003" 공지사항 selectPostList: 'comm/base/NoticeMngCtr/selectPostList', + selectPostPage: 'comm/base/NoticeMngCtr/selectPostPage', + selectPostPageTotal: 'comm/base/NoticeMngCtr/selectPostPageTotal', deletePostList: 'comm/base/NoticeMngCtr/deletePost', //prgmId: "PRG0121" 공지사항 게시물 상세조회 @@ -902,6 +904,8 @@ const INIT_URL_STATE = { //prgmId: PRG0079 에너지사용량계획 selectFabCodeList: 'ems/effc/EnrgUsePlanCtr/selectFabCodeList', selectEnrgUsePlanData: 'ems/effc/EnrgUsePlanCtr/selectEnrgUsePlanData', + selectEnrgUsePlanPageTotal: 'ems/effc/EnrgUsePlanCtr/selectEnrgUsePlanPageTotal', + saveEmsEqpmMmPlanDatas: 'ems/effc/EnrgUsePlanCtr/saveEmsEqpmMmPlanDatas', //prgmId : PRG0080 에너지 사용량 - Total Summary -- 2.50.1.windows.1