刘洋 7 months ago
parent
commit
41828eeb09
2 changed files with 52 additions and 3 deletions
  1. 12 0
      src/utils/tool.js
  2. 40 3
      src/views/work-hours/work-hours-manage/work-statistics/index.vue

+ 12 - 0
src/utils/tool.js

@@ -587,3 +587,15 @@ export const appUpdateObserver = () => {
     true
   );
 };
+
+//动态获取文字所占页面宽度
+export const getTextWidth = (text = '', fontSize = 14) => {
+  const _span = document.createElement('span');
+  _span.innerText = text;
+  _span.style.fontSize = fontSize + 'px';
+  _span.style.position = 'absolute';
+  document.body.appendChild(_span);
+  let width = _span.offsetWidth;
+  document.body.removeChild(_span);
+  return width;
+};

+ 40 - 3
src/views/work-hours/work-hours-manage/work-statistics/index.vue

@@ -40,6 +40,13 @@
           current: pagination.pageNumber,
         }"
       >
+        <template #addDaysDetail="{ row }">
+          <div v-html="str2Html(row.addDaysDetail)"></div>
+        </template>
+        <template #addHoursDetail="{ row }">
+          <div v-html="str2Html(row.addHoursDetail)"></div>
+        </template>
+
         <template #operate="{ row }">
           <div class="table-operations" @click.stop>
             <t-link
@@ -85,11 +92,14 @@ import {
   ATTENDANCE_STATISTICS_SUBMIT_STATUS,
   STATISTICAL_DIMENSION,
 } from '@/config/constants';
-import { dictToOptionList } from '@/utils/tool';
+import { dictToOptionList, getTextWidth } from '@/utils/tool';
 import usePermission from '@/hooks/usePermission';
 import AppendHoursDialog from './append-hours-dialog.vue';
 const { perm } = usePermission();
 
+const str2Html = (str) => {
+  return (str || '').replaceAll('\n', '<br />');
+};
 const curRow = ref(null);
 const showAppendDialog = ref(false);
 
@@ -158,8 +168,25 @@ const exportFile = () => {
 const statisticsHandle = () => {
   dingStatisticsApi().then(() => {
     MessagePlugin.success('操作成功');
+    mixinSearch();
   });
 };
+const dynamicsWidth = (key) => {
+  let arr = [];
+  for (let i = 0; i < tableData.value.length; i++) {
+    let val = tableData.value[i][key] || '';
+    if (val) {
+      arr.push(...val.split('\n').filter(Boolean));
+    }
+  }
+  arr.sort((a, b) => b.length - a.length);
+  if (arr.length) {
+    let maxStr = arr[0];
+    let resWidth = getTextWidth(maxStr) + 34;
+    return resWidth < 140 ? 140 : resWidth;
+  }
+  return 140;
+};
 const columns = computed(() => {
   const type = params.type;
   if (!type) {
@@ -175,9 +202,19 @@ const columns = computed(() => {
       { colKey: 'weekends', title: '周末(天)', width: 110 },
       { colKey: 'legalHolidays', title: '法定节假日(天)', width: 150 },
       { colKey: 'addDays', title: '追加人天(天)', width: 140 },
-      { colKey: 'addDaysDetail', title: '追加详情(天)', width: 140 },
+      {
+        colKey: 'addDaysDetail',
+        title: '追加详情(天)',
+        ceil: 'addDaysDetail',
+        width: dynamicsWidth('addDaysDetail'),
+      },
       { colKey: 'addHours', title: '追加小时(时)', width: 140 },
-      { colKey: 'addHoursDetail', title: '追加详情(时)', width: 140 },
+      {
+        colKey: 'addHoursDetail',
+        title: '追加详情(时)',
+        ceil: 'addHoursDetail',
+        width: dynamicsWidth('addHoursDetail'),
+      },
       { colKey: 'workDays', title: '累计人天(天)', width: 140 },
       { colKey: 'workHours', title: '累计工时(小时)', width: 160 },
       { colKey: 'violationDays', title: '违规工时(天)', width: 160 },