feat(order): 新增订单财务管理功能
- 添加更新订单财务状态的API接口 - 创建订单财务页面，支持订单查询和筛选 - 实现订单财务状态的更新操作 - 添加订单导出功能 - 集成项目和订单详情抽屉组件 - 支持多种时间类型的筛选条件- 实现金额格式化显示过滤器master
chenhao
parent
87e199ab4b
commit
0e764c997b
|
|
@ -70,3 +70,16 @@ export function uploadContractFile(data) {
|
||||||
headers: { 'Content-Type': 'multipart/form-data' }
|
headers: { 'Content-Type': 'multipart/form-data' }
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 更新订单财务状态
|
||||||
|
export function updateFinanceStatus(id, status) {
|
||||||
|
const data = {
|
||||||
|
id,
|
||||||
|
financeStatus: status
|
||||||
|
}
|
||||||
|
return request({
|
||||||
|
url: '/project/order/finance/update',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,345 @@
|
||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
|
||||||
|
<el-form-item label="项目编号" prop="projectCode">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.projectCode"
|
||||||
|
placeholder="请输入项目编号"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="项目名称" prop="projectName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.projectName"
|
||||||
|
placeholder="请输入项目名称"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="合同编号" prop="orderCode">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.orderCode"
|
||||||
|
placeholder="请输入合同编号"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="最终客户" prop="customerName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.customerName"
|
||||||
|
placeholder="请输入最终客户"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="订单状态" prop="orderStatus">
|
||||||
|
<el-select v-model="queryParams.orderStatus" placeholder="请选择订单状态" clearable>
|
||||||
|
<el-option
|
||||||
|
v-for="dict in dict.type.order_status"
|
||||||
|
:key="dict.value"
|
||||||
|
:label="dict.label"
|
||||||
|
:value="dict.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="代表处" prop="agentName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.agentName"
|
||||||
|
placeholder="请输入代表处"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="汇智负责人" prop="dutyName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.dutyName"
|
||||||
|
placeholder="请输入汇智负责人"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="进货商" prop="partnerName">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.partnerName"
|
||||||
|
placeholder="请输入进货商"
|
||||||
|
clearable
|
||||||
|
@keyup.enter.native="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="完结状态" prop="financeStatus">
|
||||||
|
<el-select v-model="queryParams.financeStatus" placeholder="请选择完结状态" clearable>
|
||||||
|
<el-option label="未完结" value="0" />
|
||||||
|
<el-option label="已完结" value="1" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间选择" prop="timeType">
|
||||||
|
<el-select v-model="queryParams.timeType" @change="changeTimeType">
|
||||||
|
<el-option label="到货时间" value="0" />
|
||||||
|
<el-option label="下单时间" value="1" />
|
||||||
|
<el-option label="执行单截止时间" value="2" />
|
||||||
|
<el-option label="归档时间" value="3" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-date-picker
|
||||||
|
v-model="dateRange"
|
||||||
|
style="width: 240px"
|
||||||
|
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="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="mb8">
|
||||||
|
<el-col :span="1.5">
|
||||||
|
<el-button
|
||||||
|
type="warning"
|
||||||
|
plain
|
||||||
|
icon="el-icon-download"
|
||||||
|
size="mini"
|
||||||
|
@click="handleExport"
|
||||||
|
v-hasPermi="['project:order:export']"
|
||||||
|
>导出</el-button>
|
||||||
|
</el-col>
|
||||||
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
<el-table v-loading="loading" :data="orderList" @selection-change="handleSelectionChange">
|
||||||
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
|
<el-table-column label="项目编号" prop="projectCode" width="120" />
|
||||||
|
<el-table-column label="项目名称" prop="projectName" width="300" :show-overflow-tooltip="true">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<a @click="handleViewProject(scope.row)" class="link-type">{{ scope.row.projectName }}</a>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="合同编号" prop="orderCode" width="200" :show-overflow-tooltip="true">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span class="link-type" @click="handleViewOrder(scope.row)">{{ scope.row.orderCode }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="最终客户" prop="customerName" width="200" :show-overflow-tooltip="true"/>
|
||||||
|
<el-table-column label="金额(¥)" prop="actualPurchaseAmount" width="120" sortable>
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ (scope.row.orderStatus == 1 || scope.row.orderStatus == 2) ? scope.row.actualPurchaseAmount : scope.row.shipmentAmount | formatAmount }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="订单状态" prop="orderStatus" width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<dict-tag :options="dict.type.order_status" :value="scope.row.orderStatus"/>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="完结状态" prop="financeStatus" width="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span>{{ scope.row.financeStatus == '1' ? '完结' : '未完结' }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="代表处" prop="agentName" width="120" />
|
||||||
|
<el-table-column label="汇智负责人" prop="dutyName" width="120" />
|
||||||
|
<el-table-column label="物流状态" width="100" />
|
||||||
|
<el-table-column label="进货商" prop="partnerName" width="200" :show-overflow-tooltip="true"/>
|
||||||
|
<el-table-column label="到货时间" prop="deliveryTime" width="180" sortable/>
|
||||||
|
<el-table-column label="下单时间" prop="estimatedOrderTime" width="180" sortable/>
|
||||||
|
<el-table-column label="执行单截止时间" prop="orderEndTime" width="180" sortable/>
|
||||||
|
<el-table-column label="归档时间" prop="approveTime" width="180" sortable/>
|
||||||
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120" fixed="right">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-button
|
||||||
|
v-if="scope.row.financeStatus != '1'"
|
||||||
|
size="mini"
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-edit"
|
||||||
|
@click="handleUpdateFinanceStatus(scope.row, '1')"
|
||||||
|
>完结</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-show="total>0"
|
||||||
|
:total="total"
|
||||||
|
:page.sync="queryParams.pageNum"
|
||||||
|
:limit.sync="queryParams.pageSize"
|
||||||
|
@pagination="getList"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<!-- 项目详情抽屉 -->
|
||||||
|
<project-detail-drawer :visible.sync="projectDrawerVisible" :project-id="currentProjectId" />
|
||||||
|
|
||||||
|
<!-- 订单详情抽屉 -->
|
||||||
|
<order-detail-drawer :visible.sync="orderDrawerVisible" :order-id="currentOrderId" title="订单详情" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { listOrder, updateFinanceStatus } from "@/api/project/order";
|
||||||
|
import ProjectDetailDrawer from '../info/ProjectDetailDrawer.vue';
|
||||||
|
import OrderDetailDrawer from './OrderDetailDrawer.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "OrderFinance",
|
||||||
|
components: {
|
||||||
|
ProjectDetailDrawer,
|
||||||
|
OrderDetailDrawer
|
||||||
|
},
|
||||||
|
dicts: ['order_status'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// 遮罩层
|
||||||
|
loading: true,
|
||||||
|
// 选中数组
|
||||||
|
ids: [],
|
||||||
|
// 非单个禁用
|
||||||
|
single: true,
|
||||||
|
// 非多个禁用
|
||||||
|
multiple: true,
|
||||||
|
// 显示搜索条件
|
||||||
|
showSearch: true,
|
||||||
|
// 总条数
|
||||||
|
total: 0,
|
||||||
|
// 订单管理表格数据
|
||||||
|
orderList: [],
|
||||||
|
// 日期范围
|
||||||
|
dateRange: [],
|
||||||
|
// --- 抽屉控制 ---
|
||||||
|
projectDrawerVisible: false,
|
||||||
|
orderDrawerVisible: false,
|
||||||
|
currentProjectId: null,
|
||||||
|
currentOrderId: null,
|
||||||
|
// 查询参数
|
||||||
|
queryParams: {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
projectCode: null,
|
||||||
|
projectName: null,
|
||||||
|
orderCode: null,
|
||||||
|
customerName: null,
|
||||||
|
orderStatus: '2',
|
||||||
|
agentName: null,
|
||||||
|
dutyName: null,
|
||||||
|
partnerName: null,
|
||||||
|
financeStatus: '0',
|
||||||
|
timeType: '0',
|
||||||
|
deliveryTimeStart: null,
|
||||||
|
deliveryTimeEnd: null,
|
||||||
|
estimatedOrderTimeStart: null,
|
||||||
|
estimatedOrderTimeEnd: null,
|
||||||
|
orderEndTimeStart: null,
|
||||||
|
orderEndTimeEnd: null,
|
||||||
|
approveTimeStart: null,
|
||||||
|
approveTimeEnd: null,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
/** 查询订单管理列表 */
|
||||||
|
getList() {
|
||||||
|
this.loading = true;
|
||||||
|
this.addDateRange(this.queryParams, this.dateRange);
|
||||||
|
this.changeTimeType(); // Ensure correct date params are set
|
||||||
|
listOrder(this.queryParams).then(response => {
|
||||||
|
this.orderList = response.rows;
|
||||||
|
this.total = response.total;
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
/** 重置按钮操作 */
|
||||||
|
resetQuery() {
|
||||||
|
this.dateRange = [];
|
||||||
|
this.resetForm("queryForm");
|
||||||
|
this.queryParams.financeStatus = '0';
|
||||||
|
this.queryParams.timeType = '0';
|
||||||
|
this.handleQuery();
|
||||||
|
},
|
||||||
|
// 多选框选中数据
|
||||||
|
handleSelectionChange(selection) {
|
||||||
|
this.ids = selection.map(item => item.id)
|
||||||
|
this.single = selection.length!==1
|
||||||
|
this.multiple = !selection.length
|
||||||
|
},
|
||||||
|
/** 完结按钮操作 */
|
||||||
|
handleUpdateFinanceStatus(row, status) {
|
||||||
|
this.$modal.confirm('确认要将此订单设置为"' + (status === '1' ? '完结' : '未完结') + '"状态吗？').then(function() {
|
||||||
|
return updateFinanceStatus(row.id, status);
|
||||||
|
}).then(() => {
|
||||||
|
this.getList();
|
||||||
|
this.$modal.msgSuccess("操作成功");
|
||||||
|
}).catch(() => {});
|
||||||
|
},
|
||||||
|
/** 导出按钮操作 */
|
||||||
|
handleExport() {
|
||||||
|
this.addDateRange(this.queryParams, this.dateRange);
|
||||||
|
this.changeTimeType();
|
||||||
|
this.download('/project/order/finance/export', {
|
||||||
|
...this.queryParams
|
||||||
|
}, `order_finance_${new Date().getTime()}.xlsx`)
|
||||||
|
},
|
||||||
|
/** 时间选择类型切换 */
|
||||||
|
changeTimeType() {
|
||||||
|
// Clear all date params first
|
||||||
|
this.queryParams.deliveryTimeStart = null;
|
||||||
|
this.queryParams.deliveryTimeEnd = null;
|
||||||
|
this.queryParams.estimatedOrderTimeStart = null;
|
||||||
|
this.queryParams.estimatedOrderTimeEnd = null;
|
||||||
|
this.queryParams.orderEndTimeStart = null;
|
||||||
|
this.queryParams.orderEndTimeEnd = null;
|
||||||
|
this.queryParams.approveTimeStart = null;
|
||||||
|
this.queryParams.approveTimeEnd = null;
|
||||||
|
|
||||||
|
if (this.dateRange && this.dateRange.length === 2) {
|
||||||
|
const [start, end] = this.dateRange;
|
||||||
|
const timeType = this.queryParams.timeType;
|
||||||
|
if (timeType == 0) {
|
||||||
|
this.queryParams.deliveryTimeStart = start;
|
||||||
|
this.queryParams.deliveryTimeEnd = end;
|
||||||
|
} else if (timeType == 1) {
|
||||||
|
this.queryParams.estimatedOrderTimeStart = start;
|
||||||
|
this.queryParams.estimatedOrderTimeEnd = end;
|
||||||
|
} else if (timeType == 2) {
|
||||||
|
this.queryParams.orderEndTimeStart = start;
|
||||||
|
this.queryParams.orderEndTimeEnd = end;
|
||||||
|
} else if (timeType == 3) {
|
||||||
|
this.queryParams.approveTimeStart = start;
|
||||||
|
this.queryParams.approveTimeEnd = end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/** 查看项目详情 */
|
||||||
|
handleViewProject(row) {
|
||||||
|
this.currentProjectId = row.projectId;
|
||||||
|
this.projectDrawerVisible = true;
|
||||||
|
},
|
||||||
|
/** 查看订单详情 */
|
||||||
|
handleViewOrder(row) {
|
||||||
|
this.currentOrderId = row.id;
|
||||||
|
this.orderDrawerVisible = true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
filters: {
|
||||||
|
formatAmount(value) {
|
||||||
|
if (value === null || value === undefined) return '';
|
||||||
|
return parseFloat(value).toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
dateRange() {
|
||||||
|
this.changeTimeType();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue