fix:收入合同
This commit is contained in:
parent
895bfcbeaf
commit
36b076f987
|
@ -1,25 +1,25 @@
|
||||||
<template>
|
<template>
|
||||||
<GiPageLayout>
|
<GiPageLayout>
|
||||||
<GiTable
|
<GiTable
|
||||||
row-key="id"
|
row-key="contractId"
|
||||||
title="收入合同管理"
|
title="收入合同管理"
|
||||||
:data="dataList"
|
:data="dataList"
|
||||||
:columns="tableColumns"
|
:columns="tableColumns"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
|
:scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
|
||||||
:pagination="pagination"
|
:pagination="pagination"
|
||||||
@page-change="onPageChange"
|
@page-change="onPageChange"
|
||||||
@page-size-change="onPageSizeChange"
|
@page-size-change="onPageSizeChange"
|
||||||
@refresh="search"
|
@refresh="search"
|
||||||
>
|
>
|
||||||
<template #top>
|
<template #top>
|
||||||
<GiForm
|
<GiForm
|
||||||
v-model="searchForm"
|
v-model="searchForm"
|
||||||
search
|
search
|
||||||
:columns="queryFormColumns"
|
:columns="queryFormColumns"
|
||||||
size="medium"
|
size="medium"
|
||||||
@search="search"
|
@search="search"
|
||||||
@reset="reset"
|
@reset="reset"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -37,15 +37,15 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 合同状态 -->
|
<!-- 合同状态 -->
|
||||||
<template #status="{ record }">
|
<template #contractStatus="{ record }">
|
||||||
<a-tag :color="getStatusColor(record.status)">
|
<a-tag :color="getStatusColor(record.contractStatus)">
|
||||||
{{ getStatusText(record.status) }}
|
{{ getStatusText(record.contractStatus) }}
|
||||||
</a-tag>
|
</a-tag>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 合同金额 -->
|
<!-- 合同金额 -->
|
||||||
<template #contractAmount="{ record }">
|
<template #amount="{ record }">
|
||||||
<span class="font-medium text-green-600">¥{{ record.contractAmount.toLocaleString() }}万</span>
|
<span class="font-medium text-green-600">¥{{ record.amount.toLocaleString() }}万</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 已收款金额 -->
|
<!-- 已收款金额 -->
|
||||||
|
@ -53,12 +53,17 @@
|
||||||
<span class="font-medium text-blue-600">¥{{ record.receivedAmount.toLocaleString() }}万</span>
|
<span class="font-medium text-blue-600">¥{{ record.receivedAmount.toLocaleString() }}万</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<!-- 已结算金额 -->
|
||||||
|
<template #settlementAmount="{ record }">
|
||||||
|
<span class="font-medium text-orange-600">¥{{ record.settlementAmount.toLocaleString() }}万</span>
|
||||||
|
</template>
|
||||||
|
|
||||||
<!-- 操作列 -->
|
<!-- 操作列 -->
|
||||||
<template #action="{ record }">
|
<template #action="{ record }">
|
||||||
<a-space>
|
<a-space>
|
||||||
<a-link @click="viewDetail(record)">详情</a-link>
|
<a-link @click="viewDetail(record)">详情</a-link>
|
||||||
<a-link @click="editRecord(record)" v-if="record.status === 'draft'">编辑</a-link>
|
<a-link @click="editRecord(record)" v-if="record.contractStatus === 'draft'">编辑</a-link>
|
||||||
<a-link @click="approveContract(record)" v-if="record.status === 'pending'">审批</a-link>
|
<a-link @click="approveContract(record)" v-if="record.contractStatus === 'pending'">审批</a-link>
|
||||||
<a-link @click="viewPayment(record)">收款记录</a-link>
|
<a-link @click="viewPayment(record)">收款记录</a-link>
|
||||||
</a-space>
|
</a-space>
|
||||||
</template>
|
</template>
|
||||||
|
@ -70,38 +75,38 @@
|
||||||
import { ref, reactive, onMounted } from 'vue'
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
import { Message } from '@arco-design/web-vue'
|
import { Message } from '@arco-design/web-vue'
|
||||||
import type { TableColumnData } 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({
|
let searchForm = reactive({
|
||||||
contractName: '',
|
code: '',
|
||||||
contractCode: '',
|
customer: '',
|
||||||
client: '',
|
contractStatus: '',
|
||||||
status: '',
|
|
||||||
signDate: '',
|
signDate: '',
|
||||||
page: 1,
|
page: 1,
|
||||||
size: 10
|
pageSize: 10
|
||||||
})
|
})
|
||||||
|
|
||||||
// 查询条件配置
|
// 查询条件配置
|
||||||
const queryFormColumns = [
|
const queryFormColumns = [
|
||||||
{
|
{
|
||||||
field: 'contractName',
|
field: 'code',
|
||||||
label: '合同名称',
|
label: '合同编号',
|
||||||
type: 'input' as const,
|
type: 'input' as const,
|
||||||
props: {
|
props: {
|
||||||
placeholder: '请输入合同名称'
|
placeholder: '请输入合同编号'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'client',
|
field: 'customer',
|
||||||
label: '客户',
|
label: '客户名称',
|
||||||
type: 'input' as const,
|
type: 'input' as const,
|
||||||
props: {
|
props: {
|
||||||
placeholder: '请输入客户名称'
|
placeholder: '请输入客户名称'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'status',
|
field: 'contractStatus',
|
||||||
label: '合同状态',
|
label: '合同状态',
|
||||||
type: 'select' as const,
|
type: 'select' as const,
|
||||||
props: {
|
props: {
|
||||||
|
@ -120,83 +125,33 @@ const queryFormColumns = [
|
||||||
|
|
||||||
// 表格列配置
|
// 表格列配置
|
||||||
const tableColumns: TableColumnData[] = [
|
const tableColumns: TableColumnData[] = [
|
||||||
{ title: '合同编号', dataIndex: 'contractCode', width: 150 },
|
{ title: '合同编号', dataIndex: 'code', width: 150 },
|
||||||
{ title: '合同名称', dataIndex: 'contractName', width: 250, ellipsis: true, tooltip: true },
|
{ title: '合同内容', dataIndex: 'contractText', width: 250, ellipsis: true, tooltip: true },
|
||||||
{ title: '客户名称', dataIndex: 'client', width: 200, ellipsis: true, tooltip: true },
|
{ title: '客户名称', dataIndex: 'customer', width: 200, ellipsis: true, tooltip: true },
|
||||||
{ title: '合同金额', dataIndex: 'contractAmount', slotName: 'contractAmount', width: 120 },
|
{ title: '合同金额', dataIndex: 'amount', slotName: 'amount', width: 120 },
|
||||||
{ title: '已收款金额', dataIndex: 'receivedAmount', slotName: 'receivedAmount', width: 120 },
|
{ title: '已收款金额', dataIndex: 'receivedAmount', slotName: 'receivedAmount', width: 120 },
|
||||||
{ title: '未收款金额', dataIndex: 'pendingAmount', width: 120 },
|
{ title: '已结算金额', dataIndex: 'settlementAmount', slotName: 'settlementAmount', width: 120 },
|
||||||
{ title: '签署日期', dataIndex: 'signDate', width: 120 },
|
{ title: '签订日期', dataIndex: 'signDate', width: 120 },
|
||||||
{ title: '开始日期', dataIndex: 'startDate', width: 120 },
|
{ title: '付款日期', dataIndex: 'paymentDate', width: 120 },
|
||||||
{ title: '结束日期', dataIndex: 'endDate', width: 120 },
|
{ title: '履约期限', dataIndex: 'performanceDeadline', width: 120 },
|
||||||
{ title: '合同状态', dataIndex: 'status', slotName: 'status', width: 100 },
|
{ title: '合同状态', dataIndex: 'contractStatus', slotName: 'contractStatus', width: 100 },
|
||||||
{ title: '项目经理', dataIndex: 'projectManager', width: 100 },
|
{ title: '业务员', dataIndex: 'salespersonName', width: 100 },
|
||||||
{ title: '销售经理', dataIndex: 'salesManager', width: 100 },
|
{ title: '部门', dataIndex: 'salespersonDeptName', width: 120 },
|
||||||
{ title: '完成进度', dataIndex: 'progress', width: 100 },
|
{ title: '项目名称', dataIndex: 'projectName', width: 200, ellipsis: true, tooltip: true },
|
||||||
{ title: '备注', dataIndex: 'remark', 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' }
|
{ title: '操作', slotName: 'action', width: 200, fixed: 'right' }
|
||||||
]
|
]
|
||||||
|
|
||||||
// 数据状态
|
// 数据状态
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const dataList = ref([
|
const dataList = ref<ContractData[]>([])
|
||||||
{
|
|
||||||
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 pagination = reactive({
|
const pagination = reactive({
|
||||||
current: 1,
|
current: 1,
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
total: 3,
|
total: 0,
|
||||||
showTotal: true,
|
showTotal: true,
|
||||||
showPageSize: true
|
showPageSize: true
|
||||||
})
|
})
|
||||||
|
@ -230,20 +185,38 @@ const getStatusText = (status: string) => {
|
||||||
// 搜索和重置
|
// 搜索和重置
|
||||||
const search = async () => {
|
const search = async () => {
|
||||||
loading.value = true
|
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
|
loading.value = false
|
||||||
}, 1000)
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const reset = () => {
|
const reset = () => {
|
||||||
Object.assign(searchForm, {
|
Object.assign(searchForm, {
|
||||||
contractName: '',
|
code: '',
|
||||||
contractCode: '',
|
customer: '',
|
||||||
client: '',
|
contractStatus: '',
|
||||||
status: '',
|
|
||||||
signDate: '',
|
signDate: '',
|
||||||
page: 1,
|
page: 1,
|
||||||
size: 10
|
pageSize: 10
|
||||||
})
|
})
|
||||||
pagination.current = 1
|
pagination.current = 1
|
||||||
search()
|
search()
|
||||||
|
@ -257,7 +230,7 @@ const onPageChange = (page: number) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const onPageSizeChange = (size: number) => {
|
const onPageSizeChange = (size: number) => {
|
||||||
searchForm.size = size
|
searchForm.pageSize = size
|
||||||
searchForm.page = 1
|
searchForm.page = 1
|
||||||
pagination.pageSize = size
|
pagination.pageSize = size
|
||||||
pagination.current = 1
|
pagination.current = 1
|
||||||
|
@ -273,20 +246,20 @@ const exportContract = () => {
|
||||||
Message.info('导出合同功能开发中...')
|
Message.info('导出合同功能开发中...')
|
||||||
}
|
}
|
||||||
|
|
||||||
const viewDetail = (record: any) => {
|
const viewDetail = (record: ContractData) => {
|
||||||
Message.info(`查看合同详情: ${record.contractName}`)
|
Message.info(`查看合同详情: ${record.contractText}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const editRecord = (record: any) => {
|
const editRecord = (record: ContractData) => {
|
||||||
Message.info(`编辑合同: ${record.contractName}`)
|
Message.info(`编辑合同: ${record.contractText}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const approveContract = (record: any) => {
|
const approveContract = (record: ContractData) => {
|
||||||
Message.info(`审批合同: ${record.contractName}`)
|
Message.info(`审批合同: ${record.contractText}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const viewPayment = (record: any) => {
|
const viewPayment = (record: ContractData) => {
|
||||||
Message.info(`查看收款记录: ${record.contractName}`)
|
Message.info(`查看收款记录: ${record.contractText}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
|
Loading…
Reference in New Issue