IM收货消息

pages/account/index/message.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-05-04 17:48:12
  * @LastEditors: ch
- * @LastEditTime: 2022-05-04 17:53:11
+ * @LastEditTime: 2022-05-26 10:38:16
  * @Description: file content
 -->
 
@@ -13,28 +13,27 @@
       <section class="section">
         <div
           class="section__item flex"
-          v-for="item in socketMsgData"
+          v-for="item in msgData"
           :key="item.id"
+          @click="handleDetail(item)"
         >
           <img
             class="section__item-img"
-            src="https://img1.baidu.com/it/u=3384796346,381674655&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500"
+            :src="item.payload.productImageUrls ? item.payload.productImageUrls[0] : require('@/assets/img/account/im/system.png')"
             alt="消息通知"
           />
           <div class="section__item-content flex flex-column">
             <div class="section__item-content--title flex">
-              <span>{{ JSON.parse(item.payload).title || `` }}</span>
-              <span class="section__item-content--time">{{
-                item.createTimeStamp
-              }}</span>
+              <span>{{ item.payload.title || `` }}</span>
+              <span class="section__item-content--time">{{item.createTimeStamp}}</span>
             </div>
             <div class="section__item-content--txt">
-              {{ JSON.parse(item.payload).content || `` }}
+              {{ item.payload.content || `` }}
             </div>
           </div>
         </div>
         <UiEmpty
-          v-if="!socketMsgData.length"
+          v-if="!msgData.length"
           desc="暂无消息通知"
           :icon="require('@/assets/img/account/order/empty.png')"
         >
@@ -44,20 +43,42 @@
   </div>
 </template>
 <script>
-import { mapState } from "vuex";
+// import { mapState } from "vuex";
 import UiEmpty from "@/components/UiEmpty.vue";
+import {FormatDate} from '@/plugins/utils'
 export default {
   components: { UiEmpty },
   data() {
     return {};
   },
   computed: {
-    ...mapState(["token", "socketMsgData"]),
+    msgData(){
+      return this.$store.state.socketMsgData.map(i => {
+        i.payload = JSON.parse(i.payload);
+        i.createTimeStamp = FormatDate(i.createTimeStamp, 'mm-dd hh:ii:ss')
+        return i;
+      }).reverse();
+    },
+    // ...mapState(["token", "socketMsgData"]),
   },
   mounted() {
     console.log(`socketMsgData`, this.$store.state);
   },
-  methods: {},
+  methods: {
+    
+		/**
+		 * 点击详情跳转
+		 */
+		handleDetail(item){
+			if(['orderPay','orderDelivery','orderCancel'].includes(item.payload.customType)){
+				this.$router.push(`/account/order/detail?id=${item.payload.primaryId}`)
+			}else if(['refundFail','refundSuccess'].includes(item.payload.customType)){
+				this.$message.warning('请在移动端查看售后详情~');
+			}else if(item.payload.linkJump){
+					window.location.href = item.payload.linkJump;
+			}
+		}
+  },
 };
 </script>
 <style lang="scss" scoped>
@@ -87,8 +108,8 @@ export default {
       margin-bottom: 20px;
 
       &-img {
-        width: 110px;
-        height: 110px;
+        width: 50px;
+        height: 50px;
         margin-right: 20px;
       }
 

pages/goods/detail/_id.vue

@@ -495,7 +495,6 @@ export default {
         num: this.curBuyNum,
         activityType: 1,
       };
-      console.log(query);
       this.$router.push({
         path: "/order/submit",
         query,