From 674c2352ef5a44315decabac6e429260d2625561 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AD=A6=E4=B9=A0=E5=BE=88=E5=B7=AE=E5=95=A6?=
 <17633066053@163.com>
Date: Fri, 17 Feb 2023 11:28:26 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20:sparkles:=20=E6=96=B0=E5=A2=9Eim?=
 =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E6=9D=83=E9=99=90=E5=A4=B1=E6=95=88=E5=88=A4?=
 =?UTF-8?q?=E5=AE=9A=EF=BC=8C=E4=BC=98=E5=8C=96=E4=B9=B0=E5=AE=B6=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E6=A0=B7=E5=BC=8F=E4=BB=A5=E5=8F=8A=E5=8D=96=E5=AE=B6?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 im/src/assets/css/global.less                 |   3 +
 im/src/components/chat/panel/OtherLink.vue    |   9 +
 im/src/components/chat/panel/TalkPanel.vue    |  82 +++++----
 .../chat/panel/template/footPrint.vue         | 171 +++++++-----------
 .../chat/panel/template/goodsLink.vue         |   7 +-
 .../chat/panel/template/storeDetail.vue       |  57 +++---
 im/src/utils/request.js                       |  38 +++-
 im/src/views/message/index.vue                |   4 +-
 8 files changed, 207 insertions(+), 164 deletions(-)

diff --git a/im/src/assets/css/global.less b/im/src/assets/css/global.less
index c1353b95..4c5db740 100644
--- a/im/src/assets/css/global.less
+++ b/im/src/assets/css/global.less
@@ -6,6 +6,9 @@
   -ms-user-select: none;
   user-select: none;
 }
+.main-color{
+  color: #508afe;
+}
 
 .no-padding {
   padding: 0;
diff --git a/im/src/components/chat/panel/OtherLink.vue b/im/src/components/chat/panel/OtherLink.vue
index a1b7b673..ec7a8a3a 100644
--- a/im/src/components/chat/panel/OtherLink.vue
+++ b/im/src/components/chat/panel/OtherLink.vue
@@ -275,4 +275,13 @@ export default {
 /deep/.el-tabs__nav-scroll{
   min-width: 362px;
 }
+/deep/ .el-tabs__item{
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+/deep/ .el-tabs__header{
+  margin-bottom: 0;
+}
 </style>
\ No newline at end of file
diff --git a/im/src/components/chat/panel/TalkPanel.vue b/im/src/components/chat/panel/TalkPanel.vue
index 6e29d2f4..99e5a65d 100644
--- a/im/src/components/chat/panel/TalkPanel.vue
+++ b/im/src/components/chat/panel/TalkPanel.vue
@@ -98,22 +98,29 @@
                         <a> 订单号:{{ item.text.sn }} </a>
                       </el-tooltip>
                     </div>
-                    <div class="baseTwo">
-                      <img :src="item.text.groupImages" style="height: 100px;width: 100px;margin-top: 10px;" />
+                    <div class="goods-shared-box">
+                      <div>
+                        <img :src="item.text.groupImages" style="height: 100px;width: 100px;" />
+                      </div>
+                      <div class="shared-goods">
                       <span class="orderGoodsName">{{ item.text.groupName }}</span>
-                      <span class="orderGoodsTime">{{ item.text.paymentTime }}</span>
+                      <div class="orderGoodsTime">{{ item.text.paymentTime }}</div>
                       <span class="orderFlowPrice">
-                        订单金额：{{ item.text.flowPrice | unitPrice('￥') }}
-                      </span>
-                      <span class="order_status"
-                        :style="{ 'color': item.text.orderStatus == 'CANCELLED' || item.text.orderStatus == 'UNPAID' || item.text.orderStatus == ' TAKE' ? '#5a606b' : '#f23030' }">{{
-                          item.text.orderStatus == 'CANCELLED' ? '已取消' : item.text.orderStatus == 'UNPAID' ? '未付款' :
-                            item.text.orderStatus ==
-                              'PAID' ? '已付款' : item.text.orderStatus == 'UNDELIVERED' ? '待发货' : item.text.orderStatus ==
-                                'DELIVERED'
-                                ? '已发货' : item.text.orderStatus == ' COMPLETED' ? '已完成' : item.text.orderStatus == ' TAKE' ?
-                                  '待校验' : ''
-                        }}</span>
+                        订单金额：<span>{{ item.text.flowPrice | unitPrice('￥') }}</span>
+                      </span> 
+                      <div class="order-status">
+                        <el-tag 
+                          size="mini"
+                          :type="item.text.orderStatus == 'CANCELLED' || item.text.orderStatus == 'UNPAID' || item.text.orderStatus == ' TAKE' ? 'info' : 'danger'">{{
+                            item.text.orderStatus == 'CANCELLED' ? '已取消' : item.text.orderStatus == 'UNPAID' ? '未付款' :
+                              item.text.orderStatus ==
+                                'PAID' ? '已付款' : item.text.orderStatus == 'UNDELIVERED' ? '待发货' : item.text.orderStatus ==
+                                  'DELIVERED'
+                                  ? '已发货' : item.text.orderStatus == ' COMPLETED' ? '已完成' : item.text.orderStatus == ' TAKE' ?
+                                    '待校验' : ''
+                          }}</el-tag>
+                      </div>
+                        </div>
                     </div>
                   </div>
                 </div>
@@ -841,25 +848,18 @@ export default {
 };
 </script>
 <style lang="less" scoped>
-.order_status {
-  height: 30px;
-  width: 60px;
-  background: #ffeded;
-  margin-right: 20px;
-  text-align: center;
-  line-height: 25px;
-  margin-left: 15px;
-  border-radius: 10px;
-}
+
 
 .oderStyle {
   border: 1px solid #f2f2f2;
   width: 330px;
   border-radius: 4px;
+  padding: 8px;
 
   .oedersn {
-    margin: 10px 0 10px 5px;
+    margin: 10px 0 10px 0;
     width: 300px;
+    font-size: 12px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -867,6 +867,7 @@ export default {
 }
 
 .goodsStyle {
+  cursor: pointer;
   border: 1px solid #f2f2f2;
   width: 300px;
   height: 120px;
@@ -893,7 +894,7 @@ export default {
   }
 
   .price {
-    color: #999;
+    color: red;
     margin-top: 20px;
   }
 
@@ -913,21 +914,24 @@ export default {
   overflow: hidden;
   text-overflow: ellipsis;
   // white-space: nowrap;
-  position: absolute;
-  margin-top: 10px;
-  margin-left: 10px;
+
+  font-size: 14px;
+ 
 }
 
 .orderGoodsTime {
-  margin-left: 10px;
+  font-size: 12px;
   color: #999;
-  position: absolute;
-  margin-top: 70px;
 }
 
 .orderFlowPrice {
   color: #999;
-  margin-bottom: 20px;
+
+  font-size: 12px;
+  >span{
+    color: red;
+    font-size: 18px;
+  }
 }
 
 .main-box {
@@ -1242,4 +1246,16 @@ export default {
     line-height: 25px;
   }
 }
+.goods-shared-box{
+  display: flex;
+  >.shared-goods{
+    padding-left: 10px;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+  }
+}
+.order-status{
+  text-align: right;
+}
 </style>
diff --git a/im/src/components/chat/panel/template/footPrint.vue b/im/src/components/chat/panel/template/footPrint.vue
index dac02033..014c5478 100644
--- a/im/src/components/chat/panel/template/footPrint.vue
+++ b/im/src/components/chat/panel/template/footPrint.vue
@@ -1,33 +1,29 @@
 <template>
-  <div class="box" @scroll="scrollBottom">
+  <div class="box" :style="{height:toUser.storeFlag ? '858px' : '815px'}" @scroll="scrollBottom">
     <div class="tab">
       <el-tabs v-model="activeName" @tab-click="handleClick" :stretch=true>
         <el-tab-pane label="最近浏览" name="goods">
           <dl>
-            <dd v-for="item in list" v-infinite-scroll="loadMore">
+            <dd :key="index"  @click="linkToGoods(item.goodsId, item.id)" v-for="(item,index) in list" v-infinite-scroll="loadMore">
               <div class="base">
                 <div>
-                  <img style="width: 60px; height: 60px;margin-left: 40px;box-sizing: border-box;" :src="item.thumbnail"
+                  <img style="width: 60px; height: 60px;margin-left:20px;box-sizing: border-box;" :src="item.thumbnail"
                     class="image" />
                 </div>
                 <div class="recent_views">
-                  <el-tooltip class="item" effect="dark" :content="item.goodsName" placement="top-start">
-                    <a class="goods_name" @click="linkToGoods(item.goodsId, item.id)">{{ item.goodsName }}</a>
-                  </el-tooltip>
-
+                  <a class="goods_name">{{ item.goodsName }}</a>
                   <div style="display: flex;">
                     <div style="margin-top: 20px;">
-                      <span style="color: red;">{{ item.price | unitPrice("￥") }}</span>
+                      <span class='goods-price'>{{ item.price | unitPrice("￥") }}</span>
                       <div class="goods_store_button">
-                        <el-button type="danger" v-if="item.btnHide == 1 && toUser.storeFlag" size="mini"
-                          @click="submitSendGoodsMessage(item)" plain>发送</el-button>
+                       
                       </div>
                     </div>
                   </div>
                 </div>
-
+                <div class="review"> <el-button  v-if="item.btnHide == 1 && toUser.storeFlag" size="mini"
+                          @click.stop="submitSendGoodsMessage(item)" plain>发送</el-button></div>
               </div>
-              <div class="Underline"></div>
             </dd>
 
           </dl>
@@ -35,25 +31,23 @@
         <el-tab-pane label="订单列表" name="orders">
           <dl>
             <dd v-for="(item, index) in orderList" v-infinite-scroll="loadMore" :key="index">
-              <div class="orderlist">
-                <div class="order_top order_padding">
-                  <span class="order_sn" @click="linkToOrders(item.sn)">订单号:{{ item.sn }}</span>
+              <div class="order-list">
+                <div class="order-top order-padding">
+                  <span class="order-sn" @click="linkToOrders(item.sn)">订单号:{{ item.sn }}</span>
                 </div>
-                <div class="order_section order_padding">
+                <div class="order-section order-padding">
                   <img :src="item.groupImages" alt="">
-                  <el-tooltip class="item" effect="dark" :content="item.groupName" placement="top-start">
-                    <span class="orderGoodsName" @click="linkToOrders(item.sn)"> {{ item.groupName }}</span>
-                  </el-tooltip>
-                  <div class="orderBtn ">
-                    <el-button type="danger" class="store-button" v-if="item.btnHide == 1 && toUser.storeFlag"
+                  <span class="order-goods-name" @click="linkToOrders(item.sn)"> {{ item.groupName }}</span>
+                  <div class="order-btn ">
+                    <el-button class="store-button" v-if="item.btnHide == 1 && toUser.storeFlag"
                       size="mini" @click="submitSendOrderMessage(item, index)" plain>发送</el-button>
                   </div>
                 </div>
-                <div class="order_footer order_padding">
+                <div class="order-footer order-padding">
                   <span> 订单金额： <span style="color: red;">{{
                     item.orderItems[0].goodsPrice | unitPrice("￥")
                   }}</span></span>
-                  <el-tag :type="col[item.orderStatus]">{{
+                  <el-tag  size='mini' :type="col[item.orderStatus]">{{
                     item.orderStatus == 'STAY_PICKED_UP' ? '待自提'
                       : item.orderStatus == 'CANCELLED' ? '已取消' : item.orderStatus == 'UNPAID' ? '未付款' : item.orderStatus
                         ==
@@ -64,7 +58,7 @@
                 </div>
 
               </div>
-              <div class="Underline"></div>
+            
             </dd>
           </dl>
         </el-tab-pane>
@@ -192,29 +186,15 @@ export default {
 </script>
 
 <style scoped lang="less">
-.order_status {
-  height: 25px;
-  width: 60px;
-  background: #ffeded;
-  margin-right: 20px;
-  text-align: center;
-  line-height: 25px;
-}
-
-.Underline {
-  border: 1px solid silver;
-  // width: 90%;
-  margin: 0 auto;
-}
-
 .recent_views {
   margin-left: 13px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  width: 232px;
+  width: 200px;
 }
 
+
 .box {
   max-width: 362px;
 
@@ -248,53 +228,44 @@ export default {
   }
 }
 
-.Underline {
-  // border: 5px solid red;
-}
-
-.orderlist {
-  max-width: 352px;
+.order-list {
+  padding: 9px;
+  transition: 0.35s;
+  cursor: pointer;
   margin-bottom: 10px;
   background: #fff;
   color: #5a606b;
   box-sizing: border-box;
 }
 
+
 .box::-webkit-scrollbar {
   width: 0px !important;
 }
-
-.order_top {
-  border-bottom: 1px solid #f2f2f2;
-
-  .order_sn {}
-}
-
-.order_section {
-  border-bottom: 1px solid #f2f2f2;
-  height: 100px;
-
+.order-section {
+  margin: 10px 0;
+  font-size: 12px;
   img {
     width: 60px;
     height: 60px;
-    margin-top: 20px;
   }
 }
 
-.order_footer {
-  border-bottom: 1px solid #f2f2f2;
+.order-footer {
+  font-size: 12px;
   display: flex;
   justify-content: space-between;
+  align-items: center;
 }
 
-.orderGoodsName {
+.order-goods-name {
   width: 200px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   position: absolute;
   margin-left: 10px;
-  margin-top: 10px;
+
   font-weight: 500;
 }
 
@@ -304,18 +275,19 @@ export default {
   white-space: nowrap
 }
 
-.orderBtn {
+.order-btn {
   display: flex;
   justify-content: flex-end;
-  margin-right: 15px;
   position: relative;
   bottom: 55px;
 }
 
 .goods_name {
+  transition: .35s;
   overflow: hidden;
   text-overflow: ellipsis;
-  white-space: nowrap
+  white-space: nowrap;
+  font-size:12px;
 }
 
 /deep/ .el-tabs__header {
@@ -326,18 +298,6 @@ export default {
   z-index: 2;
   background: #ffffff;
 }
-
-// /deep/ .el-tabs__item.is-top:last-child {
-//   color: black;
-// }
-/deep/.is-active {
-  color: #f23030;
-}
-
-/deep/.el-tabs__active-bar {
-  background-color: #f23030;
-}
-
 /deep/ .el-tabs__nav.is-top {
   height: 50px;
 }
@@ -351,54 +311,61 @@ export default {
 /deep/.el-tabs__content {
   margin-top: 50px;
 }
+/deep/ .el-tabs{
+  width: 100%;
+}
 
 .box {
-  height: 700px;
   overflow: auto;
   // margin-top: 50px;
   // width: 350px;
 }
 
-.order_padding {
+.order-padding {
   padding: 0 10px;
 }
 
-.store-button {
-  background-color: white;
-  border-color: #F56C6C;
-  margin-top: 10px;
-}
-
-.goods_store_button {
-  display: inline;
-  background-color: white;
-  border-color: #F56C6C;
-  position: absolute;
-  left: 70%;
-}
-
 .base {
-  margin-top: 5px;
+  padding: 8px;
+  cursor: pointer;
+  transition: .35s;
   height: 80px;
   display: flex;
-
-  .price {
-    color: red;
-    margin-top: 15px;
-  }
-
+  
   .image {
     height: 100px;
     margin-top: 3px;
     width: 100px;
   }
+  >.review{
+    font-size: 12px;
+    display: flex;
+    align-items: center;
+    transition: 0.35s;
+    opacity: 0;
+   
+  }
+}
+.base:hover,.order-list:hover{
+  background: #ededed;
+  padding-left: 14px;
+  >.review{
+    opacity: 1;
+  
+  }
+}
+.goods-price{
+  transition: .35s;
+  font-size: 14px;
+  color:#f23030;
 
 }
-
 .separate {
   margin-top: 8px;
 }
-
+.order-sn{
+  font-size: 12px;
+}
 // .el-tabs--card {
 //   height: calc(100vh - 110px);
 //   overflow-y: auto; 
diff --git a/im/src/components/chat/panel/template/goodsLink.vue b/im/src/components/chat/panel/template/goodsLink.vue
index 91068557..3a11402f 100644
--- a/im/src/components/chat/panel/template/goodsLink.vue
+++ b/im/src/components/chat/panel/template/goodsLink.vue
@@ -1,5 +1,5 @@
 <template>
-  <div style="max-width: 362px;">
+  <div class="current-preview">
     当前浏览
     <div class="base">
       <div>
@@ -16,7 +16,6 @@
         </div>
       </div>
     </div>
-    <hr class="separate" />
   </div>
 </template>
 
@@ -40,6 +39,7 @@ export default {
     }),
   },
   mounted () {
+    console.log(this.goodsDetail)
     this.btnHide = localStorage.getItem('btnHide')
   },
   components: {
@@ -151,6 +151,9 @@ export default {
   background-color: white;
   border-color: #F56C6C;
 }
+.current-preview{
+  padding: 16px;
+}
 
 .base {
   margin-top: 5px;
diff --git a/im/src/components/chat/panel/template/storeDetail.vue b/im/src/components/chat/panel/template/storeDetail.vue
index 91f1dd7e..9c2fb7f7 100644
--- a/im/src/components/chat/panel/template/storeDetail.vue
+++ b/im/src/components/chat/panel/template/storeDetail.vue
@@ -4,31 +4,33 @@
       <div>
         <img :src="storeInfo.storeLogo" class="image" />
       </div>
-      <div style="margin-left: 13px">
+      <div class="store-detail">
+        <div>
         <div class="div-zoom">
-          <span class="title_left_name"> 店铺名称：</span> <span class="title_right_name">{{ storeInfo.storeName }}</span>
+          <span class="title_left_name"> 店铺名称:</span> <span class="title_right_name">{{ storeInfo.storeName }}</span>
           <el-tag style="margin-left: 10px;" type="danger" v-if="storeInfo.selfOperated" size="mini">自营</el-tag>
         </div>
         <div>
           <span class="title_left_name"> 联系方式:</span> <span class="title_right_name">{{ storeInfo.memberName }}</span>
         </div>
+        </div>
         <div>
-          <el-button class="store-button" type="danger" @click="linkToStore(storeInfo.id)" size="mini"
+          <el-button class="store-button" @click="linkToStore(storeInfo.id)" size="mini"
             plain>进入店铺</el-button>
         </div>
       </div>
     </div>
-    <hr class="separate" />
-
-    <div class="separate">店铺评分: <el-rate v-model="storeInfo.serviceScore" disabled show-score text-color="#ff9900"
-        score-template="{value}">
-      </el-rate></div>
-    <div class="separate">服务评分: <el-rate v-model="storeInfo.descriptionScore" disabled show-score text-color="#ff9900"
-        score-template="{value}">
-      </el-rate></div>
-    <div class="separate">物流评分: <el-rate v-model="storeInfo.deliveryScore" disabled show-score text-color="#ff9900"
-        score-template="{value}">
-      </el-rate></div>
+    <div class="wrapper">
+      <div class="separate">店铺评分: <el-rate v-model="storeInfo.serviceScore" disabled show-score text-color="#ff9900"
+          score-template="{value}">
+        </el-rate></div>
+      <div class="separate">服务评分: <el-rate v-model="storeInfo.descriptionScore" disabled show-score text-color="#ff9900"
+          score-template="{value}">
+        </el-rate></div>
+      <div class="separate">物流评分: <el-rate v-model="storeInfo.deliveryScore" disabled show-score text-color="#ff9900"
+          score-template="{value}">
+        </el-rate></div>
+    </div>
   </div>
 </template>
 
@@ -59,33 +61,40 @@ export default {
 </script>
 
 <style scoped lang="less">
+.wrapper{
+  padding: 16px;
+  border-top: 1px solid #f5eeee;
+}
 .title_left_name {
   font-size: 12px;
-  color: #a1a6af;
+  color: #999;
 }
 
 .title_right_name {
   font-size: 12px;
   color: #343036;
+  
 }
 
 .store-button {
   background-color: white;
-  border-color: #F56C6C;
+
 }
+.store-detail{
+  margin-left: 13px;
+  display:flex;
 
+  flex-direction: column;
+  justify-content: space-between;
+}
 .base {
+  padding: 16px;
   margin-top: 5px;
-  height: 120px;
+
   display: flex;
-
-  div {
-    margin-top: 8px;
-  }
-
   .image {
     height: 100px;
-    margin-top: 3px;
+
     width: 100px
   }
 
@@ -96,6 +105,8 @@ export default {
   // display: inline;
   display: flex;
   font-size: 12px;
+  align-items: center;
+
   color: #a1a6af;
 }
 </style>
\ No newline at end of file
diff --git a/im/src/utils/request.js b/im/src/utils/request.js
index f035c2af..517b9d59 100644
--- a/im/src/utils/request.js
+++ b/im/src/utils/request.js
@@ -2,7 +2,7 @@ import axios from "axios";
 import config from "@/config/config";
 import { getToken, removeAll } from "@/utils/auth";
 
-import { Notification } from "element-ui";
+import { Notification, MessageBox } from "element-ui";
 import qs from "qs";
 
 // 创建 axios 实例
@@ -20,15 +20,46 @@ const request = axios.create({
  * @param {*} error
  */
 const errorHandler = (error) => {
+  console.log(error);
   // 判断是否是响应错误信息
   if (error.response) {
     if (error.response.status == 401) {
       removeAll();
       location.reload();
-    } else {
+    } else if (error.response.status == 403) {
+      /**
+       * 403提示将重新从商家移动端进入当前页面
+       */
+      MessageBox("当前登录已失效，请从商家管理后台重新登录。", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        closeOnPressEscape: false,
+        closeOnClickModal: false,
+        type: "warning",
+      })
+        .then(() => {
+          window.close();
+          Notification({
+            title:"登录失效提示",
+            message: "请手动关闭当前页面",
+            type:"error",
+            position: "top-right",
+          });
+        })
+        .catch(() => {
+         
+          Notification({
+            title:"登录失效提示",
+            message: "请手动关闭当前页面",
+            type:"error",
+            position: "top-right",
+          });
+        });
+    } else if(error.response.status == 400){
       Notification({
-        message: "网络异常,请稍后再试...",
+        message: error.response.data.message,
         position: "top-right",
+        type:"error",
       });
     }
   }
@@ -39,6 +70,7 @@ const errorHandler = (error) => {
 // 请求拦截器
 request.interceptors.request.use((config) => {
   const token = getToken();
+
   if (token) {
     config.headers["accessToken"] = `${token}`;
     return config;
diff --git a/im/src/views/message/index.vue b/im/src/views/message/index.vue
index f5a869ca..ba327c57 100644
--- a/im/src/views/message/index.vue
+++ b/im/src/views/message/index.vue
@@ -653,7 +653,9 @@ export default {
 /deep/ .el-scrollbar__wrap {
   overflow-x: hidden;
 }
-
+.user-status{
+  margin-left: 10px;
+}
 .aside-box {
   position: relative;
   border-right: 1px solid rgb(245, 245, 245);