yudao
/
admin-vue3
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vue3.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

add 项目结算

pull/853/head
wersd 2025-08-02 19:35:49 +08:00
parent 30e63e8eee
commit 81f9c98526
12 changed files with 1770 additions and 304 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

135
src/api/crm/project/index.ts
View File

@ -1,59 +1,76 @@
import request from '@/config/axios'
// 项目利润结算 VO
export interface ProjectSettlementVO {
id: number // 结算记录ID
projectId: number // 关联项目ID
settlementPeriod: string // 结算周期(如:2023-Q1)
settlementDate: Date // 结算日期
actualRevenue: number // 实际营收
governmentSubsidy: number // 政府补贴收入
otherIncome: number // 其他项目收入
totalIncome: number // 总收入
incomeRemark: string // 收入备注
electricityCost: number // 电费成本
venueRent: number // 场地租金
venueDeposit: number // 项目押金
projectPromotion: number // 项目推介费
equipmentUpgrade: number // 设备更新购置费
managementCost: number // 管理费用
taxCost: number // 税收
netProfit: number // 净利润
expenseRemark: string // 支出备注
settlementStatus: number // 结算状态
proofAttachment: string // 结算凭证附件
remark: string // 结算备注
}
// 项目利润结算 API
export const ProjectSettlementApi = {
// 查询项目利润结算分页
getProjectSettlementPage: async (params: any) => {
return await request.get({ url: `/crm/project-settlement/page`, params })
},
// 查询项目利润结算详情
getProjectSettlement: async (id: number) => {
return await request.get({ url: `/crm/project-settlement/get?id=` + id })
},
// 新增项目利润结算
createProjectSettlement: async (data: ProjectSettlementVO) => {
return await request.post({ url: `/crm/project-settlement/create`, data })
},
// 修改项目利润结算
updateProjectSettlement: async (data: ProjectSettlementVO) => {
return await request.put({ url: `/crm/project-settlement/update`, data })
},
// 删除项目利润结算
deleteProjectSettlement: async (id: number) => {
return await request.delete({ url: `/crm/project-settlement/delete?id=` + id })
},
// 导出项目利润结算 Excel
exportProjectSettlement: async (params) => {
return await request.download({ url: `/crm/project-settlement/export-excel`, params })
},
}
import request from '@/config/axios'
// CRM 项目信息 VO
export interface ProjectVO {
id: number // 主键ID
deptId: number // 部门ID
name?: string
siteId: number // 场地ID
totalInvestment: number // 项目总投资额
ownerUserId: string // 项目合伙人
ratio: string // 比例
investment: string // 投资额
cooperationAgreement: number // 场地租赁合同
purchaseContractId: number // 设备采购合同ID
epcContractId: number // EPC施工合同ID
cooperationAgreementName?: String // 场地租赁合同名称
purchaseContractName?: String // 设备采购合同名称
epcContractName?: String // EPC施工合同名称
buildPermit: string // 同意建桩证明
ownershipProof: string // 场地权属证明
projectRecord: string // 项目备案
powerSupplyReply: string // 供电答复单
investmentAgreement: string // 合作投资协议
investmentShareAgreement: string // 合作投资分成协议
supplementaryMaterials: string // 其他补充材料文件路径
cooperationAgreementConfig?: number // 场地租赁合同配置
purchaseContractConfig?: number // 设备采购合同配置
epcContractConfig?: number // EPC施工合同配置
buildPermitConfig?: number // 同意建桩证明配置
ownershipProofConfig?: number // 场地权属证明配置
projectRecordConfig?: number // 项目备案配置
powerSupplyReplyConfig?: number // 供电答复单配置
investmentAgreementConfig?: number // 合作投资协议配置
investmentShareAgreementConfig?: number // 合作投资分成协议配置
supplementaryMaterialsConfig?: number // 其他补充材料配置
type: number // 类型
partners: []
RevenueSharePartners: []
projectStatus: number // 状态
estimatedPiles: number //枪数
}
// 查询CRM 项目信息分页
export const getProjectPage = async (params: any) => {
return await request.get({ url: `/crm/project/page`, params })
}
// 查询CRM 项目信息详情
export const getProject = async (id: number) => {
return await request.get({ url: `/crm/project/get?id=` + id })
}
// 新增CRM 项目信息
export const createProject = async (data: ProjectVO) => {
return await request.post({ url: `/crm/project/create`, data })
}
// 修改CRM 项目信息
export const updateProject = async (data: ProjectVO) => {
return await request.put({ url: `/crm/project/update`, data })
}
// 删除CRM 项目信息
export const deleteProject = async (id: number) => {
return await request.delete({ url: `/crm/project/delete?id=` + id })
}
// 导出CRM 项目信息 Excel
export const exportProject = async (params: any) => {
return await request.download({ url: `/crm/project/export-excel`, params })
}
// 获取项目列表
export const getProjectSimpleList = async () => {
return await request.get({ url: `/crm/project/simple-list` })
}

57
src/api/crm/project/settlement/index.ts Normal file
View File

@ -0,0 +1,57 @@
import request from '@/config/axios'
// 项目利润结算 VO
export interface ProjectSettlementVO {
id: number; // 结算记录ID
projectId: number; // 关联项目ID
settlementPeriod: string; // 结算周期(如:2023-Q1)
period: number; // 总期数
settlementDate: Date; // 结算日期
actualRevenue: number; // 实际营收
governmentSubsidy: number; // 政府补贴收入
otherIncome: number; // 其他项目收入
totalIncome: number; // 总收入
incomeRemark: string; // 收入备注
electricityCost: number; // 电费成本
venueRent: number; // 场地租金
venueDeposit: number; // 项目押金
projectPromotion: number; // 项目推介费
equipmentUpgrade: number; // 设备更新购置费
managementCost: number; // 管理费用
taxCost: number; // 税收
netProfit: number; // 净利润
expenseRemark: string; // 支出备注
settlementStatus: number; // 结算状态
proofAttachment: string; // 结算凭证附件
remark: string; // 结算备注
}
// 查询项目利润结算分页
export const getProjectSettlementPage = async (params: any) => {
return await request.get({ url: `/crm/project-settlement/page`, params })
}
// 查询项目利润结算详情
export const getProjectSettlement = async (id: number) => {
return await request.get({ url: `/crm/project-settlement/get?id=` + id })
}
// 新增项目利润结算
export const createProjectSettlement = async (data: ProjectSettlementVO) => {
return await request.post({ url: `/crm/project-settlement/create`, data })
}
// 修改项目利润结算
export const updateProjectSettlement = async (data: ProjectSettlementVO) => {
return await request.put({ url: `/crm/project-settlement/update`, data })
}
// 删除项目利润结算
export const deleteProjectSettlement = async (id: number) => {
return await request.delete({ url: `/crm/project-settlement/delete?id=` + id })
}
// 导出项目利润结算 Excel
export const exportProjectSettlement = async (params: any) => {
return await request.download({ url: `/crm/project-settlement/export-excel`, params })
}

85
src/api/crm/receivable/other/index.ts Normal file
View File

@ -0,0 +1,85 @@
import request from '@/config/axios'
export interface ReceivableVO {
id: number
no: string
planId?: number
period?: number // 期数
customerId?: number
customerName?: string
contractId?: number
receivableType: number
paymentType: number
deptId: number
deptName?: string
projectId?: number
contract?: {
id?: number
name?: string
no: string
totalPrice: number
}
auditStatus: number
processInstanceId: number
returnTime: Date
returnType: number
transactionType: number // 交易类型：0-付款，1-收款
price: number
ownerUserId: number
ownerUserName?: string
remark: string
creator: string // 创建人
creatorName?: string // 创建人名称
createTime: Date // 创建时间
updateTime: Date // 更新时间
}
// 查询回款列表
export const getReceivablePage = async (params) => {
return await request.get({ url: `/crm/receivable-other/page`, params })
}
// 查询回款列表
export const getReceivablePageByCustomer = async (params) => {
return await request.get({ url: `/crm/receivable-other/page-by-customer`, params })
}
// 查询回款详情
export const getReceivable = async (id: number) => {
return await request.get({ url: `/crm/receivable-other/get?id=` + id })
}
// 新增回款
export const createReceivable = async (data: ReceivableVO) => {
return await request.post({ url: `/crm/receivable-other/create`, data })
}
// 修改回款
export const updateReceivable = async (data: ReceivableVO) => {
return await request.put({ url: `/crm/receivable-other/update`, data })
}
// 删除回款
export const deleteReceivable = async (id: number) => {
return await request.delete({ url: `/crm/receivable-other/delete?id=` + id })
}
// 导出回款 Excel
export const exportReceivable = async (params) => {
return await request.download({ url: `/crm/receivable-other/export-excel`, params })
}
// 提交审核
export const submitReceivable = async (id: number) => {
return await request.put({ url: `/crm/receivable-other/submit?id=${id}` })
}
// 获得待审核回款数量
export const getAuditReceivableCount = async () => {
return await request.get({ url: '/crm/receivable-other/audit-count' })
}
// 查询收付主体汇总金额
export const queryReceivableSummary = async () => {
return await request.get({ url: '/crm/receivable-other/query-summary' })
}

4
src/views/crm/finance/writeoff/index.vue
View File

@ -46,7 +46,7 @@
</el-table-column>
<el-table-column label="未核销收款票据金额" align="center" prop="unwrittenOffIncomeInvoiceAmount" width="160px" />
<el-table-column label="未核销收款金额" align="center" prop="unwrittenOffIncomeAmount" width="160px" />
<el-table-column label="应收额" align="center" prop="unwrittenOffIncomeDiffAmount" width="230px">
<el-table-column label="应收额" align="center" prop="unwrittenOffIncomeDiffAmount" width="160px">
<template #header>
<span class="diffAmount">应收额</span>
</template>
@ -56,7 +56,7 @@
</el-table-column>
<el-table-column label="未核销付款票据金额" align="center" prop="unwrittenOffOutcomeInvoiceAmount" width="160px" />
<el-table-column label="未核销付款金额" align="center" prop="unwrittenOffOutcomeAmount" width="160px" />
<el-table-column label="应付额" align="center" prop="unwrittenOffOutcomeDiffAmount" width="230px">
<el-table-column label="应付额" align="center" prop="unwrittenOffOutcomeDiffAmount" width="160px">
<template #header>
<span class="diffAmount">应付额</span>
</template>

350
src/views/crm/project/index.vue
View File

@ -8,191 +8,46 @@
:inline="true"
label-width="68px"
>
<el-form-item label="关联项目ID" prop="projectId">
<el-input
v-model="queryParams.projectId"
placeholder="请输入关联项目ID"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="结算周期(如:2023-Q1)" prop="settlementPeriod">
<el-input
v-model="queryParams.settlementPeriod"
placeholder="请输入结算周期(如:2023-Q1)"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="结算日期" prop="settlementDate">
<el-date-picker
v-model="queryParams.settlementDate"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-220px"
/>
</el-form-item>
<el-form-item label="实际营收" prop="actualRevenue">
<el-input
v-model="queryParams.actualRevenue"
placeholder="请输入实际营收"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="政府补贴收入" prop="governmentSubsidy">
<el-input
v-model="queryParams.governmentSubsidy"
placeholder="请输入政府补贴收入"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="其他项目收入" prop="otherIncome">
<el-input
v-model="queryParams.otherIncome"
placeholder="请输入其他项目收入"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="总收入" prop="totalIncome">
<el-input
v-model="queryParams.totalIncome"
placeholder="请输入总收入"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="收入备注" prop="incomeRemark">
<el-input
v-model="queryParams.incomeRemark"
placeholder="请输入收入备注"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="电费成本" prop="electricityCost">
<el-input
v-model="queryParams.electricityCost"
placeholder="请输入电费成本"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="场地租金" prop="venueRent">
<el-input
v-model="queryParams.venueRent"
placeholder="请输入场地租金"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="项目押金" prop="venueDeposit">
<el-input
v-model="queryParams.venueDeposit"
placeholder="请输入项目押金"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="项目推介费" prop="projectPromotion">
<el-input
v-model="queryParams.projectPromotion"
placeholder="请输入项目推介费"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="设备更新购置费" prop="equipmentUpgrade">
<el-input
v-model="queryParams.equipmentUpgrade"
placeholder="请输入设备更新购置费"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="管理费用" prop="managementCost">
<el-input
v-model="queryParams.managementCost"
placeholder="请输入管理费用"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="税收" prop="taxCost">
<el-input
v-model="queryParams.taxCost"
placeholder="请输入税收"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="总支出" prop="totalExpenses">
<el-input
v-model="queryParams.totalExpenses"
placeholder="请输入总支出"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="净利润" prop="netProfit">
<el-input
v-model="queryParams.netProfit"
placeholder="请输入净利润"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="支出备注" prop="expenseRemark">
<el-input
v-model="queryParams.expenseRemark"
placeholder="请输入支出备注"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="结算状态" prop="settlementStatus">
<el-form-item label="项目名称" prop="deptId">
<el-select
v-model="queryParams.settlementStatus"
placeholder="请选择结算状态"
v-model="queryParams.deptId"
class="!w-240px"
placeholder="请选择项目名称"
@keyup.enter="handleQuery"
>
<el-option
v-for="item in deptList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<!-- <el-form-item label="项目合伙人" prop="ownerUserId">
<el-input
v-model="queryParams.ownerUserId"
placeholder="请输入项目合伙人"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item> -->
<el-form-item label="类型" prop="type">
<el-select
v-model="queryParams.type"
placeholder="请选择类型"
clearable
class="!w-240px"
>
<el-option label="请选择字典生成" value="" />
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_PROJECT_TYPE)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="创建时间" prop="createTime">
<el-date-picker
v-model="queryParams.createTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-220px"
/>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
@ -200,7 +55,7 @@
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['crm:project-settlement:create']"
v-hasPermi="['crm:project:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
@ -209,7 +64,7 @@
plain
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['crm:project-settlement:export']"
v-hasPermi="['crm:project:export']"
>
<Icon icon="ep:download" class="mr-5px" /> 导出
</el-button>
@ -220,40 +75,38 @@
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="结算记录ID" align="center" prop="id" />
<el-table-column label="关联项目ID" align="center" prop="projectId" />
<el-table-column label="结算周期(如:2023-Q1)" align="center" prop="settlementPeriod" />
<el-table-column label="结算日期" align="center" prop="settlementDate" />
<el-table-column label="实际营收" align="center" prop="actualRevenue" />
<el-table-column label="政府补贴收入" align="center" prop="governmentSubsidy" />
<el-table-column label="其他项目收入" align="center" prop="otherIncome" />
<el-table-column label="总收入" align="center" prop="totalIncome" />
<el-table-column label="收入备注" align="center" prop="incomeRemark" />
<el-table-column label="电费成本" align="center" prop="electricityCost" />
<el-table-column label="场地租金" align="center" prop="venueRent" />
<el-table-column label="项目押金" align="center" prop="venueDeposit" />
<el-table-column label="项目推介费" align="center" prop="projectPromotion" />
<el-table-column label="设备更新购置费" align="center" prop="equipmentUpgrade" />
<el-table-column label="管理费用" align="center" prop="managementCost" />
<el-table-column label="税收" align="center" prop="taxCost" />
<el-table-column label="总支出" align="center" prop="totalExpenses" />
<el-table-column label="净利润" align="center" prop="netProfit" />
<el-table-column label="支出备注" align="center" prop="expenseRemark" />
<el-table-column label="结算状态" align="center" prop="settlementStatus" />
<el-table-column
label="创建时间"
align="center"
prop="createTime"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column label="操作" align="center" min-width="120px">
<el-table-column align="center" label="项目名称" prop="deptName" min-width="300"/>
<el-table-column label="项目总投资额(万元)" align="center" prop="totalInvestment" width="180"/>
<el-table-column label="枪数" align="center" prop="estimatedPiles" />
<el-table-column label="单枪成本(万元)" align="center" min-width="120">
<template #default="{ row }">
<span>{{ calculateCostPerPile(row) }}</span>
</template>
</el-table-column>
<el-table-column align="center" label="类型" prop="type" width="160">
<template #default="scope">
<dict-tag :type="DICT_TYPE.CRM_PROJECT_TYPE" :value="scope.row.type" />
</template>
</el-table-column>
<el-table-column align="center" label="供电模式" prop="type" width="160">
<template #default="scope">
<dict-tag :type="DICT_TYPE.CRM_PROJECT_POWER_SUPPLY_TYPE" :value="scope.row.powerSupplyType" />
</template>
</el-table-column>
<el-table-column align="center" label="状态" prop="projectStatus" width="160">
<template #default="scope">
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.projectStatus" />
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="120px">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['crm:project-settlement:update']"
v-hasPermi="['crm:project:update']"
>
编辑
</el-button>
@ -261,7 +114,7 @@
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['crm:project-settlement:delete']"
v-hasPermi="['crm:project:delete']"
>
删除
</el-button>
@ -278,56 +131,46 @@
</ContentWrap>
<!-- 表单弹窗：添加/修改 -->
<ProjectSettlementForm ref="formRef" @success="getList" />
<ProjectForm ref="formRef" @success="getList" />
</template>
<script setup lang="ts">
import { dateFormatter } from '@/utils/formatTime'
import download from '@/utils/download'
import { ProjectSettlementApi, ProjectSettlementVO } from '@/api/crm/project'
import ProjectSettlementForm from './ProjectSettlementForm.vue'
import * as ProjectApi from '@/api/crm/project'
import * as DeptApi from '@/api/system/dept'
import ProjectForm from './ProjectForm.vue'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
/** 项目利润结算 列表 */
defineOptions({ name: 'CrmProjectSettlement' })
/** CRM 项目信息 列表 */
defineOptions({ name: 'CrmProject' })
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const loading = ref(true) // 列表的加载中
const list = ref<ProjectSettlementVO[]>([]) // 列表的数据
const list = ref<ProjectApi.ProjectVO[]>([]) // 列表的数据
const total = ref(0) // 列表的总页数
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
projectId: undefined,
settlementPeriod: undefined,
settlementDate: [],
actualRevenue: undefined,
governmentSubsidy: undefined,
otherIncome: undefined,
totalIncome: undefined,
incomeRemark: undefined,
electricityCost: undefined,
venueRent: undefined,
venueDeposit: undefined,
projectPromotion: undefined,
equipmentUpgrade: undefined,
managementCost: undefined,
taxCost: undefined,
totalExpenses: [],
netProfit: undefined,
expenseRemark: undefined,
settlementStatus: undefined,
deptId: undefined,
siteId: undefined,
ownerUserId: undefined,
type: undefined,
projectStatus: undefined,
estimatedPiles: undefined,
createTime: [],
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
const deptList = ref<DeptApi.DeptVO[]>([])
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await ProjectSettlementApi.getProjectSettlementPage(queryParams)
const data = await ProjectApi.getProjectPage(queryParams)
list.value = data.list
total.value = data.total
} finally {
@ -335,6 +178,11 @@ const getList = async () => {
}
}
/** 打开场地详情 */
const { push } = useRouter()
const openSiteDetail = (id: number) => {
push({ name: 'CrmStationSiteDetail', params: { id } })
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
@ -359,7 +207,7 @@ const handleDelete = async (id: number) => {
// 删除的二次确认
await message.delConfirm()
// 发起删除
await ProjectSettlementApi.deleteProjectSettlement(id)
await ProjectApi.deleteProject(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
@ -373,16 +221,34 @@ const handleExport = async () => {
await message.exportConfirm()
// 发起导出
exportLoading.value = true
const data = await ProjectSettlementApi.exportProjectSettlement(queryParams)
download.excel(data, '项目利润结算.xls')
const data = await ProjectApi.exportProject(queryParams)
download.excel(data, 'CRM 项目信息.xls')
} catch {
} finally {
exportLoading.value = false
}
}
const calculateCostPerPile = (row) => {
// 检查枪数是否有效（非空、非零、数字类型）
if (!row.estimatedPiles || isNaN(row.estimatedPiles) || row.estimatedPiles <= 0) {
return ''; // 无效值返回空字符串
}
// 检查总投资额是否有效
if (!row.totalInvestment || isNaN(row.totalInvestment)) {
return ''; // 无效值返回空字符串
}
// 计算并保留两位小数
const cost = (row.totalInvestment / row.estimatedPiles).toFixed(2);
return parseFloat(cost); // 转为数字类型避免显示多余的0
};
/** 初始化 **/
onMounted(() => {
getList()
onMounted(async () => {
await getList()
// 加载部门列表
deptList.value = await DeptApi.querySimpleDeptList(3)
})
</script>

150
src/views/crm/project/settlement/ProjectSettlementForm.vue Normal file
View File

@ -0,0 +1,150 @@
<template>
<Dialog :title="dialogTitle" v-model="dialogVisible">
<el-form
ref="formRef"
:model="formData"
:rules="formRules"
label-width="100px"
v-loading="formLoading"
>
<el-form-item label="关联项目ID" prop="projectId">
<el-select
v-model="formData.projectId"
filterable
placeholder="请选择关联项目"
class="!w-100%"
>
<el-option
v-for="item in projectOptions"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="结算周期(如:2023-Q1)" prop="settlementPeriod">
<el-input v-model="formData.settlementPeriod" placeholder="请输入结算周期(如:2023-Q1)" />
</el-form-item>
<el-form-item label="总期数" prop="period">
<el-input v-model.number="formData.period" placeholder="请输入总期数" type="number" />
</el-form-item>
<el-form-item label="结算日期" prop="settlementDate">
<el-date-picker
v-model="formData.settlementDate"
type="date"
value-format="x"
placeholder="选择结算日期"
/>
</el-form-item>
<el-form-item label="收入备注" prop="incomeRemark">
<el-input v-model="formData.incomeRemark" placeholder="请输入收入备注" />
</el-form-item>
<el-form-item label="支出备注" prop="expenseRemark">
<el-input v-model="formData.expenseRemark" placeholder="请输入支出备注" />
</el-form-item>
<el-form-item label="结算凭证附件" prop="proofAttachment">
<UploadFile v-model="formData.proofAttachment" />
</el-form-item>
<el-form-item label="结算备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入结算备注" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
</template>
<script setup lang="ts">
import * as ProjectSettlementApi from '@/api/crm/project/settlement'
import * as ProjectApi from '@/api/crm/project'
/** 项目利润结算 表单 */
defineOptions({ name: 'ProjectSettlementForm' })
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
id: undefined,
projectId: undefined,
settlementPeriod: undefined,
period: undefined,
settlementDate: undefined,
incomeRemark: undefined,
expenseRemark: undefined,
proofAttachment: undefined,
remark: undefined,
})
const formRules = reactive({
projectId: [{ required: true, message: '关联项目ID不能为空', trigger: 'blur' }],
settlementPeriod: [{ required: true, message: '结算周期(如:2023-Q1)不能为空', trigger: 'blur' }],
settlementDate: [{ required: true, message: '结算日期不能为空', trigger: 'blur' }],
})
const formRef = ref() // 表单 Ref
const projectOptions = ref<ProjectApi.ProjectVO[]>([])
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
// 修改时，设置数据
if (id) {
formLoading.value = true
try {
formData.value = await ProjectSettlementApi.getProjectSettlement(id)
} finally {
formLoading.value = false
}
}
// 获取项目列表
projectOptions.value = await ProjectApi.getProjectSimpleList();
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
// 校验表单
await formRef.value.validate()
// 提交请求
formLoading.value = true
try {
const data = formData.value as unknown as ProjectSettlementApi.ProjectSettlementVO
if (formType.value === 'create') {
await ProjectSettlementApi.createProjectSettlement(data)
message.success(t('common.createSuccess'))
} else {
await ProjectSettlementApi.updateProjectSettlement(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
id: undefined,
projectId: undefined,
settlementPeriod: undefined,
period: undefined,
settlementDate: undefined,
incomeRemark: undefined,
expenseRemark: undefined,
proofAttachment: undefined,
remark: undefined,
}
formRef.value?.resetFields()
}
</script>

232
src/views/crm/project/settlement/index.vue Normal file
View File

@ -0,0 +1,232 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="68px"
>
<el-form-item label="项目" prop="projectId">
<el-select
v-model="queryParams.projectId"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
>
<el-option
v-for="item in projectOptions"
:key="item.id"
:label="item.name"
:value="item.id ?? ''"
/>
</el-select>
</el-form-item>
<el-form-item label="结算周期(如:2023-Q1)" prop="settlementPeriod">
<el-input
v-model="queryParams.settlementPeriod"
placeholder="请输入结算周期(如:2023-Q1)"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="结算日期" prop="settlementDate">
<el-date-picker
v-model="queryParams.settlementDate"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-220px"
/>
</el-form-item>
<el-form-item label="结算状态" prop="settlementStatus">
<el-select
v-model="queryParams.settlementStatus"
placeholder="请选择结算状态"
clearable
class="!w-240px"
>
<el-option label="请选择字典生成" value="" />
</el-select>
</el-form-item>
<el-form-item label="创建时间" prop="createTime">
<el-date-picker
v-model="queryParams.createTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-220px"
/>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
<el-button
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['crm:project-settlement:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
<el-button
type="success"
plain
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['crm:project-settlement:export']"
>
<Icon icon="ep:download" class="mr-5px" /> 导出
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column label="项目名称" align="center" prop="projectName" />
<el-table-column label="枪数" align="center" prop="settlementPeriod" />
<el-table-column label="结算周期(如:2023-Q1)" align="center" prop="settlementPeriod" />
<el-table-column label="结算开始时间" align="center" prop="settlementDate" />
<el-table-column label="结算结束时间" align="center" prop="settlementDate" />
<el-table-column label="结算日期" align="center" prop="settlementDate" />
<el-table-column label="总期数" align="center" prop="period" />
<el-table-column label="毛利润" align="center" prop="settlementDate" />
<el-table-column label="单枪毛利润" align="center" prop="settlementDate" />
<el-table-column label="净利润" align="center" prop="settlementDate" />
<el-table-column label="结算状态" align="center" prop="settlementStatus" />
<el-table-column label="操作" align="center" min-width="120px">
<template #default="scope">
<el-button
link
type="primary"
@click="openForm('update', scope.row.id)"
v-hasPermi="['crm:project-settlement:update']"
>
编辑
</el-button>
<el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['crm:project-settlement:delete']"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</ContentWrap>
<!-- 表单弹窗：添加/修改 -->
<ProjectSettlementForm ref="formRef" @success="getList" />
</template>
<script setup lang="ts">
import { dateFormatter } from '@/utils/formatTime'
import download from '@/utils/download'
import * as ProjectSettlementApi from '@/api/crm/project/settlement'
import * as ProjectApi from '@/api/crm/project'
import ProjectSettlementForm from './ProjectSettlementForm.vue'
/** 项目利润结算 列表 */
defineOptions({ name: 'CrmProjectSettlement' })
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const loading = ref(true) // 列表的加载中
const list = ref<ProjectSettlementApi.ProjectSettlementVO[]>([]) // 列表的数据
const total = ref(0) // 列表的总页数
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
projectId: undefined,
settlementPeriod: undefined,
settlementDate: [],
settlementStatus: undefined,
createTime: [],
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
const projectOptions = ref<ProjectApi.ProjectVO[]>([])
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await ProjectSettlementApi.getProjectSettlementPage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
handleQuery()
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
}
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
try {
// 删除的二次确认
await message.delConfirm()
// 发起删除
await ProjectSettlementApi.deleteProjectSettlement(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
}
/** 导出按钮操作 */
const handleExport = async () => {
try {
// 导出的二次确认
await message.exportConfirm()
// 发起导出
exportLoading.value = true
const data = await ProjectSettlementApi.exportProjectSettlement(queryParams)
download.excel(data, '项目利润结算.xls')
} catch {
} finally {
exportLoading.value = false
}
}
/** 初始化 **/
onMounted(async () => {
await getList()
// 获取项目列表
projectOptions.value = await ProjectApi.getProjectSimpleList();
})
</script>

43
src/views/crm/receivable/components/SummaryOtherForm.vue Normal file
View File

@ -0,0 +1,43 @@
<template>
<Dialog v-model="dialogVisible" title="金额汇总">
<ContentWrap class="mt-10px">
<el-table v-loading="loading" :data="list" :show-overflow-tooltip="true" :stripe="true">
<template #empty>
<div>当前 list: {{ list }}</div>
</template>
<el-table-column align="center" label="收付主体" prop="deptName" min-width="300px" />
<el-table-column
align="center"
label="汇总金额(元)"
prop="price"
:formatter="erpPriceTableColumnFormatter"
min-width="150px"
/>
</el-table>
</ContentWrap>
</Dialog>
</template>
<script lang="ts" setup>
import * as ReceivableApi from '@/api/crm/receivable/other'
import { erpPriceTableColumnFormatter } from '@/utils'
const dialogVisible = ref(false)
const loading = ref(true)
const list = ref([])
const getList = async () => {
try {
loading.value = true
const data = await ReceivableApi.queryReceivableSummary()
list.value = data
} finally {
loading.value = false
}
}
const open = () => {
dialogVisible.value = true
getList()
}
defineExpose({ open })
</script>

311
src/views/crm/receivable/other/PaymentForm.vue Normal file
View File

@ -0,0 +1,311 @@
<template>
<Dialog v-model="dialogVisible" :title="dialogTitle">
<el-form
ref="formRef"
v-loading="formLoading"
:model="formData"
:rules="formRules"
label-width="100px"
>
<el-row>
<el-col :span="12">
<el-form-item label="收款单位" prop="deptId">
<el-select
v-model="formData.deptId"
class="w-1/1"
filterable
placeholder="请选择收款单位"
>
<el-option
v-for="data in deptList"
:key="data.id"
:label="data.name"
:value="data.id!"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="经办人" prop="ownerUserId">
<el-select
v-model="formData.ownerUserId"
class="w-1/1"
filterable
placeholder="请选择经办人"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.nickname"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="收款金额" prop="price">
<el-input-number
v-model="formData.price"
:max="maxPayableAmount"
:precision="2"
class="!w-100%"
controls-position="right"
placeholder="请输入收款金额"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="收款日期" prop="returnTime">
<el-date-picker
v-model="formData.returnTime"
placeholder="选择收款日期"
type="date"
value-format="x"
class="!w-100%"
/>
</el-form-item>
</el-col>
</el-row>
<!-- <el-row>
<el-col :span="12">
<el-form-item label="收款方式" prop="returnType">
<el-select v-model="formData.returnType" class="w-1/1" placeholder="请选择收款方式">
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="收入类型" prop="paymentType">
<el-select v-model="formData.paymentType" placeholder="请选择收入类型" class="w-1/1">
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_PAYMENT_TYPE)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row> -->
<el-row>
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注" type="textarea" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
</template>
<script lang="ts" setup>
import * as ReceivablePlanApi from '@/api/crm/receivable/plan'
import * as ReceivableApi from '@/api/crm/receivable/other'
import { ReceivableVO } from '@/api/crm/receivable/other'
import * as UserApi from '@/api/system/user'
import * as CustomerApi from '@/api/crm/customer'
import * as ContractApi from '@/api/crm/contract'
import * as ProjectApi from '@/api/crm/project'
import * as DeptApi from '@/api/system/dept'
import { useUserStore } from '@/store/modules/user'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref<ReceivableApi.ReceivableVO & {
date?: number | string
projectId?: number
}>({} as ReceivableApi.ReceivableVO)
const formRules = reactive({
// customerId: [{ required: true, message: '客户不能为空', trigger: 'blur' }],
ownerUserId: [{ required: true, message: '经办人不能为空', trigger: 'blur' }],
deptId: [{ required: true, message: '收款单位不能为空', trigger: 'blur' }],
returnTime: [{ required: true, message: '收款日期不能为空', trigger: 'blur' }],
price: [{ required: true, message: '收款金额不能为空', trigger: 'blur' }],
date: [{ required: true, message: '日期不能为空', trigger: 'blur' }],
content: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
type: [{ required: true, message: '收支类型不能为空', trigger: 'change' }],
// projectId: [{ required: true, message: '项目名称不能为空', trigger: 'change' }],
remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
const deptList = ref<DeptApi.DeptVO[]>([])
const customerList = ref<CustomerApi.CustomerVO[]>([]) // 客户列表
const contractList = ref<ContractApi.ContractVO[]>([]) // 合同列表
const receivablePlanList = ref<ReceivablePlanApi.ReceivablePlanVO[]>([]) // 收款计划列表
const projectList = ref<ProjectApi.ProjectVO[]>([]) // 项目列表
const maxPayableAmount = ref(Infinity)
const showProject = computed(() => formData.value.paymentType >= 11 && formData.value.paymentType <= 14)
/** 打开弹窗 */
const open = async (
type: string,
id?: number,
receivablePlan?: ReceivablePlanApi.ReceivablePlanVO
) => {
const a = getIntDictOptions(DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE)
console.log(a)
console.log('a')
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
// 修改时，设置数据
if (id) {
formLoading.value = true
try {
const data = (await ReceivableApi.getReceivable(id)) as ReceivableVO
formData.value = data
await handleCustomerChange(data.customerId!)
formData.value.contractId = data?.contract?.id
} finally {
formLoading.value = false
}
}
// 加载部门列表
deptList.value = await DeptApi.querySimpleDeptList(2)
// 获得用户列表
userOptions.value = await UserApi.getSimpleUserList()
// 获得客户列表
customerList.value = await CustomerApi.getCustomerSimpleList()
// 获得项目列表
// projectList.value = await ProjectApi.getProjectSimpleList()
// 默认新建时选中自己
if (formType.value === 'create') {
formData.value.ownerUserId = useUserStore().getUser.id
}
// 从收款计划创建收款
if (receivablePlan) {
// 修复 receivablePlan.contractId 可能为 undefined 的类型问题
formData.value.customerId = receivablePlan.customerId
formData.value.period = receivablePlan.period
formData.value.remark = receivablePlan.remark
await handleCustomerChange(receivablePlan.customerId)
if (receivablePlan.contractId) {
formData.value.contractId = receivablePlan.contractId
await handleContractChange(receivablePlan.contractId)
}
if (receivablePlan.id) {
formData.value.planId = receivablePlan.id
formData.value.returnType = receivablePlan.returnType
// 计算应收款金额并赋值给收款金额
let paid = 0
if (Array.isArray(receivablePlan.receivable) && receivablePlan.receivable.length > 0) {
paid = receivablePlan.receivable.reduce((sum, r) => sum + (r.price || 0), 0)
}
maxPayableAmount.value = receivablePlan.price - paid
formData.value.price = receivablePlan.price - paid
}
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
// 校验表单
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
// 提交请求
formLoading.value = true
try {
const data = formData.value as unknown as ReceivableApi.ReceivableVO
if (formType.value === 'create') {
await ReceivableApi.createReceivable(data)
message.success(t('common.createSuccess'))
} else {
await ReceivableApi.updateReceivable(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {} as ReceivableApi.ReceivableVO
formRef.value?.resetFields()
formData.value.transactionType = 0 // 默认收支方向为收入
}
/** 处理切换客户 */
const handleCustomerChange = async (customerId: number) => {
// 重置合同编号
formData.value.contractId = undefined
// 获得合同列表
if (customerId) {
contractList.value = []
contractList.value = await ContractApi.getContractSimpleList(customerId)
}
}
/** 处理切换合同 */
const handleContractChange = async (contractId: number) => {
// 重置收款计划编号
formData.value.planId = undefined
if (contractId) {
// 获得收款计划列表
receivablePlanList.value = []
receivablePlanList.value = await ReceivablePlanApi.getReceivablePlanSimpleList(
formData.value.customerId!,
contractId
)
// 设置金额
const contract = contractList.value.find((item) => item.id === contractId)
if (contract) {
formData.value.price = contract.totalPrice - contract.totalReceivablePrice
// 设置收款方
formData.value.deptId = contract.deptId
}
}
}
/** 处理切换收款计划 */
const handleReceivablePlanChange = (planId: number) => {
if (!planId) {
return
}
const receivablePlan = receivablePlanList.value.find((item) => item.id === planId)
if (!receivablePlan) {
return
}
formData.value.price = receivablePlan.price
formData.value.returnType = receivablePlan.returnType
}
// watch(
// () => formData.value.paymentType,
// (val) => {
// if (val === 11 || val === 12 || val === 13 || val === 14) {
// formRules.projectId = [{ required: true, message: '项目名称不能为空', trigger: 'change' }]
// } else {
// formRules.projectId = []
// formData.value.projectId = undefined
// }
// },
// { immediate: true }
// )
</script>

312
src/views/crm/receivable/other/ReceivableForm.vue Normal file
View File

@ -0,0 +1,312 @@
<template>
<Dialog v-model="dialogVisible" :title="dialogTitle">
<el-form
ref="formRef"
v-loading="formLoading"
:model="formData"
:rules="formRules"
label-width="100px"
>
<el-row>
<el-col :span="12">
<el-form-item label="付款单位" prop="deptId">
<el-select
v-model="formData.deptId"
class="w-1/1"
filterable
placeholder="请选择付款单位"
>
<el-option
v-for="data in deptList"
:key="data.id"
:label="data.name"
:value="data.id!"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="报销人" prop="ownerUserId">
<el-select
v-model="formData.ownerUserId"
class="w-1/1"
filterable
placeholder="请选择报销人"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.nickname"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<!-- :max="maxPayableAmount" -->
<el-row>
<el-col :span="12">
<el-form-item label="付款金额" prop="price">
<el-input-number
v-model="formData.price"
:precision="2"
class="!w-100%"
controls-position="right"
placeholder="请输入付款金额"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="付款日期" prop="returnTime">
<el-date-picker
v-model="formData.returnTime"
placeholder="选择付款日期"
type="date"
value-format="x"
class="!w-100%"
/>
</el-form-item>
</el-col>
</el-row>
<!-- <el-row>
<el-col :span="12">
<el-form-item label="付款方式" prop="returnType">
<el-select v-model="formData.returnType" class="w-1/1" placeholder="请选择付款方式">
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_RECEIVABLE_RETURN_TYPE)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="支出类型" prop="receivableType">
<el-select v-model="formData.receivableType" placeholder="请选择支出类型" class="w-1/1">
<el-option
v-for="dict in getIntDictOptions(DICT_TYPE.CRM_RECEIVABLE_TYPE)"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
</el-col>
</el-row> -->
<el-row>
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注" type="textarea" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
</template>
<script lang="ts" setup>
import * as ReceivablePlanApi from '@/api/crm/receivable/plan'
import * as ReceivableApi from '@/api/crm/receivable/other'
import { ReceivableVO } from '@/api/crm/receivable/other'
import * as UserApi from '@/api/system/user'
import * as CustomerApi from '@/api/crm/customer'
import * as ContractApi from '@/api/crm/contract'
import * as ProjectApi from '@/api/crm/project'
import * as DeptApi from '@/api/system/dept'
import { useUserStore } from '@/store/modules/user'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref<ReceivableApi.ReceivableVO & {
date?: number | string
projectId?: number
}>({} as ReceivableApi.ReceivableVO)
const formRules = reactive({
// customerId: [{ required: true, message: '客户不能为空', trigger: 'blur' }],
ownerUserId: [{ required: true, message: '报销人不能为空', trigger: 'blur' }],
deptId: [{ required: true, message: '付款单位不能为空', trigger: 'blur' }],
// contractId: [{ required: true, message: '合同不能为空', trigger: 'blur' }],
returnTime: [{ required: true, message: '付款日期不能为空', trigger: 'blur' }],
price: [{ required: true, message: '付款金额不能为空', trigger: 'blur' }],
date: [{ required: true, message: '日期不能为空', trigger: 'blur' }],
// content: [{ required: true, message: '备注不能为空', trigger: 'blur' }],
// type: [{ required: true, message: '收支类型不能为空', trigger: 'change' }],
// projectId: [{ required: true, message: '项目名称不能为空', trigger: 'change' }],
remark: [{ required: true, message: '备注不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
const deptList = ref<DeptApi.DeptVO[]>([])
const customerList = ref<CustomerApi.CustomerVO[]>([]) // 客户列表
const contractList = ref<ContractApi.ContractVO[]>([]) // 合同列表
const receivablePlanList = ref<ReceivablePlanApi.ReceivablePlanVO[]>([]) // 付款计划列表
const projectList = ref<ProjectApi.ProjectVO[]>([]) // 项目列表
const maxPayableAmount = ref(Infinity)
const showProject = computed(() => formData.value.receivableType >= 1 && formData.value.receivableType <= 7)
/** 打开弹窗 */
const open = async (
type: string,
id?: number,
receivablePlan?: ReceivablePlanApi.ReceivablePlanVO
) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
resetForm()
// 修改时，设置数据
if (id) {
formLoading.value = true
try {
const data = (await ReceivableApi.getReceivable(id)) as ReceivableVO
formData.value = data
await handleCustomerChange(data.customerId!)
formData.value.contractId = data?.contract?.id
} finally {
formLoading.value = false
}
}
// 加载部门列表
deptList.value = await DeptApi.querySimpleDeptList(2)
// 获得用户列表
userOptions.value = await UserApi.getSimpleUserList()
// 获得客户列表
customerList.value = await CustomerApi.getCustomerSimpleList()
// 获得项目列表
// projectList.value = await ProjectApi.getProjectSimpleList()
// 默认新建时选中自己
if (formType.value === 'create') {
formData.value.ownerUserId = useUserStore().getUser.id
}
// 从付款计划创建付款
if (receivablePlan) {
// 修复 receivablePlan.contractId 可能为 undefined 的类型问题
formData.value.customerId = receivablePlan.customerId
formData.value.period = receivablePlan.period
formData.value.remark = receivablePlan.remark
formData.value.deptId = receivablePlan.deptId
await handleCustomerChange(receivablePlan.customerId)
if (receivablePlan.contractId) {
formData.value.contractId = receivablePlan.contractId
await handleContractChange(receivablePlan.contractId)
}
if (receivablePlan.id) {
formData.value.planId = receivablePlan.id
formData.value.returnType = receivablePlan.returnType
// 计算应付款金额并赋值给付款金额
let paid = 0
if (Array.isArray(receivablePlan.receivable) && receivablePlan.receivable.length > 0) {
paid = receivablePlan.receivable.reduce((sum, r) => sum + (r.price || 0), 0)
}
maxPayableAmount.value = receivablePlan.price - paid
formData.value.price = receivablePlan.price - paid
}
}
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => {
// 校验表单
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
// 提交请求
formLoading.value = true
try {
const data = formData.value as unknown as ReceivableApi.ReceivableVO
if (formType.value === 'create') {
await ReceivableApi.createReceivable(data)
message.success(t('common.createSuccess'))
} else {
await ReceivableApi.updateReceivable(data)
message.success(t('common.updateSuccess'))
}
dialogVisible.value = false
// 发送操作成功的事件
emit('success')
} finally {
formLoading.value = false
}
}
/** 重置表单 */
const resetForm = () => {
formData.value = {} as ReceivableApi.ReceivableVO
formRef.value?.resetFields()
formData.value.isDeposit = false // 默认不是押金
formData.value.transactionType = 1 // 默认收支方向为支出
}
/** 处理切换客户 */
const handleCustomerChange = async (customerId: number) => {
// 重置合同编号
formData.value.contractId = undefined
// 获得合同列表
if (customerId) {
contractList.value = []
contractList.value = await ContractApi.getContractSimpleList(customerId)
}
}
/** 处理切换合同 */
const handleContractChange = async (contractId: number) => {
// 重置付款计划编号
formData.value.planId = undefined
if (contractId) {
// 获得付款计划列表
receivablePlanList.value = []
receivablePlanList.value = await ReceivablePlanApi.getReceivablePlanSimpleList(
formData.value.customerId!,
contractId
)
// 设置金额
const contract = contractList.value.find((item) => item.id === contractId)
if (contract) {
formData.value.price = contract.totalPrice - contract.totalReceivablePrice
// 设置付款方
formData.value.deptId = contract.deptId
}
}
}
/** 处理切换付款计划 */
const handleReceivablePlanChange = (planId: number) => {
if (!planId) {
return
}
const receivablePlan = receivablePlanList.value.find((item) => item.id === planId)
if (!receivablePlan) {
return
}
formData.value.price = receivablePlan.price
formData.value.returnType = receivablePlan.returnType
}
watch(
() => formData.value.receivableType,
(val) => {
if (val === 1 || val === 2 || val === 3 || val === 4 || val === 5 || val === 6 || val === 7) {
formRules.projectId = [{ required: true, message: '项目名称不能为空', trigger: 'change' }]
} else {
formRules.projectId = []
formData.value.projectId = undefined
}
},
{ immediate: true }
)
</script>

393
src/views/crm/receivable/other/index.vue Normal file
View File

@ -0,0 +1,393 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<el-form
ref="queryFormRef"
:inline="true"
:model="queryParams"
class="-mb-15px"
label-width="68px"
>
<el-form-item label="日期" prop="returnTime">
<el-date-picker
v-model="queryParams.returnTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-220px"
/>
</el-form-item>
<el-form-item label="报销人/经办人" prop="ownerUserId" label-width="120px">
<el-select
v-model="queryParams.ownerUserId"
class="!w-240px"
placeholder="请选择"
filterable
@keyup.enter="handleQuery"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.nickname"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="收付主体" prop="deptId">
<el-select
v-model="queryParams.deptId"
class="!w-240px"
placeholder="请选择收付主体"
@keyup.enter="handleQuery"
>
<el-option
v-for="item in deptList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="金额(元)">
<el-input-number
v-model="queryParams.priceMin"
:precision="2"
class="!w-110px mr-8px"
:controls="false"
placeholder="最小金额"
/>
<span style="margin: 0 8px;">-</span>
<el-input-number
v-model="queryParams.priceMax"
:precision="2"
class="!w-110px"
:controls="false"
placeholder="最大金额"
/>
</el-form-item>
<el-form-item>
<el-button @click="handleQuery">
<Icon class="mr-5px" icon="ep:search" />
搜索
</el-button>
<el-button @click="resetQuery">
<Icon class="mr-5px" icon="ep:refresh" />
重置
</el-button>
<el-button
v-hasPermi="['crm:receivable-other:create']"
plain
type="primary"
@click="openPaymentForm('create')"
>
<Icon class="mr-5px" icon="ep:plus" />
新增收入
</el-button>
<el-button
v-hasPermi="['crm:receivable-other:create']"
plain
type="primary"
@click="openForm('create')"
>
<Icon class="mr-5px" icon="ep:plus" />
新增支出
</el-button>
<el-button
v-hasPermi="['crm:receivable-other:export']"
:loading="exportLoading"
plain
type="success"
@click="handleExport"
>
<Icon class="mr-5px" icon="ep:download" />
导出
</el-button>
<el-button plain type="warning" @click="openSummaryForm">
<Icon class="mr-5px" icon="ep:view" />
查看汇总
</el-button>
</el-form-item>
</el-form>
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list" :show-overflow-tooltip="true" :stripe="true">
<el-table-column
:formatter="dateFormatter2"
align="center"
label="日期"
prop="returnTime"
width="150px"
/>
<el-table-column align="center" label="报销人/经办人" prop="ownerUserName" min-width="350px"/>
<el-table-column
align="center"
label="收入金额(元)"
prop="price"
width="140"
>
<template #default="scope">
<span v-if="scope.row.transactionType === 0">{{ erpPriceInputFormatter(scope.row.price) }}</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column
align="center"
label="支出金额(元)"
prop="price"
width="140"
>
<template #default="scope">
<span v-if="scope.row.transactionType === 1">{{ erpPriceInputFormatter(scope.row.price) }}</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column align="center" label="收付主体" prop="name" min-width="350px">
<template #default="scope">
{{ scope.row.deptName }}
</template>
</el-table-column>
<el-table-column align="center" fixed="right" label="操作" width="180px">
<template #default="scope">
<!-- <el-button
v-hasPermi="['crm:receivable-other:query']"
link
type="primary"
@click="openDetail(scope.row.id)"
>
查看
</el-button> -->
<el-button
v-hasPermi="['crm:receivable-other:update']"
link
type="primary"
@click="scope.row.transactionType === 1 ? openForm('update', scope.row.id) : openPaymentForm('update', scope.row.id)"
>
编辑
</el-button>
<!-- <el-button
v-if="scope.row.auditStatus === 0"
v-hasPermi="['crm:receivable-other:update']"
link
type="primary"
@click="handleSubmit(scope.row)"
>
提交审核
</el-button>
<el-button
v-else
v-hasPermi="['crm:receivable-other:update']"
link
type="primary"
@click="handleProcessDetail(scope.row)"
>
查看审批
</el-button> -->
<el-button
v-hasPermi="['crm:receivable-other:delete']"
link
type="danger"
@click="handleDelete(scope.row.id)"
>
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
v-model:limit="queryParams.pageSize"
v-model:page="queryParams.pageNo"
:total="total"
@pagination="getList"
/>
</ContentWrap>
<!-- 表单弹窗：添加/修改 -->
<ReceivableForm ref="formRef" @success="getList" />
<PaymentForm ref="paymentFormRef" @success="getList" />
<SummaryForm ref="summaryFormRef" />
</template>
<script lang="ts" setup>
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { dateFormatter, dateFormatter2 } from '@/utils/formatTime'
import download from '@/utils/download'
import * as ReceivableApi from '@/api/crm/receivable/other'
import ReceivableForm from './ReceivableForm.vue'
import * as CustomerApi from '@/api/crm/customer'
import * as DeptApi from '@/api/system/dept'
import * as UserApi from '@/api/system/user'
import * as ProjectApi from '@/api/crm/project'
import { TabsPaneContext } from 'element-plus'
import { erpPriceInputFormatter } from '@/utils'
import { is } from 'bpmn-js/lib/util/ModelUtil'
import PaymentForm from './PaymentForm.vue'
import SummaryForm from '../components/SummaryOtherForm.vue'
defineOptions({ name: 'Receivable' })
const message = useMessage() // 消息弹窗
const { t } = useI18n() // 国际化
const loading = ref(true) // 列表的加载中
const total = ref(0) // 列表的总页数
const list = ref([]) // 列表的数据
const queryParams = reactive({
pageNo: 1,
pageSize: 10,
sceneType: undefined, // 默认和 activeName 相等
returnTime: [], // 收付日期
ownerUserId: undefined,
projectId: undefined,
deptId: undefined, // 收付主体
paymentType: undefined,
receivableType: undefined,
priceMin: undefined, // 金额最小值
priceMax: undefined, // 金额最大值
transactionType: undefined, // 收支类型
})
const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中
const activeName = ref('1') // 列表 tab
const customerList = ref<CustomerApi.CustomerVO[]>([]) // 客户列表
const deptList = ref<DeptApi.DeptVO[]>([])
const projectList = ref<ProjectApi.ProjectVO[]>([])
const userOptions = ref<UserApi.UserVO[]>([]) // 用户列表
const showSummaryDialog = ref(false)
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await ReceivableApi.getReceivablePage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
queryParams.priceMin = undefined
queryParams.priceMax = undefined
handleQuery()
}
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
}
const paymentFormRef = ref()
const openPaymentForm = (type: string, id?: number) => {
paymentFormRef.value.open(type, id)
}
/** 汇总表单 */
const summaryFormRef = ref()
const openSummaryForm = () => {
summaryFormRef.value.open()
}
/** 删除按钮操作 */
const handleDelete = async (id: number) => {
try {
// 删除的二次确认
await message.delConfirm()
// 发起删除
await ReceivableApi.deleteReceivable(id)
message.success(t('common.delSuccess'))
// 刷新列表
await getList()
} catch {}
}
/** 提交审核 **/
const handleSubmit = async (row: ReceivableApi.ReceivableVO) => {
await message.confirm(`您确定提交编号为【${row.no}】的付款审核吗？`)
await ReceivableApi.submitReceivable(row.id)
message.success('提交审核成功！')
await getList()
}
/** 查看审批 */
const handleProcessDetail = (row: ReceivableApi.ReceivableVO) => {
push({ name: 'BpmProcessInstanceDetail', query: { id: row.processInstanceId } })
}
/** 打开付款详情 */
const { push } = useRouter()
const openDetail = (id: number) => {
push({ name: 'CrmReceivableDetail', params: { id } })
}
/** 打开客户详情 */
const openCustomerDetail = (id: number) => {
push({ name: 'CrmCustomerDetail', params: { id } })
}
/** 打开合同详情 */
const openContractDetail = (id: number) => {
push({ name: 'CrmContractDetail', params: { id } })
}
/** 导出按钮操作 */
const handleExport = async () => {
try {
// 导出的二次确认
await message.exportConfirm()
// 发起导出
exportLoading.value = true
const data = await ReceivableApi.exportReceivable(queryParams)
download.excel(data, '付款.xls')
} catch {
} finally {
exportLoading.value = false
}
}
/** 初始化 **/
onMounted(async () => {
await getList()
// 获得用户列表
userOptions.value = await UserApi.getSimpleUserList()
// 获得客户列表
// customerList.value = await CustomerApi.getCustomerSimpleList()
// 加载部门列表
deptList.value = await DeptApi.querySimpleDeptList(2)
// // 加载项目列表
// projectList.value = await ProjectApi.getProjectSimpleList()
})
watch(
() => queryParams.priceMax,
(newVal) => {
if (
queryParams.priceMin !== undefined &&
newVal !== undefined &&
newVal < queryParams.priceMin
) {
queryParams.priceMax = queryParams.priceMin
}
}
)
</script>

2
src/views/crm/receivable/plan/index.vue
View File

@ -245,7 +245,7 @@
<ReceivablePlanForm ref="formRef" @success="getList" />
<ReceivableForm ref="receivableFormRef" @success="getList" />
<!-- 汇总弹窗 -->
<Dialog v-model="summaryDialogVisible" title="收款计划汇总" @open="fetchSummaryData">
<Dialog v-model="summaryDialogVisible" title="付款计划汇总" @open="fetchSummaryData">
<div v-loading="summaryLoading" style="height:400px;">
<div v-if="!summaryLoading && summaryChartData.length === 0" style="text-align:center;padding:100px 0;">暂无数据</div>
<div v-else ref="summaryChartRef" style="width:100%;height:100%;"></div>