wuxueyu
/
Industrial-image-management-system---web
1
0
Fork 2
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix:支出合同的编辑功能实现

This commit is contained in:
Maple 2025-08-08 17:59:38 +08:00
parent d5929bdc2d
commit 16743cfc7f
4 changed files with 578 additions and 157 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/types/auto-imports.d.ts vendored
View File

@ -70,6 +70,6 @@ declare global {
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
import('vue')
}

155
src/views/project-management/contract/expense-contract/ContractDetail.vue Normal file
View File

@ -0,0 +1,155 @@
<template>
<a-spin :loading="loading">
<div v-if="contractDetail">
<a-descriptions
:column="1"
size="medium"
:label-style="{ width: '120px' }"
>
<a-descriptions-item label="合同编号">
{{ contractDetail.code }}
</a-descriptions-item>
<a-descriptions-item label="项目名称">
{{ contractDetail.projectName }}
</a-descriptions-item>
<a-descriptions-item label="客户名称">
{{ contractDetail.customer }}
</a-descriptions-item>
<a-descriptions-item label="合同金额">
<span class="font-medium text-green-600">￥{{ (contractDetail.amount || 0).toLocaleString() }}</span>
</a-descriptions-item>
<a-descriptions-item label="已收款金额">
<span class="font-medium text-blue-600">￥{{ (contractDetail.receivedAmount || 0).toLocaleString() }}</span>
</a-descriptions-item>
<a-descriptions-item label="未收款金额">
<span class="font-medium text-orange-600">￥{{ (contractDetail.pendingAmount || 0).toLocaleString() }}</span>
</a-descriptions-item>
<a-descriptions-item label="签署日期">
{{ contractDetail.signDate }}
</a-descriptions-item>
<a-descriptions-item label="履约期限">
{{ contractDetail.performanceDeadline }}
</a-descriptions-item>
<a-descriptions-item label="付款日期">
{{ contractDetail.paymentDate }}
</a-descriptions-item>
<a-descriptions-item label="合同状态">
<a-tag :color="getStatusColor(contractDetail.contractStatus)">
{{ getStatusText(contractDetail.contractStatusLabel || contractDetail.contractStatus) }}
</a-tag>
</a-descriptions-item>
<a-descriptions-item label="销售人员">
{{ contractDetail.salespersonName }}
</a-descriptions-item>
<a-descriptions-item label="销售部门">
{{ contractDetail.salespersonDeptName }}
</a-descriptions-item>
<a-descriptions-item label="产品服务">
{{ contractDetail.productService }}
</a-descriptions-item>
<a-descriptions-item label="备注">
{{ contractDetail.notes }}
</a-descriptions-item>
</a-descriptions>
</div>
<div v-else-if="!loading" class="empty-container">
<a-empty description="暂无信息" />
</div>
</a-spin>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import http from '@/utils/http'
import { Message } from '@arco-design/web-vue'
interface ContractDetail {
contractId: string
customer: string
code: string
projectId: string
type: string
productService: string
paymentDate: string | null
performanceDeadline: string | null
paymentAddress: string
amount: number
accountNumber: string
notes: string
contractStatus: string
contractText: string | null
projectName: string
salespersonName: string | null
salespersonDeptName: string
settlementAmount: number | null
receivedAmount: number | null
contractStatusLabel: string | null
createBy: string | null
updateBy: string | null
createTime: string
updateTime: string
page: number
pageSize: number
signDate: string
duration: string
pendingAmount?: number
}
const props = defineProps({
contractId: {
type: String,
required: true
}
})
const contractDetail = ref<ContractDetail | null>(null)
const loading = ref(false)
const getStatusColor = (status: string) => {
const colorMap: Record<string, string> = {
未确认: 'gray',
待审批: 'orange',
已签署: 'blue',
执行中: 'cyan',
已完成: 'green',
已终止: 'red'
}
return colorMap[status] || 'gray'
}
const getStatusText = (status: string) => {
return status || '未知状态'
}
const fetchContractDetail = async () => {
try {
loading.value = true
const response = await http.get(`/contract/${props.contractId}`)
if (response.code === 200) {
contractDetail.value = response.data
// 计算未收款金额
if (contractDetail.value) {
contractDetail.value.pendingAmount = (contractDetail.value.amount || 0) - (contractDetail.value.receivedAmount || 0)
}
} else {
Message.error(response.msg || '获取合同详情失败')
}
} catch (error) {
console.error('获取合同详情失败:', error)
Message.error('获取合同详情失败')
} finally {
loading.value = false
}
}
onMounted(() => {
fetchContractDetail()
})
</script>
<style scoped>
.empty-container {
text-align: center;
padding: 40px 0;
}
</style>

122
src/views/project-management/contract/expense-contract/ContractEdit.vue Normal file
View File

@ -0,0 +1,122 @@
<template>
<a-form :model="contractData" layout="vertical">
<a-row :gutter="16">
<a-col :span="12">
<a-form-item field="code" label="合同编号">
<a-input v-model="contractData.code" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item field="projectName" label="项目名称">
<a-input v-model="contractData.projectName" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item field="customer" label="客户名称">
<a-input v-model="contractData.customer" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item field="amount" label="合同金额">
<a-input-number v-model="contractData.amount" style="width: 100%" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item field="accountNumber" label="收款账号">
<a-input v-model="contractData.accountNumber" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item field="contractStatus" label="合同状态">
<a-select v-model="contractData.contractStatus">
<a-option value="未确认">未确认</a-option>
<a-option value="待审批">待审批</a-option>
<a-option value="已签署">已签署</a-option>
<a-option value="执行中">执行中</a-option>
<a-option value="已完成">已完成</a-option>
<a-option value="已终止">已终止</a-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item field="signDate" label="签订日期">
<a-date-picker v-model="contractData.signDate" style="width: 100%" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item field="performanceDeadline" label="履约期限">
<a-date-picker v-model="contractData.performanceDeadline" style="width: 100%" />
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-form-item field="paymentDate" label="付款日期">
<a-date-picker v-model="contractData.paymentDate" style="width: 100%" />
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item field="productService" label="产品或服务">
<a-input v-model="contractData.productService" />
</a-form-item>
</a-col>
</a-row>
<a-form-item field="paymentAddress" label="付款地址">
<a-input v-model="contractData.paymentAddress" />
</a-form-item>
<a-form-item field="notes" label="备注">
<a-textarea v-model="contractData.notes" />
</a-form-item>
<a-form-item field="contractText" label="合同内容">
<a-textarea v-model="contractData.contractText" />
</a-form-item>
</a-form>
</template>
<script setup lang="ts">
import { ref, watch } from 'vue'
import type { ContractItem } from './index.vue'
const props = defineProps<{
contractData: ContractItem
}>()
const emit = defineEmits<{
(e: 'update:contractData', data: ContractItem): void
}>()
const contractData = ref({ ...props.contractData })
// 监听props变化更新内部数据
watch(
() => props.contractData,
(newVal) => {
if (newVal) {
contractData.value = { ...newVal }
}
},
{ immediate: true },
)
// 监听内部数据变化并触发更新事件
watch(
contractData,
(newVal) => {
emit('update:contractData', newVal)
},
{ deep: true },
)
</script>

456
src/views/project-management/contract/expense-contract/index.vue
View File

@ -1,28 +1,28 @@
<template>
<GiPageLayout>
<GiTable
row-key="id"
title="支出合同管理"
:data="dataList"
:columns="tableColumns"
:loading="loading"
:scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
:pagination="pagination"
@page-change="onPageChange"
@page-size-change="onPageSizeChange"
@refresh="search"
row-key="id"
title="支出合同管理"
:data="dataList"
:columns="tableColumns"
:loading="loading"
:scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
:pagination="pagination"
@page-change="onPageChange"
@page-size-change="onPageSizeChange"
@refresh="search"
>
<template #top>
<GiForm
v-model="searchForm"
search
:columns="queryFormColumns"
size="medium"
@search="search"
@reset="reset"
<GiForm
v-model="searchForm"
search
:columns="queryFormColumns"
size="medium"
@search="search"
@reset="reset"
/>
</template>
<template #toolbar-left>
<a-space>
<a-button type="primary" @click="openAddModal">
@ -35,51 +35,113 @@
</a-button>
</a-space>
</template>
<!-- 合同状态 -->
<template #status="{ record }">
<a-tag :color="getStatusColor(record.status)">
{{ getStatusText(record.status) }}
<a-tag :color="getStatusColor(record.contractStatus)">
{{ getStatusText(record.contractStatusLabel || record.contractStatus) }}
</a-tag>
</template>
<!-- 合同金额 -->
<template #contractAmount="{ record }">
<span class="font-medium text-red-600">￥{{ record.contractAmount.toLocaleString() }}万</span>
<span class="font-medium text-green-600">￥{{ (record.amount || 0).toLocaleString() }}</span>
</template>
<!-- 已付款金额 -->
<template #paidAmount="{ record }">
<span class="font-medium text-orange-600">￥{{ record.paidAmount.toLocaleString() }}万</span>
<!-- 已收款金额 -->
<template #receivedAmount="{ record }">
<span class="font-medium text-blue-600">￥{{ (record.receivedAmount || 0).toLocaleString() }}</span>
</template>
<!-- 操作列 -->
<template #action="{ record }">
<a-space>
<a-link @click="viewDetail(record)">详情</a-link>
<a-link @click="editRecord(record)" v-if="record.status === 'draft'">编辑</a-link>
<a-link @click="approveContract(record)" v-if="record.status === 'pending'">审批</a-link>
<a-link @click="viewPayment(record)">付款记录</a-link>
<a-link v-if="record.contractStatus === '未确认'" @click="editRecord(record)">编辑</a-link>
<a-link v-if="record.contractStatus === '待审批'" @click="approveContract(record)">审批</a-link>
<a-link @click="viewPayment(record)">收款记录</a-link>
<a-link v-if="record.contractStatus !== '已签署' && record.contractStatus !== '已完成'" @click="deleteContract(record)">删除</a-link>
</a-space>
</template>
</GiTable>
<!-- 合同详情弹窗 -->
<a-modal
v-model:visible="showDetailModal"
title="合同详情"
:width="800"
:footer="false"
@cancel="closeDetailModal"
>
<ContractDetail v-if="showDetailModal" :contract-id="selectedContractId" />
</a-modal>
<!-- 合同编辑弹窗 -->
<a-modal
v-model:visible="showEditModal"
title="编辑合同"
:width="800"
@cancel="closeEditModal"
@before-ok="handleEditSubmit"
>
<ContractEdit
v-if="showEditModal"
:contract-data="selectedContractData"
@update:contract-data="handleContractDataUpdate"
/>
</a-modal>
</GiPageLayout>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import { Message } from '@arco-design/web-vue'
import { onMounted, reactive, ref } from 'vue'
import { Message, Modal } from '@arco-design/web-vue'
import type { TableColumnData } from '@arco-design/web-vue'
import ContractEdit from './ContractEdit.vue'
import ContractDetail from './ContractDetail.vue'
import http from '@/utils/http'
// 接口数据类型定义
interface ContractItem {
contractId: string
customer: string
code: string
projectId: string
type: string
productService: string
paymentDate: string | null
performanceDeadline: string | null
paymentAddress: string
amount: number
accountNumber: string
notes: string
contractStatus: string
contractText: string | null
projectName: string
salespersonName: string | null
salespersonDeptName: string
settlementAmount: number | null
receivedAmount: number | null
contractStatusLabel: string | null
createBy: string | null
updateBy: string | null
createTime: string
updateTime: string
page: number
pageSize: number
signDate: string
duration: string
}
// 搜索表单
let searchForm = reactive({
const searchForm = reactive({
contractName: '',
contractCode: '',
supplier: '',
client: '',
status: '',
signDate: '',
page: 1,
size: 10
size: 10,
})
// 查询条件配置
@ -89,16 +151,16 @@ const queryFormColumns = [
label: '合同名称',
type: 'input' as const,
props: {
placeholder: '请输入合同名称'
}
placeholder: '请输入合同名称',
},
},
{
field: 'supplier',
label: '供应商',
field: 'client',
label: '客户',
type: 'input' as const,
props: {
placeholder: '请输入供应商名称'
}
placeholder: '请输入客户名称',
},
},
{
field: 'status',
@ -107,147 +169,121 @@ const queryFormColumns = [
props: {
placeholder: '请选择合同状态',
options: [
{ label: '草稿', value: 'draft' },
{ label: '待审批', value: 'pending' },
{ label: '已签署', value: 'signed' },
{ label: '执行中', value: 'executing' },
{ label: '已完成', value: 'completed' },
{ label: '已终止', value: 'terminated' }
]
}
}
{ label: '未确认', value: '未确认' },
{ label: '待审批', value: '待审批' },
{ label: '已签署', value: '已签署' },
{ label: '执行中', value: '执行中' },
{ label: '已完成', value: '已完成' },
{ label: '已终止', value: '已终止' },
],
},
},
]
// 表格列配置
const tableColumns: TableColumnData[] = [
{ title: '合同编号', dataIndex: 'contractCode', width: 150 },
{ title: '合同名称', dataIndex: 'contractName', width: 250, ellipsis: true, tooltip: true },
{ title: '供应商名称', dataIndex: 'supplier', width: 200, ellipsis: true, tooltip: true },
{ title: '合同类型', dataIndex: 'contractType', width: 120 },
{ title: '合同金额', dataIndex: 'contractAmount', slotName: 'contractAmount', width: 120 },
{ title: '已付款金额', dataIndex: 'paidAmount', slotName: 'paidAmount', width: 120 },
{ title: '未付款金额', dataIndex: 'unpaidAmount', width: 120 },
{ title: '合同编号', dataIndex: 'code', width: 150 },
{ title: '项目名称', dataIndex: 'projectName', width: 250, ellipsis: true, tooltip: true },
{ title: '客户名称', dataIndex: 'customer', width: 200, ellipsis: true, tooltip: true },
{ title: '合同金额', dataIndex: 'amount', slotName: 'contractAmount', width: 120 },
{ title: '已收款金额', dataIndex: 'receivedAmount', slotName: 'receivedAmount', width: 120 },
{ title: '未收款金额', dataIndex: 'pendingAmount', width: 120 },
{ title: '签署日期', dataIndex: 'signDate', width: 120 },
{ title: '开始日期', dataIndex: 'startDate', width: 120 },
{ title: '结束日期', dataIndex: 'endDate', width: 120 },
{ title: '合同状态', dataIndex: 'status', slotName: 'status', width: 100 },
{ title: '项目关联', dataIndex: 'relatedProject', width: 200, ellipsis: true, tooltip: true },
{ title: '采购负责人', dataIndex: 'purchaseManager', width: 100 },
{ title: '付款方式', dataIndex: 'paymentMethod', width: 100 },
{ title: '备注', dataIndex: 'remark', width: 200, ellipsis: true, tooltip: true },
{ title: '操作', slotName: 'action', width: 200, fixed: 'right' }
{ title: '履约期限', dataIndex: 'performanceDeadline', width: 120 },
{ title: '付款日期', dataIndex: 'paymentDate', width: 120 },
{ title: '合同状态', dataIndex: 'contractStatus', slotName: 'status', width: 100 },
{ title: '销售人员', dataIndex: 'salespersonName', width: 100 },
{ title: '销售部门', dataIndex: 'salespersonDeptName', width: 100 },
{ title: '产品服务', dataIndex: 'productService', width: 120, ellipsis: true, tooltip: true },
{ title: '备注', dataIndex: 'notes', width: 200, ellipsis: true, tooltip: true },
{ title: '操作', slotName: 'action', width: 200, fixed: 'right' },
]
// 数据状态
const loading = ref(false)
const dataList = ref([
{
id: 1,
contractCode: 'EC2024001',
contractName: '风电检测设备采购合同',
supplier: '深圳市智能检测设备有限公司',
contractType: '设备采购',
contractAmount: 120,
paidAmount: 60,
unpaidAmount: 60,
signDate: '2024-02-25',
startDate: '2024-03-01',
endDate: '2024-03-31',
status: 'executing',
relatedProject: '华能新能源风电场叶片检测服务项目',
purchaseManager: '李采购经理',
paymentMethod: '银行转账',
remark: '按合同约定分期付款'
},
{
id: 2,
contractCode: 'EC2024002',
contractName: '无人机检测服务外包合同',
supplier: '北京航天无人机技术有限公司',
contractType: '服务外包',
contractAmount: 85,
paidAmount: 25.5,
unpaidAmount: 59.5,
signDate: '2024-03-02',
startDate: '2024-03-05',
endDate: '2024-04-05',
status: 'executing',
relatedProject: '大唐风电场防雷检测项目',
purchaseManager: '王采购经理',
paymentMethod: '分期付款',
remark: '服务外包，按进度付款'
},
{
id: 3,
contractCode: 'EC2024003',
contractName: '检测车辆租赁合同',
supplier: '上海专业车辆租赁有限公司',
contractType: '车辆租赁',
contractAmount: 15,
paidAmount: 15,
unpaidAmount: 0,
signDate: '2024-01-20',
startDate: '2024-01-25',
endDate: '2024-02-25',
status: 'completed',
relatedProject: '中广核风电场设备维护服务项目',
purchaseManager: '刘采购经理',
paymentMethod: '月付',
remark: '租赁合同已完成'
const dataList = ref<ContractItem[]>([])
// API调用函数
const fetchContractList = async () => {
try {
loading.value = true
const params = {
page: searchForm.page,
pageSize: searchForm.size,
contractName: searchForm.contractName,
code: searchForm.contractCode,
customer: searchForm.client,
contractStatus: searchForm.status,
signDate: searchForm.signDate,
}
const response = await http.get('/contract/list', params)
if (response.code === 200) {
// 过滤出类型为"收入合同"的数据
const allContracts = response.rows || []
const revenueContracts = allContracts.filter((item: ContractItem) => item.type === '支出合同')
// 计算未收款金额
dataList.value = revenueContracts.map((item: ContractItem) => ({
...item,
pendingAmount: (item.amount || 0) - (item.receivedAmount || 0),
}))
pagination.total = Number.parseInt(response.total) || 0
} else {
Message.error(response.msg || '获取合同列表失败')
dataList.value = []
}
} catch (error) {
console.error('获取合同列表失败:', error)
Message.error('获取合同列表失败')
dataList.value = []
} finally {
loading.value = false
}
])
}
const pagination = reactive({
current: 1,
pageSize: 10,
total: 3,
total: 0,
showTotal: true,
showPageSize: true
showPageSize: true,
})
// 获取状态颜色
const getStatusColor = (status: string) => {
const colorMap: Record<string, string> = {
'draft': 'gray',
'pending': 'orange',
'signed': 'blue',
'executing': 'cyan',
'completed': 'green',
'terminated': 'red'
未确认: 'gray',
待审批: 'orange',
已签署: 'blue',
执行中: 'cyan',
已完成: 'green',
已终止: 'red',
}
return colorMap[status] || 'gray'
}
// 获取状态文本
const getStatusText = (status: string) => {
const textMap: Record<string, string> = {
'draft': '草稿',
'pending': '待审批',
'signed': '已签署',
'executing': '执行中',
'completed': '已完成',
'terminated': '已终止'
}
return textMap[status] || status
// 直接返回后端返回的状态文本，如果有contractStatusLabel则使用，否则使用contractStatus
return status || '未知状态'
}
// 搜索和重置
const search = async () => {
loading.value = true
setTimeout(() => {
loading.value = false
}, 1000)
await fetchContractList()
}
const reset = () => {
Object.assign(searchForm, {
contractName: '',
contractCode: '',
supplier: '',
client: '',
status: '',
signDate: '',
page: 1,
size: 10
size: 10,
})
pagination.current = 1
search()
@ -277,23 +313,131 @@ const exportContract = () => {
Message.info('导出合同功能开发中...')
}
const viewDetail = (record: any) => {
Message.info(`查看合同详情: ${record.contractName}`)
// 显示合同编辑弹窗
const showEditModal = ref(false)
const selectedContractData = ref<ContractItem | null>(null)
const editedContractData = ref<ContractItem | null>(null)
const editRecord = (record: ContractItem) => {
// 确保所有必要的字段都存在
const completeRecord = {
...record,
amount: record.amount || 0,
projectId: record.projectId || '',
type: record.type || '收入合同',
contractStatus: record.contractStatus || '未确认',
}
selectedContractData.value = completeRecord
showEditModal.value = true
}
const editRecord = (record: any) => {
Message.info(`编辑合同: ${record.contractName}`)
const closeEditModal = () => {
showEditModal.value = false
selectedContractData.value = null
editedContractData.value = null
}
const approveContract = (record: any) => {
Message.info(`审批合同: ${record.contractName}`)
const handleContractDataUpdate = (data: ContractItem) => {
editedContractData.value = data
}
const viewPayment = (record: any) => {
Message.info(`查看付款记录: ${record.contractName}`)
const handleEditSubmit = async () => {
if (!editedContractData.value) return false;
try {
const requestData = {
...editedContractData.value,
accountNumber: editedContractData.value.accountNumber || '',
amount: editedContractData.value.amount || 0,
code: editedContractData.value.code || '',
contractId: editedContractData.value.contractId,
contractStatus: editedContractData.value.contractStatus || '',
contractText: editedContractData.value.contractText || '',
customer: editedContractData.value.customer || '',
departmentId: editedContractData.value.departmentId || '',
duration: editedContractData.value.duration || '',
notes: editedContractData.value.notes || '',
paymentAddress: editedContractData.value.paymentAddress || '',
paymentDate: editedContractData.value.paymentDate || null,
performanceDeadline: editedContractData.value.performanceDeadline || null,
productService: editedContractData.value.productService || '',
projectId: editedContractData.value.projectId || '',
salespersonId: editedContractData.value.salespersonId || '',
signDate: editedContractData.value.signDate || null,
type: editedContractData.value.type || '',
};
console.log('Edited Contract Data:', requestData); // 打印请求数据以便调试
// 修改此处，直接向 /contract 发送 PUT 请求
const response = await http.put('/contract', requestData);
// 检查响应状态
if (response.status === 200 && response.code === 200) {
Message.success('合同编辑成功');
closeEditModal();
search(); // 刷新列表
return true;
} else {
Message.error(response.msg || '合同编辑失败');
return false;
}
} catch (error) {
console.error('合同编辑失败:', error);
Message.error('合同编辑失败: ' + (error.message || '请稍后再试'));
return false;
}
}
// 删除合同
const deleteContract = async (record: ContractItem) => {
try {
await Modal.confirm({
title: '确认删除',
content: `确定要删除合同 "${record.projectName}" 吗？`,
})
const response = await http.delete(`/contract/${record.contractId}`)
if (response.code === 200) {
Message.success('合同删除成功')
search() // 刷新列表
} else {
Message.error(response.msg || '合同删除失败')
}
} catch (error) {
// 用户取消删除或请求失败
if (error !== 'cancel') {
console.error('合同删除失败:', error)
Message.error('合同删除失败')
}
}
}
// 显示合同详情弹窗
const showDetailModal = ref(false)
const selectedContractId = ref<string | null>(null)
const viewDetail = (record: ContractItem) => {
selectedContractId.value = record.contractId
showDetailModal.value = true
}
const closeDetailModal = () => {
showDetailModal.value = false
selectedContractId.value = null
}
const approveContract = (record: ContractItem) => {
Message.info(`审批合同: ${record.projectName}`)
}
const viewPayment = (record: ContractItem) => {
Message.info(`查看收款记录: ${record.projectName}`)
}
onMounted(() => {
search()
fetchContractList()
})
</script>
</script>