bug fixes

src/pages/shop/index.vue

@@ -6,14 +6,19 @@
           <el-button type="primary" size="mini" @click="addShop">创建店铺</el-button>
         </div>
       </template>
-      <div class="shop-list" v-if="list.length">
-        <div class="item" v-for="item in list" :key="item.shop_id" @click="entryShop(item)">
-          <h2 class="title">{{ item.shop_name }}</h2>
-          <p>主体信息：{{ item.business_entity }}</p>
-          <p>有效期至：{{ format(item.end_time) }}</p>
-          <span class="type">{{ typeName(item.shop_type) }}</span>
+      <template v-if="list.length">
+        <ul class="shop-filter">
+          <li>所有店铺</li>
+        </ul>
+        <div class="shop-list">
+          <div class="item" v-for="item in list" :key="item.shop_id" @click="entryShop(item)">
+            <h2 class="title">{{ item.shop_name }}</h2>
+            <p>主体信息：{{ item.business_entity }}</p>
+            <p>有效期至：{{ format(item.end_time) }}</p>
+            <span class="type">{{ typeName(item.shop_type) }}</span>
+          </div>
         </div>
-      </div>
+      </template>
       <div class="shop-tips" v-else>
         <p>请<router-link to="/shop/add">创建</router-link>你的专属店铺</p>
       </div>
@@ -92,6 +97,15 @@ export default {
   align-items: center;
   justify-content: flex-end;
 }
+.shop-filter {
+  display: flex;
+  margin: 10px 0 20px;
+  li {
+    color: var(--main-color);
+    cursor: pointer;
+    margin: 0 5px;
+  }
+}
 .shop-list {
   overflow: hidden;
   display: flex;
@@ -140,5 +154,8 @@ export default {
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
+  a {
+    color: var(--main-color);
+  }
 }
 </style>