diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index 0d76f4e..db33f5f 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -23,7 +23,7 @@
-
@@ -429,7 +429,8 @@ export default {
enlargeImgShow: false,
enlargeImg: '',
top: '',
- remark_level:[]//绩效提成经营分析品线等级下拉选择
+ tableHeight: 700, // 表格高度,会动态计算
+ remark_level: [] // 绩效提成经营分析品线等级下拉选择
}
},
computed: {
@@ -449,12 +450,36 @@ export default {
created () {
this.getList()
},
+ mounted() {
+ // 组件挂载后计算表格高度
+ this.calculateTableHeight();
+ // 监听窗口大小变化,动态调整表格高度
+ window.addEventListener('resize', this.calculateTableHeight);
+ },
+ beforeDestroy() {
+ // 组件销毁前移除事件监听
+ window.removeEventListener('resize', this.calculateTableHeight);
+ },
methods: {
updateRemark(val, rowIndex){
// 根据选中的二级品线查找对应的一级品线
const item = this.remark_level.find(i => i && i.remark_two === val.value);
this.tableData[rowIndex].remark1 = item.remark_one;
},
+ // 计算表格自适应高度
+ calculateTableHeight() {
+ // 获取浏览器窗口高度
+ const windowHeight = window.innerHeight;
+ // 获取表格容器上方元素的高度(这里需要根据实际情况调整)
+ // 假设上方操作栏和标题区域大约占用200px
+ const headerHeight = 200;
+ // 计算表格可用高度,减去一些边距和预留空间
+ this.tableHeight = windowHeight - headerHeight - 30; // 30px作为底部边距预留
+ // 确保表格高度不会太小
+ if (this.tableHeight < 300) {
+ this.tableHeight = 300;
+ }
+ },
enlarge (e, row) {
console.log(e)
this.enlargeImg = row.picture