Procházet zdrojové kódy

✨ feat(ruiheng): 表格调整

Zimo před 2 týdny
rodič
revize
8ea3fd27d0

+ 1 - 0
src/api/pms/iotrhdailyreport/index.ts

@@ -2,6 +2,7 @@ import request from '@/config/axios'
 
 // 瑞恒日报 VO
 export interface IotRhDailyReportVO {
+  createTime:number,
   id: number // 主键id
   deptId: number // 施工队伍id
   projectId: number // 项目id

+ 1 - 1
src/utils/formatTime.ts

@@ -197,7 +197,7 @@ export function formatPast2(ms: number): string {
  * @param column 字段
  * @param cellValue 字段值
  */
-export function dateFormatter(_row: any, _column: TableColumnCtx<any>, cellValue: any): string {
+export function dateFormatter(_row: any, _column: TableColumnCtx<any> | null, cellValue: any): string {
   return cellValue ? formatDate(cellValue) : ''
 }
 

+ 398 - 278
src/views/pms/iotrhdailyreport/index.vue

@@ -45,8 +45,12 @@
             />
           </el-form-item>
           <el-form-item>
-            <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
-            <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+            <el-button @click="handleQuery"
+              ><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
+            >
+            <el-button @click="resetQuery"
+              ><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button
+            >
             <el-button
               type="primary"
               plain
@@ -84,7 +88,7 @@
             <span
               class="unfilled-link"
               @click="openUnfilledDialog"
-              :class="{ 'disabled': !queryParams.createTime || queryParams.createTime.length === 0 }"
+              :class="{ disabled: !queryParams.createTime || queryParams.createTime.length === 0 }"
             >
               {{ statistics.unFilled || '-' }}
             </span>
@@ -104,11 +108,15 @@
         <div class="color-legend">
           <div class="legend-item">
             <span class="color-indicator red"></span>
-            <span>运行时效=当日注气量/产能&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;超过120%红色预警</span>
+            <span
+              >运行时效=当日注气量/产能&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;超过120%红色预警</span
+            >
           </div>
           <div class="legend-item">
             <span class="color-indicator orange"></span>
-            <span>当日注气时间+当日注水时间+非生产时间=24H&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;否则橙色预警</span>
+            <span
+              >当日注气时间+当日注水时间+非生产时间=24H&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;否则橙色预警</span
+            >
           </div>
         </div>
       </ContentWrap>
@@ -116,9 +124,16 @@
       <!-- 列表 -->
       <ContentWrap ref="tableContainerRef">
         <div class="table-container">
-          <el-table ref="tableRef" v-loading="loading" :data="list" :stripe="true"
-                    style="width: 100%" :cell-style="cellStyle">
-            <el-table-column :label="t('iotDevice.serial')" width="70" align="center">
+          <el-table
+            ref="tableRef"
+            v-loading="loading"
+            :data="list"
+            :stripe="true"
+            :style="{ width: '100%' }"
+            max-height="600"
+            :cell-style="cellStyle"
+          >
+            <el-table-column :label="t('iotDevice.serial')" width="56px" align="center">
               <template #default="scope">
                 {{ scope.$index + 1 }}
               </template>
@@ -128,29 +143,107 @@
               align="center"
               prop="createTime"
               :formatter="dateFormatter"
-              :width="columnWidths.createTime"
+              :min-width="columnWidths.createTime.width"
+            />
+            <el-table-column
+              label="施工队伍"
+              align="center"
+              prop="deptName"
+              :min-width="columnWidths.deptName.width"
+            />
+            <el-table-column
+              label="项目"
+              align="center"
+              prop="contractName"
+              :show-overflow-tooltip="true"
+              class-name="contract-name-column"
+              :min-width="columnWidths.contractName.width"
+            />
+            <el-table-column
+              label="任务"
+              align="center"
+              prop="taskName"
+              :min-width="columnWidths.taskName.width"
             />
-            <el-table-column label="施工队伍" align="center" prop="deptName" :width="columnWidths.deptName"/>
-            <el-table-column label="项目" align="center" prop="contractName" :width="columnWidths.contractName"
-                             :show-overflow-tooltip="true" class-name="contract-name-column"/>
-            <el-table-column label="任务" align="center" prop="taskName" :width="columnWidths.taskName"/>
             <!-- <el-table-column label="施工状态" align="center" prop="constructionStatus" /> -->
-            <el-table-column :label="t('project.status')" align="center" prop="constructionStatus" :width="columnWidths.constructionStatus">
+            <el-table-column
+              :label="t('project.status')"
+              align="center"
+              prop="constructionStatus"
+              :min-width="columnWidths.constructionStatus.width"
+            >
               <template #default="scope">
-                <dict-tag :type="DICT_TYPE.PMS_PROJECT_TASK_SCHEDULE" :value="scope.row.constructionStatus" />
+                <dict-tag
+                  :type="DICT_TYPE.PMS_PROJECT_TASK_SCHEDULE"
+                  :value="scope.row.constructionStatus"
+                />
               </template>
             </el-table-column>
-            <el-table-column label="搬迁安装天数" align="center" prop="relocationDays" :width="columnWidths.relocationDays" :formatter="relocationDaysFormatter"/>
-            <el-table-column label="设计注气量(万方)" align="center" prop="designInjection" :width="columnWidths.designInjection"/>
-            <el-table-column label="运行时效" align="center" prop="transitTime" :width="columnWidths.transitTime" :formatter="percentageFormatter"/>
-            <el-table-column label="当日注气量(万方)" align="center" prop="dailyGasInjection"
-                             :width="columnWidths.dailyGasInjection" :formatter="gasInjectionFormatter"/>
-            <el-table-column label="当日注水量(方)" align="center" prop="dailyWaterInjection" :width="columnWidths.dailyWaterInjection"/>
-            <el-table-column label="当日注气时间(H)" align="center" prop="dailyInjectGasTime" :width="columnWidths.dailyInjectGasTime"/>
-            <el-table-column label="当日注水时间(H)" align="center" prop="dailyInjectWaterTime" :width="columnWidths.dailyInjectWaterTime"/>
-            <el-table-column label="当日用电量(kWh)" align="center" prop="dailyPowerUsage" :width="columnWidths.dailyPowerUsage"/>
-            <el-table-column label="非生产时间(H)" align="center" prop="nonProductionTime" :width="columnWidths.nonProductionTime"/>
-            <el-table-column :label="t('project.nptReason')" align="center" prop="nptReason" :width="columnWidths.nptReason">
+            <el-table-column
+              label="搬迁安装天数"
+              align="center"
+              prop="relocationDays"
+              :formatter="relocationDaysFormatter"
+              :min-width="columnWidths.relocationDays.width"
+            />
+            <el-table-column
+              label="设计注气量(万方)"
+              align="center"
+              prop="designInjection"
+              :min-width="columnWidths.designInjection.width"
+            />
+            <el-table-column
+              label="运行时效"
+              align="center"
+              prop="transitTime"
+              :formatter="percentageFormatter"
+              :min-width="columnWidths.transitTime.width"
+            />
+            <el-table-column label="当日" align="center">
+              <el-table-column
+                label="注气量(万方)"
+                align="center"
+                prop="dailyGasInjection"
+                :formatter="gasInjectionFormatter"
+                :min-width="columnWidths.dailyGasInjection.width"
+              />
+              <el-table-column
+                label="注水量(方)"
+                align="center"
+                prop="dailyWaterInjection"
+                :min-width="columnWidths.dailyWaterInjection.width"
+              />
+              <el-table-column
+                label="注气时间(H)"
+                align="center"
+                prop="dailyInjectGasTime"
+                :min-width="columnWidths.dailyInjectGasTime.width"
+              />
+              <el-table-column
+                label="注水时间(H)"
+                align="center"
+                prop="dailyInjectWaterTime"
+                :min-width="columnWidths.dailyInjectWaterTime.width"
+              />
+              <el-table-column
+                label="用电量(kWh)"
+                align="center"
+                prop="dailyPowerUsage"
+                :min-width="columnWidths.dailyPowerUsage.width"
+              />
+            </el-table-column>
+            <el-table-column
+              label="非生产时间(H)"
+              align="center"
+              prop="nonProductionTime"
+              :min-width="columnWidths.nonProductionTime.width"
+            />
+            <el-table-column
+              :label="t('project.nptReason')"
+              align="center"
+              prop="nptReason"
+              :min-width="columnWidths.nptReason.width"
+            >
               <template #default="scope">
                 <dict-tag :type="DICT_TYPE.PMS_PROJECT_NPT_REASON" :value="scope.row.nptReason" />
               </template>
@@ -160,16 +253,21 @@
               align="center"
               prop="constructionStartDate"
               :formatter="dateFormatter"
-              :width="columnWidths.constructionStartDate"
+              :min-width="columnWidths.constructionStartDate.width"
             />
             <el-table-column
               label="施工结束日期"
               align="center"
               prop="constructionEndDate"
               :formatter="dateFormatter"
-              :width="columnWidths.constructionEndDate"
+              :min-width="columnWidths.constructionEndDate.width"
             />
-            <el-table-column label="生产动态" align="center" :width="columnWidths.productionStatus" fixed-width>
+            <el-table-column
+              label="生产动态"
+              align="center"
+              :min-width="columnWidths.productionStatus.width"
+              fixed-width
+            >
               <template #default="scope">
                 <el-tooltip
                   effect="light"
@@ -178,16 +276,41 @@
                   popper-class="design-well-struct-tooltip"
                   :disabled="!scope.row.productionStatus || scope.row.productionStatus.length <= 30"
                 >
-                  <span class="design-well-struct-text">{{ formatDesignWellStruct(scope.row.productionStatus) }}</span>
+                  <span class="design-well-struct-text">{{
+                    formatDesignWellStruct(scope.row.productionStatus)
+                  }}</span>
                 </el-tooltip>
               </template>
             </el-table-column>
-            <el-table-column label="累计注气量(万方)" align="center" prop="totalGasInjection"
-                             :width="columnWidths.totalGasInjection" :formatter="gasInjectionFormatter"/>
-            <el-table-column label="累计注水量(方)" align="center" prop="totalWaterInjection" :width="columnWidths.totalWaterInjection"/>
-            <el-table-column label="累计完工井次" align="center" prop="cumulativeCompletion" :width="columnWidths.cumulativeCompletion"/>
-            <el-table-column label="产能(万方)" align="center" prop="capacity" :width="columnWidths.capacity" :formatter="gasInjectionFormatter"/>
-            <el-table-column label="操作" align="center" :width="columnWidths.operation" fixed="right">
+            <el-table-column label="累计" align="center">
+              <el-table-column
+                label="注气量(万方)"
+                align="center"
+                prop="totalGasInjection"
+                :formatter="gasInjectionFormatter"
+                :min-width="columnWidths.totalGasInjection.width"
+              />
+              <el-table-column
+                label="注水量(方)"
+                align="center"
+                prop="totalWaterInjection"
+                :min-width="columnWidths.totalWaterInjection.width"
+              />
+              <el-table-column
+                label="完工井次"
+                align="center"
+                prop="cumulativeCompletion"
+                :min-width="columnWidths.cumulativeCompletion.width"
+              />
+            </el-table-column>
+            <el-table-column
+              label="产能(万方)"
+              align="center"
+              prop="capacity"
+              :formatter="gasInjectionFormatter"
+              :min-width="columnWidths.capacity.width"
+            />
+            <el-table-column label="操作" align="center" fixed="right">
               <template #default="scope">
                 <el-button
                   link
@@ -219,7 +342,7 @@
       </ContentWrap>
 
       <!-- 表单弹窗:添加/修改 -->
-      <IotRhDailyReportForm ref="formRef" @success="getList" :row-data="selectedRowData"/>
+      <IotRhDailyReportForm ref="formRef" @success="getList" :row-data="selectedRowData" />
 
       <UnfilledReportDialog
         ref="unfilledDialogRef"
@@ -228,18 +351,18 @@
       />
     </el-col>
   </el-row>
-
 </template>
 
 <script setup lang="ts">
-import {dateFormatter, dateFormatter2} from '@/utils/formatTime'
+import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import { IotRhDailyReportApi, IotRhDailyReportVO } from '@/api/pms/iotrhdailyreport'
 import IotRhDailyReportForm from './IotRhDailyReportForm.vue'
 import UnfilledReportDialog from './UnfilledReportDialog.vue'
-import {DICT_TYPE, getDictLabel} from "@/utils/dict";
-import { ref, reactive, onMounted, nextTick, watch, onUnmounted } from 'vue'
-import DeptTree2 from "@/views/pms/iotrhdailyreport/DeptTree2.vue";
+import { DICT_TYPE } from '@/utils/dict'
+import { ref, reactive, onMounted, onUnmounted } from 'vue'
+import DeptTree2 from '@/views/pms/iotrhdailyreport/DeptTree2.vue'
+import { useDebounceFn } from '@vueuse/core'
 
 /** 瑞恒日报 列表 */
 defineOptions({ name: 'IotRhDailyReport' })
@@ -286,7 +409,7 @@ const queryParams = reactive({
   status: undefined,
   processInstanceId: undefined,
   auditStatus: undefined,
-  createTime: [],
+  createTime: []
 })
 const queryFormRef = ref() // 搜索的表单
 const exportLoading = ref(false) // 导出的加载中
@@ -301,7 +424,7 @@ const statistics = ref({
   filled: '-',
   unFilled: '-',
   totalWaterInjection: '-', // 新增累计注水量
-  totalGasInjection: '-'    // 新增累计注气量
+  totalGasInjection: '-' // 新增累计注气量
 })
 
 const totalColor = '#00DD99'
@@ -320,62 +443,182 @@ const workloadStatistics = ref({
 })
 
 // 列宽度配置
-const columnWidths = ref({
-  deptName: '120px',
-  contractName: '200px',
-  taskName: '120px',
-  constructionStatus: '110px',
-  relocationDays: '120px',
-  designInjection: '120px',
-  transitTime: '100px',
-  dailyGasInjection: '150px',
-  dailyWaterInjection: '150px',
-  dailyPowerUsage: '150px',
-  dailyInjectGasTime: '150px',
-  dailyInjectWaterTime: '150px',
-  nonProductionTime: '150px',
-  nptReason: '150px',
-  constructionStartDate: '180px',
-  constructionEndDate: '180px',
-  productionStatus: '200px',
-  totalGasInjection: '150px',
-  totalWaterInjection: '150px',
-  cumulativeCompletion: '150px',
-  capacity: '120px',
-  createTime: '180px',
-  operation: '120px'
+const columnWidths = ref<
+  Record<
+    string,
+    { label: string; prop: string; width: string; fn?: (row: IotRhDailyReportVO) => string }
+  >
+>({
+  createTime: {
+    label: '日期',
+    prop: 'createTime',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => dateFormatter(null, null, row.createTime)
+  },
+  deptName: {
+    label: '施工队伍',
+    prop: 'deptName',
+    width: '120px'
+  },
+  contractName: {
+    label: '项目',
+    prop: 'contractName',
+    width: '120px'
+  },
+  taskName: {
+    label: '任务',
+    prop: 'taskName',
+    width: '120px'
+  },
+  constructionStatus: {
+    label: '施工状态',
+    prop: 'constructionStatus',
+    width: '120px'
+  },
+  relocationDays: {
+    label: '搬迁安装天数',
+    prop: 'relocationDays',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => relocationDaysFormatter(null, null, row.relocationDays, null)
+  },
+  designInjection: {
+    label: '设计注气量(万方)',
+    prop: 'designInjection',
+    width: '120px'
+  },
+  transitTime: {
+    label: '运行时效',
+    prop: 'transitTime',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => percentageFormatter(null, null, row.transitTime, null)
+  },
+  dailyGasInjection: {
+    label: '注气量(万方)',
+    prop: 'dailyGasInjection',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => gasInjectionFormatter(null, null, row.dailyGasInjection, null)
+  },
+  dailyWaterInjection: {
+    label: '注水量(方)',
+    prop: 'dailyWaterInjection',
+    width: '120px'
+  },
+  dailyInjectGasTime: {
+    label: '注气时间(H)',
+    prop: 'dailyInjectGasTime',
+    width: '120px'
+  },
+  dailyInjectWaterTime: {
+    label: '注水时间(H)',
+    prop: 'dailyInjectWaterTime',
+    width: '120px'
+  },
+  dailyPowerUsage: {
+    label: '用电量(kWh)',
+    prop: 'dailyPowerUsage',
+    width: '120px'
+  },
+  nonProductionTime: {
+    label: '非生产时间(H)',
+    prop: 'nonProductionTime',
+    width: '120px'
+  },
+  nptReason: {
+    label: '非生产时间原因',
+    prop: 'nptReason',
+    width: '120px'
+  },
+  constructionStartDate: {
+    label: '施工开始日期',
+    prop: 'constructionStartDate',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => dateFormatter(null, null, row.constructionStartDate)
+  },
+  constructionEndDate: {
+    label: '施工结束日期',
+    prop: 'constructionEndDate',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => dateFormatter(null, null, row.constructionEndDate)
+  },
+  productionStatus: {
+    label: '生产动态',
+    prop: 'productionStatus',
+    width: '120px'
+  },
+  totalGasInjection: {
+    label: '注气量(万方)',
+    prop: 'totalGasInjection',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => gasInjectionFormatter(null, null, row.totalGasInjection, null)
+  },
+  totalWaterInjection: {
+    label: '注水量(方)',
+    prop: 'totalWaterInjection',
+    width: '120px'
+  },
+  cumulativeCompletion: {
+    label: '完工井次',
+    prop: 'cumulativeCompletion',
+    width: '120px'
+  },
+  capacity: {
+    label: '产能(万方)',
+    prop: 'capacity',
+    width: '120px',
+    fn: (row: IotRhDailyReportVO) => gasInjectionFormatter(null, null, row.capacity, null)
+  }
 })
 
 // 计算文本宽度
-const getTextWidth = (text: string, fontSize = 14) => {
-  const span = document.createElement('span');
-  span.style.visibility = 'hidden';
-  span.style.position = 'absolute';
-  span.style.whiteSpace = 'nowrap';
-  span.style.fontSize = `${fontSize}px`;
-  span.style.fontFamily = 'inherit';
-  span.innerText = text;
-
-  document.body.appendChild(span);
-  const width = span.offsetWidth;
-  document.body.removeChild(span);
-
-  return width;
-};
+const getTextWidth = (text: string, fontSize = 12) => {
+  const span = document.createElement('span')
+  span.style.visibility = 'hidden'
+  span.style.position = 'absolute'
+  span.style.whiteSpace = 'nowrap'
+  span.style.fontSize = `${fontSize}px`
+  span.style.fontFamily = 'PingFang SC'
+  span.innerText = text
+
+  document.body.appendChild(span)
+  const width = span.offsetWidth
+  document.body.removeChild(span)
+
+  return width
+}
+
+const calculateColumnWidths = useDebounceFn(() => {
+  if (!tableContainerRef.value?.$el) return
+  Object.values(columnWidths.value).forEach(({ fn, prop, label, width }) => {
+    width =
+      Math.max(
+        ...[
+          getTextWidth(label),
+          ...list.value.map((v) => {
+            return getTextWidth(fn ? fn(v) : v[prop])
+          })
+        ]
+      ) +
+      (label === '施工状态' || label === '非生产时间原因' ? 30 : 20) +
+      'px'
+
+    columnWidths.value[prop].width = width
+  })
+}, 1000)
+// 计算列宽度
 
 // 格式化设计井身结构文本
 const formatDesignWellStruct = (text: string | null | undefined) => {
-  if (!text) return '-';
+  if (!text) return '-'
   // 如果文本长度超过30个字符,显示前30个字符并添加省略号
-  return text.length > 30 ? text.substring(0, 30) + '...' : text;
-};
+  return text.length > 30 ? text.substring(0, 30) + '...' : text
+}
 
 // 百分比格式化函数
-const percentageFormatter = (row: any, column: any, cellValue: any, index: number) => {
-  if (cellValue === null || cellValue === undefined) return '';
+const percentageFormatter = (row: any, column: any, cellValue: any, index: number | null) => {
+  if (cellValue === null || cellValue === undefined) return ''
   // 将小数转换为百分比,保留两位小数
-  return `${(parseFloat(cellValue) * 100).toFixed(2)}%`;
-};
+  return `${(parseFloat(cellValue) * 100).toFixed(2)}%`
+}
 
 // 添加打开未填报弹窗的方法
 const openUnfilledDialog = () => {
@@ -416,7 +659,7 @@ const getStatistics = async () => {
 
     // 处理统计数据
     const statsMap = {}
-    res.forEach(item => {
+    res.forEach((item) => {
       statsMap[item.groupName] = item.count
     })
 
@@ -430,13 +673,6 @@ const getStatistics = async () => {
   }
 }
 
-// 可伸缩列配置
-const FLEXIBLE_COLUMNS = ['deptName', 'taskName', 'constructionStatus', 'relocationDays', 'designInjection',
-  'transitTime', 'dailyGasInjection', 'dailyWaterInjection', 'dailyPowerUsage', 'dailyInjectGasTime',
-  'dailyInjectWaterTime', 'nonProductionTime', 'nptReason', 'constructionStartDate',
-  'constructionEndDate', 'productionStatus', 'totalGasInjection', 'totalWaterInjection',
-  'cumulativeCompletion', 'createTime'];
-
 /** 查询列表 */
 const getList = async () => {
   loading.value = true
@@ -453,204 +689,85 @@ const getList = async () => {
 
     // 获取数据后计算列宽
     nextTick(() => {
-      calculateColumnWidths();
-    });
+      calculateColumnWidths()
+    })
   } finally {
     loading.value = false
   }
 }
 
 // 搬迁安装天数格式化函数
-const relocationDaysFormatter = (row: any, column: any, cellValue: any, index: number) => {
-  if (cellValue === null || cellValue === undefined || cellValue === '') return '';
+const relocationDaysFormatter = (row: any, column: any, cellValue: any, index: number | null) => {
+  if (cellValue === null || cellValue === undefined || cellValue === '') return ''
 
-  const value = parseFloat(cellValue);
+  const value = parseFloat(cellValue)
   // 如果值为负数,显示0,否则显示原值
-  return value < 0 ? '0' : String(value);
-};
+  return value < 0 ? '0' : String(value)
+}
 
 // 注气量格式化函数(单位转换:方 -> 万方)
-const gasInjectionFormatter = (row: any, column: any, cellValue: any, index: number) => {
-  if (cellValue === null || cellValue === undefined || cellValue === '') return '';
+const gasInjectionFormatter = (row: any, column: any, cellValue: any, index: number | null) => {
+  if (cellValue === null || cellValue === undefined || cellValue === '') return ''
   // 将方转换为万方,保留两位小数
-  const value = parseFloat(cellValue);
-  return (value / 10000).toFixed(2);
-};
+  const value = parseFloat(cellValue)
+  return (value / 10000).toFixed(2)
+}
 
 // 检查三个时间字段之和是否为24
 const checkTimeSumEquals24 = (row: any) => {
   // 获取三个字段的值,转换为数字,如果为空则视为0
-  const gasTime = parseFloat(row.dailyInjectGasTime) || 0;
-  const waterTime = parseFloat(row.dailyInjectWaterTime) || 0;
-  const nonProdTime = parseFloat(row.nonProductionTime) || 0;
+  const gasTime = parseFloat(row.dailyInjectGasTime) || 0
+  const waterTime = parseFloat(row.dailyInjectWaterTime) || 0
+  const nonProdTime = parseFloat(row.nonProductionTime) || 0
 
   // 计算总和
-  const sum = gasTime + waterTime + nonProdTime;
+  const sum = gasTime + waterTime + nonProdTime
 
   // 返回是否等于24(允许一定的浮点数误差)
-  return Math.abs(sum - 24) < 0.01; // 使用0.01作为误差范围
-};
+  return Math.abs(sum - 24) < 0.01 // 使用0.01作为误差范围
+}
 
 // 单元格样式函数
-const cellStyle = ({ row, column, rowIndex, columnIndex }: { row: any; column: any; rowIndex: number; columnIndex: number }) => {
+const cellStyle = ({
+  row,
+  column,
+  rowIndex,
+  columnIndex
+}: {
+  row: any
+  column: any
+  rowIndex: number
+  columnIndex: number
+}) => {
   // 只针对 transitTime 列进行处理
   if (column.property === 'transitTime') {
     // 获取原始值(不是格式化后的百分比值)
-    const originalValue = row.transitTime;
+    const originalValue = row.transitTime
 
     // 检查值是否大于120
     if (originalValue !== null && originalValue !== undefined && parseFloat(originalValue) > 1.2) {
       return {
         color: 'red',
         fontWeight: 'bold' // 可选:加粗以更突出显示
-      };
+      }
     }
   }
 
   // 处理三个时间字段:当日注气时间、当日注水时间、非生产时间
-  const timeFields = ['dailyInjectGasTime', 'dailyInjectWaterTime', 'nonProductionTime'];
+  const timeFields = ['dailyInjectGasTime', 'dailyInjectWaterTime', 'nonProductionTime']
   if (timeFields.includes(column.property)) {
     // 检查三个时间字段之和是否不等于24
     if (!checkTimeSumEquals24(row)) {
       return {
         color: 'orange',
         fontWeight: 'bold'
-      };
+      }
     }
   }
 
   // 默认返回空对象,不应用特殊样式
-  return {};
-};
-
-// 计算列宽度
-const calculateColumnWidths = () => {
-  const MIN_WIDTH = 80; // 最小列宽
-  const PADDING = 25; // 列内边距
-
-  // 确保表格容器存在
-  if (!tableContainerRef.value?.$el) return;
-
-  const container = tableContainerRef.value.$el;
-  const containerWidth = container.clientWidth;
-
-  // 1. 计算所有列的最小宽度
-  const minWidths: Record<string, number> = {};
-  let totalMinWidth = 0;
-
-  // 计算列最小宽度的函数
-  const calculateColumnMinWidth = (key: string, label: string, getValue: Function) => {
-    // 跳过 contractName 列的计算,使用固定宽度
-    if (key === 'contractName') {
-      minWidths[key] = 200; // 固定宽度
-      totalMinWidth += 200;
-      return 200;
-    }
-
-    const headerWidth = getTextWidth(label) * 1.2;
-    let contentMaxWidth = 0;
-
-    // 计算内容最大宽度
-    list.value.forEach((row, index) => {
-      let text = '';
-      if (key === 'constructionStatus') {
-        // 特殊处理字典列
-        const dictValue = row[key];
-        // 这里需要根据实际情况获取字典标签,简化处理使用值本身
-        text = String(dictValue || '');
-      } else if (key === 'nptReason') {
-        // 非生产时间原因
-        text = getDictLabel(DICT_TYPE.PMS_PROJECT_NPT_REASON, row[key]);
-      } else if (key.includes('Date') || key === 'createTime') {
-        // 日期列使用格式化后的值
-        text = dateFormatter(null, null, row[key]) || '';
-      } else {
-        text = String(getValue ? getValue(row, index) : (row[key] || ''));
-      }
-
-      const textWidth = getTextWidth(text);
-      if (textWidth > contentMaxWidth) contentMaxWidth = textWidth;
-    });
-
-    const minWidth = Math.max(headerWidth, contentMaxWidth, MIN_WIDTH) + PADDING;
-    minWidths[key] = minWidth;
-    totalMinWidth += minWidth;
-    return minWidth;
-  };
-
-  // 计算各列最小宽度
-  calculateColumnMinWidth('deptName', '施工队伍', (row: any) => row.deptName);
-  calculateColumnMinWidth('contractName', '项目', (row: any) => row.contractName);
-  calculateColumnMinWidth('taskName', '任务', (row: any) => row.taskName);
-  calculateColumnMinWidth('constructionStatus', t('project.status'), (row: any) => {
-    // 这里可以获取字典标签,简化处理使用值本身
-    return String(row.constructionStatus || '');
-  });
-  // 修改搬迁安装天数的宽度计算,使用格式化后的值
-  calculateColumnMinWidth('relocationDays', '搬迁安装天数', (row: any) => {
-    const value = row.relocationDays;
-    if (value === null || value === undefined || value === '') return '';
-    const numValue = parseFloat(value);
-    return numValue < 0 ? '0' : String(numValue);
-  });
-  calculateColumnMinWidth('designInjection', '设计注气量(万方)', (row: any) => row.designInjection);
-  calculateColumnMinWidth('transitTime', '运行时效', (row: any) => row.transitTime);
-  calculateColumnMinWidth('dailyGasInjection', '当日注气量(万方)', (row: any) => row.dailyGasInjection);
-  calculateColumnMinWidth('dailyWaterInjection', '当日注水量(方)', (row: any) => row.dailyWaterInjection);
-  calculateColumnMinWidth('dailyPowerUsage', '当日用电量(kWh)', (row: any) => row.dailyPowerUsage);
-  calculateColumnMinWidth('dailyInjectGasTime', '当日注气时间(H)', (row: any) => row.dailyInjectGasTime);
-  calculateColumnMinWidth('dailyInjectWaterTime', '当日注水时间(H)', (row: any) => row.dailyInjectWaterTime);
-  calculateColumnMinWidth('nonProductionTime', '非生产时间(H)', (row: any) => row.nonProductionTime);
-  calculateColumnMinWidth('nptReason', t('project.nptReason'), (row: any) => row.nptReason);
-  calculateColumnMinWidth('constructionStartDate', '施工开始日期', (row: any) => dateFormatter(null, null, row.constructionStartDate));
-  calculateColumnMinWidth('constructionEndDate', '施工结束日期', (row: any) => dateFormatter(null, null, row.constructionEndDate));
-  calculateColumnMinWidth('productionStatus', '生产动态', (row: any) => row.productionStatus);
-  calculateColumnMinWidth('totalGasInjection', '累计注气量(万方)', (row: any) => row.totalGasInjection);
-  calculateColumnMinWidth('totalWaterInjection', '累计注水量(方)', (row: any) => row.totalWaterInjection);
-  calculateColumnMinWidth('cumulativeCompletion', '累计完工井次', (row: any) => row.cumulativeCompletion);
-  calculateColumnMinWidth('capacity', '产能(万方)', (row: any) => row.capacity);
-  calculateColumnMinWidth('createTime', '创建时间', (row: any) => dateFormatter(null, null, row.createTime));
-
-  // 生产动态 列使用固定宽度,不参与自动计算
-  minWidths.productionStatus = 200; // 固定宽度200px
-  totalMinWidth += 200;
-
-  // 操作列固定宽度
-  minWidths.operation = 120;
-  totalMinWidth += 120;
-
-  // 2. 计算可伸缩列最终宽度
-  const newWidths: Record<string, string> = {};
-  const availableWidth = containerWidth - 17; // 减去滚动条宽度
-
-  // 应用最小宽度到所有列
-  Object.keys(minWidths).forEach(key => {
-    newWidths[key] = `${minWidths[key]}px`;
-  });
-
-  // 计算可伸缩列需要的宽度
-  if (totalMinWidth < availableWidth) {
-    // 有剩余空间:按比例分配给可伸缩列
-    const extraSpace = availableWidth - totalMinWidth;
-    const flexibleColumnCount = FLEXIBLE_COLUMNS.length;
-    const spacePerColumn = Math.floor(extraSpace / flexibleColumnCount);
-
-    FLEXIBLE_COLUMNS.forEach(key => {
-      newWidths[key] = `${minWidths[key] + spacePerColumn}px`;
-    });
-  }
-
-  // 确保 contractName 保持固定宽度
-  newWidths.contractName = '200px';
-
-  // 3. 更新列宽配置
-  columnWidths.value = newWidths;
-
-  // 4. 触发表格重新布局
-  nextTick(() => {
-    tableRef.value?.doLayout();
-  });
-};
+  return {}
+}
 
 // 获取工作量统计数据的方法
 const getWorkloadStatistics = async () => {
@@ -752,7 +869,7 @@ const handleExport = async () => {
 }
 
 // 声明 ResizeObserver 实例
-let resizeObserver: ResizeObserver | null = null;
+let resizeObserver: ResizeObserver | null = null
 
 /** 初始化 **/
 onMounted(() => {
@@ -761,33 +878,36 @@ onMounted(() => {
   if (tableContainerRef.value?.$el) {
     resizeObserver = new ResizeObserver(() => {
       // 使用防抖避免频繁触发
-      clearTimeout((window as any).resizeTimer);
-      (window as any).resizeTimer = setTimeout(() => {
-        calculateColumnWidths();
-      }, 100);
-    });
-    resizeObserver.observe(tableContainerRef.value.$el);
+      clearTimeout((window as any).resizeTimer)
+      ;(window as any).resizeTimer = setTimeout(() => {
+        calculateColumnWidths()
+      }, 100)
+    })
+    resizeObserver.observe(tableContainerRef.value.$el)
   }
 })
 
 onUnmounted(() => {
   // 清除 ResizeObserver
   if (resizeObserver && tableContainerRef.value?.$el) {
-    resizeObserver.unobserve(tableContainerRef.value.$el);
-    resizeObserver = null;
+    resizeObserver.unobserve(tableContainerRef.value.$el)
+    resizeObserver = null
   }
 
   // 清除定时器
   if ((window as any).resizeTimer) {
-    clearTimeout((window as any).resizeTimer);
+    clearTimeout((window as any).resizeTimer)
   }
 })
 
 // 监听列表数据变化重新计算列宽
-watch(list, () => {
-  nextTick(calculateColumnWidths)
-}, { deep: true })
-
+watch(
+  list,
+  () => {
+    nextTick(calculateColumnWidths())
+  },
+  { deep: true }
+)
 </script>
 
 <style scoped>
@@ -832,12 +952,12 @@ watch(list, () => {
 /* 颜色说明区域样式 */
 .color-legend {
   display: flex;
-  flex-direction: column;
-  gap: 8px;
   padding: 12px 16px;
   background-color: #f8f9fa;
-  border-radius: 4px;
   border-left: 4px solid #e6f7ff;
+  border-radius: 4px;
+  flex-direction: column;
+  gap: 8px;
 }
 
 .legend-item {
@@ -864,28 +984,28 @@ watch(list, () => {
 
 /* 统计区域未填报链接样式 */
 .unfilled-link {
-  cursor: pointer;
+  color: #f50;
   text-decoration: underline;
-  color: #FF5500;
+  cursor: pointer;
 }
 
 .unfilled-link:hover {
-  color: #ff7733;
+  color: #f73;
 }
 
 .unfilled-link.disabled {
-  cursor: not-allowed;
+  color: #ccc;
   text-decoration: none;
-  color: #cccccc;
+  cursor: not-allowed;
 }
 </style>
 
 <style>
 /* 设计井身结构 tooltip 样式 - 保留换行符 */
 .design-well-struct-tooltip {
-  white-space: pre-line;
   max-width: 500px;
   line-height: 1.5;
+  white-space: pre-line;
 }
 
 /* 统计区域样式 */
@@ -896,11 +1016,11 @@ watch(list, () => {
 }
 
 .stat-item {
-  flex: 1;
-  text-align: center;
+  min-width: 0; /* 防止内容溢出 */
   font-size: 16px;
   font-weight: 500;
-  min-width: 0; /* 防止内容溢出 */
+  text-align: center;
+  flex: 1;
 }
 
 /* 确保统计项内容不换行 */