From 1b2f1472a0dfb464d49a9ef252721caf1b5f1c76 Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期二, 14 五月 2024 14:24:44 +0800 Subject: [PATCH] 优化首页 --- src/components/view/b2-standard.vue | 62 +++++++++++++++++++++++++------ 1 files changed, 50 insertions(+), 12 deletions(-) diff --git a/src/components/view/b2-standard.vue b/src/components/view/b2-standard.vue index 46dba57..9725c6b 100644 --- a/src/components/view/b2-standard.vue +++ b/src/components/view/b2-standard.vue @@ -58,12 +58,15 @@ } .product_table .el-table { - height: 100%; + height: calc(100% - 35px) !important; } .sort { width: 80% !important; overflow: hidden; + } + >>>.el-table__body-wrapper{ + height: calc(100% - 46px) !important; } </style> <style> @@ -142,7 +145,7 @@ <!-- </el-col> --> </el-row> <el-row class="standard_table" v-loading="tableLoad"> - <el-table class="el-table" :data="standardList" style="width: 100%;" height="220" tooltip-effect="dark" + <el-table class="el-table" :data="standardList" style="width: 100%;height: 220px !important;" height="220" tooltip-effect="dark" highlight-current-row @row-click="rowClick" ref="standard"> <el-table-column prop="code" label="鏍囧噯缂栧彿" show-overflow-tooltip width="200"> <template slot-scope="scope"> @@ -161,8 +164,9 @@ </el-table> </el-row> <el-row class="product_table" v-loading="tableLoad2"> - <el-table :data="productList" ref="productTable" style="width: 100%;" height="100%" tooltip-effect="dark" stripe - :fit="true" border @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" + <el-table :data="pagedData" ref="productTable" style="width: 100%;" height="100%" tooltip-effect="dark" stripe + :fit="true" border + @selection-change="handleSelectionChange" :row-class-name="tableRowClassName" @select="upProductSelect" @select-all="handleAll"> <el-table-column type="selection" width="65"> </el-table-column> @@ -231,6 +235,14 @@ </template> </el-table-column> </el-table> + <el-pagination + style="position: absolute;right: 16px;bottom: 1px;" + @current-change="handleCurrentChange" + :current-page="currentPage" + :page-size="pageSize" + layout="total, prev, pager, next, jumper" + :total="total"> + </el-pagination> </el-row> </div> <el-dialog title="鍒嗙被娣诲姞" :visible.sync="addDia" width="400px"> @@ -428,7 +440,29 @@ sectionLoad: false, sectionRow: null, sectionList: [], - templateList: [] + templateList: [], + total:0, + pageSize:100, + currentPage:1, + } + }, + computed: { + pagedData() { + const start = (this.currentPage - 1) * this.pageSize; + const end = start + this.pageSize; + return this.productList.slice(start, end); + }, + }, + watch:{ + pagedData:{ + deep:true, + handler(val){ + setTimeout(() => { + val.forEach(a => { + if (a.state == 1) this.toggleSelection(a) + }) + }, 300) + } } }, mounted() { @@ -912,11 +946,12 @@ tree: this.selectTree }).then(res => { this.productList = res.data - setTimeout(() => { - this.productList.forEach(a => { - if (a.state == 1) this.toggleSelection(a) - }) - }, 300) + this.total = this.productList.length; + // setTimeout(() => { + // this.productList.forEach(a => { + // if (a.state == 1) this.toggleSelection(a) + // }) + // }, 300) this.tableLoad2 = false }) }, @@ -955,13 +990,13 @@ }, handleAll(e) { if (e.length > 0) { - this.productList.map(m => { + this.productList = this.productList.map(m => { m.state = 0 this.upProductSelect(null, m) return m }) } else { - this.productList.map(m => { + this.productList = this.productList.map(m => { m.state = 1 this.upProductSelect(null, m) return m @@ -1039,6 +1074,9 @@ this.templateList = res.data }) }, + handleCurrentChange(val) { + this.currentPage = val; + }, } } </script> -- Gitblit v1.9.3