feat 绑定自运力优化

src/api/shop.js

@@ -48,7 +48,7 @@ export const setTakeOut = (params) => {
 }
 
 export const getDeliveryList = (params) => {
-  return get('app/delivery/list', params)
+  return get('app/deliveryBind/list', params)
 }
 
 export const bindDelivery = (params) => {
@@ -143,3 +143,11 @@ export const addUsbPrint = (params) => {
 export const getUsbPrint = (params) => {
   return get('app/shop/device/getUsbPrint', params)
 }
+// 获取外卖平台列表
+export const getWaimaiList = (params) => {
+  return post('app/waimai/waimais', params)
+}
+// 获取绑定配送平台列表
+export const getBindDeliveryShopList = (params) => {
+  return get('app/deliveryBind/shopList', params)
+}

src/components/shopCompoents/bindDelivery.vue

@@ -1,6 +1,33 @@
 <template>
-  <div v-loading="loading" element-loading-text="数据加载中">
-    <div v-if="deliveryList.length" class="take-out-list">
+  <!-- 1->绑定，0：未绑定，2-> 审核中，3->拒绝，4->待完善资料 -->
+  <div style="height: 100%;" v-loading="loading" element-loading-text="数据加载中">
+    <div class="content">
+      <div class="left">
+        <div :class="['list',curIndex === i ? 'active' : '']" v-for="(v,i) in deliveryList" :key="i" @click="changeTab(i)">
+          <img :src="v.logo" alt="" srcset="">
+          <div class="name">{{v.name}}</div>
+        </div>
+      </div>
+      <div class="right">
+        <div class="shop" v-for="(v,i) in shopList" :key="i">
+          <div class="top">
+            <div class="name">{{v.shopName}}</div>
+            <img  @click="editShop(v)" v-if="[1,9].includes(type)&& v.bindStatus === 1" src="../../../static/image/icon-edit.png" alt="">
+          </div>
+          <div class="shop-content">
+            <div class="info">
+              <div class="info-line">门店编号：{{type === 1 ? (v.dadaShopNo || '--') : type ===9 ? (v.dadaYzShopNo || '--') : type === 5 ? v.thirdShopId : '--'}}</div>
+              <div class="balance">账户余额：{{typeof v.balance === 'number' ? '￥ ' + v.balance : '--'}}</div>
+              <div class="refuse" v-if="type === 5 && v.bindStatus === 3">审核失败：{{v.msg}}</div>
+            </div>
+            <div v-if="type === 5 && [2,3].includes(v.bindStatus)" :class="['status',v.bindStatus === 2 ? '' : 'refuse']">{{v.bindStatus === 2 ? '审核中' : '审核失败'}}</div>
+          </div>
+          <div class="but" @click="bind(v)" v-if="!v.bindStatus || (type === 5 && v.bindStatus === 3)">绑定</div>
+          <div class="but unbind" @click="unbind(v)" v-if="v.bindStatus === 1">解绑</div>
+        </div>
+      </div>
+    </div>
+    <!-- <div v-if="deliveryList.length" class="take-out-list">
       <div class="item" v-for="(v, index) in deliveryList" :key="index">
         <div class="item-top">
           <div class="top-left">
@@ -22,7 +49,6 @@
               <div v-if="v.balance">账户余额：{{ v.balance }}</div>
             </div>
           </div>
-          <!-- 1->绑定，0：未绑定，2-> 审核中，3->拒绝，4->待完善资料 -->
           <div class="right" v-if="memberType === 2">
             <span class="reason">{{
               v.bindStatus === 2 ? "审核中" : v.bindStatus === 3 ? `已拒绝` : ""
@@ -34,8 +60,25 @@
         </div>
         <div v-if="v.bindStatus === 3" class="respect">{{ v.authMsg }}</div>
       </div>
-    </div>
-    <el-empty v-if="!deliveryList.length && !loading" description="暂无绑定配送平台！"></el-empty>
+    </div> -->
+    <!-- 账号绑定 -->
+    <el-dialog title="账号绑定" :visible.sync="centerDialogVisible3" width="40%" center>
+      <el-form ref="form" :model="params" label-width="100px">
+        <el-form-item label="商户编号">
+          <el-input v-model="params.merchantNo" placeholder="请输入商户编号"></el-input>
+        </el-form-item>
+        <el-form-item label="门店编号">
+          <el-input v-model="params.shopNo" placeholder="请输入门店编号"></el-input>
+        </el-form-item>
+        <el-form-item label="注册手机号">
+          <el-input v-model="params.mobile" placeholder="请输入手机号"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button  @click="againBind">重新绑定</el-button>
+          <el-button type="primary" @click="confirm">确认</el-button>
+        </el-form-item>
+      </el-form>
+    </el-dialog>
     <!-- UU跑腿 -->
     <el-dialog :title="title" :visible.sync="centerDialogVisible" width="40%" center>
       <el-form v-if="title === 'UU跑腿绑定'" :model="UUData" ref="UUData" label-width="80px" class="demo-ruleForm">
@@ -97,6 +140,7 @@ import {
   statusDelivery,
   cancelBindDelivery,
   unBindDelivery,
+  getBindDeliveryShopList,
 } from "../../api/shop";
 export default {
   data() {
@@ -121,6 +165,17 @@ export default {
         shopNo: "",
       },
       memberType: this.$store.state.userInfo.memberType,
+      curIndex: 0,
+      shopList: [],
+      params: {
+        bindId: "",
+        deliveryId: "",
+        shopId: "",
+        shopNo: "",
+        merchantNo: "",
+        mobile: "",
+      },
+      centerDialogVisible3: false,
     };
   },
   watch: {
@@ -151,6 +206,11 @@ export default {
       }
     },
   },
+  computed: {
+    type() {
+      return this.deliveryList[this.curIndex]?.deliveryType;
+    },
+  },
   created() {
     if (this.memberType !== 1) {
       this.getDeliveryList();
@@ -169,6 +229,47 @@ export default {
   // 12->货拉拉
   // 13-> 美图跑腿
   methods: {
+    editShop(v) {
+				this.shopId = v.shopId
+				this.params = {
+					bindId: v.bindId,
+					deliveryId: this.deliveryId,
+					shopId: v.shopId,
+					shopNo: this.type === 1 ? v.dadaShopNo : this.type === 9 ? v.dadaYzShopNo : v.shopNo,
+					merchantNo: v.thirdShopId,
+					mobile: v.account
+				}
+				this.centerDialogVisible3 = true
+			},
+    confirm() {},
+    againBind() {},
+    bind(v) {
+      console.log('点击绑定！', typeof this.type);
+				this.shopId = v.shopId
+				if (this.type === 5) {
+					this.shunFengShow = true
+					return
+				}
+				this.bindShop()
+    },
+    getBindDeliveryShopList() {
+      this.loading = true;
+      let deliveryId = this.deliveryList[this.curIndex].deliveryId;
+      getBindDeliveryShopList({ deliveryId }).then((res) => {
+        if (res.code === 200) {
+          this.shopList = res.data;
+        } else {
+          this.$message({
+            type: "error",
+            message: res.msg,
+          });
+        }
+        this.loading = false;
+      });
+    },
+    changeTab(i) {
+      this.curIndex = i;
+    },
     explainDelivery() {
       explainDelivery().then((res) => {
         // console.log(res);
@@ -179,6 +280,10 @@ export default {
       getDeliveryList().then((res) => {
         if (res.code === 200) {
           this.deliveryList = res.data;
+          let type = this.deliveryList[this.curIndex].deliveryType;
+          if ([1, 2, 5, 9, 13].includes(type)) {
+            this.getBindDeliveryShopList();
+          }
         } else {
           this.$message({
             type: "error",
@@ -551,6 +656,118 @@ export default {
   -moz-border-radius: 6px;
 }
 
+.content {
+  display: flex;
+  height: 100%;
+  .left {
+    display: flex;
+    flex-direction: column;
+    background: #fefefe;
+    height: 100%;
+    padding: 0 10px;
+
+    .active {
+      background: #ffffff;
+      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.12);
+      border-radius: 40px 2px 4px 40px;
+    }
+    .list {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+      cursor: pointer;
+      padding: 0 10px 0 10px;
+      img {
+        width: 30px;
+        height: 30px;
+        margin-right: 10px;
+      }
+      .name {
+        font-size: 16px;
+        white-space: nowrap;
+      }
+    }
+  }
+  .right {
+    display: flex;
+    flex-wrap: wrap;
+    margin-left: 10px;
+    width: 100%;
+    height: 100%;
+    overflow-y: auto;
+    .shop {
+      position: relative;
+      width: 365px;
+      height: 200px;
+      background: #ffffff;
+      box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
+      border-radius: 8px;
+      margin: 0 20px 20px 0;
+      overflow: hidden;
+      .top {
+        padding: 20px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        .name {
+          font-size: 18px;
+          font-weight: 500;
+          line-height: 25px;
+          color: #333333;
+        }
+        img {
+          width: 30px;
+          height: 30px;
+          cursor: pointer;
+        }
+      }
+      .shop-content {
+        padding: 20px 0;
+        margin: 0 20px;
+        display: flex;
+        justify-content: space-between;
+        border-top: 1px solid #ebebeb;
+        .info {
+          font-size: 14px;
+          font-weight: 500;
+          line-height: 20px;
+          color: #333333;
+          .balance {
+            margin: 10px 0;
+          }
+        }
+        .status {
+          padding: 0 5px;
+          font-size: 14px;
+          height: 20px;
+          line-height: 20px;
+          color: #007aff;
+          border: 1px solid #007aff;
+          transform: rotate(-20deg);
+        }
+        .refuse {
+          color: #999999;
+          border: 1px solid #999999;
+        }
+      }
+      .but {
+        position: absolute;
+        left: 0;
+        bottom: 0;
+        width: 100%;
+        height: 30px;
+        line-height: 30px;
+        text-align: center;
+        color: #ffffff;
+        background: #fc7200;
+        cursor: pointer;
+      }
+      .unbind {
+        background: rgba(252, 114, 0, 0.6);
+      }
+    }
+  }
+}
 .take-out-list {
   .item {
     background-color: #fff;

src/components/shopInfo.vue

@@ -20,7 +20,7 @@
     </el-row>
 
     <el-row class="content">
-      <el-col :span="24">
+      <el-col style="height: 100%;" :span="24">
         <component v-if="renderComponent" :is="activeName"></component>
       </el-col>
     </el-row>
@@ -168,6 +168,7 @@ export default {
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
 .shopInfo {
+  height: 100%;
   .order_tab {
     width: 100%;
     height: 74px;
@@ -213,6 +214,7 @@ export default {
 
   .content {
     width: 100%;
+    height: calc(100% - 84px);
     margin-top: 10px;
   }
 }