fix : 分摊详情小计与导出

2024-06-22 18:45:40 +08:00
parent 3f32683d69
commit 5c60bf91e4
3 changed files with 103 additions and 117 deletions
--- a/src/components/DetailComponent/ExpenseDetail.vue
+++ b/src/components/DetailComponent/ExpenseDetail.vue
@@ -14,15 +14,27 @@
                           :label="childColumn.label"
                           :width="childColumn.prop === 'subtotal' ? 160 : 130">
            <template #default="columnScope">
-              {{ columnScope.row[column.prop][childColumn.prop] }}
+              <template v-if="(tableData.length -1) !== columnScope.$index">
+                {{
+                  columnScope.row[column.prop][childColumn.prop] ? columnScope.row[column.prop][childColumn.prop] : '/'
+                }}
+              </template>
+              <template v-else>
+                {{ columnScope.row[column.prop][childColumn.prop] }}
+              </template>
            </template>
          </el-table-column>
        </template>
        <template v-else>
+          <!--分摊金额合计与分摊金额总计计算-->
          <template
-              v-if="(column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost') && (tableData.length- 1) !== scope.$index">
+              v-if="(column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost') && (tableData.length -1) !== scope.$index">
            {{ getTotalSeparation(scope.row, column.prop) }}
          </template>
+          <template
+              v-else-if="(tableData.length -1) === scope.$index && (column.prop === 'totalSeparation' || column.prop === 'totalSeparationCost')">
+            {{ getTotalSummary(scope.row, column.prop) }}
+          </template>
          <template v-else>
            {{ scope.row[column.prop] }}
          </template>
@@ -33,12 +45,10 @@
  </el-table>
 </template>

-<script setup lang="jsx">
-import {getResearchUser, getAllocationDetailList, getAllocationDetails} from "@/api/expense-manage";
-import {ElNotification} from "element-plus";
-import {exportExcel} from "@/utils/export-excel";

-import {toThousands} from '@/utils/changePrice.js'
+<script setup lang="jsx">
+import {getResearchUser, getAllocationDetails} from "@/api/expense-manage";
+import {exportExcel} from "@/utils/export-excel";

 const route = useRoute()
 const tableIns = ref()
@@ -49,93 +59,6 @@ const tableData = ref([])
 const loading = ref(false)
 const researchOptions = ref([])

-// const getSummaries = (param) => {
-//   const {columns, data} = param
-//   const sums = []
-//   columns.forEach((column, index) => {
-//     if (index === 1) {
-//       sums[index] = '合计'
-//     }
-//     // else if (index == (columns.length - 1)) {//分摊金额总计
-//     //   const values = data.map((item) => {
-//     //     // Number()
-//     //     console.log('column.property',column.property)
-//     //     console.log('item]',item)
-//     //   })
-//     //   if (!values.every((value) => Number.isNaN(value))) {
-//     //     sums[index] = `${values.reduce((prev, curr) => {
-//     //       const value = Number(curr)
-//     //       if (!Number.isNaN(value)) {
-//     //         return prev + curr
-//     //       } else {
-//     //         return prev
-//     //       }
-//     //     }, 0)}`
-//     //     sums[index] = toThousands(sums[index])
-//     //   } else {
-//     //     sums[index] = '-'
-//     //   }
-//     // }
-//     // else if (index == (columns.length - 2)) {//分摊金额合计
-//     //   const values = data.map((item) => Number(item[column.property]))
-//     //   console.log('values',values)
-//     //   if (!values.every((value) => Number.isNaN(value))) {
-//     //     sums[index] = `${values.reduce((prev, curr) => {
-//     //       const value = Number(curr)
-//     //       if (!Number.isNaN(value)) {
-//     //         return prev + curr
-//     //       } else {
-//     //         return prev
-//     //       }
-//     //     }, 0)}`
-//     //     sums[index] = toThousands(sums[index])
-//     //   } else {
-//     //     sums[index] = '-'
-//     //   }
-//     // }
-//     const parts = column.property.split('.');
-//     if (column.property.startsWith('personInfo') && parts[1] === 'separationAmount') {
-//       console.log('column',column,index)
-//       const values = data.map((item) => {
-//         // console.log('parts[0]',parts)
-//         // console.log(item[parts[0]])
-//       })
-//       // console.log('values',values)
-//       if (!values.every((value) => Number.isNaN(value))) {
-//         sums[index] = `${values.reduce((prev, curr) => {
-//           const value = Number(curr)
-//           if (!Number.isNaN(value)) {
-//             return prev + curr
-//           } else {
-//             return prev
-//           }
-//         }, 0)}`
-//         sums[index] = toThousands(sums[index])
-//       } else {
-//         sums[index] = '-'
-//       }
-//     } else {
-//       if (column.property.startsWith('personInfo') && parts[1] === 'subtotal') {
-//         const values = data.map((item) => Number(item[parts[0]].subtotal))
-//         if (!values.every((value) => Number.isNaN(value))) {
-//           sums[index] = `${values.reduce((prev, curr) => {
-//             const value = Number(curr)
-//             if (!Number.isNaN(value)) {
-//               return prev + curr
-//             } else {
-//               return prev
-//             }
-//           }, 0)}`
-//           sums[index] = toThousands(sums[index])
-//         } else {
-//           sums[index] = '-'
-//         }
-//       }
-//     }
-//   })
-//   return sums
-// }
-
 const objectSpanMethod = ({row, column, rowIndex, columnIndex}) => {
  if (columnIndex === 0) {
    if (monthConcat.has(rowIndex)) {
@@ -151,8 +74,9 @@ const objectSpanMethod = ({row, column, rowIndex, columnIndex}) => {
    }
  } else {
    let length = Object.keys(row).length
+    console.log(length)
    if (length > 5) {
-      if (concatColumn(columnIndex, length)) {
+      if (concatColumn(columnIndex, length, rowIndex)) {
        if (rowIndex % 5 === 0) {
          return {
            rowspan: 5,
@@ -174,7 +98,7 @@ const getTotalSeparation = (row, prop) => {
  let totalSeparation = 0.00
  for (let key of Object.keys(row)) {
    if (key.startsWith('personInfo')) {
-      let value = prop === 'totalSeparation' ? row[key].separationAmount : row[key].subtotal
+      let value = prop === 'totalSeparation' ? (row[key].separationAmount ? row[key].separationAmount : 0) : row[key].subtotal
      if ("/" !== value) {
        try {
          totalSeparation += parseFloat(value)
@@ -190,7 +114,33 @@ const getTotalSeparation = (row, prop) => {
  }
 }

-const concatColumn = (columnIndex, length) => {
+
+const getTotalSummary = (row, prop) => {
+  let key;
+  if (prop === 'totalSeparation') {
+    key = 'separationAmount'
+  } else {
+    key = 'subtotal'
+  }
+  let result = 0
+  for (const rowKey of Object.keys(row)) {
+    if (rowKey.startsWith('personInfo')) {
+      let value = row[rowKey][key]
+      if (value && "/" !== value) {
+        try {
+          result += parseFloat(value)
+        } catch (e) {
+        }
+      }
+    }
+  }
+  return result.toFixed(2);
+}
+
+const concatColumn = (columnIndex, length, rowIndex) => {
+  if (rowIndex === tableData.value.length - 1) {
+    return false
+  }
  let columnLength = 5 + (length - 5) * 5
  if (columnIndex === 1
      || columnIndex === columnLength - 1) {
@@ -205,22 +155,69 @@ const concatColumn = (columnIndex, length) => {
  }
  return false
 }
+
 const init = () => {
  loading.value = true
-  getAllocationDetails().then(res => {
+  getAllocationDetails(route.query.id).then(res => {
    columnInfo.value = res.data.columns
    let tableDataLet = res.data.tableData;
+    let personInfoKey = []
+    columnInfo.value.forEach(item => {
+      if (item.prop.startsWith('personInfo')) {
+        personInfoKey.push(item.prop)
+      }
+    })
    tableData.value = []
    let rowIndex = 0;
-    tableDataLet.forEach((tableDatum, index) => {
+    let summary = {
+      month: "",
+      salaryType: '',
+      projectName: "合计",
+      totalSeparation: 10,
+      totalSeparationCost: 10
+    }
+    for (const key of personInfoKey) {
+      summary[key] = {
+        researchDuration: "",
+        separationAmount: 20,
+        subtotal: 20,
+        wagesPayable: "",
+        workday: "",
+      }
+    }
+    tableDataLet.forEach((tableDatum) => {
      let rowspan = tableDatum.rows.length * 5
      monthConcat.set(rowIndex, rowspan)
      rowIndex += rowspan
      for (const tableDatumElement of tableDatum.rows) {
        tableData.value = tableData.value.concat(tableDatumElement)
-
+        let row = tableDatumElement[0]
+        for (const key of personInfoKey) {
+          try {
+            if (row[key].subtotal && '/' !== row[key].subtotal) {
+              summary[key].subtotal += parseFloat(row[key].subtotal)
+            }
+          } catch (e) {
+          }
+        }
      }
    })
+    for (const row of tableData.value) {
+      for (const key of personInfoKey) {
+        try {
+          if (row[key].separationAmount && '/' !== row[key].separationAmount) {
+            summary[key].separationAmount += parseFloat(row[key].separationAmount)
+          }
+        } catch (e) {
+        }
+      }
+    }
+    for (const key of personInfoKey) {
+      summary[key].subtotal = summary[key].subtotal.toFixed(2)
+      summary[key].separationAmount = summary[key].separationAmount.toFixed(2)
+    }
+    monthConcat.set(rowIndex, 1)
+    tableData.value.push(summary)
    loading.value = false
  })
 }
@@ -229,17 +226,6 @@ const getResearchOptions = async () => {
  const res = await getResearchUser()
  researchOptions.value = res.data
 }
-const getResearchName = (id) => {
-  let label = ''
-  if (id !== undefined) {
-    researchOptions.value.forEach(item => {
-      if (item.value == id) {
-        label = item.label
-      }
-    })
-  }
-  return label
-}
 const search = (val) => {
  tableConfig.params = {
    allocationId: route.query.id,
@@ -257,6 +243,6 @@ const exportTable = () => {
  if (!$table) {
    $table = $e
  }
-  exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目人工成本分摊明细表",2)
+  exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目人工成本分摊明细表", 2)
 }
 </script>
--- a/src/utils/export-excel.js
+++ b/src/utils/export-excel.js
@@ -7,8 +7,9 @@ import XLSX from "xlsx-style-vite";
 * @param $table 表格html dom元素
 * @param columnLength 列长度
 * @param excelName 导出文件名称
+ * @param bigWidthIndex 更宽列的索引
 */
-export function exportExcel($table, columnLength, excelName,bigWidth) {
+export function exportExcel($table, columnLength, excelName, bigWidthIndex) {
  //从el-table表生成工作簿对象
  //使用原始的格式,保留表格中的格式如%、小数末尾的0等
  let workbook = utils.table_to_book($table, {
@@ -16,7 +17,7 @@ export function exportExcel($table, columnLength, excelName,bigWidth) {
  });
  //列宽，需要导出的表格有多少列这里的i就小于多少
  for (let i = 1; i < columnLength; i++) {
-    if(i==bigWidth){
+    if (i === bigWidthIndex) {
      workbook.Sheets.Sheet1["!cols"].push({wpx: 300});
    }
    workbook.Sheets.Sheet1["!cols"].push({wpx: 100});
--- a/src/views/expense-management/share/add.vue
+++ b/src/views/expense-management/share/add.vue
@@ -38,7 +38,7 @@
          </el-table-column>
          <el-table-column prop="researchPersonnel" label="研发人员" width="230">
            <template #default="scope">
-              <el-form-item prop="time" :rules="scope.row.researchPersonnel?'1':rules.researchPersonnel">
+              <el-form-item prop="researchPersonnel">
                {{ chooseUserInfo() }}
                <el-button @click="showPersonnelPicker">
                  {{ chooseUserInfo() == null ? '请选择研发人员' : '更改' }}
@@ -183,7 +183,7 @@ const rules = reactive({
  shareName: [{required: true, message: '请输入分摊名称', trigger: 'blur'}],
  apportionmentMonth: [{required: true, message: '请选择月份', trigger: 'blur'}],
  projectId: [{required: true, message: '请选择项目名称', trigger: 'blur'}],
-  researchPersonnel: [{required: true, message: '请选择研发人员', trigger: 'blur'}],
+  // researchPersonnel: [{required: true, message: '请选择研发人员', trigger: 'blur'}],
  wagesPayable: [{required: true, message: '请输入应发工资', trigger: 'blur'}],
  performance: [{required: true, message: '请输入绩效', trigger: 'blur'}],
  reserveFund: [{required: true, message: '请输入公积金', trigger: 'blur'}],
@@ -299,7 +299,6 @@ const handleSubmit = (instance) => {
  //   }
    formData.value.tableData.forEach(item => {
      item.projectName = getProjectName(item.projectId)
-      // item.researchPersonnel
    })
    let params = {
      shareName: formData.value.shareName,