入表功能调整

lxs
Showing 1 changed file with 49 additions and 50 deletions
src/views/data_entry/index.vue
--- a/src/views/data_entry/index.vue
View file @850e14f
+++ b/src/views/data_entry/index.vue
View file @850e14f
@@ -299,7 +299,13 @@ const getCostData = () => {
  loading.value = true;
  getCostList().then((res: any) => {
    loading.value = false;
-    tableData.value = res.data || [];
+    const data = res.data || [];
+    tableData.value = data.map(item => {
+      item.checked1 = false;
+      item.checked2 = false;
+      item.checked3 = false;
+      return item;
+    })
    getMergeRow();
  }).catch((res) => {
    loading.value = false;
@@ -736,7 +742,7 @@ const setTableFields = (info) => {
  }
  arrYear.forEach(item => {
    const field = `${item}`;
-    fields.push({ label: `${item}年`, field: field, type: 'input', width: 100, columClass: 'edit_cell' },)
+    fields.push({ label: `${item}年`, field: field, type: 'input', width: 100, align: 'right', columClass: 'edit_cell' },)
    row[field] = '';
  })
  costFileds.value = row;
@@ -744,7 +750,7 @@ const setTableFields = (info) => {
  const currDay = date.toLocaleDateString('zh-CN', { year: 'numeric', month: 'long' });
  tableField.value.at(-1).visible = true;
  tableField.value = tableField.value.filter(item => item.field.indexOf('name') > -1 || item.field == 'total');
-  tableField.value.splice(-1, 0, ...fields, { label: currDay, field: 'baseNum', type: 'input', width: 120, columClass: 'edit_cell' });
+  tableField.value.splice(-1, 0, ...fields, { label: currDay, field: 'baseNum', type: 'input', width: 120, align: 'right', columClass: 'edit_cell' });
  // 设置table数据
  let datas: any = [];
  tableData.value.map(t => {
@@ -930,10 +936,10 @@ const s2ab = (s) => {
 // 定义边框样式 - 实线边框
 const borderStyle = {
-  top: { style: 'thin', color: { rgb: 'D9D9D9' } },
+  top: { style: 'thin', color: { rgb: '888888' } },
-  bottom: { style: 'thin', color: { rgb: 'D9D9D9' } },
+  bottom: { style: 'thin', color: { rgb: '888888' } },
-  left: { style: 'thin', color: { rgb: 'D9D9D9' } },
+  left: { style: 'thin', color: { rgb: '888888' } },
-  right: { style: 'thin', color: { rgb: 'D9D9D9' } }
+  right: { style: 'thin', color: { rgb: '888888' } }
 };
 // 字体配置
@@ -966,6 +972,11 @@ const exportDetailsToExcel = async () => {
  const headers = fields.map(item => item.label)
  wsData.push(headers)
+  // 判断哪些列是数值类型
+  const numField = fields.filter(item => item.field.indexOf('name') == -1);
+  const numericFields = numField.map(f => f.field);
+  const isNumericColumn = fields.map(field => numericFields.includes(field.field));
  // 处理数据行
  checkedData.value.forEach(item => {
    const row = fields.map(f => {
@@ -982,8 +993,6 @@ const exportDetailsToExcel = async () => {
  // 添加合计行
  const totalRow = ['合计', '', '', ''];
-  const numField = fields.filter(item => item.field.indexOf('name') == -1);
-  const numericFields = numField.map(f => f.field);
  let totalValues = {}
  // 初始化合计值
@@ -1021,7 +1030,7 @@ const exportDetailsToExcel = async () => {
  // 自动调整列宽
  const colWidths = fields.map((field, index) => {
    const defaultWidth = field.width || 100 // 默认宽度100
-    const colWidth = defaultWidth * 0.75; // 留一些余地
+    const colWidth = 100 * 0.75; // 留一些余地
    // 取表头宽度和内容宽度的较大值
    return { wpx: colWidth } // 使用像素宽度
@@ -1092,8 +1101,14 @@ const exportDetailsToExcel = async () => {
      // 表头样式
      if (R === 0) {
+        // 如果该列是数值列，则表头也右对齐
+        const isNumeric = isNumericColumn[C];
        ws[cellAddress].s = {
          ...defaultStyle,
+          alignment: {
+            vertical: 'center',
+            horizontal: isNumeric ? 'right' : 'left'
+          },
          fill: { fgColor: { rgb: 'F2F2F2' } } // 表头背景色（可选）
        }
        continue
@@ -1105,8 +1120,9 @@ const exportDetailsToExcel = async () => {
          ...defaultStyle,
          alignment: {
            vertical: 'center',
-            horizontal: C > 3 ? 'right' : 'left'
+            horizontal: isNumericColumn[C] ? 'right' : 'left'
-          }
+          },
+          // fill: { fgColor: { rgb: 'FFF1D4' } } // 合计行背景色（可选）
        }
        continue
      }
@@ -1116,7 +1132,7 @@ const exportDetailsToExcel = async () => {
      const field = fields[fieldIndex]
      // 数值列右对齐
-      if (numericFields.includes(field.field)) {
+      if (isNumericColumn[C]) {
        ws[cellAddress].s = {
          ...defaultStyle,
          alignment: {
@@ -1200,8 +1216,8 @@ const exportBookToExcel = async () => {
  // 设置单元格样式
  const range = XLSXS.utils.decode_range(ws['!ref'])
-  // 数值字段(除title外的所有字段)
+  // 确定哪些列是数值列（field不包含'title'的列）
-  const numericFields = bookHeaders.value.slice(1).map(f => f.field);
+  const isNumericColumn = bookHeaders.value.map(f => f.field.indexOf('title') === -1);
  for (let R = range.s.r; R <= range.e.r; ++R) {
    for (let C = range.s.c; C <= range.e.c; ++C) {
@@ -1222,40 +1238,35 @@ const exportBookToExcel = async () => {
        border: borderStyle // 添加边框样式
      }
+       // 判断当前列是否为数值列
+      const isNumeric = isNumericColumn[C];
+      // 数值列的对齐方式
+      const alignment = {
+        vertical: 'center',
+        horizontal: isNumeric ? 'right' : 'left'
+      };
      // 表头样式（第1行）
      if (R === 0) {
        ws[cellAddress].s = {
          ...defaultStyle,
+          alignment: alignment, // 使用统一对齐方式
          fill: { fgColor: { rgb: 'F2F2F2' } } // 表头背景色（可选）
        }
        continue
      }
-      // 获取当前列对应的字段
+      // 数据行样式
-      const field = bookHeaders.value[C];
-      // 判断是否为数值列（包括最后一行）
-      const isNumeric = numericFields.includes(field?.field);
      const cellValue = ws[cellAddress].v;
-      // 数值列特殊处理（无论是否最后一行）
+      ws[cellAddress].s = {
-      if (isNumeric) {
+        ...defaultStyle,
-        ws[cellAddress].s = {
+        alignment: alignment // 使用统一对齐方式
-          ...defaultStyle,
+      };
-          alignment: {
-            vertical: 'center',
-            horizontal: 'right'
-          },
-        };
-        // 确保数值被正确识别为数字类型
+      // 确保数值被正确识别为数字类型
-        if (cellValue !== undefined && cellValue !== "" && !isNaN(cellValue)) {
+      if (isNumeric && cellValue !== undefined && cellValue !== "" && !isNaN(cellValue)) {
-          ws[cellAddress].t = 'n'; // 数字类型
+        ws[cellAddress].t = 'n'; // 数字类型
-          ws[cellAddress].z = '#,##0.00'; // 数字格式
+        ws[cellAddress].z = '#,##0.00'; // 数字格式
-        }
-      } else {
-        // 文本列保持默认样式
-        ws[cellAddress].s = defaultStyle;
      }
    }
  }
@@ -1373,7 +1384,7 @@ onUpdated(() => {
                    show-overflow-tooltip>
                    <template #default="scope">
                      <div class="input_cell" v-if="item.type == 'input'">
-                        <el-input v-model.trim="scope.row[item.field]" placeholder="--" size="small"
+                        <el-input v-model.trim="scope.row[item.field]" :placeholder="scope.row.edit?'':'--'"
                          :maxlength="item.maxlength ?? ''" @change="(val) => inputChange(val, scope, item.field)"
                          @input="(val) => inputEventChange(val, scope, item.field)"
                          :disabled="scope.row.edit ? false : true" clearable></el-input>
@@ -1403,24 +1414,12 @@ onUpdated(() => {
                </template>
              </el-table>
              <el-table id="entry-table" ref="entryTableRef" :data="transposedData" stripe border v-show="step == 1">
-                <!-- <el-table-column prop="title" label="项目" :width="140">
-                  <template v-slot="{ row }">
-                    <span>{{ setLabel(row.title) }}</span>
-                  </template>
-                </el-table-column> -->
                <el-table-column v-for="(item, index) in bookHeaders" :key="index" :prop="item.field"
                  :label="item.label" :width="item.width" :align="item.align">
                  <template #default="scope">
                    <span v-if="item.field == 'title'">{{ setLabel(scope.row[item.field]) }}</span>
                    <span v-else>{{ changeNum(scope.row[item.field], 2, true) }}</span>
                  </template>
-                  <!-- <template v-slot:header>
-                    <span v-html="item.label"></span>
-                  </template>
-                  <template v-slot="{ row }">
-                    <span v-if="typeof row[item.field] == 'number'">{{ changeNum(row[item.field], 2, true) }}</span>
-                    <span v-else></span>
-                  </template> -->
                </el-table-column>
              </el-table>
            </div>