feat(crm): 添加邮寄申请表单优化功能

- 集成最优邮寄方案推荐功能,显示预估费用和匹配条件
- 添加自动填入邮寄费用按钮和查询条件显示
- 在附件上传区域添加图片上传提示信息
dev
Yangk 2 days ago
parent 303d435d07
commit 8920b73f71

@ -395,9 +395,6 @@ const isFormDisabled = computed(() => {
//
const computedRules = computed(() => {
const baseRules = { ...rules.value };
// tripType ( el-form-item )
// Element Plus Form Item v-if rules
//
return baseRules;
});
@ -420,9 +417,7 @@ const setDefaultCopyUsers = () => {
}
// ID
const copyIds = userList.value
.filter((u: any) => targetNames.includes(u.nickName))
.map((u: any) => String(u.userId));
const copyIds = userList.value.filter((u: any) => targetNames.includes(u.nickName)).map((u: any) => String(u.userId));
//
if (includeDeptLeader) {

@ -63,14 +63,7 @@
</el-col>
<el-col :span="12">
<el-form-item label="部门" prop="deptId">
<el-select
v-model="form.deptId"
placeholder="请选择部门"
filterable
clearable
:disabled="!isFormEditable"
style="width: 100%"
>
<el-select v-model="form.deptId" placeholder="请选择部门" filterable clearable :disabled="!isFormEditable" style="width: 100%">
<el-option v-for="item in deptList" :key="item.deptId" :label="item.deptName" :value="item.deptId" />
</el-select>
</el-form-item>
@ -122,9 +115,26 @@
<el-input v-model="form.expressNo" placeholder="请输入快递单号" :disabled="!isFormEditable" />
</el-form-item>
</el-col>
</el-row>
<el-col :span="24" v-if="form.mailingType === '1' && (bestSolutionLoading || bestSolution)">
<el-alert
v-loading="bestSolutionLoading"
:title="bestSolution ? `最优惠方案推荐:${bestSolution.solutionName} (预估费用:¥${bestSolution.price}` : '正在查询最优方案...'"
:type="bestSolution ? 'success' : 'info'"
:closable="false"
show-icon
style="margin-bottom: 20px"
>
<template #default v-if="bestSolution && isFormEditable">
<el-button type="primary" link size="small" @click="applyBestSolution"></el-button>
<span v-if="bestSolution.queryCond" style="margin-left: 10px; font-size: 12px; color: #909399">
(匹配条件: {{ bestSolution.queryCond }})
</span>
</template>
</el-alert>
</el-col>
</el-row>
<el-divider content-position="left">邮寄物品及事由</el-divider>
<el-divider content-position="left">邮寄物品及事由</el-divider>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="邮寄物品信息及申请事由" prop="itemInfo" label-width="180px">
@ -145,6 +155,7 @@
:disabled="!isFormEditable"
:isShowTip="true"
/>
<div style="color: #f56c6c; font-size: 12px; margin-top: 5px">提示请上传邮寄实物图片和快递单截图</div>
</el-form-item>
</el-col>
<el-col :span="12">
@ -266,6 +277,7 @@ import SubmitVerify from '@/components/Process/submitVerify.vue';
import ApprovalRecord from '@/components/Process/approvalRecord.vue';
import approvalButton from '@/components/Process/approvalButton.vue';
import { useUserStore } from '@/store/modules/user';
import { getBestSolution, CrmShippingTariffVO } from '@/api/oa/crm/shippingTariff';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { mailing_type, logistics_status, mailing_apply_status, wf_business_status } = toRefs<any>(
@ -303,6 +315,10 @@ const signTimeForm = reactive<{ signTime: string | undefined }>({ signTime: unde
// 使queryprojectInfo
const routeParams = ref<Record<string, any>>({});
//
const bestSolution = ref<CrmShippingTariffVO | null>(null);
const bestSolutionLoading = ref(false);
//
const taskVariables = ref<any>({});
@ -353,8 +369,9 @@ const data = reactive<{ form: CrmMailingApplyForm; rules: any }>({
mailingFee: [{ required: true, message: '邮寄费用不能为空', trigger: 'blur' }],
itemInfo: [{ required: true, message: '邮寄物品信息及申请事由不能为空', trigger: 'blur' }],
expressNo: [{ required: true, message: '快递单号不能为空', trigger: 'blur' }],
logisticsStatus: [{ required: true, message: '物流状态不能为空', trigger: 'change' }],
mailingTime: [{ required: true, message: '邮寄时间不能为空', trigger: 'change' }]
ossId: [{ required: true, message: '附件图片不能为空', trigger: 'blur' }]
// logisticsStatus: [{ required: true, message: '', trigger: 'change' }],
// mailingTime: [{ required: true, message: '', trigger: 'change' }]
}
});
@ -423,6 +440,35 @@ watch(
}
);
//
watch(
() => [form.value.province, form.value.weight, form.value.mailingType],
async ([province, weight, type]) => {
if (type === '1' && province && weight) {
bestSolutionLoading.value = true;
try {
const res = await getBestSolution(province as string, weight as number);
bestSolution.value = res.data;
} catch (e) {
bestSolution.value = null;
} finally {
bestSolutionLoading.value = false;
}
} else {
bestSolution.value = null;
}
},
{ immediate: true }
);
//
const applyBestSolution = () => {
if (bestSolution.value && bestSolution.value.price != null) {
form.value.mailingFee = bestSolution.value.price as any;
proxy?.$modal.msgSuccess('已应用最优惠资费方案!');
}
};
/** 经手人变更时自动填充姓名和部门 */
const onHandlerChange = (userId: number) => {
const user = userList.value.find((u) => u.userId === userId);

@ -77,6 +77,7 @@
:fileType="['jpg', 'jpeg', 'png', 'pdf', 'doc', 'docx', 'xls', 'xlsx']"
:isShowTip="true"
/>
<div style="color: #f56c6c; font-size: 12px; margin-top: 5px">提示请上传机票折扣信息页面截图</div>
</el-form-item>
</el-col>
<el-col :span="12">

Loading…
Cancel
Save