feat(oa/erp): 添加合同台账报表功能
- 新增合同台账报表API接口定义和数据模型 - 实现合同查询、筛选和分页功能 - 添加导出Excel报表功能 - 构建完整的前端页面界面和交互逻辑dev
Yangk
4 weeks ago
parent
098d833c31
commit
a499cb57e2
@ -0,0 +1,56 @@
|
|||||||
|
import request from '@/utils/request';
|
||||||
|
|
||||||
|
export interface ContractLedgerReportQuery {
|
||||||
|
pageNum: number;
|
||||||
|
pageSize: number;
|
||||||
|
customerContractCode?: string;
|
||||||
|
internalContractCode?: string;
|
||||||
|
projectCode?: string;
|
||||||
|
businessDirection?: string;
|
||||||
|
contractIdList?: Array<string | number>;
|
||||||
|
params?: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface ContractLedgerReportVO {
|
||||||
|
contractId: string | number;
|
||||||
|
month: string;
|
||||||
|
internalContractCode: string;
|
||||||
|
externalContractCode: string;
|
||||||
|
customerContractCode: string;
|
||||||
|
contractDate: string;
|
||||||
|
orderContractCode: string;
|
||||||
|
projectContractCode: string;
|
||||||
|
customerName: string;
|
||||||
|
productName: string;
|
||||||
|
mesnacContractPrice: number;
|
||||||
|
totalPrice: number;
|
||||||
|
paymentMethod: string;
|
||||||
|
deliveryStart: number;
|
||||||
|
warrantyPeriod: number;
|
||||||
|
contractManagerName: string;
|
||||||
|
contractDeptName: string;
|
||||||
|
businessDirection: string;
|
||||||
|
projectCode: string;
|
||||||
|
projectName: string;
|
||||||
|
managerName: string;
|
||||||
|
typeName: string;
|
||||||
|
finalCustomerName: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询合同台账报表列表
|
||||||
|
export function listContractLedgerReport(query: ContractLedgerReportQuery) {
|
||||||
|
return request({
|
||||||
|
url: '/oa/erp/contractLedgerReport/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导出合同台账报表
|
||||||
|
export function exportContractLedgerReport(query: ContractLedgerReportQuery) {
|
||||||
|
return request({
|
||||||
|
url: '/oa/erp/contractLedgerReport/export',
|
||||||
|
method: 'post',
|
||||||
|
data: query
|
||||||
|
});
|
||||||
|
}
|
||||||
@ -0,0 +1,228 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form :model="queryParams" ref="queryFormRef" :inline="true" v-show="showSearch" label-width="120px">
|
||||||
|
<el-form-item label="客户合同编号" prop="customerContractCode">
|
||||||
|
<el-input v-model="queryParams.customerContractCode" placeholder="请输入客户合同编号" clearable style="width: 180px" @keyup.enter="handleQuery" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="海威SAP订单号" prop="internalContractCode">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.internalContractCode"
|
||||||
|
placeholder="请输入海威SAP订单号"
|
||||||
|
clearable
|
||||||
|
style="width: 180px"
|
||||||
|
@keyup.enter="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="项目编号" prop="projectCode">
|
||||||
|
<el-input v-model="queryParams.projectCode" placeholder="请输入项目编号" clearable style="width: 180px" @keyup.enter="handleQuery" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="业务方向" prop="businessDirection">
|
||||||
|
<el-select v-model="queryParams.businessDirection" placeholder="请选择业务方向" clearable style="width: 180px">
|
||||||
|
<el-option v-for="dict in business_direction" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="签订时间" style="width: 320px">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="daterangeContractDate"
|
||||||
|
value-format="YYYY-MM-DD"
|
||||||
|
type="daterange"
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||||
|
<el-button type="warning" plain icon="Download" @click="handleExport">导出</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="reportList" border @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="55" align="center" fixed="left" />
|
||||||
|
<el-table-column label="月份" prop="month" width="100" align="center" fixed="left" />
|
||||||
|
|
||||||
|
<!-- ========== 合同信息 ========== -->
|
||||||
|
<el-table-column label="合同信息" align="center">
|
||||||
|
<el-table-column label="海威SAP订单号" prop="internalContractCode" width="140" align="center" show-overflow-tooltip fixed="left" />
|
||||||
|
<el-table-column label="海威合同归档编号" prop="externalContractCode" width="150" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="客户合同编号" prop="customerContractCode" width="150" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="签订时间" prop="contractDate" width="110" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="软控SAP订单号" prop="orderContractCode" width="140" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="软控SAP项目号" prop="projectContractCode" width="140" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="客户名称" prop="customerName" width="200" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="产品名称" prop="productName" width="180" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="软控合同额(元)" prop="mesnacContractPrice" width="130" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.mesnacContractPrice != null ? formatNumber(scope.row.mesnacContractPrice) : '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="海威合同额(元)" prop="totalPrice" width="130" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.totalPrice != null ? formatNumber(scope.row.totalPrice) : '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="付款方式" prop="paymentMethod" width="180" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="交货期" prop="deliveryStart" width="100" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.deliveryStart != null ? scope.row.deliveryStart + '天' : '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="质保期" prop="warrantyPeriod" width="100" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.warrantyPeriod != null ? scope.row.warrantyPeriod + '天' : '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="签订人" prop="contractManagerName" width="100" align="center" show-overflow-tooltip>
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.contractManagerName || '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="部门" prop="contractDeptName" width="120" align="center" show-overflow-tooltip />
|
||||||
|
<el-table-column label="业务方向" prop="businessDirection" width="120" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<dict-tag :options="business_direction" :value="scope.row.businessDirection" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<!-- ========== 项目基本信息 ========== -->
|
||||||
|
<el-table-column label="项目基本信息" align="center">
|
||||||
|
<el-table-column label="项目编号" prop="projectCode" width="140" align="center" show-overflow-tooltip>
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.projectCode || '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="项目名称" prop="projectName" width="200" align="center" show-overflow-tooltip>
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.projectName || '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="项目经理" prop="managerName" width="100" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.managerName || '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="项目类型" prop="typeName" width="130" align="center" show-overflow-tooltip>
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.typeName || '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
<!-- ========== 备注 ========== -->
|
||||||
|
<el-table-column label="备注" align="center">
|
||||||
|
<el-table-column label="最终客户" prop="finalCustomerName" width="200" align="center" show-overflow-tooltip>
|
||||||
|
<template #default="scope">
|
||||||
|
{{ scope.row.finalCustomerName || '-' }}
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total > 0"
|
||||||
|
:total="total"
|
||||||
|
v-model:page="queryParams.pageNum"
|
||||||
|
v-model:limit="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts" name="ContractLedgerReport">
|
||||||
|
import { ref, reactive, onMounted, ComponentInternalInstance, getCurrentInstance, toRefs } from 'vue';
|
||||||
|
import { ElForm } from 'element-plus';
|
||||||
|
import { listContractLedgerReport, ContractLedgerReportQuery, ContractLedgerReportVO } from '@/api/oa/erp/contractLedgerReport';
|
||||||
|
|
||||||
|
type ElFormInstance = InstanceType<typeof ElForm>;
|
||||||
|
|
||||||
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
|
const { business_direction } = toRefs<any>(proxy?.useDict('business_direction'));
|
||||||
|
|
||||||
|
const reportList = ref<ContractLedgerReportVO[]>([]);
|
||||||
|
const selectedRows = ref<ContractLedgerReportVO[]>([]);
|
||||||
|
const loading = ref(true);
|
||||||
|
const showSearch = ref(true);
|
||||||
|
const total = ref(0);
|
||||||
|
const daterangeContractDate = ref<[any, any]>(['', '']);
|
||||||
|
|
||||||
|
const queryFormRef = ref<ElFormInstance>();
|
||||||
|
|
||||||
|
const queryParams = reactive<ContractLedgerReportQuery>({
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
customerContractCode: undefined,
|
||||||
|
internalContractCode: undefined,
|
||||||
|
projectCode: undefined,
|
||||||
|
businessDirection: undefined,
|
||||||
|
params: {}
|
||||||
|
});
|
||||||
|
|
||||||
|
/** 查询列表 */
|
||||||
|
const getList = async () => {
|
||||||
|
loading.value = true;
|
||||||
|
queryParams.params = {};
|
||||||
|
if (daterangeContractDate.value && daterangeContractDate.value.length === 2 && daterangeContractDate.value[0]) {
|
||||||
|
queryParams.params.beginContractDate = daterangeContractDate.value[0];
|
||||||
|
queryParams.params.endContractDate = daterangeContractDate.value[1];
|
||||||
|
}
|
||||||
|
const res = await listContractLedgerReport(queryParams);
|
||||||
|
reportList.value = res.rows;
|
||||||
|
total.value = res.total;
|
||||||
|
loading.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
const handleQuery = () => {
|
||||||
|
queryParams.pageNum = 1;
|
||||||
|
getList();
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
const resetQuery = () => {
|
||||||
|
daterangeContractDate.value = ['', ''];
|
||||||
|
queryFormRef.value?.resetFields();
|
||||||
|
handleQuery();
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
const handleExport = () => {
|
||||||
|
const exportParams = { ...queryParams };
|
||||||
|
if (daterangeContractDate.value && daterangeContractDate.value.length === 2 && daterangeContractDate.value[0]) {
|
||||||
|
exportParams.params = {
|
||||||
|
beginContractDate: daterangeContractDate.value[0],
|
||||||
|
endContractDate: daterangeContractDate.value[1]
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
exportParams.params = {};
|
||||||
|
}
|
||||||
|
|
||||||
|
if (selectedRows.value.length > 0) {
|
||||||
|
exportParams.contractIdList = selectedRows.value.map((row) => row.contractId);
|
||||||
|
}
|
||||||
|
|
||||||
|
proxy?.download('/oa/erp/contractLedgerReport/export', exportParams, `合同台账报表_${new Date().getTime()}.xlsx`);
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 勾选变化 */
|
||||||
|
const handleSelectionChange = (selection: ContractLedgerReportVO[]) => {
|
||||||
|
selectedRows.value = selection;
|
||||||
|
};
|
||||||
|
|
||||||
|
/** 格式化数字：保留两位小数并加千分位 */
|
||||||
|
const formatNumber = (num: number | string | undefined | null) => {
|
||||||
|
if (num === null || num === undefined || num === '') return '-';
|
||||||
|
const n = Number(num);
|
||||||
|
if (isNaN(n)) return num;
|
||||||
|
return n.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
getList();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
/* 可根据需要调整样式 */
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue