feat: 更改优惠券逻辑

src/components/common/layout/layout.vue

@@ -22,8 +22,10 @@
           {{$route.name}}
         </div>
         <div class="right">
-          <div @click="onAppMessage" class="news">
-            <span class="dot" v-show="hasUnreadMessage"></span>
+          <div @click="onAppMessage"
+               class="news">
+            <span class="dot"
+                  v-show="hasUnreadMessage"></span>
             <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/news.png" />
           </div>
           <div class="head-img"><img :src="userInfo.avatar_url"></div>
@@ -46,93 +48,102 @@
     </div>
     <minePupop :show="msgPupopVisible">
       <div class="block">
-          <div class="title">
-            <div @click="clearUnreadMsgsByType(0)" class="clear">
-              <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/clearMsg.png" alt="">
-              <div class="">清除未读</div>
-            </div>
-            <div class="txt">消息</div>
-            <div class="delete-pupop" @click="closeMsgPanel">
-              <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/delete.png" alt />
-            </div>
+        <div class="title">
+          <div @click="clearUnreadMsgsByType(0)"
+               class="clear">
+            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/clearMsg.png"
+                 alt="">
+            <div class="">清除未读</div>
           </div>
-          <div class="msg-con">
-            <van-list 
-              v-model="mainPanelMsgListLoading"
-              :finished="mainPanelMsgListFinished"
-              finished-text="没有更多了"
-              @load="getMainPanelMessageList"
-              :immediate-check="false"
-            >
-              <div class="order-msg">
-                <div class="success">
-                  <div class="flex justify-between" @click="toMsgDetail(1)">
-                    <div class="desc flex items-center">
-                      <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png" alt="" />
-                      <div class="title">预约成功信息</div>
-                    </div>
-                    <div class="count flex flex-column justify-center items-center">
-                      <!-- <div class="time">10:23</div> -->
-                      <div class="num" v-if="orderSuccessUnreadNum">{{orderSuccessUnreadNum}}</div>
-                    </div>
+          <div class="txt">消息</div>
+          <div class="delete-pupop"
+               @click="closeMsgPanel">
+            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/delete.png"
+                 alt />
+          </div>
+        </div>
+        <div class="msg-con">
+          <van-list v-model="mainPanelMsgListLoading"
+                    :finished="mainPanelMsgListFinished"
+                    finished-text="没有更多了"
+                    @load="getMainPanelMessageList"
+                    :immediate-check="false">
+            <div class="order-msg">
+              <div class="success">
+                <div class="flex justify-between"
+                     @click="toMsgDetail(1)">
+                  <div class="desc flex items-center">
+                    <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/make.png"
+                         alt="" />
+                    <div class="title">预约成功信息</div>
                   </div>
-                </div>
-                <div class="cancel">
-                  <div class="flex justify-between" @click="toMsgDetail(2)">
-                    <div class="desc flex items-center">
-                      <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/cancelOrder.png" alt="" />
-                      <div class="title">预约取消信息</div>
-                    </div>
-                    <div class="count flex flex-column justify-center items-center">
-                      <!-- <div class="time">10:23</div> -->
-                      <div class="num" v-if="orderCancelUnreadNum">{{orderCancelUnreadNum}}</div>
-                    </div>
+                  <div class="count flex flex-column justify-center items-center">
+                    <!-- <div class="time">10:23</div> -->
+                    <div class="num"
+                         v-if="orderSuccessUnreadNum">{{orderSuccessUnreadNum}}</div>
                   </div>
                 </div>
               </div>
-              <div class="ready-msg flex justify-between items-center" 
-                v-for="(item, index) in msgPanelList" 
-                :key="index"
-                @click="readMsgToOrderDetails(item)"
-              >
-                <div class="content-bar flex flex-column">
-                  <div class="desc-info">{{item.project_name}}</div>
-                  <div class="desc-time">{{`${item.device_name} (${item.room}) 还有${item.minute}分钟开始` | ellipsis(80)}}</div>
-                </div>
-                <div class="count flex flex-column items-center">
-                  <div class="time">{{item.create_time}}</div>
-                  <div class="dot" v-if="!item.is_read && allUnread"></div>
+              <div class="cancel">
+                <div class="flex justify-between"
+                     @click="toMsgDetail(2)">
+                  <div class="desc flex items-center">
+                    <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/cancelOrder.png"
+                         alt="" />
+                    <div class="title">预约取消信息</div>
+                  </div>
+                  <div class="count flex flex-column justify-center items-center">
+                    <!-- <div class="time">10:23</div> -->
+                    <div class="num"
+                         v-if="orderCancelUnreadNum">{{orderCancelUnreadNum}}</div>
+                  </div>
                 </div>
               </div>
-            </van-list>
-          </div>
+            </div>
+            <div class="ready-msg flex justify-between items-center"
+                 v-for="(item, index) in msgPanelList"
+                 :key="index"
+                 @click="readMsgToOrderDetails(item)">
+              <div class="content-bar flex flex-column">
+                <div class="desc-info">{{item.project_name}}</div>
+                <div class="desc-time">{{`${item.device_name} (${item.room}) 还有${item.minute}分钟开始` | ellipsis(80)}}</div>
+              </div>
+              <div class="count flex flex-column items-center">
+                <div class="time">{{item.create_time}}</div>
+                <div class="dot"
+                     v-if="!item.is_read && allUnread"></div>
+              </div>
+            </div>
+          </van-list>
+        </div>
       </div>
     </minePupop>
     <minePupop :show="msgSuccessDetailPupopVisible">
       <div class="block detail">
         <div class="title">
-          <div @click="backMsgPanel" class="back flex items-center">
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/back.png" alt="" />
+          <div @click="backMsgPanel"
+               class="back flex items-center">
+            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/back.png"
+                 alt="" />
           </div>
           <div class="txt">消息</div>
-          <div class="delete-msg flex items-center" @click="clearUnreadMsgsByType(1)">
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/clearMsg.png" alt />
+          <div class="delete-msg flex items-center"
+               @click="clearUnreadMsgsByType(1)">
+            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/clearMsg.png"
+                 alt />
             <div class="">清除未读</div>
           </div>
         </div>
         <div class="detail-msg-con">
-          <van-list 
-            v-model="detailSuccessMsgListLoading"
-            :finished="detailSuccessMsgListFinished"
-            finished-text="没有更多了"
-            @load="getMessageByType(orderMsgType)"
-            :immediate-check="false"
-          >
-            <div class="msg-bar flex justify-between items-center" 
-              v-for="(item, index) in msgSuccessDetailList" 
-              :key="index"
-              @click="readMsgToOrderDetails(item)"
-            >
+          <van-list v-model="detailSuccessMsgListLoading"
+                    :finished="detailSuccessMsgListFinished"
+                    finished-text="没有更多了"
+                    @load="getMessageByType(orderMsgType)"
+                    :immediate-check="false">
+            <div class="msg-bar flex justify-between items-center"
+                 v-for="(item, index) in msgSuccessDetailList"
+                 :key="index"
+                 @click="readMsgToOrderDetails(item)">
               <div class="info flex">
                 <div class="name">{{item.nickname}}</div>
                 <div class="project">成功预约{{item.order_time}}</div>
@@ -140,7 +151,8 @@
               </div>
               <div class="flex flex-column items-center">
                 <div class="time">{{item.create_time}}</div>
-                <div class="dot" v-if="!item.is_read && successUnread"></div>
+                <div class="dot"
+                     v-if="!item.is_read && successUnread"></div>
               </div>
             </div>
           </van-list>
@@ -150,28 +162,29 @@
     <minePupop :show="msgCancelDetailPupopVisible">
       <div class="block detail">
         <div class="title">
-          <div @click="backMsgPanel" class="back flex items-center">
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/back.png" alt="" />
+          <div @click="backMsgPanel"
+               class="back flex items-center">
+            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/back.png"
+                 alt="" />
           </div>
           <div class="txt">消息</div>
-          <div class="delete-msg flex items-center" @click="clearUnreadMsgsByType(2)">
-            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/clearMsg.png" alt />
+          <div class="delete-msg flex items-center"
+               @click="clearUnreadMsgsByType(2)">
+            <img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/home/clearMsg.png"
+                 alt />
             <div class="">清除未读</div>
           </div>
         </div>
         <div class="detail-msg-con">
-          <van-list 
-            v-model="detailCancelMsgListLoading"
-            :finished="detailCancelMsgListFinished"
-            finished-text="没有更多了"
-            @load="getMessageByType(orderMsgType)"
-            :immediate-check="false"
-          >
+          <van-list v-model="detailCancelMsgListLoading"
+                    :finished="detailCancelMsgListFinished"
+                    finished-text="没有更多了"
+                    @load="getMessageByType(orderMsgType)"
+                    :immediate-check="false">
             <div class="msg-bar flex justify-between items-center"
-              v-for="(item, index) in msgCancelDetailList"
-              :key="index"
-              @click="readMsgToOrderDetails(item)"
-            >
+                 v-for="(item, index) in msgCancelDetailList"
+                 :key="index"
+                 @click="readMsgToOrderDetails(item)">
               <div class="info flex">
                 <div class="name">{{item.nickname}}</div>
                 <div class="project">取消预约{{item.order_time}}</div>
@@ -179,20 +192,27 @@
               </div>
               <div class="flex flex-column items-center">
                 <div class="time">{{item.create_time}}</div>
-                <div class="dot" v-if="!item.is_read"></div>
+                <div class="dot"
+                     v-if="!item.is_read"></div>
               </div>
             </div>
           </van-list>
         </div>
       </div>
     </minePupop>
-    <audio ref="orderSuccessMp3" id="orderSuccessMp3" muted>
+    <audio ref="orderSuccessMp3"
+           id="orderSuccessMp3"
+           muted>
       <source src="@/assets/audio/order_success.mp3" />
     </audio>
-    <audio ref="orderReadyMp3_15" id="orderReadyMp3_15" muted>
+    <audio ref="orderReadyMp3_15"
+           id="orderReadyMp3_15"
+           muted>
       <source src="@/assets/audio/order_ready_15.mp3" />
     </audio>
-    <audio ref="orderReadyMp3_5" id="orderReadyMp3_5" muted>
+    <audio ref="orderReadyMp3_5"
+           id="orderReadyMp3_5"
+           muted>
       <source src="@/assets/audio/order_ready_5.mp3" />
     </audio>
   </div>
@@ -249,7 +269,6 @@ export default {
   },
   async created () {
     this.getUserInfo()
-
     console.log('开始连接...')
     let token = this.$store.state.comVal.token || localStorage.getItem('token')
     //申请一个WebSocket对象，参数是服务端地址，同http协议使用http://开头一样，WebSocket协议的url使用ws://开头，另外安全的WebSocket协议使用wss://开头
@@ -258,12 +277,12 @@ export default {
       //当WebSocket创建成功时，触发onopen事件
       console.log("连接成功");
       this.timer = setInterval(() => {
-        this.wsInstance.send(JSON.stringify({type:'ping'}));
+        this.wsInstance.send(JSON.stringify({ type: 'ping' }));
       }, 30000);
     }
     this.wsInstance.onmessage = (e) => {
       //当客户端收到服务端发来的消息时，触发onmessage事件，参数e.data包含server传递过来的数据
-      console.log('收到消息',e.data)
+      console.log('收到消息', e.data)
       let data = JSON.parse(e.data);
       if (data.data.type === 'order_success') {
         console.log('预约成功信息播报')
@@ -289,11 +308,11 @@ export default {
     }
 
     await this.queryHasUnreadMessage()
-    this.timer1 = setInterval(async() => {
+    this.timer1 = setInterval(async () => {
       await this.queryHasUnreadMessage()
     }, 20000)
   },
-  mounted () {},
+  mounted () { },
   beforeDestroy () {
     // 关闭WebSocket连接并清除定时器
     this.wsInstance.close()
@@ -330,7 +349,7 @@ export default {
       this.wsInstance.close()
       clearInterval(this.timer)
       clearInterval(this.timer1)
-      
+
       this.$router.replace('/login')
     },
     changeMenu (index) {
@@ -345,28 +364,28 @@ export default {
     async queryHasUnreadMessage () {
       let resp = await api.hasUnreadMessage()
       if (resp.code === 200) {
-        this.hasUnreadMessage =  resp.data ? true : false
+        this.hasUnreadMessage = resp.data ? true : false
       }
     },
     async getMainPanelMessageList (page = this.mainPanelMessagePage) {
       // setTimeout(async() => {
-        let resp = await api.getMessageList({ page: page, limit: this.mainPanelMessageLimit })
-        if (resp.code = 200) {
-          this.orderSuccessUnreadNum = resp.data.reserved
-          this.orderCancelUnreadNum = resp.data.cancel
+      let resp = await api.getMessageList({ page: page, limit: this.mainPanelMessageLimit })
+      if (resp.code = 200) {
+        this.orderSuccessUnreadNum = resp.data.reserved
+        this.orderCancelUnreadNum = resp.data.cancel
 
-          if (this.mainPanelMessagePage === 1) {
-            this.msgPanelList = resp.data.list
-          } else {
-            this.msgPanelList = [...this.msgPanelList, ...resp.data.list]
-          }
+        if (this.mainPanelMessagePage === 1) {
+          this.msgPanelList = resp.data.list
+        } else {
+          this.msgPanelList = [...this.msgPanelList, ...resp.data.list]
+        }
 
-          this.mainPanelMessagePage++
-          this.mainPanelMsgListLoading = false;
-          if (this.msgPanelList.length >= resp.data.total) {
-            this.mainPanelMsgListFinished = true;
-          }
+        this.mainPanelMessagePage++
+        this.mainPanelMsgListLoading = false;
+        if (this.msgPanelList.length >= resp.data.total) {
+          this.mainPanelMsgListFinished = true;
         }
+      }
       // }, 1000);
     },
     async getMessageByType (type, page = this.detailSuccessMessagePage) {
@@ -379,7 +398,7 @@ export default {
           } else {
             this.msgSuccessDetailList = [...this.msgSuccessDetailList, ...resp.data.list]
           }
-          
+
           this.detailSuccessMessagePage++
           this.detailSuccessMsgListLoading = false;
           if (this.msgSuccessDetailList.length >= resp.data.total) {
@@ -420,20 +439,20 @@ export default {
       this.msgPupopVisible = false
       // this.getMessageByType(param)
       if (param === 1) {
-      this.msgSuccessDetailList = []
-      this.detailSuccessMessagePage = 1
-      this.detailSuccessMsgListLoading = false
-      this.detailSuccessMsgListFinished = false
-      this.getMessageByType(param, 1)
+        this.msgSuccessDetailList = []
+        this.detailSuccessMessagePage = 1
+        this.detailSuccessMsgListLoading = false
+        this.detailSuccessMsgListFinished = false
+        this.getMessageByType(param, 1)
 
         this.msgSuccessDetailPupopVisible = true
       } else {
-      this.msgCancelDetailList = []
-      this.detailCancelMessagePage = 1
-      this.detailCancelMsgListLoading = false
-      this.detailCancelMsgListFinished = false
-      
-      this.getMessageByType(param, 1)
+        this.msgCancelDetailList = []
+        this.detailCancelMessagePage = 1
+        this.detailCancelMsgListLoading = false
+        this.detailCancelMsgListFinished = false
+
+        this.getMessageByType(param, 1)
 
         this.msgCancelDetailPupopVisible = true
       }
@@ -443,7 +462,7 @@ export default {
     backMsgPanel () {
       this.msgSuccessDetailPupopVisible = false
       this.msgCancelDetailPupopVisible = false
-      
+
       this.getMainPanelMessageList()
       this.msgPupopVisible = true
     },
@@ -465,7 +484,7 @@ export default {
     async readMsgToOrderDetails (source) {
       // console.log(source)
       if (!source.is_read) {
-        let clearMsgByIdResp = await api.clearMessageById({id: source.id})
+        let clearMsgByIdResp = await api.clearMessageById({ id: source.id })
         if (clearMsgByIdResp.code === 200) {
           this.getMainPanelMessageList()
         }
@@ -490,7 +509,7 @@ export default {
           this.msgPupopVisible = false
           this.msgSuccessDetailPupopVisible = false
           this.msgCancelDetailPupopVisible = false
-          
+
           this.$router.push({
             path: "/historicalOrder/details",
             query: {
@@ -528,7 +547,7 @@ export default {
       },
       set (val) {
         this.MsgType = val
-      } 
+      }
     }
   },
 }
@@ -671,7 +690,7 @@ export default {
   width: 9px;
   height: 9px;
   border-radius: 50%;
-  background-color: #FF6945;
+  background-color: #ff6945;
   margin-top: 10px;
 }
 .dot-activated {
@@ -717,7 +736,8 @@ export default {
     overflow: auto;
     margin-top: 21px;
     .order-msg {
-      .success, .cancel {
+      .success,
+      .cancel {
         .desc {
           img {
             width: 36px;
@@ -744,8 +764,7 @@ export default {
             box-sizing: border-box;
             color: #ffffff;
             border-radius: 50%;
-            background-color: #FF6945;
-            
+            background-color: #ff6945;
           }
         }
       }
@@ -766,7 +785,6 @@ export default {
           font-weight: 500;
           line-height: 18px;
         }
-        
       }
       .count {
         .time {

src/pages/confirmOrder/addOrder/index.vue

@@ -238,8 +238,12 @@
                      size="mini">
             <el-option v-for="item in classifyList"
                        :key="item.id"
+                       style=" display: flex;justify-content: space-between ;align-items: center;line-height: inherit;"
                        :label="item.name"
                        :value="item.id">
+              <span style="float: left">{{ item.name }}</span>
+              <span v-if="item.recommend==1"
+                    style="float: right;color: #fa7d22ff;font-size: 13px;background: #ffefeb;border-radius: 4px;border: 1px solid #fa7d22;height: 18px;padding: 2px 6px;">推荐</span>
             </el-option>
           </el-select>
         </div>
@@ -252,8 +256,13 @@
                      size="mini">
             <el-option v-for="item in projectList"
                        :key="item.id"
+                       style=" display: flex;justify-content: space-between ;align-items: center;line-height: inherit; padding: 0 12px;"
                        :label="item.name"
-                       :value="item.id"></el-option>
+                       :value="item.id">
+              <span style="float: left">{{ item.name |ellipsis(14) }}</span>
+              <span v-if="item.recommend==1"
+                    style="float: right;color: #fa7d22ff;font-size: 13px;background: #ffefeb;border-radius: 4px;border: 1px solid #fa7d22;height: 18px;padding: 2px 6px;">推荐</span>
+            </el-option>
           </el-select>
         </div>
         <div class="products-select">
@@ -496,6 +505,7 @@ export default {
       });
     },
     addProject () {
+      this.classifyInfo = ""
       this.projectInfo = "";
       this.productsInfo = "";
       this.isEditProject = false;
@@ -614,11 +624,48 @@ export default {
         );
         return;
       }
-      this.getWeekDate();
-      this.getOrderTime();
-      this.order_time = "";
-      this.tsTableIndex = 0;
-      this.isTs = true;
+
+      let that = this;
+      let order_data = [];
+      this.order_data.project_list.forEach(item => {
+        let order_data_info = {};
+        order_data_info["id"] = item.id;
+        if (item.product_ids != "") {
+          order_data_info["product_id"] = item.product_ids;
+        }
+        order_data.push(order_data_info);
+      });
+      let params = {
+        user_id: this.userInfo.user_id,
+        order_data: JSON.stringify(order_data),
+        // order_day: this.tsTableList[this.tsTableIndex].order_day,
+        // order_time: this.timeIndexText
+      };
+      this.$loading({
+        lock: true,
+        text: '加载中',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      })
+      api.padOrderAdd(params).then(res => {
+        if (res.code == 200) {
+          this.$loading().close()
+          // 关闭当前页面并且跳转
+          that.$router.push({
+            path: "/confirmOrder/details",
+            query: {
+              id: res.data.order_id
+            }
+          });
+        }
+      });
+
+
+      // this.getWeekDate();
+      // this.getOrderTime();
+      // this.order_time = "";
+      // this.tsTableIndex = 0;
+      // this.isTs = true;
     },
     //确定时间选择
     comfigTs () {
@@ -1239,6 +1286,7 @@ export default {
       overflow: scroll;
       .coupon-info {
         width: 345px;
+        height: fit-content;
         margin-bottom: 20px;
         padding: 20px 14px 10px 14px;
         position: relative;

src/pages/confirmOrder/details/index.vue

@@ -203,9 +203,19 @@
              @click="isCoupun=false"><img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/slices/delete.png"
                alt=""></div>
         <div class="coupon-pupop-title">选择优惠券</div>
+        <div class="tatle">
+          <div class="tatle-list">
+            <div :class="['tatle-info',item.display==true?'tatle-info-active':'']"
+                 v-for="item,index in couponTatleList"
+                 @click="changeTable(item,index)"
+                 :key="index">{{item.name}}</div>
+          </div>
+        </div>
         <ul class="coupon-lists">
           <li class="coupon-info"
               v-for="item,index in couponList"
+              @click="selectPupop(item,index)"
+              :style="item.isSelect?'border: 1px solid #FA7D22;':''"
               :key="index">
             <!-- 1: '抵扣券',
       2: '满减券',
@@ -221,13 +231,12 @@
                 <div class="price-tips">{{item.full_price}}</div>
               </div>
               <div class="coupon-tip">
-                <div class="tips-title">{{item.coupon_name}}</div>
-                <div class="tips-ts">有效期至{{item.ex_time}}</div>
+                <div class="tips-title">{{item.coupon_name | ellipsis(14)}}</div>
+                <!-- <div class="tips-ts">有效期至{{item.ex_time}}</div> -->
               </div>
-              <div class="choice-icon"
-                   @click="selectPupop(item,index)"><img :src="item.isSelect?select:unSelect"></div>
+              <div class="choice-icon"><img :src="item.isSelect?select:unSelect"></div>
             </div>
-            <div class="bottom">
+            <!-- <div class="bottom">
               <div class="coupon-notes"
                    @click="isOver=!isOver">
                 <div class="notes-text min-size">
@@ -237,7 +246,7 @@
                 <div class="notes-icon"><img :src="isOver?open:unOpen"
                        alt=""></div>
               </div>
-            </div>
+            </div> -->
           </li>
         </ul>
         <div class="coupon-confirm"
@@ -259,8 +268,12 @@
                      size="mini">
             <el-option v-for="item in classifyList"
                        :key="item.id"
+                       style=" display: flex;justify-content: space-between ;align-items: center;line-height: inherit;"
                        :label="item.name"
                        :value="item.id">
+              <span style="float: left">{{ item.name }}</span>
+              <span v-if="item.recommend==1"
+                    style="float: right;color: #fa7d22ff;font-size: 13px;background: #ffefeb;border-radius: 4px;border: 1px solid #fa7d22;height: 18px;padding: 2px 6px;">推荐</span>
             </el-option>
           </el-select>
         </div>
@@ -274,7 +287,11 @@
             <el-option v-for="item in projectList"
                        :key="item.id"
                        :label="item.name"
+                       style=" display: flex;justify-content: space-between ;align-items: center;line-height: inherit; padding: 0 12px;"
                        :value="item.id">
+              <span style="float: left">{{ item.name |ellipsis(14) }}</span>
+              <span v-if="item.recommend==1"
+                    style="float: right;color: #fa7d22ff;font-size: 13px;background: #ffefeb;border-radius: 4px;border: 1px solid #fa7d22;height: 18px;padding: 2px 6px;">推荐</span>
             </el-option>
           </el-select>
         </div>
@@ -422,9 +439,11 @@
           </div>
         </div>
         <div v-else>
-          <div class="pay-title">支付成功</div>
+          <div class="pay-title">支付完成</div>
           <div class="pay-suc"><img src="https://we-spa.oss-cn-shenzhen.aliyuncs.com/pad_clerk/icon/coupon/paySuc.png"
                  alt=""></div>
+          <div class="suc-tips">美容项目即将开始</div>
+          <div class="suc-zoom">请带领用户移步到 <span class="device_name">{{device_name}}</span> <span class="zoom">{{room}}</span></div>
           <div class="pay-button"
                @click="toHome">返回首页</div>
         </div>
@@ -498,6 +517,25 @@ export default {
           isSelect: false
         },
       ],
+      //优惠券类型
+      couponTatleList: [
+        {
+          id: 0,
+          name: '用户券',
+          display: true
+        },
+        {
+          id: 1,
+          name: '美团',
+          display: false
+        },
+        {
+          id: 2,
+          name: '抖音券',
+          display: false
+        },
+      ],
+      platform: 0,
       timesInfo: '',
       reservationPrice: 0,//预约费用
       projectInfo: '',
@@ -530,6 +568,8 @@ export default {
       showMoney: 0, // 价值总额
       discountPrice: 0,//活动后金额
       discount: 0,//折扣类型
+      device_name: '',//支付成功后的设备
+      room: '',//设备房间
       // showRuleText: 10086,
 
     };
@@ -577,7 +617,6 @@ export default {
             this.order_data.discountPrice = this.showMoney
           }
         })
-        console.log(Number(this.order_data.discountPrice).toFixed(2), 'this.order_data.discountPrice.toFixed(2)');
         this.discountPrice = Number(this.order_data.discountPrice).toFixed(2)
         this.calculationPrice()
       })
@@ -626,6 +665,7 @@ export default {
       })
     },
     addProject () {
+      this.classifyInfo = ''
       this.projectInfo = ''
       this.productsInfo = ''
       this.isEditProject = false
@@ -732,11 +772,40 @@ export default {
     //确定订单&支付
     determine () {
       if (this.isChange) {
-        this.getWeekDate()
-        this.getOrderTime()
-        this.order_time = ''
-        this.tsTableIndex = 0
-        this.isTs = true
+        let order_data = []
+        this.order_data.project_list.forEach(item => {
+          let order_data_info = {}
+          order_data_info['id'] = item.id
+          if (item.product_ids != "") {
+            order_data_info['product_id'] = item.product_ids
+          }
+          order_data.push(order_data_info)
+        })
+        let params = {
+          id: this.id,
+          order_data: JSON.stringify(order_data),
+          // order_day: this.tsTableList[this.tsTableIndex].order_day,
+          // order_time: this.timeIndexText
+        }
+        this.$loading({
+          lock: true,
+          text: '加载中',
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.7)'
+        })
+        api.setOrderUpdate(params).then(res => {
+          this.$loading().close()
+          if (res.code == 200) {
+            this.getOrderInfo()
+            this.isTs = false
+            this.isChange = false
+          }
+        })
+        // this.getWeekDate()
+        // this.getOrderTime()
+        // this.order_time = ''
+        // this.tsTableIndex = 0
+        // this.isTs = true
       } else {
         this.choicePayType = true
       }
@@ -780,17 +849,33 @@ export default {
         this.reservationPrice += Number(res.price)
       })
     },
+    //切换优惠券tatle
+    changeTable (item, index) {
+      this.couponTatleList.forEach((res, i) => {
+        if (index == i) {
+          res.display = true
+          this.platform = item.id
+          this.couponList = []
+          this.page = 1
+          this.onCoupon()
+        } else {
+          res.display = false
+        }
+      })
+    },
 
     //获取订单优惠券
+
     onCoupon () {
       if (this.couponList.length > 0) {
         this.isCoupun = true
         return
       }
-
+      // platform 优惠券平台，0本地（用户券:默认），1美团券，2抖音券
       let params = {
         id: this.id,
         page: this.page,
+        platform: this.platform,
         limit: this.limit
       }
       api.getOrderCoupon(params).then(res => {
@@ -830,13 +915,17 @@ export default {
       let coupon_data = []
       if (this.isSelectCoup.length > 0) {
         this.isSelectCoup.forEach(item => {
-          if (item.type != 4) {
-            params['coupon_id'] = item.id
+          if (this.platform != 0) {
+            params['scoupon_id'] = item.id
           } else {
-            let couponInfo = {}
-            couponInfo['id'] = item.projectids
-            couponInfo['coupon_id'] = item.id
-            coupon_data.push(couponInfo)
+            if (item.type != 4) {
+              params['coupon_id'] = item.id
+            } else {
+              let couponInfo = {}
+              couponInfo['id'] = item.projectids
+              couponInfo['coupon_id'] = item.id
+              coupon_data.push(couponInfo)
+            }
           }
         })
       }
@@ -863,7 +952,6 @@ export default {
             }, 1000)
           }
         }
-
       })
     },
     changePayStatus () {
@@ -876,6 +964,8 @@ export default {
       api.payStatus({ id: this.id, }).then(res => {
         if (res.data.pay_status == 1) {
           clearInterval(this.payStatusInterval)
+          this.device_name = res.data.device_name
+          this.room = res.data.room
           this.isPayCode = false
         }
       })
@@ -1629,7 +1719,7 @@ export default {
     background: #ffffff;
     border-radius: 8px;
     position: relative;
-    padding: 42px;
+    padding: 40px 20px;
     .delete-pupop {
       width: 32px;
       position: absolute;
@@ -1647,29 +1737,60 @@ export default {
       line-height: 20px;
       text-align: center;
     }
+    .tatle {
+      margin-top: 20px;
+      .tatle-list {
+        display: flex;
+        padding-left: 20px;
+        .tatle-info {
+          width: 104px;
+          height: 30px;
+          line-height: 30px;
+          margin-left: 10px;
+          background: #f7f8fa;
+          border-radius: 10px 10px 0px 0px;
+          font-size: 14px;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #999999;
+          text-align: center;
+        }
+        .tatle-info-active {
+          background: #fffaf6;
+          color: #fa7d22;
+        }
+      }
+    }
     .coupon-lists {
       display: inline-block;
       position: relative;
+      width: 100%;
+      background: #fffaf6;
+      border-radius: 8px;
       left: 50%;
       transform: translateX(-50%);
-      margin-top: 20px;
+      padding: 10px 10px 0 10px;
+      display: flex;
+      flex-wrap: wrap;
       height: 228px;
       overflow: scroll;
       .coupon-info {
-        width: 345px;
+        margin-left: 10px;
+        width: 225px;
+        height: fit-content;
         margin-bottom: 20px;
         padding: 20px 14px 10px 14px;
         position: relative;
-        background: #fff4e6;
-        border-radius: 12px;
+        background: #ffffff;
+        border-radius: 8px;
         .coupon-tips-text {
           position: absolute;
           left: 0;
           top: 0;
           padding: 0 8px;
           height: 18px;
-          background: #875617;
-          border-radius: 12px 0px 12px 0px;
+          background: #fa7d22;
+          border-radius: 8px 0px 8px 0px;
           font-size: 12px;
           font-family: PingFangSC-Medium, PingFang SC;
           font-weight: 500;
@@ -1681,9 +1802,9 @@ export default {
         .top {
           display: flex;
           justify-content: space-between;
-          align-items: center;
+          align-items: end;
           padding-bottom: 10px;
-          border-bottom: 1px dashed #ffdfb6;
+          // border-bottom: 1px dashed #ffdfb6;
           .all-free {
             font-size: 22px;
             font-family: PingFangSC-Medium, PingFang SC;
@@ -1712,6 +1833,7 @@ export default {
             }
           }
           .discount-over {
+            width: 50px;
             font-size: 22px;
             font-family: PingFangSC-Medium, PingFang SC;
             font-weight: 500;
@@ -1720,10 +1842,11 @@ export default {
           }
           .coupon-tip {
             .tips-title {
-              font-size: 16px;
+              width: 126px;
+              font-size: 14px;
               font-family: PingFangSC-Medium, PingFang SC;
               font-weight: 500;
-              color: #875617;
+              color: #333333;
               line-height: 22px;
             }
             .tips-ts {
@@ -2000,7 +2123,7 @@ export default {
       }
     }
     .pay-title {
-      font-size: 14px;
+      font-size: 16px;
       font-family: PingFangSC-Medium, PingFang SC;
       font-weight: 500;
       color: #333333;
@@ -2009,12 +2132,39 @@ export default {
     }
     .pay-suc {
       margin-top: 40px;
-      margin-bottom: 80px;
       text-align: center;
       img {
         width: 140px;
       }
     }
+    .suc-tips {
+      text-align: center;
+      margin-top: 20px;
+      font-size: 14px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333333;
+      line-height: 20px;
+    }
+    .suc-zoom {
+      text-align: center;
+      margin-top: 23px;
+      font-size: 14px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #333333;
+      line-height: 20px;
+      .device_name {
+        margin-left: 10px;
+        color: #fa7d22;
+      }
+      .zoom {
+        margin-left: 10px;
+        font-size: 18px;
+        color: #fa7d22;
+      }
+    }
+
     .pay-price {
       margin-top: 10px;
       font-size: 14px;

vue.config.js

@@ -3,8 +3,12 @@
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
 module.exports = {
-  publicPath: process.env.env_config === 'prod' ? 'https://h5-cms-vue.ijolijoli.com/dist' :
+  // 测试
+  publicPath: process.env.env_config === 'prod' ? 'https://h5-cms-vue.ijolijoli.com/test_pad/dist' :
     process.env.env_config === 'test' ? '/vapps/calory/' : '/dist/',
+  // 正式
+  // publicPath: process.env.env_config === 'prod' ? 'https://h5-cms-vue.ijolijoli.com/dist' :
+  //   process.env.env_config === 'test' ? '/vapps/calory/' : '/dist/',
   // 设置跨域
   crossorigin: 'anonymous',
   /**
@@ -42,22 +46,22 @@ module.exports = {
   css: {
     loaderOptions: {
       postcss: {
-          plugins: [
-              require("postcss-px-to-viewport")({
-                unitToConvert: "px", // 把什么单位转换成vw
-                viewportWidth: 1000, // 视口宽度，设计稿宽度
-                viewportHeight: 600, // 视口高度，设计稿高度
-                unitPrecision: 5, // 转换成vw单位的小数点后的保留位数
-                propList: ["*"], // 属性列表，表示你要把哪些css属性的px转换成vw
-                viewportUnit: "vw", // 使用的单位，目前可选单位有vw,vh。
-                fontViewportUnit: "vw", // 字体使用的单位
-                selectorBlackList: ['van', 'el-'], // 匹配不被转换为vw的选择器
-                minPixelValue: 1,
-                mediaQuery: false,
-                replace: true, // 是否直接更换属性值，而不添加备用属性
-                exclude: /(\/|\\)(node_modules)(\/|\\)/,
-              })
-          ]
+        plugins: [
+          require("postcss-px-to-viewport")({
+            unitToConvert: "px", // 把什么单位转换成vw
+            viewportWidth: 1000, // 视口宽度，设计稿宽度
+            viewportHeight: 600, // 视口高度，设计稿高度
+            unitPrecision: 5, // 转换成vw单位的小数点后的保留位数
+            propList: ["*"], // 属性列表，表示你要把哪些css属性的px转换成vw
+            viewportUnit: "vw", // 使用的单位，目前可选单位有vw,vh。
+            fontViewportUnit: "vw", // 字体使用的单位
+            selectorBlackList: ['van', 'el-'], // 匹配不被转换为vw的选择器
+            minPixelValue: 1,
+            mediaQuery: false,
+            replace: true, // 是否直接更换属性值，而不添加备用属性
+            exclude: /(\/|\\)(node_modules)(\/|\\)/,
+          })
+        ]
       }
     }
   }