Kaynağa Gözat

fix(ticket): 修复抵扣价格与售卖价格显示及验证逻辑错误

- 修正 detail.vue 中抵扣价格与售卖价格的数据绑定错误
- 调整 newVoucher.vue 和 newCoupon.vue 表单字段与验证规则匹配
- 添加初始化标志避免表单初始值触发验证
- 修复价格比较验证逻辑中的字段引用错误
- 在组件挂载后清除表单验证状态并重置初始化标志
congxuesong 4 ay önce
ebeveyn
işleme
b0f53f6383

+ 4 - 4
src/views/ticketManagement/detail.vue

@@ -22,14 +22,14 @@
           <div class="detail-item">
             <div class="detail-label">抵扣价格</div>
             <div class="detail-value">
-              {{ formatCurrency(voucherModel.offprice, 2, "¥") || "--" }}
+              {{ formatCurrency(voucherModel.price, 2, "¥") || "--" }}
             </div>
           </div>
           <!-- 售卖价格 -->
           <div class="detail-item">
             <div class="detail-label">售卖价格</div>
             <div class="detail-value">
-              {{ formatCurrency(voucherModel.price, 2, "¥") || "--" }}
+              {{ formatCurrency(voucherModel.offprice, 2, "¥") || "--" }}
             </div>
           </div>
           <!-- 开始售卖时间 -->
@@ -142,9 +142,9 @@ const voucherModel = ref<any>({
   // 代金券名称
   name: "",
   // 抵扣价格
-  offprice: "",
-  // 售卖价格
   price: "",
+  // 售卖价格
+  offprice: "",
   // 开始售卖时间
   startDate: "",
   // 结束售卖时间

+ 10 - 0
src/views/ticketManagement/newCoupon.vue

@@ -232,6 +232,9 @@ const couponModel = ref<any>({
 
 // ==================== 监听器 ====================
 
+// 初始化标志,用于防止初始化时触发验证
+const isInitializing = ref(true);
+
 /**
  * 监听开始领取时间变化
  * 当开始时间改变时,重新验证结束时间
@@ -239,6 +242,7 @@ const couponModel = ref<any>({
 watch(
   () => couponModel.value.beginGetDate,
   () => {
+    if (isInitializing.value) return;
     if (couponModel.value.endGetDate) {
       nextTick(() => {
         ruleFormRef.value?.validateField("endGetDate");
@@ -254,6 +258,7 @@ watch(
 watch(
   () => couponModel.value.endGetDate,
   () => {
+    if (isInitializing.value) return;
     if (couponModel.value.beginGetDate) {
       nextTick(() => {
         ruleFormRef.value?.validateField("beginGetDate");
@@ -269,6 +274,7 @@ watch(
 watch(
   () => couponModel.value.hasMinimumSpend,
   newVal => {
+    if (isInitializing.value) return;
     if (newVal === 0) {
       couponModel.value.minimumSpendingAmount = "";
       nextTick(() => {
@@ -290,6 +296,10 @@ onMounted(async () => {
     let res: any = await getCouponDetail({ counponId: id.value });
     couponModel.value = { ...couponModel.value, ...res.data };
   }
+
+  await nextTick();
+  ruleFormRef.value?.clearValidate();
+  isInitializing.value = false;
 });
 /**
  * 返回上一页

+ 28 - 16
src/views/ticketManagement/newVoucher.vue

@@ -17,12 +17,12 @@
               <el-input maxlength="20" v-model="voucherModel.name" placeholder="请输入" clearable />
             </el-form-item>
             <!-- 抵扣价格 -->
-            <el-form-item label="抵扣价格(¥)" prop="offprice">
-              <el-input v-model="voucherModel.offprice" maxlength="15" placeholder="请输入" clearable />
+            <el-form-item label="抵扣价格(¥)" prop="price">
+              <el-input v-model="voucherModel.price" maxlength="15" placeholder="请输入" clearable />
             </el-form-item>
             <!-- 售卖价格 -->
-            <el-form-item label="售卖价格(¥)" prop="price">
-              <el-input v-model="voucherModel.price" maxlength="15" placeholder="请输入" clearable />
+            <el-form-item label="售卖价格(¥)" prop="offprice">
+              <el-input v-model="voucherModel.offprice" maxlength="15" placeholder="请输入" clearable />
             </el-form-item>
             <!-- 开始售卖时间 -->
             <el-form-item label="开始售卖时间" prop="startDate">
@@ -269,7 +269,7 @@ const id = ref<string>(""); // 页面ID参数
 // ==================== 表单验证规则 ====================
 const rules = reactive({
   name: [{ required: true, message: "请输入代金券名称" }],
-  offprice: [
+  price: [
     { required: true, message: "请输入抵扣价格" },
     {
       validator: validatePositiveNumber("抵扣价格必须为正数"),
@@ -281,14 +281,14 @@ const rules = reactive({
     },
     {
       validator: validatePriceComparison(
-        () => voucherModel.value.offprice,
         () => voucherModel.value.price,
+        () => voucherModel.value.offprice,
         "抵扣价格不能低于售卖价格"
       ),
       trigger: "blur"
     }
   ],
-  price: [
+  offprice: [
     { required: true, message: "请输入售卖价格" },
     {
       validator: validatePositiveNumber("售卖价格必须为正数"),
@@ -300,8 +300,8 @@ const rules = reactive({
     },
     {
       validator: validatePriceComparison(
-        () => voucherModel.value.offprice,
         () => voucherModel.value.price,
+        () => voucherModel.value.offprice,
         "抵扣价格不能低于售卖价格"
       ),
       trigger: "blur"
@@ -587,9 +587,9 @@ const voucherModel = ref<any>({
   // 代金券名称
   name: "",
   // 抵扣价格
-  offprice: "",
-  // 售卖价格
   price: "",
+  // 售卖价格
+  offprice: "",
   // 开始售卖时间
   startDate: "",
   // 结束售卖时间
@@ -673,6 +673,9 @@ const holidayList: any = ref([]);
 
 // ==================== 监听器 ====================
 
+// 初始化标志,用于防止初始化时触发验证
+const isInitializing = ref(true);
+
 /**
  * 监听开始售卖时间变化
  * 当开始时间改变时,重新验证结束时间
@@ -680,6 +683,7 @@ const holidayList: any = ref([]);
 watch(
   () => voucherModel.value.startDate,
   () => {
+    if (isInitializing.value) return;
     if (voucherModel.value.endDate) {
       nextTick(() => {
         ruleFormRef.value?.validateField("endDate");
@@ -695,6 +699,7 @@ watch(
 watch(
   () => voucherModel.value.endDate,
   () => {
+    if (isInitializing.value) return;
     if (voucherModel.value.startDate) {
       nextTick(() => {
         ruleFormRef.value?.validateField("startDate");
@@ -708,11 +713,12 @@ watch(
  * 当抵扣价格改变时,重新验证售卖价格
  */
 watch(
-  () => voucherModel.value.offprice,
+  () => voucherModel.value.price,
   () => {
-    if (voucherModel.value.price) {
+    if (isInitializing.value) return;
+    if (voucherModel.value.offprice) {
       nextTick(() => {
-        ruleFormRef.value?.validateField("price");
+        ruleFormRef.value?.validateField("offprice");
       });
     }
   }
@@ -723,11 +729,12 @@ watch(
  * 当售卖价格改变时,重新验证抵扣价格
  */
 watch(
-  () => voucherModel.value.price,
+  () => voucherModel.value.offprice,
   () => {
-    if (voucherModel.value.offprice) {
+    if (isInitializing.value) return;
+    if (voucherModel.value.price) {
       nextTick(() => {
-        ruleFormRef.value?.validateField("offprice");
+        ruleFormRef.value?.validateField("price");
       });
     }
   }
@@ -740,6 +747,7 @@ watch(
 watch(
   () => voucherModel.value.singleQty,
   () => {
+    if (isInitializing.value) return;
     if (voucherModel.value.singleCanUse) {
       nextTick(() => {
         ruleFormRef.value?.validateField("singleCanUse");
@@ -850,6 +858,10 @@ onMounted(async () => {
     }
     console.log(voucherModel.value);
   }
+
+  await nextTick();
+  ruleFormRef.value?.clearValidate();
+  isInitializing.value = false;
 });
 
 // ==================== 事件处理函数 ====================