成本核算清单

This commit is contained in:
2025-08-21 15:46:30 +08:00
parent 7933ffbc0e
commit 5454018914
3 changed files with 452 additions and 50 deletions

View File

@ -228,7 +228,16 @@ const handleExport = () => {
};
// 审核
const handleAudit = (row: any) => {
//
console.log(11111);
// proxy.$tab.closePage(proxy.$route);
// proxy.$router.push({
// path: `/approval/biddingLimit/indexEdit`,
// query: {
// id: row.id,
// type: 'add'
// }
// });
};
onUnmounted(() => {

View File

@ -0,0 +1,371 @@
<template>
<div class="p-4 bg-gray-50">
<div class="max-w-4xl mx-auto">
<!-- 顶部按钮区域 -->
<el-card class="mb-4 rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md">
<approvalButton
@submitForm="submitForm"
@approvalVerifyOpen="approvalVerifyOpen"
@handleApprovalRecord="handleApprovalRecord"
:buttonLoading="buttonLoading"
:id="form.id"
:status="form.status"
:pageType="routeParams.type"
/>
</el-card>
<!-- 表单区域 -->
<el-card class="rounded-lg shadow-sm bg-white border border-gray-100 transition-all hover:shadow-md overflow-hidden">
<div class="p-4 bg-gradient-to-r from-blue-50 to-indigo-50 border-b border-gray-100">
<h3 class="text-lg font-semibold text-gray-800">成本核算清单</h3>
</div>
<div class="p-6">
<el-form
ref="leaveFormRef"
:disabled="routeParams.type === 'view' || form.status == 'waiting'"
:model="form"
:rules="rules"
label-width="100px"
class="space-y-4"
>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<el-form-item label="表格文件" prop="fileId" class="mb-2 md:col-span-2">
<input type="text" :value="form.fileId" class="w-full" readonly />
</el-form-item>
</div>
</el-form>
</div>
</el-card>
<!-- 提交组件 -->
<submitVerify ref="submitVerifyRef" :task-variables="taskVariables" @submit-callback="submitCallback" />
<approvalRecord ref="approvalRecordRef"></approvalRecord>
<!-- 流程选择对话框 -->
<el-dialog
draggable
v-model="dialogVisible.visible"
:title="dialogVisible.title"
:before-close="handleClose"
width="500"
class="rounded-lg shadow-lg"
>
<div class="p-4">
<p class="text-gray-600 mb-4">请选择要启动的流程</p>
<el-select v-model="flowCode" placeholder="请选择流程" style="width: 100%">
<el-option v-for="item in flowCodeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<template #footer>
<div class="dialog-footer p-4 border-t border-gray-100 flex justify-end space-x-3">
<el-button @click="handleClose" class="px-4 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 transition-colors"
>取消</el-button
>
<el-button type="primary" @click="submitFlow()" class="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
>确认</el-button
>
</div>
</template>
</el-dialog>
</div>
</div>
</template>
<script setup name="Leave" lang="ts">
import { LeaveForm } from '@/api/workflow/leave/types';
import { startWorkFlow } from '@/api/workflow/task';
import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import ApprovalButton from '@/components/Process/approvalButton.vue';
import { StartProcessBo } from '@/api/workflow/workflowCommon/types';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
import { useUserStoreHook } from '@/store/modules/user';
import { getDrawing } from '@/api/design/drawing';
import { updateDesignChange, getDesignChange } from '@/api/design/designChange';
// 获取用户 store
const userStore = useUserStoreHook();
// 从 store 中获取项目列表和当前选中的项目
const currentProject = computed(() => userStore.selectedProject);
const buttonLoading = ref(false);
const loading = ref(true);
//路由参数
const routeParams = ref<Record<string, any>>({});
const flowCodeOptions = [
{
value: currentProject.value?.id + '_costAccounting',
label: '成本核算清单审批'
}
];
const flowCode = ref<string>('');
const status = ref<string>('');
const dialogVisible = reactive<DialogOption>({
visible: false,
title: '流程定义'
});
//提交组件
const submitVerifyRef = ref<InstanceType<typeof SubmitVerify>>();
//审批记录组件
const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>();
//按钮组件
const approvalButtonRef = ref<InstanceType<typeof ApprovalButton>>();
const leaveFormRef = ref<ElFormInstance>();
const dialog = reactive({
visible: false,
title: '',
isEdit: false
});
const submitFormData = ref<StartProcessBo>({
businessId: '',
flowCode: '',
variables: {}
});
const taskVariables = ref<Record<string, any>>({});
const initFormData = {
id: undefined,
projectId: currentProject.value?.id,
versionNumber: undefined,
fileName: undefined,
fileUrl: undefined,
fileType: undefined,
fileSuffix: undefined,
originalName: undefined,
remark: undefined,
fileId: undefined
};
const data = reactive({
form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
projectId: currentProject.value?.id,
fileName: undefined,
fileType: undefined,
fileSuffix: undefined,
fileStatus: undefined,
originalName: undefined,
newest: undefined,
params: {}
},
rules: {}
});
const handleClose = () => {
dialogVisible.visible = false;
flowCode.value = '';
buttonLoading.value = false;
};
const { form, rules } = toRefs(data);
/** 表单重置 */
const reset = () => {
form.value = { ...initFormData };
leaveFormRef.value?.resetFields();
};
/** 获取详情 */
const getInfo = () => {
loading.value = true;
buttonLoading.value = false;
nextTick(async () => {
const res = await getDesignChange(routeParams.value.id);
Object.assign(form.value, res.data);
loading.value = false;
buttonLoading.value = false;
});
};
/** 提交按钮 */
const submitForm = (status1: string) => {
status.value = status1;
leaveFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
var res;
// if (form.value.id) {
res = await updateDesignChange({ ...form.value, id: routeParams.value.id }).finally(() => (buttonLoading.value = false));
// }
if (res.code == 200) {
dialog.visible = false;
submit(status.value, res.data);
}
}
});
};
const submitFlow = async () => {
handleStartWorkFlow(form.value);
dialogVisible.visible = false;
};
//提交申请
const handleStartWorkFlow = async (data: LeaveForm) => {
try {
submitFormData.value.flowCode = flowCode.value;
submitFormData.value.businessId = data.id;
//流程变量
taskVariables.value = {
// leave4/5 使用的流程变量
userList: ['1', '3', '4']
};
submitFormData.value.variables = taskVariables.value;
const resp = await startWorkFlow(submitFormData.value);
if (submitVerifyRef.value) {
buttonLoading.value = false;
submitVerifyRef.value.openDialog(resp.data.taskId);
}
} finally {
buttonLoading.value = false;
}
};
//审批记录
const handleApprovalRecord = () => {
approvalRecordRef.value.init(form.value.id);
};
//提交回调
const submitCallback = async () => {
await proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
};
//审批
const approvalVerifyOpen = async () => {
submitVerifyRef.value.openDialog(routeParams.value.taskId, true, routeParams.value.businessId);
// submitVerifyRef.value.openDialog(routeParams.value.taskId);
};
// 图纸上传成功之后 开始提交
const submit = async (status, data) => {
form.value = data;
if (status === 'draft') {
buttonLoading.value = false;
proxy?.$modal.msgSuccess('暂存成功');
proxy.$tab.closePage(proxy.$route);
proxy.$router.go(-1);
} else {
if ((form.value.status === 'draft' && (flowCode.value === '' || flowCode.value === null)) || routeParams.value.type === 'add') {
flowCode.value = flowCodeOptions[0].value;
dialogVisible.visible = true;
return;
}
//说明启动过先随意穿个参数
if (flowCode.value === '' || flowCode.value === null) {
flowCode.value = 'xx';
}
console.log(data);
await handleStartWorkFlow(data);
}
};
onMounted(() => {
nextTick(async () => {
routeParams.value = proxy.$route.query;
reset();
loading.value = false;
if (routeParams.value.type === 'update' || routeParams.value.type === 'view' || routeParams.value.type === 'approval') {
getInfo();
}
});
});
</script>
<style scoped lang="scss">
/* 全局样式 */
:root {
--primary: #409eff;
--primary-light: #66b1ff;
--primary-dark: #3a8ee6;
--success: #67c23a;
--warning: #e6a23c;
--danger: #f56c6c;
--info: #909399;
}
/* 表单样式优化 */
.el-form-item {
.el-form-item__label {
color: #606266;
font-weight: 500;
}
.el-input__inner,
.el-select .el-input__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
.el-textarea__inner {
border-radius: 4px;
transition:
border-color 0.2s,
box-shadow 0.2s;
&:focus {
border-color: var(--primary-light);
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.1);
}
}
}
/* 按钮样式优化 */
.el-button {
border-radius: 4px;
transition: all 0.2s;
&.is-primary {
background-color: var(--primary);
border-color: var(--primary);
&:hover {
background-color: var(--primary-light);
border-color: var(--primary-light);
}
&:active {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
}
}
&.is-text {
color: var(--primary);
&:hover {
color: var(--primary-light);
background-color: rgba(64, 158, 255, 0.05);
}
}
}
/* 卡片样式优化 */
.el-card {
transition: all 0.3s ease;
&:hover {
/* transform: translateY(-2px); */
}
}
/* 对话框样式优化 */
.el-dialog {
.el-dialog__header {
background-color: #f5f7fa;
border-bottom: 1px solid #ebeef5;
padding: 15px 20px;
}
.el-dialog__title {
font-size: 16px;
font-weight: 600;
color: #303133;
}
.el-dialog__footer {
padding: 15px 20px;
border-top: 1px solid #ebeef5;
}
}
</style>

View File

@ -5,44 +5,34 @@
<!-- 卡片头部独立背景色+内边距+圆角 -->
<template #header>
<div class="bg-blue-50 px-6 py-4 rounded-t-xl mb-0">
<h3 class="el-card__header-title text-lg font-semibold text-blue-800">标项目信息填写</h3>
<h3 class="el-card__header-title text-lg font-semibold text-blue-800">标项目信息填写</h3>
<span>{{ currentProject.name }}</span>
</div>
</template>
<!-- 表单区域内边距+间距优化 -->
<el-form ref="listOfWinningBidsFormRef" :model="form" :rules="rules" label-width="110px" class="p-6 pt-4" style="background-color: #ffffff">
<el-form ref="listOfWinningBidsFormRef" :model="form" :rules="rules" label-width="150px" class="p-6 pt-4" style="background-color: #ffffff">
<el-row :gutter="32">
<!-- 表单列统一12列布局保持对齐 -->
<el-col :span="12">
<el-form-item label="项目名称" prop="projectName" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.projectName" placeholder="请输入项目名称" size="medium" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中标价(原始)" prop="winningBidOriginal" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.winningBidOriginal" placeholder="请输入中标价(原始)" size="medium" />
<el-form-item label="中标价(美元)" prop="winningBidOriginal" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model.number="form.winningBidOriginal" type="number" placeholder="请输入中标价" @input="calculateWinningBid" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="汇率" prop="exchangeRate" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.exchangeRate" placeholder="请输入汇率" size="medium" />
<el-input v-model.number="form.exchangeRate" type="number" placeholder="请输入汇率" step="0.0001" @input="calculateWinningBid" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="币种" prop="currency" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.currency" placeholder="请输入币种" size="medium" />
<el-input v-model="form.currency" placeholder="请输入币种" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="所属主体" prop="subject" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.subject" placeholder="请输入所属主体" size="medium" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="中标价" prop="winningBid" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.winningBid" placeholder="请输入中标价" size="medium" />
<el-form-item label="中标价(人民币)" prop="winningBid" class="rounded-lg border border-gray-100 p-1 mb-5">
<!-- 人民币输入框添加readonly禁止手动修改 -->
<el-input v-model="form.winningBid" type="number" placeholder="根据美元中标价和汇率自动计算" readonly />
</el-form-item>
</el-col>
<!-- 其他表单项保持不变 -->
<el-col :span="12">
<el-form-item label="中标日期" prop="bidWinningDate" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-date-picker
@ -52,38 +42,45 @@
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
placeholder="请选择中标日期"
size="medium"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="投标保证金" prop="bidDeposit" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.bidDeposit" placeholder="请输入投标保证金" size="medium" />
<el-form-item label="投标保证金(人民币)" prop="bidDeposit" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.bidDeposit" type="number" placeholder="请输入投标保证金" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="是否退还" prop="whetherSendBack" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.whetherSendBack" placeholder="请输入是否退还(如:是/否)" size="medium" />
<el-radio-group v-model="form.whetherSendBack">
<el-radio label="是" border></el-radio>
<el-radio label="否" border></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="所属主体" prop="subject" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.subject" placeholder="请输入所属主体" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="建设单位" prop="construction" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.construction" placeholder="请输入建设单位" size="medium" />
<el-input v-model="form.construction" placeholder="请输入建设单位" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="总造价" prop="totalCost" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.totalCost" placeholder="请输入总造价" size="medium" />
<el-input v-model="form.totalCost" placeholder="请输入总造价" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="立项申请人" prop="projectApplicant" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.projectApplicant" placeholder="请输入立项申请人" size="medium" />
<el-input v-model="form.projectApplicant" placeholder="请输入立项申请人" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="立项部门" prop="projectApplicantDept" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.projectApplicantDept" placeholder="请输入立项部门" size="medium" />
<el-input v-model="form.projectApplicantDept" placeholder="请输入立项部门" />
</el-form-item>
</el-col>
<el-col :span="12">
@ -95,28 +92,21 @@
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"
placeholder="请选择立项申请日期"
size="medium"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="项目编号" prop="projectNumbering" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.projectNumbering" placeholder="请输入项目编号" size="medium" />
<el-input v-model="form.projectNumbering" placeholder="请输入项目编号" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="项目状态" prop="projectStatus" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.projectStatus" placeholder="请输入项目状态(如:进行中/已完成)" size="medium" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="流程状态" prop="processStatus" class="rounded-lg border border-gray-100 p-1 mb-5">
<el-input v-model="form.processStatus" placeholder="请输入流程状态(如:待审核/已通过)" size="medium" />
<el-input v-model="form.projectStatus" placeholder="请输入项目状态(如:进行中/已完成)" />
</el-form-item>
</el-col>
</el-row>
<!-- 操作按钮区域优化间距+圆角按钮 -->
<!-- 操作按钮区域 -->
<el-row class="mt-8">
<el-col :span="24" class="text-center">
<el-button
@ -124,12 +114,12 @@
type="primary"
@click="submitForm"
v-hasPermi="['bidding:listOfWinningBids:add', 'bidding:listOfWinningBids:edit']"
size="medium"
class="rounded-full px-8"
size="large"
>
确认提交
</el-button>
<el-button type="default" @click="resetForm" class="ml-6 rounded-full px-8" size="medium"> 重置 </el-button>
<el-button type="default" @click="resetForm" class="ml-6 rounded-full px-8" size="large"> 重置 </el-button>
</el-col>
</el-row>
</el-form>
@ -142,7 +132,7 @@ import { ref, reactive, toRefs, watch, onMounted, onUnmounted, getCurrentInstanc
import { addListOfWinningBids, updateListOfWinningBids, getListOfWinningBids } from '@/api/bidding/listOfWinningBids';
import { ListOfWinningBidsVO, ListOfWinningBidsForm } from '@/api/bidding/listOfWinningBids/types';
import { useUserStoreHook } from '@/store/modules/user';
import { ElFormInstance } from 'element-plus';
import { ElFormInstance, ElMessage } from 'element-plus';
// 获取组件实例
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@ -185,6 +175,10 @@ const data = reactive({
projectId: [{ required: true, message: '项目ID不能为空', trigger: 'blur' }],
projectName: [{ required: true, message: '请输入项目名称', trigger: 'blur' }],
winningBidOriginal: [{ required: true, message: '请输入原始中标价', trigger: 'blur' }],
exchangeRate: [
{ required: true, message: '请输入汇率', trigger: 'blur' },
{ type: 'number', min: 0.001, message: '汇率需大于0', trigger: 'blur' }
],
currency: [{ required: true, message: '请输入币种', trigger: 'blur' }],
subject: [{ required: true, message: '请输入所属主体', trigger: 'blur' }],
winningBid: [{ required: true, message: '请输入中标价', trigger: 'blur' }],
@ -196,6 +190,26 @@ const data = reactive({
// 解构响应式数据
const { form, rules } = toRefs(data);
/**
* 计算人民币中标价
* 显式触发的计算函数,确保执行时机可靠
*/
const calculateWinningBid = () => {
// 确保数据类型正确
const dollarAmount = Number(form.value.winningBidOriginal);
const rate = Number(form.value.exchangeRate);
// 验证输入有效性
if (isNaN(dollarAmount) || isNaN(rate) || dollarAmount <= 0 || rate <= 0) {
form.value.winningBid = undefined;
return;
}
// 计算并保留2位小数
const result = dollarAmount * rate;
form.value.winningBid = Number(result.toFixed(2));
};
/**
* 页面初始化 - 获取已有数据(如存在)
*/
@ -203,14 +217,15 @@ const initData = async () => {
try {
if (currentProject.value?.id) {
const res = await getListOfWinningBids(currentProject.value.id);
// 若存在数据则赋值到表单
console.log(res);
if (res.data && res.data.id) {
Object.assign(form.value, res.data);
// 初始化时手动触发一次计算
setTimeout(calculateWinningBid, 0);
}
}
} catch (error) {
console.error('初始化数据失败:', error);
ElMessage.error('初始化数据失败');
}
};
@ -222,19 +237,20 @@ const submitForm = () => {
if (valid) {
buttonLoading.value = true;
try {
// 补充项目ID从store获取
// 提交前确保计算正确
calculateWinningBid();
form.value.projectId = currentProject.value?.id;
// 区分新增/修改根据ID是否存在
if (form.value.id) {
await updateListOfWinningBids(form.value);
} else {
await addListOfWinningBids(form.value);
}
// 提示成功并重置表单
proxy?.$modal.msgSuccess('提交成功');
ElMessage.success('提交成功');
resetForm();
} catch (error) {
proxy?.$modal.msgError('提交失败,请重试');
ElMessage.error('提交失败,请重试');
console.error('提交表单失败:', error);
} finally {
buttonLoading.value = false;
@ -310,4 +326,10 @@ onUnmounted(() => {
.el-button:hover {
transform: translateY(-1px);
}
/* 只读输入框样式优化(区分可编辑状态) */
.el-input--readonly .el-input__wrapper {
background-color: #f9fafb;
cursor: not-allowed;
}
</style>