【代码优化】】商城: 完善代码评审提到的问题

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

@@ -25,12 +25,13 @@
               订单金额优惠
               <el-form-item>
                 减
-                <!-- TODO @puhui999：需要考虑 100 换算哈 -->
-                <el-input
+                <el-input-number
                   v-model="rule.discountPrice"
+                  :min="0"
+                  :precision="2"
+                  :step="0.1"
                   class="w-150px! p-x-20px!"
-                  placeholder=""
-                  type="number"
+                  controls-position="right"
                 />
                 元
               </el-form-item>
@@ -71,9 +72,9 @@
                 inactive-text="否"
                 inline-prompt
               />
-              <RewardRuleCouponShowcase
+              <RewardRuleCouponSelect
                 v-if="rule.giveCoupon"
-                ref="rewardRuleCouponShowcaseRef"
+                ref="rewardRuleCouponSelectRef"
                 v-model="rule!"
               />
             </el-col>
@@ -88,12 +89,14 @@
 </template>
 
 <script lang="ts" setup>
-import RewardRuleCouponShowcase from './RewardRuleCouponShowcase.vue'
+import RewardRuleCouponSelect from './RewardRuleCouponSelect.vue'
 import { RewardActivityVO } from '@/api/mall/promotion/reward/rewardActivity'
 import { PromotionConditionTypeEnum } from '@/utils/constants'
 import { useVModel } from '@vueuse/core'
 import { isEmpty } from '@/utils/is'
 
+defineOptions({ name: 'RewardRule' })
+
 const props = defineProps<{
   modelValue: RewardActivityVO
 }>()
@@ -104,7 +107,7 @@ const emits = defineEmits<{
 }>()
 
 const formData = useVModel(props, 'modelValue', emits) // 活动数据
-const rewardRuleCouponShowcaseRef = ref<InstanceType<typeof RewardRuleCouponShowcase>[]>() // 活动规则优惠券 Ref
+const rewardRuleCouponSelectRef = ref<InstanceType<typeof RewardRuleCouponSelect>[]>() // 活动规则优惠券 Ref
 
 /** 删除优惠规则 */
 const deleteRule = (ruleIndex: number) => {
@@ -127,14 +130,20 @@ const addRule = () => {
 
 /** 设置规则优惠券-提交时 */
 const setRuleCoupon = () => {
-  if (isEmpty(rewardRuleCouponShowcaseRef.value)) {
+  if (isEmpty(rewardRuleCouponSelectRef.value)) {
     return
   }
 
-  rewardRuleCouponShowcaseRef.value?.forEach((item) => item.setGiveCouponList())
+  // 情况一：不赠送优惠券
+  formData.value.rules.forEach((rule) => {
+    if (!rule.giveCoupon) {
+      rule.couponIds = []
+      rule.couponCounts = []
+    }
+  })
+  // 情况二：赠送优惠券
+  rewardRuleCouponSelectRef.value?.forEach((item) => item.setGiveCouponList())
 }
 
 defineExpose({ setRuleCoupon })
 </script>
-
-<style lang="scss" scoped></style>

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

@@ -40,7 +40,7 @@ import { isEmpty } from '@/utils/is'
 import { useVModel } from '@vueuse/core'
 import { findIndex } from '@/utils'
 
-// TODO @puhui999：要不就叫 RewardRuleCouponSelect
+defineOptions({ name: 'RewardRuleCouponSelect' })
 
 const props = defineProps<{
   modelValue: RewardRule
@@ -89,15 +89,13 @@ const initGiveCouponList = async () => {
   if (!data) {
     return
   }
-
-  for (let i = 0; i < data.length; i++) {
-    const coupon = data[i]
-    const index = findIndex(rewardRule.value.couponIds!, (item) => item.id === coupon.id)
+  data.forEach((coupon) => {
+    const index = findIndex(rewardRule.value.couponIds!, (couponId) => couponId === coupon.id)
     list.value.push({
       ...coupon,
       giveCount: rewardRule.value.couponCounts![index]
     })
-  }
+  })
 }
 
 /** 设置赠送的优惠券 */
@@ -106,15 +104,8 @@ const setGiveCouponList = () => {
     return
   }
 
-  const couponIds: number[] = []
-  const couponCounts: number[] = []
-  for (let i = 0, len = list.value.length; i < len; i++) {
-    couponIds.push(list.value[i].id)
-    couponCounts.push(list.value[i].giveCount!)
-  }
-  // TODO @puhui999：可以考虑，直接使用 list 的 map 操作，简单一些。性能没啥差别的
-  rewardRule.value.couponIds = couponIds
-  rewardRule.value.couponCounts = couponCounts
+  rewardRule.value.couponIds = list.value.map((rule) => rule.id)
+  rewardRule.value.couponCounts = list.value.map((rule) => rule.giveCount || 0)
 }
 defineExpose({ setGiveCouponList })