【代码优化】】商城: 满减送活动

src/api/mall/promotion/reward/rewardActivity.ts

@@ -21,11 +21,10 @@ export interface RewardRule {
   limit?: number
   discountPrice?: number
   freeDelivery?: boolean
-  givePoint?: boolean
+  point: number
-  point?: number
+  giveCoupons?: {
-  giveCoupon?: boolean
+    [key: number]: number
-  couponIds?: number[]
+  }
-  couponCounts?: number[]
 }
 
 // 新增满减送活动

src/views/mall/promotion/coupon/components/CouponSelect.vue

@@ -33,32 +33,6 @@
             />
           </el-select>
         </el-form-item>
-        <el-form-item label="优惠券状态" prop="status">
-          <el-select
-            v-model="queryParams.status"
-            class="!w-240px"
-            clearable
-            placeholder="请选择优惠券状态"
-          >
-            <el-option
-              v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
-              :key="dict.value"
-              :label="dict.label"
-              :value="dict.value"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="创建时间" prop="createTime">
-          <el-date-picker
-            v-model="queryParams.createTime"
-            :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
-            class="!w-240px"
-            end-placeholder="结束日期"
-            start-placeholder="开始日期"
-            type="daterange"
-            value-format="YYYY-MM-DD HH:mm:ss"
-          />
-        </el-form-item>
         <el-form-item>
           <el-button @click="handleQuery">
             <Icon class="mr-5px" icon="ep:search" />
@@ -118,13 +92,6 @@
             <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
           </template>
         </el-table-column>
-        <el-table-column
-          :formatter="dateFormatter"
-          align="center"
-          label="创建时间"
-          prop="createTime"
-          width="180"
-        />
       </el-table>
       <!-- 分页 -->
       <Pagination
@@ -148,13 +115,13 @@ import {
   takeLimitCountFormat,
   validityTypeFormat
 } from '@/views/mall/promotion/coupon/formatter'
-import { dateFormatter } from '@/utils/formatTime'
 import * as CouponTemplateApi from '@/api/mall/promotion/coupon/couponTemplate'
 
 defineOptions({ name: 'CouponSelect' })
 
 const props = defineProps<{
   multipleSelection?: CouponTemplateApi.CouponTemplateVO[]
+  takeType: number // 领取方式
 }>()
 const emit = defineEmits<{
   (e: 'update:multipleSelection', v: CouponTemplateApi.CouponTemplateVO[]): void
@@ -170,10 +137,8 @@ const queryParams = reactive({
   pageNo: 1,
   pageSize: 10,
   name: null,
-  status: null,
   discountType: null,
-  type: null,
+  canTakeTypes: null
-  createTime: []
 })
 const queryFormRef = ref() // 搜索的表单
 const selectedCouponList = ref<CouponTemplateApi.CouponTemplateVO[]>([]) // 选择的数据
@@ -183,6 +148,7 @@ const getList = async () => {
   loading.value = true
   try {
     // 执行查询
+    queryParams.canTakeTypes = [props.takeType] as any
     const data = await CouponTemplateApi.getCouponTemplatePage(queryParams)
     list.value = data.list
     total.value = data.total

src/views/mall/promotion/rewardActivity/RewardForm.vue

@@ -17,6 +17,7 @@
           :start-placeholder="t('common.startTimeText')"
           range-separator="-"
           type="datetimerange"
+          value-format="x"
         />
       </el-form-item>
       <el-form-item label="条件类型" prop="conditionType">
@@ -146,6 +147,7 @@ const submitForm = async () => {
     // 时间段转换
     data.startTime = data.startAndEndTime![0]
     data.endTime = data.startAndEndTime![1]
+    delete data.startAndEndTime
     // 规则元转分
     data.rules.forEach((item) => {
       item.discountPrice = yuanToFen(item.discountPrice || 0)

src/views/mall/promotion/rewardActivity/components/RewardRule.vue

@@ -47,13 +47,7 @@
             </el-col>
             <el-col :span="24">
               <span>送积分：</span>
-              <el-switch
+              <el-form-item>
-                v-model="rule.givePoint"
-                active-text="是"
-                inactive-text="否"
-                inline-prompt
-              />
-              <el-form-item v-if="rule.givePoint">
                 送
                 <el-input
                   v-model="rule.point"
@@ -64,19 +58,12 @@
                 积分
               </el-form-item>
             </el-col>
+            <el-col :span="24">
+              <el-tag type="warning"> 当赠送积分为 0 时，表示不赠送积分</el-tag>
+            </el-col>
             <el-col :span="24">
               <span>送优惠券：</span>
-              <el-switch
+              <RewardRuleCouponSelect ref="rewardRuleCouponSelectRef" v-model="rule!" />
-                v-model="rule.giveCoupon"
-                active-text="是"
-                inactive-text="否"
-                inline-prompt
-              />
-              <RewardRuleCouponSelect
-                v-if="rule.giveCoupon"
-                ref="rewardRuleCouponSelectRef"
-                v-model="rule!"
-              />
             </el-col>
           </el-form-item>
         </el-form>
@@ -120,11 +107,7 @@ const addRule = () => {
     limit: 0,
     discountPrice: 0,
     freeDelivery: false,
-    givePoint: false,
+    point: 0
-    point: 0,
-    giveCoupon: false,
-    couponIds: [],
-    couponCounts: []
   })
 }
 
@@ -134,14 +117,6 @@ const setRuleCoupon = () => {
     return
   }
 
-  // 情况一：不赠送优惠券
-  formData.value.rules.forEach((rule) => {
-    if (!rule.giveCoupon) {
-      rule.couponIds = []
-      rule.couponCounts = []
-    }
-  })
-  // 情况二：赠送优惠券
   rewardRuleCouponSelectRef.value?.forEach((item) => item.setGiveCouponList())
 }
 

src/views/mall/promotion/rewardActivity/components/RewardRuleCouponSelect.vue

@@ -1,6 +1,8 @@
 <template>
   <el-button class="ml-10px" type="text" @click="selectCoupon">添加优惠卷</el-button>
-
+  <el-col :span="24">
+    <el-tag type="warning"> 当没有选择优惠券时，表示不赠送优惠券</el-tag>
+  </el-col>
   <div
     v-for="(item, index) in list"
     :key="item.id"
@@ -27,7 +29,11 @@
   </div>
 
   <!-- 优惠券选择 -->
-  <CouponSelect ref="couponSelectRef" @change="handleCouponChange" />
+  <CouponSelect
+    ref="couponSelectRef"
+    :take-type="CouponTemplateTakeTypeEnum.ADMIN.type"
+    @change="handleCouponChange"
+  />
 </template>
 
 <script lang="ts" setup>
@@ -35,10 +41,10 @@ import { CouponSelect } from '@/views/mall/promotion/coupon/components'
 import * as CouponTemplateApi from '@/api/mall/promotion/coupon/couponTemplate'
 import { RewardRule } from '@/api/mall/promotion/reward/rewardActivity'
 import { DICT_TYPE } from '@/utils/dict'
+import { CouponTemplateTakeTypeEnum } from '@/utils/constants'
 import { discountFormat } from '@/views/mall/promotion/coupon/formatter'
 import { isEmpty } from '@/utils/is'
 import { useVModel } from '@vueuse/core'
-import { findIndex } from '@/utils'
 
 defineOptions({ name: 'RewardRuleCouponSelect' })
 
@@ -81,19 +87,20 @@ const deleteCoupon = (index: number) => {
 
 /** 初始化赠送的优惠券列表 */
 const initGiveCouponList = async () => {
-  // 朝赵优惠劵
+  // 校验优惠券存在
-  if (isEmpty(rewardRule.value) || isEmpty(rewardRule.value.couponIds)) {
+  if (isEmpty(rewardRule.value) || isEmpty(rewardRule.value.giveCoupons)) {
     return
   }
-  const data = await CouponTemplateApi.getCouponTemplateList(rewardRule.value.couponIds!)
+  const tempLateIds = Object.keys(rewardRule.value.giveCoupons!).map((item) => parseInt(item))
+  const data = await CouponTemplateApi.getCouponTemplateList(tempLateIds)
   if (!data) {
     return
   }
+  // 回显
   data.forEach((coupon) => {
-    const index = findIndex(rewardRule.value.couponIds!, (couponId) => couponId === coupon.id)
     list.value.push({
       ...coupon,
-      giveCount: rewardRule.value.couponCounts![index]
+      giveCount: rewardRule.value.giveCoupons![coupon.id]
     })
   })
 }
@@ -104,8 +111,13 @@ const setGiveCouponList = () => {
     return
   }
 
-  rewardRule.value.couponIds = list.value.map((rule) => rule.id)
+  // 设置优惠券和其数量的对应
-  rewardRule.value.couponCounts = list.value.map((rule) => rule.giveCount || 0)
+  list.value.forEach((rule) => {
+    if (!rewardRule.value.giveCoupons) {
+      rewardRule.value.giveCoupons = {}
+    }
+    rewardRule.value.giveCoupons[rule.id] = rule.giveCount!
+  })
 }
 defineExpose({ setGiveCouponList })