【代码评审】Mall：客服的会话列表

src/views/mall/promotion/kefu/components/message/ImageMessageItem.vue

@@ -10,6 +10,7 @@
             : ''
       ]"
     >
+      <!-- TODO @puhui999：unocss -->
       <el-image
         :src="message.content"
         fit="contain"
@@ -30,6 +31,7 @@ defineOptions({ name: 'ImageMessageItem' })
 defineProps<{
   message: KeFuMessageRespVO
 }>()
+
 /** 图预览 */
 const imagePreview = (imgUrl: string) => {
   createImageViewer({

src/views/mall/promotion/kefu/components/message/OrderMessageItem.vue

@@ -18,6 +18,7 @@
           </div>
         </div>
         <div v-for="item in getMessageContent.items" :key="item.id" class="border-bottom">
+          <!-- TODO @puhui999：要不把 img => picUrl 类似这种，搞的更匹配一点 -->
           <ProductItem
             :img="item.picUrl"
             :num="item.count"
@@ -29,10 +30,10 @@
         <div class="pay-box mt-30px flex justify-end pr-20px">
           <div class="flex items-center">
             <div class="discounts-title pay-color"
-              >共 {{ getMessageContent.productCount }} 件商品,总金额:
+              >共 {{ getMessageContent?.productCount }} 件商品,总金额:
             </div>
             <div class="discounts-money pay-color">
-              ￥{{ fenToYuan(getMessageContent.payPrice) }}
+              ￥{{ fenToYuan(getMessageContent?.payPrice) }}
             </div>
           </div>
         </div>

src/views/mall/promotion/kefu/components/message/ProductItem.vue

@@ -90,6 +90,8 @@ const props = defineProps({
     default: ''
   }
 })
+
+/** SKU 展示字符串 */
 const skuString = computed(() => {
   if (!props.skuText) {
     return ''
@@ -99,6 +101,8 @@ const skuString = computed(() => {
   }
   return props.skuText
 })
+
+// TODO @puhui999：可以使用 preview-teleported
 /** 图预览 */
 const imagePrediv = (imgUrl: string) => {
   createImageViewer({

src/views/mall/promotion/kefu/components/message/ProductMessageItem.vue

@@ -32,5 +32,7 @@ defineOptions({ name: 'ProductMessageItem' })
 const props = defineProps<{
   message: KeFuMessageRespVO
 }>()
+
+/** 获悉消息内容 */
 const getMessageContent = computed(() => JSON.parse(props.message.content))
 </script>