结算和工地直转

src/api/back/index.js

@@ -25,6 +25,18 @@ export function getUnitList(data) {
     data: data,
   })
 }
+
+// 往来单位下拉选,过滤掉班组
+// 往来单位下拉选
+export function getUnitListFilterTeam(data) {
+  return request({
+    url: '/material/select/getUnitListFilterTeam',
+    method: 'post',
+    data: data,
+  })
+}
+
+
 // 协议
 export function getAgreementInfoById(data) {
   return request({

src/views/business/businessHandling/directApply.vue

@@ -248,14 +248,40 @@
             </el-row>
         </el-form>
 
+        <!-- 数据状态提示 -->
+        <div class="data-status-info" style="margin-bottom: 10px; display: flex; justify-content: space-between; align-items: center;">
+            <!-- 分页状态 -->
+            <div style="padding: 8px 12px; background-color: #f8fafc; border: 1px solid #e2e8f0; border-radius: 4px; color: #475569; font-size: 14px;">
+                <i class="el-icon-info"></i>
+                总共 <strong>{{ total }}</strong> 条数据，当前显示第 <strong>{{ queryParams.pageNum }}</strong> 页，每页 <strong>{{ queryParams.pageSize }}</strong> 条
+            </div>
+
+            <!-- 选中数量提示 -->
+            <div v-if="multipleSelection.length > 0" style="padding: 8px 12px; background-color: #f0f9ff; border: 1px solid #bfdbfe; border-radius: 4px; color: #1e40af;">
+                <i class="el-icon-info"></i>
+                已选中 <strong>{{ multipleSelection.length }}</strong> 条数据
+                <span style="margin-left: 10px; font-size: 12px; color: #64748b;">
+<!--                    (当前页: {{ equipmentList.filter(row => row.isActive).length }} 条, 全部: {{ selectedDataArray.length }} 条)-->
+                </span>
+                <el-button type="text" size="mini" style="margin-left: 10px; color: #ef4444;" @click="clearCrossPageSelection">
+                    清空选择
+                </el-button>
+            </div>
+        </div>
+
         <el-table
             v-loading="loading"
             ref="equipmentList"
             :data="equipmentList"
+            :row-key="getRowKey"
             @selection-change="handleSelectionChange"
         >
             <el-table-column type="selection" width="55" align="center" />
-            <el-table-column align="center" label="序号" type="index" width="55" />
+            <el-table-column align="center" label="序号" width="55">
+                <template slot-scope="scope">
+                    {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+                </template>
+            </el-table-column>
             <el-table-column
                 v-for="(column, index) in tableColumns"
                 :key="column.prop"
@@ -287,6 +313,15 @@
       </el-table-column> -->
         </el-table>
 
+        <!-- 分页组件 -->
+        <pagination
+            v-show="total > 0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+        />
+
         <!-- 图片查看弹窗 -->
         <el-dialog :visible.sync="dialogVisible" width="600px" height="600px">
             <img width="100%" height="500px" :src="dialogImageUrl" />
@@ -303,11 +338,12 @@ import { getUseringData, receiveSubmit, receiveEdit, receiveDetail, getEquipment
 import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 import { getToken } from '@/utils/auth'
+import Pagination from '@/components/Pagination'
 
 export default {
     name: 'DirectApply',
     dicts: ['purchase_task_status'],
-    components: { Treeselect },
+    components: { Treeselect, Pagination },
     data() {
         return {
             id: '',
@@ -367,10 +403,18 @@ export default {
             projectId: null,
             // 查询参数
             queryParams: {
+                pageNum: 1, // 当前页码
+                pageSize: 20, // 每页显示数量
                 maId: undefined, // 物资类型
                 typeId: '', // 类型规格
                 keyWord: ''
             },
+            // 前端分页数据
+            allData: [], // 存储所有数据
+            // 跨页勾选数据专用数组
+            selectedDataArray: [], // 专门存储所有选中的完整数据
+            // 防止事件循环的标志位
+            isRestoringSelection: false, // 正在恢复选中状态时为true
             maForm: {
                 backUnitId: undefined,
                 backProId: undefined,
@@ -477,6 +521,9 @@ export default {
         }
     },
     created() {
+        // 初始化标志位
+        this.isRestoringSelection = false
+
         if (this.$route.query.type == 'edit') {
             this.isEdit = true
             this.isDetail = false
@@ -508,7 +555,13 @@ export default {
         // this.maForm.backAgreementId 变化时执行
         'maForm.backAgreementId': {
             handler: function (val, oldVal) {
+                if (val && val !== oldVal) {
                     this.getMaTypeOpt()
+                    // 协议变化时清空数据
+                    this.allData = []
+                    this.clearCrossPageSelection()
+                    this.queryParams.pageNum = 1
+                }
             },
             deep: true
         }
@@ -516,42 +569,126 @@ export default {
     methods: {
         // 查询
         handleQuery() {
+            // 重置分页到第一页
+            this.queryParams.pageNum = 1
+            // 清空缓存数据，强制重新获取
+            this.allData = []
             this.getList()
         },
         // 重置
         handleReset() {
             this.$refs.queryForm.resetFields()
+            // 重置分页
+            this.queryParams.pageNum = 1
+            // 清空缓存数据，强制重新获取
+            this.allData = []
+            // 清空跨页选中状态
+            this.clearCrossPageSelection()
             this.getList()
         },
+
+        // 清空跨页选中状态
+        clearCrossPageSelection() {
+            console.log('=== 清空所有选中状态 ===')
+
+            // 清空数据
+            this.selectedDataArray = []
+            this.multipleSelection = []
+
+            // 清空当前页表格的选中样式
+            if (this.$refs.equipmentList) {
+                // 设置标志位防止触发selection-change事件
+                this.isRestoringSelection = true
+                this.$refs.equipmentList.clearSelection()
+
+                // 清空当前页数据的isActive状态
+                this.equipmentList.forEach(item => {
+                    item.isActive = false
+                    if (!this.isEdit && !this.isDetail) {
+                        item.directNum = undefined
+                    }
+                })
+
+                // 重置标志位
+                this.$nextTick(() => {
+                    this.isRestoringSelection = false
+                    console.log('清空选中状态完成')
+                })
+            } else {
+                this.isRestoringSelection = false // 重置标志位
+            }
+        },
+
+        // 清空所有状态
+        clearAllStates() {
+            this.allData = []
+            this.equipmentList = []
+            this.total = 0
+            this.clearCrossPageSelection()
+            this.queryParams.pageNum = 1
+        },
         // 获取列表
         async getList() {
+            this.loading = true
             try {
+                // 只在第一次查询或者查询条件变化时重新获取数据
+                const needRefreshData = this.queryParams.pageNum === 1 || this.allData.length === 0
+
+                if (needRefreshData) {
                     const params = {
                         agreementId: this.maForm.backAgreementId,
-                    ...this.queryParams
+                        maId: this.queryParams.maId,
+                        typeId: this.queryParams.typeId,
+                        keyWord: this.queryParams.keyWord
+                        // 不传递分页参数，获取全量数据
                     }
                     const res = await getUseringData(params)
                     console.log('🚀 ~ 获取列表 ~ res:', res)
-                this.equipmentList = res.data
+
-                if (this.isEdit || this.isDetail) {
+                    // 存储全量数据
+                    if (res.data && res.data.records) {
+                        this.allData = res.data.records
+                    } else if (Array.isArray(res.data)) {
+                        this.allData = res.data
+                    } else {
+                        this.allData = []
+                    }
+                }
+
+                // 前端分页处理
+                this.total = this.allData.length
+                const startIndex = (this.queryParams.pageNum - 1) * this.queryParams.pageSize
+                const endIndex = startIndex + this.queryParams.pageSize
+
+                // 设置标志位，防止更新equipmentList时触发selection-change事件
+                this.isRestoringSelection = true
+                this.equipmentList = this.allData.slice(startIndex, endIndex)
+
+                console.log(`🚀 ~ 分页信息 ~ 总数据:${this.total}, 当前页:${this.queryParams.pageNum}, 每页:${this.queryParams.pageSize}, 当前页数据:${this.equipmentList.length}`)
+
+                // 编辑模式下的回显数据处理（只在第一次加载时执行）
+                if ((this.isEdit || this.isDetail) && this.multipleSelectionTemp.length > 0 && needRefreshData) {
+                    console.log('编辑模式初始化选中数据:', this.multipleSelectionTemp.length)
+                    // 将编辑数据添加到选中数据数组中
+                    this.selectedDataArray = [...this.multipleSelectionTemp.map(row => ({
+                        ...row,
+                        isActive: true
+                    }))]
+                    this.updateCrossPageSelection()
+                    console.log('编辑模式回显选中数据已添加到selectedDataArray:', this.selectedDataArray.length)
+                }
+
+                // 恢复当前页的勾选状态
                 this.$nextTick(() => {
-                        this.multipleSelection = this.multipleSelectionTemp
+                    this.restoreCurrentPageSelection()
-                        console.log('🚀 ~ 获取列表 ~ this.equipmentList:', this.multipleSelection)
-                        this.multipleSelection.forEach(row => {
-                            const foundRow = this.equipmentList.find(item => item.typeId === row.typeId)
-                            console.log('🚀 ~ getList ~ foundRow:', foundRow)
-                            if (foundRow) {
-                                // 将 directNum 赋值给 foundRow
-                                foundRow.directNum = row.directNum
-                                // 调用 toggleRowSelection 方法选中行
-                                this.$refs.equipmentList.toggleRowSelection(foundRow)
-                            }
                 })
-                    })
-                }
             } catch (error) {
                 console.log('🚀 ~ 获取列表 ~ error:', error)
-                this.tableList = []
+                this.allData = []
+                this.equipmentList = []
+                this.total = 0
+            } finally {
+                this.loading = false
             }
         },
         // 获取物资类型
@@ -592,6 +729,10 @@ export default {
                 console.log('🚀 ~ getAgreementId ~ res:', res)
                 this.maForm.backAgreementId = res.data.agreementId
                 this.maForm.backAgreementCode = res.data.agreementCode
+                // 协议变化时清空缓存数据和选中状态
+                this.allData = []
+                this.clearCrossPageSelection()
+                this.queryParams.pageNum = 1
                 this.getList()
             } catch (error) {
                 console.log('🚀 ~ getAgreementId ~ error:', error)
@@ -715,21 +856,61 @@ export default {
             }
         },
         // 多选框选中数据
-        handleSelectionChange(row) {
+        handleSelectionChange(currentPageSelectedRows) {
-            console.log('选中了~', row)
+            // 如果正在恢复选中状态，忽略此事件
-            this.multipleSelection = row
+            if (this.isRestoringSelection) {
-            this.equipmentList.forEach(item => {
+                console.log('正在恢复选中状态，忽略selection-change事件')
-                if (item.id && this.multipleSelection.some(val => val.id === item.id)) {
+                console.trace('忽略selection-change的调用栈:')
-                    item.isActive = true
+                return
-                    // 检查 useNum 是否存在，避免赋值 undefined
-                    if (item.useNum !== undefined) {
-                        item.directNum = item.useNum
             }
-                } else {
+
-                    item.isActive = false
+            console.log('=== handleSelectionChange 开始 ===')
+            console.trace('handleSelectionChange调用栈:')
+            console.log('当前页选中数据:', currentPageSelectedRows)
+            console.log('选中前全局数据数量:', this.selectedDataArray.length)
+            console.log('当前页码:', this.queryParams.pageNum)
+
+            // 获取当前页所有数据的rowKey
+            const currentPageRowKeys = this.equipmentList.map(item => this.getRowKey(item))
+
+            // 从selectedDataArray中移除属于当前页的数据（不影响其他页面的数据）
+            const beforeCount = this.selectedDataArray.length
+            this.selectedDataArray = this.selectedDataArray.filter(item =>
+                !currentPageRowKeys.includes(this.getRowKey(item))
+            )
+            const afterCount = this.selectedDataArray.length
+            console.log(`移除当前页数据：${beforeCount} -> ${afterCount}，移除了 ${beforeCount - afterCount} 条`)
+
+            // 添加当前页新选中的数据到数组中
+            currentPageSelectedRows.forEach(row => {
+                const completeRow = {
+                    ...row,
+                    directNum: row.directNum || row.useNum,
+                    isActive: true
+                }
+                this.selectedDataArray.push(completeRow)
+            })
+            console.log(`添加当前页选中数据：${currentPageSelectedRows.length} 条`)
+
+            // 更新当前页的isActive状态
+            this.equipmentList.forEach(item => {
+                const isSelected = currentPageSelectedRows.some(selectedRow => this.getRowKey(selectedRow) === this.getRowKey(item))
+                item.isActive = isSelected
+                if (isSelected && !item.directNum && item.useNum) {
+                    item.directNum = item.useNum
+                } else if (!isSelected && !this.isEdit && !this.isDetail) {
                     item.directNum = undefined
                 }
             })
+
+            // 更新multipleSelection
+            this.multipleSelection = [...this.selectedDataArray]
+
+            console.log('选中后全局数据数量:', this.selectedDataArray.length)
+            console.log('当前页选中rowKey列表:', currentPageSelectedRows.map(row => this.getRowKey(row)))
+            console.log('全局选中rowKey列表:', this.selectedDataArray.map(row => this.getRowKey(row)))
+            console.log('=== handleSelectionChange 结束 ===')
+            console.log('')
         },
 
         // 数量变更
@@ -740,12 +921,130 @@ export default {
                     row.directNum = row.useNum
                 })
             }
+
+            // 如果行被选中，同步更新跨页选中数据数组
+            const rowKey = this.getRowKey(row)
+            const selectedIndex = this.selectedDataArray.findIndex(item => this.getRowKey(item) === rowKey)
+
+            if (selectedIndex !== -1) {
+                // 更新数组中对应的数据
+                this.selectedDataArray[selectedIndex] = {
+                    ...this.selectedDataArray[selectedIndex],
+                    ...row,
+                    directNum: row.directNum,
+                    isActive: true
+                }
+                // 同步更新multipleSelection
+                this.multipleSelection = [...this.selectedDataArray]
+                console.log('数量变更后跨页选中总数:', this.selectedDataArray.length)
+            }
+        },
+
+        // 获取行的唯一标识
+        getRowKey(row) {
+            // 使用最核心的字段确保唯一性，避免编辑数据和实际数据的字段差异
+            const key = `${row.typeId || row.id || 'unknown'}_${row.maCode || ''}_${row.typeModelName || ''}`
+            // 在调试模式下记录 rowKey 生成
+            // console.log('生成rowKey:', key, 'for:', row.typeModelName)
+            return key
+        },
+
+        // 恢复当前页的勾选状态
+        restoreCurrentPageSelection() {
+            // 如果标志位未设置，则设置它
+            if (!this.isRestoringSelection) {
+                this.isRestoringSelection = true
+            }
+
+            this.$nextTick(() => {
+                if (!this.$refs.equipmentList) {
+                    this.isRestoringSelection = false // 确保标志位重置
+                    return
+                }
+
+                console.log('=== 开始恢复选中状态 ===')
+                console.log('标志位状态:', this.isRestoringSelection)
+                console.log('全局选中数量:', this.selectedDataArray.length)
+                console.log('当前页数据数量:', this.equipmentList.length)
+                console.log('当前页码:', this.queryParams.pageNum)
+                console.log('是否编辑模式:', this.isEdit || this.isDetail)
+                if (this.selectedDataArray.length > 0) {
+                    console.log('全局选中数据的前3个rowKey:', this.selectedDataArray.slice(0, 3).map(item => this.getRowKey(item)))
+                    console.log('当前页数据的前3个rowKey:', this.equipmentList.slice(0, 3).map(item => this.getRowKey(item)))
+                }
+
+                try {
+                    // 先清除所有选中状态（此时标志位已设置）
+                    this.$refs.equipmentList.clearSelection()
+
+                    // 遍历当前页数据，检查是否在选中数组中
+                    let matchedCount = 0
+                    this.equipmentList.forEach(row => {
+                        const rowKey = this.getRowKey(row)
+                        // 在选中数组中查找对应的数据
+                        const selectedData = this.selectedDataArray.find(item => this.getRowKey(item) === rowKey)
+
+                        if (selectedData) {
+                            matchedCount++
+                            // 恢复保存的数据
+                            row.directNum = selectedData.directNum
+                            row.isActive = true
+                            // 恢复表格选中状态
+                            this.$refs.equipmentList.toggleRowSelection(row, true)
+                            console.log(`恢复选中: ${rowKey}`)
+                        } else {
+                            row.isActive = false
+                            if (!this.isEdit && !this.isDetail) {
+                                row.directNum = undefined
+                            }
+                        }
+                    })
+                    console.log(`当前页匹配到 ${matchedCount} 条选中数据`)
+
+                    // 如果是编辑模式且匹配数量为0，显示详细的调试信息
+                    if ((this.isEdit || this.isDetail) && matchedCount === 0 && this.selectedDataArray.length > 0) {
+                        console.warn('编辑模式下当前页没有匹配到任何选中数据，检查rowKey匹配:')
+                        console.log('当前页所有rowKey:', this.equipmentList.map(item => this.getRowKey(item)))
+                        console.log('全局选中所有rowKey:', this.selectedDataArray.map(item => this.getRowKey(item)))
+                    }
+
+                    const restoredCount = this.equipmentList.filter(row => row.isActive).length
+                    console.log('恢复选中状态完成，当前页选中数量:', this.$refs.equipmentList.selection?.length || 0)
+                    console.log('恢复选中状态完成，当前页isActive数量:', restoredCount)
+                    console.log('全局选中数量:', this.selectedDataArray.length)
+                    console.log('当前页应该恢复的rowKey:', this.equipmentList.filter(row => {
+                        const rowKey = this.getRowKey(row)
+                        return this.selectedDataArray.some(item => this.getRowKey(item) === rowKey)
+                    }).map(row => this.getRowKey(row)))
+                    console.log('=== 恢复选中状态结束 ===')
+                    console.log('')
+                } catch (error) {
+                    console.error('恢复选中状态时出错:', error)
+                } finally {
+                    // 无论如何都要清除标志位
+                    this.isRestoringSelection = false
+                    console.log('标志位已重置为:', this.isRestoringSelection)
+                }
+            })
+        },
+
+        // 更新跨页选中状态
+        updateCrossPageSelection() {
+            // 直接使用选中数据数组
+            this.multipleSelection = [...this.selectedDataArray]
         },
         /** 保存按钮操作 */
         handleSave() {
+            // 确保使用最新的跨页选中数据
+            this.updateCrossPageSelection()
+            console.log('=== 保存操作开始 ===')
             console.log('maForm', this.maForm)
-            console.log('选中数据', this.multipleSelection)
+            console.log('selectedDataArray:', this.selectedDataArray)
-            if (this.multipleSelection.length > 0) {
+            console.log('multipleSelection:', this.multipleSelection)
+            console.log('选中数据总数:', this.selectedDataArray.length)
+            console.log('=====================')
+
+            if (this.selectedDataArray.length > 0) {
                 this.$refs['maForm'].validate(valid => {
                     if (valid) {
                         this.$modal.confirm('是否确认申请').then(async () => {
@@ -808,8 +1107,8 @@ export default {
                                 }
                                 this.$message.success('操作成功')
                                 this.$refs['maForm'].resetFields()
-                                this.equipmentList = []
+                                // 清空所有状态
-                                this.multipleSelection = []
+                                this.clearAllStates()
                                 this.delBusinessFileIdList = []
                                 loading.close()
                             } catch (error) {
@@ -1127,4 +1426,33 @@ export default {
     justify-content: center;
     align-items: center;
 }
+
+// 数据状态提示样式
+.data-status-info {
+    font-size: 14px;
+
+    @media (max-width: 768px) {
+        flex-direction: column;
+        gap: 10px;
+        align-items: stretch !important;
+    }
+
+    strong {
+        font-weight: 600;
+    }
+
+    .el-button--text {
+        padding: 0;
+        margin-left: 15px;
+
+        &:hover {
+            color: #dc2626 !important;
+        }
+    }
+
+    .el-icon-info {
+        margin-right: 5px;
+        font-size: 16px;
+    }
+}
 </style>

src/views/material/cost/component/applyDetail.vue

@@ -213,7 +213,7 @@
 import { getSltInfo, submitFee,submitCosts } from '@/api/cost/cost'
 
 export default {
-    name: '',
+    name: 'ApplyDetail',
     dicts: [],
     props: {
         row: {

src/views/material/cost/component/applyHome.vue

@@ -234,7 +234,7 @@ import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import printJS from 'print-js'
 export default {
-    name: 'CostApplyList',
+    name: 'ApplyHome',
     dicts: ['cost_status'],
     components: { Treeselect, vueEasyPrint },
     data() {
@@ -307,6 +307,15 @@ export default {
         // this.GetProData()
         this.getList()
     },
+    activated() {
+        // 组件被 keep-alive 缓存后重新激活时，不重新加载数据
+        // 如果需要刷新数据，可以在这里添加逻辑
+        console.log('ApplyHome activated - 页面缓存激活')
+    },
+    deactivated() {
+        // 组件被 keep-alive 缓存时
+        console.log('ApplyHome deactivated - 页面缓存')
+    },
     methods: {
         /** 转换菜单数据结构 */
         normalizer(node) {
@@ -387,6 +396,7 @@ export default {
                 pageSize: this.queryParams.pageSize,
                 projectId: this.queryParams.projectId,
                 sltStatus: this.queryParams.sltStatus,
+                agreementCode: this.queryParams.agreementCode,
                 // ...this.queryParams,
                 unitIds: this.unitIds,
 

src/views/material/cost/component/examHome.vue

@@ -246,7 +246,7 @@ import vueEasyPrint from "vue-easy-print";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 export default {
-    name: 'CostApplyList',
+    name: 'ExamHome',
     dicts: ['cost_status'],
     components: { Treeselect, vueEasyPrint },
     data() {

src/views/material/cost/component/reportHome.vue

@@ -138,12 +138,14 @@
             :visible.sync="costDetailVisible"
             width="80%"
             top="5vh"
-            :close-on-click-modal="false">
+            :close-on-click-modal="false"
+            @closed="handleCostDetailDialogClosed">
             <!-- 租赁费用详情表格 -->
             <el-table
                 v-if="costDetailType === 'lease'"
                 v-loading="costDetailLoading"
                 :data="costDetailList"
+                :key="'lease-table-' + costDetailType"
                 border
                 stripe
                 height="500">
@@ -155,7 +157,7 @@
                 <el-table-column label="数量" align="center" prop="quantity" width="80" />
                 <el-table-column label="归还数量" align="center" prop="returnQuantity" width="100" />
                 <el-table-column label="租赁日期" align="center" prop="leaseDate" width="120" />
-                <el-table-column label="退换日期" align="center" prop="returnDate" width="120" />
+                <el-table-column label="退还日期" align="center" prop="returnDate" width="120" />
                 <el-table-column label="天数" align="center" prop="days" width="80" />
                 <el-table-column label="费用（元）" align="center" prop="cost" width="100">
                     <template slot-scope="scope">
@@ -169,6 +171,7 @@
                 v-if="costDetailType === 'repair'"
                 v-loading="costDetailLoading"
                 :data="costDetailList"
+                :key="'repair-table-' + costDetailType"
                 border
                 stripe
                 height="500">
@@ -189,6 +192,7 @@
                 v-if="costDetailType === 'lose'"
                 v-loading="costDetailLoading"
                 :data="costDetailList"
+                :key="'lose-table-' + costDetailType"
                 border
                 stripe
                 height="500">
@@ -209,6 +213,7 @@
                 v-if="costDetailType === 'scrap'"
                 v-loading="costDetailLoading"
                 :data="costDetailList"
+                :key="'scrap-table-' + costDetailType"
                 border
                 stripe
                 height="500">
@@ -229,6 +234,7 @@
                 v-if="costDetailType === 'total'"
                 v-loading="costDetailLoading"
                 :data="costDetailList"
+                :key="'total-table-' + costDetailType"
                 border
                 stripe
                 height="500">
@@ -236,12 +242,40 @@
                 <el-table-column label="名称" align="center" prop="name" :show-overflow-tooltip="true" />
                 <el-table-column label="型号" align="center" prop="model" :show-overflow-tooltip="true" />
                 <el-table-column label="单位" align="center" prop="unit" width="80" />
-                <el-table-column label="单价（元）" align="center" prop="unitPrice" width="100" />
+                <el-table-column label="单价（元）" align="center" width="100">
-                <el-table-column label="数量" align="center" prop="quantity" width="80" />
+                    <template slot-scope="scope">
-                <el-table-column label="归还数量" align="center" prop="returnQuantity" width="100" />
+                        {{ scope.row.costType === 'lease' ? (scope.row.unitPrice || 0) : '-' }}
-                <el-table-column label="租赁日期" align="center" prop="leaseDate" width="120" />
+                    </template>
-                <el-table-column label="退换日期" align="center" prop="returnDate" width="120" />
+                </el-table-column>
-                <el-table-column label="天数" align="center" prop="days" width="80" />
+                <el-table-column label="数量" align="center" width="80">
+                    <template slot-scope="scope">
+                        <span v-if="scope.row.costType === 'lease'">{{ scope.row.quantity || 0 }}</span>
+                        <span v-else-if="scope.row.costType === 'repair'">{{ scope.row.repairQuantity || 0 }}</span>
+                        <span v-else-if="scope.row.costType === 'lose'">{{ scope.row.loseQuantity || 0 }}</span>
+                        <span v-else-if="scope.row.costType === 'scrap'">{{ scope.row.scrapQuantity || 0 }}</span>
+                        <span v-else>-</span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="归还数量" align="center" width="100">
+                    <template slot-scope="scope">
+                        {{ scope.row.costType === 'lease' ? (scope.row.returnQuantity || 0) : '-' }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="租赁日期" align="center" width="120">
+                    <template slot-scope="scope">
+                        {{ scope.row.costType === 'lease' ? (scope.row.leaseDate || '-') : '-' }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="退还日期" align="center" width="120">
+                    <template slot-scope="scope">
+                        {{ scope.row.costType === 'lease' ? (scope.row.returnDate || '-') : '-' }}
+                    </template>
+                </el-table-column>
+                <el-table-column label="天数" align="center" width="80">
+                    <template slot-scope="scope">
+                        {{ scope.row.costType === 'lease' ? (scope.row.days || 0) : '-' }}
+                    </template>
+                </el-table-column>
                 <el-table-column label="费用（元）" align="center" prop="cost" width="100">
                     <template slot-scope="scope">
                         {{ scope.row.cost ? scope.row.cost.toFixed(2) : '0.00' }}
@@ -278,7 +312,7 @@ import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import * as XLSX from 'xlsx';
 export default {
-    name: 'CostApplyList',
+    name: 'ReportHome',
     dicts: ['cost_status'],
     components: { Treeselect, vueEasyPrint },
     data() {
@@ -575,6 +609,7 @@ export default {
             this.costDetailType = costType;
             this.costDetailVisible = true;
             this.costDetailLoading = true;
+            // 确保完全清空之前的数据，避免数据污染
             this.costDetailList = [];
 
             try {
@@ -614,46 +649,68 @@ export default {
                             sourceList = [];
                     }
 
-                    // 根据不同费用类型处理数据
+                    // 根据不同费用类型处理数据，创建完全独立的数据对象避免引用污染
-                    this.costDetailList = sourceList.map(item => {
+                    const newDetailList = sourceList.map(item => {
+                        // 创建深度拷贝的基础数据对象
                         const baseData = {
-                            name: item.typeName || '',
+                            name: (item.typeName || '').toString(),
-                            model: item.modelName || '',
+                            model: (item.modelName || '').toString(),
-                            unit: item.mtUnitName || '',
+                            unit: (item.mtUnitName || '').toString(),
-                            cost: item.costs || 0,
+                            cost: Number(item.costs || 0),
-                            costType: item.costType || costType
+                            costType: (item.costType || costType).toString()
                         };
 
-                        // 根据费用类型添加特定字段
+                        // 根据费用类型添加特定字段，确保每个对象都是独立的
                         if (costType === 'lease' || (costType === 'total' && item.costType === 'lease')) {
                             return {
-                                ...baseData,
+                                name: baseData.name,
-                                unitPrice: item.leasePrice || 0,
+                                model: baseData.model,
-                                quantity: item.num || 0,
+                                unit: baseData.unit,
-                                returnQuantity: item.backNum || 0,
+                                cost: baseData.cost,
-                                leaseDate: item.startTime || '',
+                                costType: baseData.costType,
-                                returnDate: item.endTime || '',
+                                unitPrice: Number(item.leasePrice || 0),
-                                days: item.leaseDays || 0
+                                quantity: Number(item.num || 0),
+                                returnQuantity: Number(item.backNum || 0),
+                                leaseDate: (item.startTime || '').toString(),
+                                returnDate: (item.endTime || '').toString(),
+                                days: Number(item.leaseDays || 0)
                             };
                         } else if (costType === 'repair' || (costType === 'total' && item.costType === 'repair')) {
                             return {
-                                ...baseData,
+                                name: baseData.name,
-                                repairQuantity: item.num || 0
+                                model: baseData.model,
+                                unit: baseData.unit,
+                                cost: baseData.cost,
+                                costType: baseData.costType,
+                                repairQuantity: Number(item.num || 0)
                             };
                         } else if (costType === 'lose' || (costType === 'total' && item.costType === 'lose')) {
                             return {
-                                ...baseData,
+                                name: baseData.name,
-                                loseQuantity: item.num || 0
+                                model: baseData.model,
+                                unit: baseData.unit,
+                                cost: baseData.cost,
+                                costType: baseData.costType,
+                                loseQuantity: Number(item.num || 0)
                             };
                         } else if (costType === 'scrap' || (costType === 'total' && item.costType === 'scrap')) {
                             return {
-                                ...baseData,
+                                name: baseData.name,
-                                scrapQuantity: item.num || 0
+                                model: baseData.model,
+                                unit: baseData.unit,
+                                cost: baseData.cost,
+                                costType: baseData.costType,
+                                scrapQuantity: Number(item.num || 0)
                             };
                         }
 
                         return baseData;
                     });
+
+                    // 使用$nextTick确保DOM完全更新后再赋值数据
+                    this.$nextTick(() => {
+                        this.costDetailList = newDetailList;
+                    });
                 } else {
                     this.$modal.msgError(response.msg || '获取费用详情失败');
                 }
@@ -665,6 +722,15 @@ export default {
             }
         },
 
+        // 费用详情弹窗关闭时的数据清理
+        handleCostDetailDialogClosed() {
+            // 完全清理数据，确保下次打开时是全新状态
+            this.costDetailList = [];
+            this.costDetailType = '';
+            this.costDetailTitle = '';
+            this.costDetailLoading = false;
+        },
+
         // 导出费用详情为Excel
         exportCostDetail() {
             if (!this.costDetailList || this.costDetailList.length === 0) {
@@ -688,7 +754,7 @@ export default {
                             { key: 'quantity', title: '数量' },
                             { key: 'returnQuantity', title: '归还数量' },
                             { key: 'leaseDate', title: '租赁日期' },
-                            { key: 'returnDate', title: '退换日期' },
+                            { key: 'returnDate', title: '退还日期' },
                             { key: 'days', title: '天数' },
                             { key: 'cost', title: '费用（元）' }
                         ];
@@ -737,7 +803,7 @@ export default {
                             { key: 'quantity', title: '数量' },
                             { key: 'returnQuantity', title: '归还数量' },
                             { key: 'leaseDate', title: '租赁日期' },
-                            { key: 'returnDate', title: '退换日期' },
+                            { key: 'returnDate', title: '退还日期' },
                             { key: 'days', title: '天数' },
                             { key: 'cost', title: '费用（元）' },
                             { key: 'costType', title: '费用类型' }

src/views/material/cost/component/unreportHome.vue

@@ -141,7 +141,7 @@
                 <el-table-column label="数量" align="center" prop="quantity" width="80" />
                 <el-table-column label="归还数量" align="center" prop="returnQuantity" width="100" />
                 <el-table-column label="租赁日期" align="center" prop="leaseDate" width="120" />
-                <el-table-column label="退换日期" align="center" prop="returnDate" width="120" />
+                <el-table-column label="退还日期" align="center" prop="returnDate" width="120" />
                 <el-table-column label="天数" align="center" prop="days" width="80" />
                 <el-table-column label="费用（元）" align="center" prop="cost" width="100">
                     <template slot-scope="scope">
@@ -226,7 +226,7 @@
                 <el-table-column label="数量" align="center" prop="quantity" width="80" />
                 <el-table-column label="归还数量" align="center" prop="returnQuantity" width="100" />
                 <el-table-column label="租赁日期" align="center" prop="leaseDate" width="120" />
-                <el-table-column label="退换日期" align="center" prop="returnDate" width="120" />
+                <el-table-column label="退还日期" align="center" prop="returnDate" width="120" />
                 <el-table-column label="天数" align="center" prop="days" width="80" />
                 <el-table-column label="费用（元）" align="center" prop="cost" width="100">
                     <template slot-scope="scope">
@@ -264,7 +264,7 @@ import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import * as XLSX from 'xlsx';
 export default {
-    name: 'CostApplyList',
+    name: 'UnreportHome',
     dicts: ['cost_status'],
     components: { Treeselect, vueEasyPrint },
     data() {
@@ -720,7 +720,7 @@ export default {
                             { key: 'quantity', title: '数量' },
                             { key: 'returnQuantity', title: '归还数量' },
                             { key: 'leaseDate', title: '租赁日期' },
-                            { key: 'returnDate', title: '退换日期' },
+                            { key: 'returnDate', title: '退还日期' },
                             { key: 'days', title: '天数' },
                             { key: 'cost', title: '费用（元）' }
                         ];
@@ -769,7 +769,7 @@ export default {
                             { key: 'quantity', title: '数量' },
                             { key: 'returnQuantity', title: '归还数量' },
                             { key: 'leaseDate', title: '租赁日期' },
-                            { key: 'returnDate', title: '退换日期' },
+                            { key: 'returnDate', title: '退还日期' },
                             { key: 'days', title: '天数' },
                             { key: 'cost', title: '费用（元）' },
                             { key: 'costType', title: '费用类型' }

src/views/material/cost/costApplyList.vue

@@ -6,12 +6,14 @@
             :pageContent="pageContent"
             @goBack="goBack"
         />
+        <keep-alive>
             <component
                 :is="isShowComponent"
                 :row="rowData"
                 @goDetail="goDetail"
                 @goBackPage="goBack"
             />
+        </keep-alive>
     </div>
 </template>