code review：订单列表、订单详情

src/api/mall/promotion/bargain/bargainActivity.ts

@@ -20,7 +20,7 @@ export interface BargainActivityVO {
   successCount?: number // 砍价成功数量
 }
 
-// 砍价活动所需属性。 选择的商品和属性的时候使用方便使用活动的通用封装
+// 砍价活动所需属性。选择的商品和属性的时候使用方便使用活动的通用封装
 export interface BargainProductVO {
   spuId: number
   skuId: number

src/utils/dict.ts

@@ -90,6 +90,7 @@ export enum DICT_TYPE {
   USER_TYPE = 'user_type',
   COMMON_STATUS = 'common_status',
   SYSTEM_TENANT_PACKAGE_ID = 'system_tenant_package_id',
+  TERMINAL = 'terminal', // 终端
 
   // ========== SYSTEM 模块 ==========
   SYSTEM_USER_SEX = 'system_user_sex',
@@ -130,7 +131,7 @@ export enum DICT_TYPE {
   BPM_OA_LEAVE_TYPE = 'bpm_oa_leave_type',
 
   // ========== PAY 模块 ==========
-  PAY_CHANNEL_CODE_TYPE = 'pay_channel_code_type', // 支付渠道编码类型
+  PAY_CHANNEL_CODE = 'pay_channel_code', // 支付渠道编码类型
   PAY_ORDER_STATUS = 'pay_order_status', // 商户支付订单状态
   PAY_REFUND_STATUS = 'pay_refund_status', // 退款订单状态
   PAY_NOTIFY_STATUS = 'pay_notify_status', // 商户支付回调状态
@@ -155,7 +156,7 @@ export enum DICT_TYPE {
   TRADE_ORDER_TYPE = 'trade_order_type', // 订单 - 类型
   TRADE_ORDER_STATUS = 'trade_order_status', // 订单 - 状态
   TRADE_ORDER_ITEM_AFTER_SALE_STATUS = 'trade_order_item_after_sale_status', // 订单项 - 售后状态
-  TERMINAL = 'terminal', // 终端
+  TRADE_DELIVERY_TYPE = 'trade_delivery_type', // 配送方式
 
   // ========== MALL - 营销模块 ==========
   PROMOTION_DISCOUNT_TYPE = 'promotion_discount_type', // 优惠类型
@@ -164,8 +165,5 @@ export enum DICT_TYPE {
   PROMOTION_COUPON_STATUS = 'promotion_coupon_status', // 优惠劵的状态
   PROMOTION_COUPON_TAKE_TYPE = 'promotion_coupon_take_type', // 优惠劵的领取方式
   PROMOTION_ACTIVITY_STATUS = 'promotion_activity_status', // 优惠活动的状态
-  PROMOTION_CONDITION_TYPE = 'promotion_condition_type', // 营销的条件类型枚举
+  PROMOTION_CONDITION_TYPE = 'promotion_condition_type' // 营销的条件类型枚举
-
-  // ========== MALL - 物流模块 ==========
-  DELIVERY_TYPE = 'delivery_type' // 配送方式
 }

src/views/mall/promotion/bargain/activity/BargainActivityForm.vue

@@ -83,17 +83,17 @@ const ruleConfig: RuleConfig[] = [
   {
     name: 'productConfig.bargainFirstPrice',
     rule: (arg) => arg > 0,
-    message: '商品砍价起始价格不能小于0 ！！！'
+    message: '商品砍价起始价格不能小于 0 ！！！'
   },
   {
     name: 'productConfig.bargainPrice',
     rule: (arg) => arg >= 0,
-    message: '商品砍价底价不能小于0 ！！！'
+    message: '商品砍价底价不能小于 0 ！！！'
   },
   {
     name: 'productConfig.stock',
     rule: (arg) => arg >= 1,
-    message: '商品活动库存不能小于1 ！！！'
+    message: '商品活动库存不能小于 1 ！！！'
   }
 ]
 const selectSpu = (spuId: number, skuIds: number[]) => {

src/views/mall/trade/order/components/DeliveryOrderForm.vue

@@ -33,6 +33,7 @@
 import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
 import * as TradeOrderApi from '@/api/mall/trade/order'
 
+// TODO @puhui999：是不是名字叫 OrderDeliveryForm 保持统一
 defineOptions({ name: 'DeliveryOrderForm' })
 
 const { t } = useI18n() // 国际化
@@ -40,7 +41,7 @@ const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
-const radio = ref('1')
+const radio = ref('1') // TODO @puhui999：尽量不用 radio 这种命名，无业务含义。这里的话，可以考虑用 expressType，如果值是 express，则是快递；none 则是无；未来做同城配送，就比较容易拓展啦；
 const formData = ref<TradeOrderApi.DeliveryVO>({
   id: 0, // 订单编号
   logisticsId: null, // 物流公司编号
@@ -48,6 +49,7 @@ const formData = ref<TradeOrderApi.DeliveryVO>({
 })
 const formRef = ref() // 表单 Ref
 
+// TODO @puhui999：每次点击发货的时候，是不是可以把之前的信息带过来哈。
 /** 打开弹窗 */
 const open = async (orderId: number) => {
   resetForm()
@@ -65,6 +67,7 @@ const submitForm = async () => {
   try {
     const data = unref(formData)
     if (radio.value === '2') {
+      // 无需发货的情况
       data.logisticsId = 0
       data.logisticsNo = ''
     }

src/views/mall/trade/order/components/OrderAdjustAddressForm.vue

@@ -7,6 +7,7 @@
       <el-form-item label="收件人手机">
         <el-input v-model="formData.receiverMobile" />
       </el-form-item>
+      <!-- TODO @puhui999：应该是个地区下拉框，可以看下 UserForm 所在地 -->
       <el-form-item label="收件人地区编号">
         <el-input v-model="formData.receiverAreaId" />
       </el-form-item>
@@ -24,6 +25,7 @@
 import * as TradeOrderApi from '@/api/mall/trade/order'
 import { copyValueToTarget } from '@/utils'
 
+// TODO @puhui999：OrderAdjustAddressForm 改成 OrderUpdateAddressForm 更新哈，保持统一；
 defineOptions({ name: 'OrderAdjustAddressForm' })
 
 const { t } = useI18n() // 国际化

src/views/mall/trade/order/components/OrderAdjustPriceForm.vue

@@ -23,6 +23,7 @@ import * as TradeOrderApi from '@/api/mall/trade/order'
 import { convertToInteger, formatToFraction } from '@/utils'
 import { cloneDeep } from 'lodash-es'
 
+// TODO @puhui999：OrderAdjustPriceForm 改成 OrderUpdatePriceForm 更新哈，保持统一；
 defineOptions({ name: 'OrderAdjustPriceForm' })
 
 const { t } = useI18n() // 国际化

src/views/mall/trade/order/components/OrderDetailForm.vue

@@ -4,7 +4,7 @@
     <el-descriptions title="订单信息">
       <el-descriptions-item label="订单号: ">{{ orderInfo.no }}</el-descriptions-item>
       <el-descriptions-item label="配送方式: ">
-        <dict-tag :type="DICT_TYPE.DELIVERY_TYPE" :value="orderInfo.deliveryType" />
+        <dict-tag :type="DICT_TYPE.TRADE_DELIVERY_TYPE" :value="orderInfo.deliveryType" />
       </el-descriptions-item>
       <!-- TODO 营销活动待实现     -->
       <el-descriptions-item label="营销活动: ">秒杀活动</el-descriptions-item>
@@ -20,7 +20,7 @@
       <el-descriptions-item label="商家备注: ">{{ orderInfo.remark }}</el-descriptions-item>
       <el-descriptions-item label="支付单号: ">{{ orderInfo.payOrderId }}</el-descriptions-item>
       <el-descriptions-item label="付款方式: ">
-        <dict-tag :type="DICT_TYPE.PAY_CHANNEL_CODE_TYPE" :value="orderInfo.payChannelCode" />
+        <dict-tag :type="DICT_TYPE.PAY_CHANNEL_CODE" :value="orderInfo.payChannelCode" />
       </el-descriptions-item>
       <!-- <el-descriptions-item label="买家: ">{{ orderInfo.user.nickname }}</el-descriptions-item> -->
       <!-- TODO 芋艿：待实现：跳转会员 -->
@@ -41,14 +41,10 @@
         <dict-tag :type="DICT_TYPE.TRADE_ORDER_STATUS" :value="orderInfo.status" />
       </el-descriptions-item>
       <el-descriptions-item label-class-name="no-colon">
-        <el-button size="small" type="primary" @click="openForm('adjustPrice')">调整价格</el-button>
+        <el-button type="primary" @click="openForm('adjustPrice')">调整价格</el-button>
-        <el-button size="small" type="primary" @click="openForm('remark')">备注</el-button>
+        <el-button type="primary" @click="openForm('remark')">备注</el-button>
-        <el-button size="small" type="primary" @click="openForm('delivery')">发货</el-button>
+        <el-button type="primary" @click="openForm('delivery')">发货</el-button>
-        <el-button size="small" type="primary" @click="openForm('adjustAddress')">
+        <el-button type="primary" @click="openForm('adjustAddress')">修改地址</el-button>
-          修改地址
-        </el-button>
-        <!-- TODO 后台商家也需要收货功能吗？ -->
-        <el-button size="small" type="primary">确认收货</el-button>
       </el-descriptions-item>
       <el-descriptions-item>
         <template #label><span style="color: red">提醒: </span></template>
@@ -201,6 +197,8 @@
       </el-descriptions>
     </div>
   </ContentWrap>
+
+  <!-- 各种操作的弹窗 -->
   <DeliveryOrderForm ref="deliveryFormRef" @success="getDetail" />
   <OrderRemarksForm ref="remarksFormRef" @success="getDetail" />
   <OrderAdjustAddressForm ref="adjustAddressFormRef" @success="getDetail" />
@@ -215,10 +213,12 @@ import DeliveryOrderForm from '@/views/mall/trade/order/components/DeliveryOrder
 import OrderAdjustAddressForm from '@/views/mall/trade/order/components/OrderAdjustAddressForm.vue'
 import OrderAdjustPriceForm from '@/views/mall/trade/order/components/OrderAdjustPriceForm.vue'
 
+// TODO @puhui999：TradeOrderDetailForm 可以挪到 order/detail/index.vue 中，它是一个 vue 界面哈。
 defineOptions({ name: 'TradeOrderDetailForm' })
 
 const message = useMessage() // 消息弹窗
 const { params } = useRoute() // 查询参数
+// TODO @puhui999：orderInfo 应该不用把属性弄出来也；
 const orderInfo = ref<TradeOrderApi.OrderVO>({
   no: '',
   createTime: null,
@@ -263,6 +263,7 @@ const orderInfo = ref<TradeOrderApi.OrderVO>({
   user: {}
 })
 
+// TODO @puhui999：这个改成直接读属性，不用按照这种写法；
 const detailGroups = ref([
   {
     title: '物流信息',
@@ -281,6 +282,7 @@ const detailGroups = ref([
   }
 ])
 
+// TODO @puhui999：从后台读数据哈。
 const detailInfo = ref({
   // 物流信息
   expressInfo: {

src/views/mall/trade/order/components/OrderRemarksForm.vue

@@ -14,6 +14,7 @@
 <script lang="ts" setup>
 import * as TradeOrderApi from '@/api/mall/trade/order'
 
+// TODO @puhui999：OrderRemarksForm 改成 OrderUpdateRemarkForm 更新哈，保持统一；
 defineOptions({ name: 'OrderRemarksForm' })
 
 const { t } = useI18n() // 国际化

src/views/mall/trade/order/index.vue

@@ -11,8 +11,8 @@
       <el-form-item label="订单状态" prop="status">
         <el-select v-model="queryParams.status" class="!w-280px" clearable placeholder="全部">
           <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.TRADE_ORDER_STATUS)"
+            v-for="dict in getIntDictOptions(DICT_TYPE.TRADE_ORDER_STATUS)"
-            :key="dict.value as string"
+            :key="dict.value"
             :label="dict.label"
             :value="dict.value"
           />
@@ -26,8 +26,8 @@
           placeholder="全部"
         >
           <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PAY_CHANNEL_CODE_TYPE)"
+            v-for="dict in getStrDictOptions(DICT_TYPE.PAY_CHANNEL_CODE)"
-            :key="dict.value as string"
+            :key="dict.value"
             :label="dict.label"
             :value="dict.value"
           />
@@ -47,8 +47,8 @@
       <el-form-item label="订单来源" prop="terminal">
         <el-select v-model="queryParams.terminal" class="!w-280px" clearable placeholder="全部">
           <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.TERMINAL)"
+            v-for="dict in getIntDictOptions(DICT_TYPE.TERMINAL)"
-            :key="dict.value as string"
+            :key="dict.value"
             :label="dict.label"
             :value="dict.value"
           />
@@ -57,8 +57,8 @@
       <el-form-item label="订单类型" prop="type">
         <el-select v-model="queryParams.type" class="!w-280px" clearable placeholder="全部">
           <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.TRADE_ORDER_TYPE)"
+            v-for="dict in getIntDictOptions(DICT_TYPE.TRADE_ORDER_TYPE)"
-            :key="dict.value as string"
+            :key="dict.value"
             :label="dict.label"
             :value="dict.value"
           />
@@ -68,7 +68,7 @@
         <el-select v-model="queryParams.logisticsId" class="!w-280px" clearable placeholder="全部">
           <el-option
             v-for="item in deliveryExpressList"
-            :key="item.id as string"
+            :key="item.id"
             :label="item.name"
             :value="item.id"
           />
@@ -84,13 +84,13 @@
         >
           <el-option
             v-for="item in pickUpStoreList"
-            :key="item.id as string"
+            :key="item.id"
             :label="item.name"
             :value="item.id"
           />
         </el-select>
       </el-form-item>
-      <!-- TODO 考虑是否移除或重构-->
+      <!-- TODO 考虑是否移除或重构；这个还是需要的哈-->
       <el-form-item label="聚合搜索">
         <el-input
           v-show="true"
@@ -100,7 +100,7 @@
           placeholder="请输入"
         >
           <template #prepend>
-            <el-select v-model="queryType.k" clearable placeholder="全部" style="width: 110px">
+            <el-select v-model="queryType.k" clearable placeholder="全部" class="!w-110px">
               <el-option
                 v-for="dict in searchList"
                 :key="dict.value"
@@ -125,6 +125,12 @@
   </ContentWrap>
 
   <!-- 列表 -->
+  <!-- TODO @puhui999：列表有可能尽量对齐 https://gitee.com/niushop_team/niushop_b2c_v5_stand/raw/master/image/back_end5.png 哇，主要感觉视觉上有点无法分辨一个订单项，是和哪个订单关联。
+
+  1、订单号、订单类型、订单来源、支付时间那一行，直接做到订单项的数据中
+  2、商品信息、商品原价那一行，应该是在最顶上一行，不用每个订单项都写一条
+  3、然后点击展开和收拢订单项，可以不做哈。
+   -->
   <ContentWrap>
     <el-table
       v-loading="loading"
@@ -157,7 +163,8 @@
             </el-table-column>
             <el-table-column label="商品原价*数量" prop="price" width="150">
               <template #default="{ row }">
-                {{ formatToFraction(row.price) }}元 * {{ row.count }}
+                <!-- TODO @puhui999：价格，要有 xxx.00 这种格式 -->
+                {{ formatToFraction(row.price) }} 元 * {{ row.count }}
               </template>
             </el-table-column>
             <el-table-column label="合计" prop="payPrice" width="150">
@@ -173,6 +180,7 @@
             </el-table-column>
             <el-table-column align="center" label="实际支付" min-width="120" prop="payPrice">
               <template #default>
+                <!-- TODO @puhui999：价格，要有 xxx.00 这种格式 -->
                 {{ formatToFraction(scope.row.payPrice) + '元' }}
               </template>
             </el-table-column>
@@ -207,7 +215,7 @@
             </el-table-column>
             <el-table-column align="center" label="配送方式" width="120">
               <template #default>
-                <dict-tag :type="DICT_TYPE.DELIVERY_TYPE" :value="scope.row.deliveryType" />
+                <dict-tag :type="DICT_TYPE.TRADE_DELIVERY_TYPE" :value="scope.row.deliveryType" />
               </template>
             </el-table-column>
             <el-table-column align="center" fixed="right" label="操作" width="160">
@@ -225,6 +233,7 @@
                     </el-button>
                     <template #dropdown>
                       <el-dropdown-menu>
+                        <!-- TODO puhui999：可以判断下状态 + 物流类型，展示【发货】按钮 -->
                         <el-dropdown-item command="delivery">
                           <Icon icon="ep:takeaway-box" />
                           发货
@@ -265,7 +274,7 @@
         <template #default="{ row }">
           <dict-tag
             v-if="row.payChannelCode"
-            :type="DICT_TYPE.PAY_CHANNEL_CODE_TYPE"
+            :type="DICT_TYPE.PAY_CHANNEL_CODE"
             :value="row.payChannelCode"
           />
         </template>
@@ -296,6 +305,8 @@
       @pagination="getList"
     />
   </ContentWrap>
+
+  <!-- 各种操作的弹窗 -->
   <DeliveryOrderForm ref="deliveryOrderFormRef" @success="getList" />
   <OrderRemarksForm ref="orderRemarksFormRef" @success="getList" />
 </template>
@@ -306,9 +317,11 @@ import DeliveryOrderForm from './components/DeliveryOrderForm.vue'
 import OrderRemarksForm from './components/OrderRemarksForm.vue'
 import { dateFormatter } from '@/utils/formatTime'
 import * as TradeOrderApi from '@/api/mall/trade/order'
+// @puhui999：通过 TradeOrderApi 去引用对应的 VO 就可以啦
 import { OrderItemRespVO, OrderVO } from '@/api/mall/trade/order'
+// @puhui999：使用 XXXApi 哈
 import { getListAllSimple } from '@/api/mall/trade/delivery/pickUpStore'
-import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
+import { DICT_TYPE, getStrDictOptions, getIntDictOptions } from '@/utils/dict'
 import { formatToFraction } from '@/utils'
 import { createImageViewer } from '@/components/ImageViewer'
 import * as DeliveryExpressApi from '@/api/mall/trade/delivery/express'
@@ -318,55 +331,8 @@ const { currentRoute, push } = useRouter() // 路由跳转
 const loading = ref(true) // 列表的加载中
 const total = ref(2) // 列表的总页数
 const list = ref<OrderVO[]>([]) // 列表的数据
-const deliveryOrderFormRef = ref()
-const orderRemarksFormRef = ref()
-const openForm = (id: number) => {
-  push('/trade/order/detail/' + id)
-}
-/** 商品图预览 */
-const imagePreview = (imgUrl: string) => {
-  createImageViewer({
-    urlList: [imgUrl]
-  })
-}
-
-interface SpanMethodProps {
-  row: OrderItemRespVO
-  column: TableColumnCtx<OrderItemRespVO>
-  rowIndex: number
-  columnIndex: number
-}
-
-const spanMethod = ({ rowIndex, columnIndex }: SpanMethodProps) => {
-  const colIndex = [4, 5, 6, 7]
-  // 处理列
-  if (colIndex.includes(columnIndex)) {
-    // 处理被合并的行
-    if (rowIndex !== 0) {
-      return {
-        rowspan: 0,
-        colspan: 0
-      }
-    }
-    return {
-      rowspan: 2,
-      colspan: 1
-    }
-  }
-}
-/** 操作分发 */
-const handleCommand = (command: string, row: OrderVO) => {
-  switch (command) {
-    case 'orderRemarks':
-      orderRemarksFormRef.value?.open(row)
-      break
-    case 'delivery':
-      deliveryOrderFormRef.value?.open(row.id)
-      break
-  }
-}
 const queryFormRef = ref<FormInstance>() // 搜索的表单
-//表单搜索
+// 表单搜索
 const queryParams = reactive({
   pageNo: 1, //首页
   pageSize: 10, //页面大小
@@ -387,11 +353,12 @@ const queryParams = reactive({
   logisticsId: null,
   all: ''
 })
-
 const queryType = reactive({ k: '', v: '' }) // 订单搜索类型kv
-/*
+/**
  * 订单聚合搜索
- * 商品名称  商品件数 全部  需要后端支持TODO
+ * 商品名称、商品件数、全部
+ *
+ * 需要后端支持 TODO
  */
 const searchList = ref([
   { value: 'no', label: '订单号' },
@@ -399,6 +366,31 @@ const searchList = ref([
   { value: 'userNickname', label: '用户昵称' },
   { value: 'userMobile', label: '用户电话' }
 ])
+
+interface SpanMethodProps {
+  row: OrderItemRespVO
+  column: TableColumnCtx<OrderItemRespVO>
+  rowIndex: number
+  columnIndex: number
+}
+const spanMethod = ({ rowIndex, columnIndex }: SpanMethodProps) => {
+  const colIndex = [4, 5, 6, 7]
+  // 处理列
+  if (colIndex.includes(columnIndex)) {
+    // 处理被合并的行
+    if (rowIndex !== 0) {
+      return {
+        rowspan: 0,
+        colspan: 0
+      }
+    }
+    return {
+      rowspan: 2,
+      colspan: 1
+    }
+  }
+}
+
 /** 查询列表 */
 const getList = async () => {
   loading.value = true
@@ -423,6 +415,33 @@ const resetQuery = () => {
   handleQuery()
 }
 
+/** 商品图预览 */
+const imagePreview = (imgUrl: string) => {
+  createImageViewer({
+    urlList: [imgUrl]
+  })
+}
+
+/** 查看商品详情 */
+const openForm = (id: number) => {
+  // TODO @puhui999：这里最好用 name 来跳转，因为 url 可能会改
+  push('/trade/order/detail/' + id)
+}
+
+/** 操作分发 */
+const deliveryOrderFormRef = ref()
+const orderRemarksFormRef = ref()
+const handleCommand = (command: string, row: OrderVO) => {
+  switch (command) {
+    case 'orderRemarks': // TODO @puhui999：orderRemarks 是不是改成 remark 会好点，保持统一
+      orderRemarksFormRef.value?.open(row)
+      break
+    case 'delivery':
+      deliveryOrderFormRef.value?.open(row.id)
+      break
+  }
+}
+
 // 监听路由变化更新列表，解决商品保存后，列表不刷新的问题。
 watch(
   () => currentRoute.value,

src/views/member/user/UserForm.vue

@@ -70,7 +70,7 @@
           <el-form-item
             label="修改原因"
             prop="levelReason"
-            v-if="formData.levelId != originLevelId"
+            v-if="formData.levelId !== originLevelId"
           >
             <el-input type="text" v-model="formData.levelReason" placeholder="请输入修改原因" />
           </el-form-item>

src/views/pay/order/index.vue

@@ -29,7 +29,7 @@
           class="!w-240px"
         >
           <el-option
-            v-for="dict in getStrDictOptions(DICT_TYPE.PAY_CHANNEL_CODE_TYPE)"
+            v-for="dict in getStrDictOptions(DICT_TYPE.PAY_CHANNEL_CODE)"
             :key="dict.value"
             :label="dict.label"
             :value="dict.value"