fix:收入合同

This commit is contained in:
Maple 2025-08-07 16:05:17 +08:00
parent 895bfcbeaf
commit 36b076f987
1 changed files with 96 additions and 123 deletions

View File

@ -1,25 +1,25 @@
<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="contractId"
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"
v-model="searchForm"
search
:columns="queryFormColumns"
size="medium"
@search="search"
@reset="reset"
/>
</template>
@ -37,15 +37,15 @@
</template>
<!-- 合同状态 -->
<template #status="{ record }">
<a-tag :color="getStatusColor(record.status)">
{{ getStatusText(record.status) }}
<template #contractStatus="{ record }">
<a-tag :color="getStatusColor(record.contractStatus)">
{{ getStatusText(record.contractStatus) }}
</a-tag>
</template>
<!-- 合同金额 -->
<template #contractAmount="{ record }">
<span class="font-medium text-green-600">{{ record.contractAmount.toLocaleString() }}</span>
<template #amount="{ record }">
<span class="font-medium text-green-600">{{ record.amount.toLocaleString() }}</span>
</template>
<!-- 已收款金额 -->
@ -53,12 +53,17 @@
<span class="font-medium text-blue-600">{{ record.receivedAmount.toLocaleString() }}</span>
</template>
<!-- 已结算金额 -->
<template #settlementAmount="{ record }">
<span class="font-medium text-orange-600">{{ record.settlementAmount.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="editRecord(record)" v-if="record.contractStatus === 'draft'">编辑</a-link>
<a-link @click="approveContract(record)" v-if="record.contractStatus === 'pending'">审批</a-link>
<a-link @click="viewPayment(record)">收款记录</a-link>
</a-space>
</template>
@ -70,38 +75,38 @@
import { ref, reactive, onMounted } from 'vue'
import { Message } from '@arco-design/web-vue'
import type { TableColumnData } from '@arco-design/web-vue'
import { getContractList, type ContractQueryParams, type ContractData } from '@/apis/contract'
//
let searchForm = reactive({
contractName: '',
contractCode: '',
client: '',
status: '',
code: '',
customer: '',
contractStatus: '',
signDate: '',
page: 1,
size: 10
pageSize: 10
})
//
const queryFormColumns = [
{
field: 'contractName',
label: '合同名称',
field: 'code',
label: '合同编号',
type: 'input' as const,
props: {
placeholder: '请输入合同名称'
placeholder: '请输入合同编号'
}
},
{
field: 'client',
label: '客户',
field: 'customer',
label: '客户名称',
type: 'input' as const,
props: {
placeholder: '请输入客户名称'
}
},
{
field: 'status',
field: 'contractStatus',
label: '合同状态',
type: 'select' as const,
props: {
@ -120,83 +125,33 @@ const queryFormColumns = [
//
const tableColumns: TableColumnData[] = [
{ title: '合同编号', dataIndex: 'contractCode', width: 150 },
{ title: '合同名称', dataIndex: 'contractName', width: 250, ellipsis: true, tooltip: true },
{ title: '客户名称', dataIndex: 'client', width: 200, ellipsis: true, tooltip: true },
{ title: '合同金额', dataIndex: 'contractAmount', slotName: 'contractAmount', width: 120 },
{ title: '合同编号', dataIndex: 'code', width: 150 },
{ title: '合同内容', dataIndex: 'contractText', width: 250, ellipsis: true, tooltip: true },
{ title: '客户名称', dataIndex: 'customer', width: 200, ellipsis: true, tooltip: true },
{ title: '合同金额', dataIndex: 'amount', slotName: 'amount', 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: 'projectManager', width: 100 },
{ title: '销售经理', dataIndex: 'salesManager', width: 100 },
{ title: '完成进度', dataIndex: 'progress', width: 100 },
{ title: '备注', dataIndex: 'remark', width: 200, ellipsis: true, tooltip: true },
{ title: '已结算金额', dataIndex: 'settlementAmount', slotName: 'settlementAmount', width: 120 },
{ title: '签订日期', dataIndex: 'signDate', width: 120 },
{ title: '付款日期', dataIndex: 'paymentDate', width: 120 },
{ title: '履约期限', dataIndex: 'performanceDeadline', width: 120 },
{ title: '合同状态', dataIndex: 'contractStatus', slotName: 'contractStatus', width: 100 },
{ title: '业务员', dataIndex: 'salespersonName', width: 100 },
{ title: '部门', dataIndex: 'salespersonDeptName', width: 120 },
{ title: '项目名称', dataIndex: 'projectName', width: 200, ellipsis: true, tooltip: true },
{ title: '产品或服务', dataIndex: 'productService', width: 200, ellipsis: true, tooltip: true },
{ title: '期限', dataIndex: 'duration', width: 100 },
{ 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: 'RC2024001',
contractName: '华能新能源风电场叶片检测服务合同',
client: '华能新能源股份有限公司',
contractAmount: 320,
receivedAmount: 192,
pendingAmount: 128,
signDate: '2024-02-20',
startDate: '2024-03-01',
endDate: '2024-04-30',
status: 'executing',
projectManager: '张项目经理',
salesManager: '李销售经理',
progress: '60%',
remark: '项目进展顺利,客户满意度高'
},
{
id: 2,
contractCode: 'RC2024002',
contractName: '大唐风电场防雷检测项目合同',
client: '大唐新能源股份有限公司',
contractAmount: 268,
receivedAmount: 134,
pendingAmount: 134,
signDate: '2024-02-25',
startDate: '2024-03-05',
endDate: '2024-04-20',
status: 'executing',
projectManager: '王项目经理',
salesManager: '赵销售经理',
progress: '45%',
remark: '按计划执行中'
},
{
id: 3,
contractCode: 'RC2024003',
contractName: '中广核风电场设备维护服务合同',
client: '中广核新能源投资有限公司',
contractAmount: 450,
receivedAmount: 450,
pendingAmount: 0,
signDate: '2024-01-15',
startDate: '2024-01-20',
endDate: '2024-01-31',
status: 'completed',
projectManager: '刘项目经理',
salesManager: '孙销售经理',
progress: '100%',
remark: '项目已完成,客户验收通过'
}
])
const dataList = ref<ContractData[]>([])
const pagination = reactive({
current: 1,
pageSize: 10,
total: 3,
total: 0,
showTotal: true,
showPageSize: true
})
@ -230,20 +185,38 @@ const getStatusText = (status: string) => {
//
const search = async () => {
loading.value = true
setTimeout(() => {
try {
const params: ContractQueryParams = {
...searchForm,
type: 'revenue', //
page: searchForm.page,
pageSize: searchForm.pageSize
}
const response = await getContractList(params)
if (response.code === 0) {
dataList.value = response.rows || []
pagination.total = response.total || 0
} else {
Message.error(response.msg || '获取合同列表失败')
}
} catch (error) {
console.error('获取合同列表失败:', error)
Message.error('获取合同列表失败')
} finally {
loading.value = false
}, 1000)
}
}
const reset = () => {
Object.assign(searchForm, {
contractName: '',
contractCode: '',
client: '',
status: '',
code: '',
customer: '',
contractStatus: '',
signDate: '',
page: 1,
size: 10
pageSize: 10
})
pagination.current = 1
search()
@ -257,7 +230,7 @@ const onPageChange = (page: number) => {
}
const onPageSizeChange = (size: number) => {
searchForm.size = size
searchForm.pageSize = size
searchForm.page = 1
pagination.pageSize = size
pagination.current = 1
@ -273,20 +246,20 @@ const exportContract = () => {
Message.info('导出合同功能开发中...')
}
const viewDetail = (record: any) => {
Message.info(`查看合同详情: ${record.contractName}`)
const viewDetail = (record: ContractData) => {
Message.info(`查看合同详情: ${record.contractText}`)
}
const editRecord = (record: any) => {
Message.info(`编辑合同: ${record.contractName}`)
const editRecord = (record: ContractData) => {
Message.info(`编辑合同: ${record.contractText}`)
}
const approveContract = (record: any) => {
Message.info(`审批合同: ${record.contractName}`)
const approveContract = (record: ContractData) => {
Message.info(`审批合同: ${record.contractText}`)
}
const viewPayment = (record: any) => {
Message.info(`查看收款记录: ${record.contractName}`)
const viewPayment = (record: ContractData) => {
Message.info(`查看收款记录: ${record.contractText}`)
}
onMounted(() => {