From 4d442ecc7777373d4acf4abdc40d9c3324fa8dcd Mon Sep 17 00:00:00 2001
From: liangjiami <2249412933@qq.com>
Date: Thu, 13 Nov 2025 14:48:04 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=B8=8B=E5=90=8D=E7=A7=B0?=
 =?UTF-8?q?=E7=A1=AC=E7=9B=98/=E8=BF=90=E8=B4=B9/=E5=85=B6=E4=BB=96--DDR?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/index/index.vue  | 41 +++++++++++++++++++++++++++-----------
 src/views/index/oindex.vue |  2 +-
 2 files changed, 30 insertions(+), 13 deletions(-)

diff --git a/src/views/index/index.vue b/src/views/index/index.vue
index d630b07..ba46b3a 100644
--- a/src/views/index/index.vue
+++ b/src/views/index/index.vue
@@ -22,7 +22,7 @@
     </div>
     <!--表格-->
     <div class="bg_white table_90 m-t-10 border-r-10 text-black f-12">
-      <vxe-table border resizable show-overflow ref="xTable" height="700" :scroll-x="{ enabled: false }"
+      <vxe-table border resizable show-overflow ref="xTable" :height="tableHeight" :scroll-x="{ enabled: false }"
         :scroll-y="{ enabled: false }" :header-row-style="header_style" :data="tableData" :edit-config="editConfig">
         <vxe-colgroup title="基本信息" header-align="center" fixed="left" resizable>
           <!-- <vxe-colgroup title="品牌" header-align="center">
@@ -206,7 +206,7 @@
               <vxe-input v-model="row.process_cost" type="text"></vxe-input>
             </template>
           </vxe-column>
-          <vxe-column field="other_cost" title="硬盘/运费其他" width="80" header-align="center" align="right"
+          <vxe-column field="other_cost" title="硬盘/运费/其他/DDR" width="80" header-align="center" align="right"
             :edit-render="{ autofocus: '.vxe-input--inner' }">
             <template #edit="{ row }">
               <vxe-input v-model="row.other_cost" type="text"></vxe-input>
@@ -336,13 +336,13 @@
             {{ row.remark1 }}
           </template>
         </vxe-column>
-        <vxe-column field="remark2" title="绩效提成经营分析品线(二级)" width="80" header-align="center" align="right"
+        <vxe-column field="remark2" title="绩效提成经营分析品线(二级)" width="100" header-align="center" align="right"
           :edit-render="{}">
           <template #default="{ row }">
             {{ row.remark2}}
           </template>
           <template #edit="{ row, $rowIndex }">
-            <vxe-select v-model="row.remark2" @change="val => updateRemark(val, $rowIndex)">
+            <vxe-select v-model="row.remark2" @change="val => updateRemark(val, $rowIndex)" clearable>
                <vxe-option v-for="item in remark_level" :key="item.remark_two" :value="item.remark_two" :label="item.remark_two"></vxe-option>
             </vxe-select>
           </template>
@@ -383,15 +383,9 @@ import axios from 'axios'
 export default {
   data () {
     return {
+      tableHeight: 700, // 初始高度，后续会动态计算
       loading: null,
       fileList: [], //上传的文件列表
-      header_style: {
-        'background-color': '#F5F7FA',
-        color: '#606266',
-        fontSize: '10px',
-        fontWeight: '600',
-        textAlign: 'center'
-      },
       brand_list: [],
       sku_list: [],
       name_list: [],
@@ -440,6 +434,16 @@ export default {
       remark_level:[]//绩效提成经营分析品线等级下拉选择
     }
   },
+  mounted() {
+    // 初始化时计算表格高度
+    this.calculateTableHeight();
+    // 监听窗口大小变化
+    window.addEventListener('resize', this.calculateTableHeight);
+  },
+  beforeUnmount() {
+    // 移除事件监听，避免内存泄漏
+    window.removeEventListener('resize', this.calculateTableHeight);
+  },
   computed: {
     ...mapState({
       // 取出页面标签
@@ -458,10 +462,23 @@ export default {
     this.getList()
   },
   methods: {
+    // 计算表格高度，使其自适应屏幕剩余空间
+    calculateTableHeight() {
+      // 获取视口高度
+      const viewportHeight = window.innerHeight;
+      // 获取表格容器上方元素的高度总和（这里需要根据实际布局调整）
+      const tableTopOffset = 150; // 估计值，包含搜索栏、按钮等上方元素的高度
+      // 计算表格可用高度
+      this.tableHeight = viewportHeight - tableTopOffset - 100; // 减去底部的边距和分页高度
+      // 确保高度不会太小
+      if (this.tableHeight < 300) {
+        this.tableHeight = 300;
+      }
+    },
     updateRemark(val, rowIndex){
       // 根据选中的二级品线查找对应的一级品线
       const item = this.remark_level.find(i => i && i.remark_two === val.value);
-      this.tableData[rowIndex].remark1 = item.remark_one;
+      this.tableData[rowIndex].remark1 = val.value==null|| !val.value?'' :item.remark_one;
     },
     enlarge (e, row) {
       console.log(e)
diff --git a/src/views/index/oindex.vue b/src/views/index/oindex.vue
index 920d571..b77b5ff 100644
--- a/src/views/index/oindex.vue
+++ b/src/views/index/oindex.vue
@@ -225,7 +225,7 @@
               <vxe-input v-model="row.process_cost" type="text"></vxe-input>
             </template>
           </vxe-column>
-          <vxe-column field="other_cost" title="硬盘/运费其他" width="80" header-align="center" align="right"
+          <vxe-column field="other_cost" title="硬盘/运费/其他/DDR" width="80" header-align="center" align="right"
             :edit-render="{ autofocus: '.vxe-input--inner' }">
             <template #edit="{ row }">
               <vxe-input v-model="row.other_cost" type="text"></vxe-input>