|
|
@@ -1,5 +1,5 @@
|
|
|
<template>
|
|
|
- <div class="product-manage">
|
|
|
+ <div class="product-manage admin-page">
|
|
|
<el-card class="pm-card" shadow="never">
|
|
|
<!-- 页面标题区:唯一主操作「新增商品」,其余降为次按钮 -->
|
|
|
<div class="pm-header">
|
|
|
@@ -83,7 +83,7 @@
|
|
|
<div class="pm-table-wrap">
|
|
|
<el-table
|
|
|
ref="table"
|
|
|
- :max-height="tableHeight"
|
|
|
+ height="100%"
|
|
|
:data="list"
|
|
|
v-loading="loading"
|
|
|
border
|
|
|
@@ -322,7 +322,6 @@ export default {
|
|
|
return {
|
|
|
list: [],
|
|
|
loading: false,
|
|
|
- tableHeight: 480,
|
|
|
filters: {
|
|
|
keyword: '',
|
|
|
status: '',
|
|
|
@@ -347,19 +346,9 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.calcTableHeight()
|
|
|
- window.addEventListener('resize', this.calcTableHeight)
|
|
|
this.loadList()
|
|
|
},
|
|
|
- beforeDestroy() {
|
|
|
- window.removeEventListener('resize', this.calcTableHeight)
|
|
|
- },
|
|
|
methods: {
|
|
|
- calcTableHeight() {
|
|
|
- // 页面留白 24*2 + 卡片内边距 24*2 + 头部 32 + 筛选区 56 + 分页 56 ≈ 基准 300
|
|
|
- const offset = this.selectedIds.length ? 336 : 300
|
|
|
- this.tableHeight = Math.max(320, window.innerHeight - offset)
|
|
|
- },
|
|
|
async loadList() {
|
|
|
this.loading = true
|
|
|
try {
|
|
|
@@ -522,12 +511,10 @@ export default {
|
|
|
},
|
|
|
handleSelectionChange(rows) {
|
|
|
this.selectedIds = rows.map(r => r.id)
|
|
|
- this.calcTableHeight()
|
|
|
},
|
|
|
clearSelection() {
|
|
|
this.selectedIds = []
|
|
|
if (this.$refs.table) this.$refs.table.clearSelection()
|
|
|
- this.calcTableHeight()
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -659,7 +646,16 @@ export default {
|
|
|
}
|
|
|
|
|
|
/* ---------- 表格 ---------- */
|
|
|
+.pm-table-wrap {
|
|
|
+ flex: 1;
|
|
|
+ min-height: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+
|
|
|
.pm-table-wrap /deep/ .el-table {
|
|
|
+ flex: 1;
|
|
|
+ min-height: 0;
|
|
|
font-size: 14px;
|
|
|
border-radius: 6px;
|
|
|
}
|