demo
/
zhiqi
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增步骤二

This commit is contained in:
JenniferW 2025-07-03 16:59:31 +08:00
parent 66b6e51050
commit 6940b2fa6a
1 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/views/order/intention/create.vue
View File

@ -9,11 +9,12 @@
</div> </div>
<el-steps :active="stepForStepsBar" finish-status="success" align-center> <el-steps :active="stepForStepsBar" finish-status="success" align-center>
<el-step title="选择客户信息" description="选择销售客户对象" /> <el-step title="选择客户信息" description="选择销售客户对象" />
<el-step title="选择商品规格" description="根据客户需求选择商品" /> <el-step title="选择商品" description="根据客户需求选择商品" />
<el-step title="选择商品规格" description="根据客户需求选择商品规格" />
<el-step <el-step
title="录入商务信息" title="录入商务信息"
description="根据客户要求录入商务信息" description="根据客户要求录入商务信息"
:status="step3Status" :status="step4Status"
/> />
<el-step <el-step
:title="selectedCarType === '其他' ? '完成意向单' : '完成订单'" :title="selectedCarType === '其他' ? '完成意向单' : '完成订单'"
@ -38,6 +39,7 @@ import Step1 from "./Step1.vue";
import Step2 from "./Step2.vue"; import Step2 from "./Step2.vue";
import Step3 from "./Step3.vue"; import Step3 from "./Step3.vue";
import Step4 from "./Step4.vue"; import Step4 from "./Step4.vue";
import Step5 from "./Step5.vue";
import { useRoute, useRouter } from "vue-router"; import { useRoute, useRouter } from "vue-router";
import { mockData } from "@/mockData"; import { mockData } from "@/mockData";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
@ -79,7 +81,7 @@ const currentPrice = ref(null);
// 是否应该显示价格 // 是否应该显示价格
const shouldShowPrice = computed(() => { const shouldShowPrice = computed(() => {
if (step.value !== 2) return false; if (step.value !== 3) return false;
if (form.value.selectedCarType === "其他") { if (form.value.selectedCarType === "其他") {
// 其他车型需要填写完所有信息 // 其他车型需要填写完所有信息
@ -166,23 +168,24 @@ const currentStepComponent = computed(() => {
if (step.value === 2) return Step2; if (step.value === 2) return Step2;
if (step.value === 3) return Step3; if (step.value === 3) return Step3;
if (step.value === 4) return Step4; if (step.value === 4) return Step4;
if (step.value === 5) return Step5;
return Step1; return Step1;
}); });
// 步骤条动态高亮/置灰 // 步骤条动态高亮/置灰
const stepForStepsBar = computed(() => { const stepForStepsBar = computed(() => {
// 车型为其他且在step2时，步骤条高亮到2，step4时高亮到4 // 车型为其他且在step2时，步骤条高亮到2，step5时高亮到5
if (selectedCarType.value === "其他") { if (selectedCarType.value === "其他") {
if (step.value === 2) return 2; if (step.value === 2) return 2;
if (step.value === 4) return 4; if (step.value === 5) return 5;
} }
return step.value; return step.value;
}); });
const step3Status = computed(() => { const step4Status = computed(() => {
// 车型为其他且在step2或step4时，步骤三置灰 // 车型为其他且在step2或step5时，步骤四置灰
if ( if (
selectedCarType.value === "其他" && selectedCarType.value === "其他" &&
(step.value === 2 || step.value === 4) (step.value === 3 || step.value === 5)
) { ) {
return "wait"; return "wait";
} }
@ -190,12 +193,12 @@ const step3Status = computed(() => {
}); });
function handleNextStep() { function handleNextStep() {
if (step.value === 4) { if (step.value === 5) {
// This is the final step, save the data // This is the final step, save the data
saveOrder(); saveOrder();
} else if (step.value === 2 && selectedCarType.value === "其他") { } else if (step.value === 3 && selectedCarType.value === "其他") {
step.value = 4; step.value = 5;
} else if (step.value < 4) { } else if (step.value < 5) {
step.value++; step.value++;
} }
} }
@ -205,10 +208,12 @@ function handlePrevStep() {
} else if (step.value === 3) { } else if (step.value === 3) {
step.value = 2; step.value = 2;
} else if (step.value === 4) { } else if (step.value === 4) {
step.value = 3;
} else if (step.value === 5) {
if (selectedCarType.value === "其他") { if (selectedCarType.value === "其他") {
step.value = 2;
} else {
step.value = 3; step.value = 3;
} else {
step.value = 4;
} }
} }
} }