fix : 分摊汇总表格及小计导出

src/api/expense-manage/index.js

@@ -19,6 +19,13 @@ export const getAllocationDetails = (allocationId) => {
     method: "get"
   });
 };
+export const getAllocationSummaryDetails = (params) => {
+  return request({
+    url: '/workflow/mosr/cost/allocation/collect',
+    method: "get",
+    params:params
+  });
+};
 export const getAllocationProcess = () => {
   return request({
     url: '/workflow/mosr/cost/allocation/process',

src/components/DetailComponent/AllocationSummaryDetail.vue

@@ -0,0 +1,104 @@
+<template>
+  <el-button color="#DED0B2" style="float: right;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>
+  <el-table ref="table" :data="tableData" style="width: 100%;height: 479px" :show-summary="true"
+            :summary-method="getSummaries" v-loading="loading" :header-cell-style="{background:'#f5f7fa'}">
+    <el-table-column type="index" label="序号" align="center" width="60"/>
+    <el-table-column prop="projectName" label="项目名称" align="center"/>
+    <el-table-column prop="projectCost" label="费用性质" align="center">
+      <template #default="scope">
+        <div v-if="scope.row.projectCost !== null">
+          <Tag dictType="project_cost" :value="scope.row.projectCost"/>
+        </div>
+        <div v-else>--</div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="researchStage" label="项目阶段" align="center">
+      <template #default="scope">
+        <div
+            v-if="scope.row.researchStage !== null && scope.row.researchStage !== null && scope.row.researchStage !== undefined">
+          <Tag dictType="research_stage" :value="scope.row.researchStage"/>
+        </div>
+        <div v-else>--</div>
+      </template>
+    </el-table-column>
+    <el-table-column prop="afterTax" label="分摊金额" align="center">
+      <template #default="scope">
+        <div v-if="scope.row.afterTax !== null">
+          {{ toThousands(scope.row.afterTax) }}
+        </div>
+      </template>
+    </el-table-column>
+  </el-table>
+</template>
+
+<script setup>
+import {toThousands} from '@/utils/changePrice.js'
+import {exportExcel} from "@/utils/export-excel";
+import {getAllocationSummaryDetails} from "@/api/expense-manage";
+
+const tableData = ref([{
+  id: '12987122',
+  name: 'Tom',
+  amount1: '234',
+  amount2: '3.2',
+  amount3: 10,
+},
+  {
+    id: '12987123',
+    name: 'Tom',
+    amount1: '165',
+    amount2: '4.43',
+    amount3: 12,
+  }])
+const loading = ref(false)
+const table = ref()
+const route = useRoute()
+const getSummaries = (param) => {
+  const {columns, data} = param
+  const sums = []
+  columns.forEach((column, index) => {
+    if (index === 0) {
+      sums[index] = '小计'
+    } else if (index === 4) {
+      const values = data.map((item) => Number(item[column.property]))
+      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 exportTable = () => {
+  const $e = table.value.$el
+  let $table = $e.querySelector('.el-table__fixed')
+  if (!$table) {
+    $table = $e
+  }
+  exportExcel($table, (5 + (Object.keys(tableData.value[0]).length - 5) * 5), "四川省国有资产经营投资管理有限责任公司科技创新项目费用分摊表")
+}
+const init = () => {
+  loading.value = true
+  let params = {
+    allocationId: route.query.id
+  }
+  getAllocationSummaryDetails(params).then(res => {
+    tableData.value = res.data
+    loading.value = false
+  })
+}
+init()
+</script>
+
+<style scoped>
+
+</style>

src/components/DetailComponent/ExpenseDetail.vue

@@ -1,6 +1,7 @@
 <template>
   <el-button color="#DED0B2" style="float: right;margin: 0 10px 10px 0" @click="exportTable">导出</el-button>
-  <el-table ref="reportTable" :data="tableData" style="width: 100%;height: 479px" :span-method="objectSpanMethod" v-loading="loading">
+  <el-table ref="reportTable" :data="tableData" style="width: 100%;height: 479px"
+            :span-method="objectSpanMethod" v-loading="loading">
     <!--        <el-table-column label="四川省国有资产经营投资管理有限责任公司-->
     <!--    科技创新项目人工成本分摊明细表" align="center">-->
     <el-table-column v-for="column in columnInfo" :prop="column.prop" :label="column.label" align="center"
@@ -37,6 +38,8 @@ import {getResearchUser, getAllocationDetailList, getAllocationDetails} from "@/
 import {ElNotification} from "element-plus";
 import {exportExcel} from "@/utils/export-excel";
 
+import {toThousands} from '@/utils/changePrice.js'
+
 const route = useRoute()
 const tableIns = ref()
 const reportTable = ref({});
@@ -45,6 +48,94 @@ const monthConcat = new Map()
 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)) {

src/utils/changePrice.js

@@ -1,8 +1,9 @@
 export const toThousands = (num) => {
-    if(num==undefined||num==null)return '--';
-    const options = {
-      style: 'currency',
-      currency: 'CNY',
-    };
-    return (num).toLocaleString('zh-CN', options)
+  let newNum=Number(num)
+  if (newNum == undefined || newNum == null) return '--';
+  const options = {
+    style: 'currency',
+    currency: 'CNY',
+  };
+  return (newNum).toLocaleString('zh-CN', options)
 }

src/views/expense-management/share/detail.vue

@@ -18,11 +18,7 @@
       <expense-detail/>
     </el-tab-pane>
     <el-tab-pane label="分摊汇总" name="second" v-loading="loading">
-      <fvTable v-if="showTable" border :tableConfig="tableConfig" :header-cell-style="{background:'#f5f7fa'}" >
-        <template #empty>
-          <el-empty description="暂无数据"/>
-        </template>
-      </fvTable>
+      <allocation-summary-detail/>
     </el-tab-pane>
   </el-tabs>
   <div v-if="shareData.taskId">
@@ -60,7 +56,6 @@
 </template>
 
 <script setup lang="jsx">
-import {toThousands} from '@/utils/changePrice.js'
 import OperationRender from '@/views/workflow/common/OperationRender.vue'
 import ProcessDiagramViewer from '@/views/workflow/common/ProcessDiagramViewer.vue'
 import {ElNotification} from "element-plus";
@@ -74,65 +69,9 @@ const shareData = ref({})
 const formData = ref({})
 const auditOpinion = ref('')
 const shareProcessViewer = ref(true)
-const showTable = ref(true)
 const loading = ref(false)
 const activeName = ref('first')
-const tableConfig = reactive({
-  columns: [
-    {
-      prop: 'index',
-      type: 'index',
-      label: '序号',
-      align: 'center',
-      width: '80',
-    },
-    {
-      prop: 'projectName',
-      label: '项目名称',
-      align: 'center',
-    },
-    {
-      prop: 'projectCost',
-      label: '费用性质',
-      align: 'center',
-      currentRender: ({row, index}) => {
-        if (row.projectCost !== null) {
-          return (<Tag dictType={'project_cost'} value={row.projectCost}/>)
-        } else {
-          return '--'
-        }
-      }
-    },
-    {
-      prop: 'researchStage',
-      label: '项目阶段',
-      align: 'center',
-      currentRender: ({row, index}) => {
-        if (row.researchStage && row.researchStage !== null && row.researchStage !== undefined) {
-          return (<Tag dictType={'research_stage'} value={row.researchStage}/>)
-        } else {
-          return '--'
-        }
-      }
-    },
-    {
-      prop: 'afterTax',
-      label: '分摊金额',
-      align: 'center',
-      currentRender: ({row}) => {
-        return <span>{toThousands(row.afterTax)}</span>
-      }
-    }
-  ],
-  api: '/workflow/mosr/cost/allocation/collect',
-  export: {
-    open: true,
-    fileName: "四川省国有资产经营投资管理有限责任公司科技创新项目费用分摊表"
-  },
-  params: {
-    allocationId: route.query.id
-  }
-})
+// const activeName = ref('second')
 
 const getDetail = async () => {
   const id = route.query.id