feat 商户信息-我的店铺

src/components/platformAccount/index.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="platform-account">
     <div class="address-list">
-      <div class="item" v-for="(v,i) in accountList" :key=i @click.stop="showAccount(1,v)">
-        <div class="name">{{v.name}}</div>
-        <div class="name">{{v.mobile}}</div>
+      <div class="item" v-for="(v,i) in accountList" :key="i">
+        <div class="name">{{v.name}} {{v.mobile}}</div>
+        <!-- <div class="name">{{v.mobile}}</div> -->
         <div class="shop-name">{{v.shopName}}</div>
         <div class="btns">
           <img @click.stop="showAccount(1,v)" src="../../../static/image/edit-icon.png" alt="">

src/components/shopCompoents/shopList.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="shopList" v-loading="loading" element-loading-text="数据加载中">
-    <div class="header" v-if="shopList.length">
+    <!-- <div class="header" v-if="shopList.length">
       <div class="left">
         <div class="line">
           <div class="b_line"></div>
@@ -27,12 +27,40 @@
       </el-table-column>
       <el-table-column fixed="right" label="操作" width="100" align="center">
         <template slot-scope="scope">
-          <el-button class="btn" size="mini" @click.stop="addShop(2, scope.row)">修改</el-button>
-          <!-- <el-button type="danger" size="mini" @click.stop="deleteItem(scope.row)">删除</el-button> -->
-        </template>
+          <el-button class="btn" size="mini" @click.stop="addShop(2, scope.row)">修改</el-button> -->
+    <!-- <el-button type="danger" size="mini" @click.stop="deleteItem(scope.row)">删除</el-button> -->
+    <!-- </template>
       </el-table-column>
     </el-table>
-    <el-empty v-if="!shopList.length && !loading" description="暂无门店数据！"></el-empty>
+    <el-empty v-if="!shopList.length && !loading" description="暂无门店数据！"></el-empty> -->
+    <div class="shop-list">
+      <div class="item" v-for="(v,i) in shopList" :key=i>
+        <div class="shop-top">
+          <div class="code">门店编号：{{v.code}}</div>
+          <div class="edit" @click.stop="addShop(2, v)">编辑</div>
+        </div>
+        <div class="cell">
+          <img class="img" src="../../../static/image/shop-name.png" alt="">
+          <div class="con">{{v.name}}</div>
+        </div>
+        <div class="cell">
+          <img class="img" src="../../../static/image/shop-address.png" alt="">
+          <div class="con1">{{v.poiAddress}}{{v.address}}</div>
+        </div>
+        <div class="cell">
+          <img class="img" src="../../../static/image/shop-contact.png" alt="">
+          <div class="con1">{{v.contactName}} {{v.mobile}}</div>
+        </div>
+        <div class="delivery">
+          <div class="name">配送运力：</div>
+          <img class="img" :src="d.logo" v-for="(d,idx) in v.deliveries" :key="idx" alt="">
+        </div>
+      </div>
+      <div class="item1" @click.stop="addShop(1)">
+        <img class="img" src="../../../static/image/icon-add.png" alt="">
+        <div class="shop-name">添加门店</div>
+      </div>
+    </div>
     <shop-add @getData="getData" ref="shopAdd" :products="productList"></shop-add>
   </div>
 </template>
@@ -41,7 +69,7 @@
 import shopAdd from "./shopAdd";
 import { getShopList, getProductList, shopDelete } from "../../api/shop";
 export default {
-  name: 'shopList',
+  name: "shopList",
   components: {
     shopAdd,
   },
@@ -53,7 +81,7 @@ export default {
       memberType: this.$store.state.userInfo.memberType,
     };
   },
-  watch:{
+  watch: {
     "$store.state.userInfo": {
       handler(newVal, oldVal) {
         this.memberType = newVal.memberType;
@@ -82,7 +110,16 @@ export default {
       this.loading = true;
       getShopList().then((res) => {
         if (res.code === 200) {
-          this.shopList = res.data;
+          this.shopList = res.data.map((v) => {
+            if (
+              v.poiAddress === "null" ||
+              v.poiAddress === "undefined" ||
+              !v.poiAddress
+            ) {
+              v.poiAddress = "";
+            }
+            return v;
+          });
         } else {
           this.$message({
             type: "error",
@@ -136,87 +173,108 @@ export default {
 
 <style lang="scss">
 .shopList {
-  width: 100%;
-  background: #ffffff;
-  min-height: calc(100vh - 184px);
-  padding: 20px;
-  box-sizing: border-box;
-
-  .header {
+  .shop-list {
     display: flex;
-    align-items: center;
-    justify-content: space-between;
-
-    .left {
+    flex-wrap: wrap;
+    .item {
+      position: relative;
       display: flex;
-      align-items: center;
-
-      .line {
-        position: relative;
-        width: 4px;
-        height: 15px;
-        background: #fc7200;
-        border-radius: 4px;
-        overflow: hidden;
-        margin-right: 10px;
-
-        .b_line {
-          width: 100px;
-          height: 6px;
-          background: #462bf7;
+      flex-direction: column;
+      width: 290px;
+      height: 150px;
+      background: rgba(255, 255, 255, 0.39);
+      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
+      margin: 10px 20px 0 0;
+      padding: 16px;
+      border-radius: 8px;
+      overflow: hidden;
+      cursor: pointer;
+      .shop-top {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding-bottom: 8px;
+        border-bottom: 1px solid #ebebeb;
+        .code {
+          font-size: 14px;
+          font-weight: 400;
+          line-height: 20px;
+          color: #999999;
         }
-
-        .triangle {
-          width: 0;
-          height: 0;
-          border-top: 100px solid #462bf7;
-          border-left: 100px solid transparent;
+        .edit {
+          font-size: 14px;
+          font-weight: 500;
+          line-height: 20px;
+          color: #fc7200;
         }
       }
-
-      .label {
+      .cell {
+        display: flex;
+        align-items: center;
+        margin-top: 8px;
+        .img {
+          width: 12px;
+          height: 12px;
+          margin-right: 5px;
+        }
+        .con {
+          font-size: 16px;
+          font-weight: bold;
+          line-height: 20px;
+          color: #333333;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+        }
+        .con1 {
+          font-size: 14px;
+          font-weight: 400;
+          line-height: 20px;
+          color: #333333;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+        }
+      }
+      .delivery {
+        display: flex;
+        align-items: center;
+        border-top: 1px solid #ebebeb;
+        margin-top: 8px;
+        padding-top: 8px;
+        .name {
+          flex-shrink: 0;
+          font-size: 14px;
+          font-weight: 400;
+          line-height: 20px;
+          color: #333333;
+        }
+        .img {
+          width: 16px;
+          height: 16px;
+          margin-left: 10px;
+        }
+      }
+    }
+    .item1 {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      background: #ffffff;
+      width: 322px;
+      height: 182px;
+      box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
+      border-radius: 8px;
+      margin: 10px 20px 0 0;
+      cursor: pointer;
+      .shop-name {
         font-size: 16px;
         font-weight: 500;
-        color: #0d1e40;
+        line-height: 22px;
+        color: #333333;
       }
     }
   }
-
-  .btn {
-    background: #fc7200;
-    border-color: #fc7200;
-    color: #fff;
-
-    &.black {
-      background: #0d1e40;
-      border-color: #0d1e40;
-    }
-  }
-
-  .el-table th.el-table__cell {
-    height: 38px;
-    background: #fafafa;
-    padding: 0;
-    font-size: 12px;
-    color: #666666;
-  }
-
-  .el-table .el-table__cell {
-    font-size: 14px;
-    color: #222222;
-  }
-
-  .imgs {
-    display: flex;
-    align-items: center;
-    padding-left: 36px;
-
-    .img {
-      width: 20px;
-      height: 20px;
-      border-radius: 50%;
-      margin-right: 10px;
-    }
-  }
 }
 </style>

src/components/waimaiComponents/addressManagement.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="address-management">
     <div class="printer-list">
-      <div class="item" v-for="(v,i) in addressList" :key=i @click.stop="showAddress(1,v)">
+      <div class="item" v-for="(v,i) in addressList" :key="i">
         <div class="name">{{v.contact}} {{v.phone}}</div>
         <div class="shop-name">{{v.address}}</div>
         <div class="btns">

src/components/waimaiComponents/printerList.vue

@@ -19,7 +19,7 @@
         </div>
       </div>
       <div class="printer-list">
-        <div class="item" v-for="(v,i) in printerList" :key=i @click.stop="addPrinter(v)">
+        <div class="item" v-for="(v,i) in printerList" :key="i">
           <img class="img" :src="require(`../../../static/image/printer-online-${v.onlineStatus}.png`)" alt="">
           <div class="name">{{v.name}}</div>
           <div class="shop-name">{{v.shopName}}</div>
@@ -51,7 +51,7 @@ import {
   deviceDelete,
   deviceStatus,
   printTest,
-  shopListNew
+  shopListNew,
 } from "../../api/shop";
 export default {
   name: "printerList",
@@ -79,7 +79,6 @@ export default {
             type: "success",
             message: "操作成功！",
           });
-          this.refreshData();
         } else {
           this.$message({
             type: "error",