Merge branch 'feature/20190729-one-key-close' into 'test'

Feature/20190729 one key close

See merge request !5

src/components/basic/popup/index.vue

+<template>
+  <block v-if="visible">
+    <view
+      v-if="mask !== 'none'"
+      class="base-popup-mask"
+      :style="{ 'background-color': mask, 'z-index': zIndex }"
+      @click="tapMask"
+    ></view>
+    <view class="base-popup-wrap" :class="position" :style="{ 'z-index': zIndex + 1 }">
+      <view class="base-popup" :class="currClass" :style="{ transition: transition }">
+        <slot></slot>
+      </view>
+    </view>
+  </block>
+</template>
+
+<script>
+const POSITION_LIST = ['center', 'top', 'bottom', 'left', 'right']
+
+export default {
+  props: {
+    // 弹窗的显示与隐藏
+    show: {
+      type: Boolean,
+      default: false,
+    },
+    /**
+     * 蒙层颜色
+     * none - 不显示蒙层
+     */
+    mask: {
+      type: String,
+      default: 'rgba(0, 0, 0, 0.6)',
+    },
+    // 是否点击蒙层关闭弹窗
+    closeOnTapMask: {
+      type: Boolean,
+      default: true,
+    },
+    /**
+     * 弹窗显示的位置
+     * 可取值：center，top，bottom，left，right
+     */
+    position: {
+      type: String,
+      default: 'center',
+      validator(val) {
+        return POSITION_LIST.includes(val)
+      },
+    },
+    /**
+     * 过渡动画
+     * none - 无动画
+     */
+    transition: {
+      type: String,
+      default: 'all 0.3s',
+    },
+    // 动画时间，单位毫秒(ms)
+    duration: {
+      type: Number,
+      default: 300,
+    },
+    // 弹窗层级
+    zIndex: {
+      type: Number,
+      default: 100,
+    },
+  },
+  data() {
+    return {
+      visible: false,
+      currClass: '',
+    }
+  },
+  watch: {
+    show: {
+      handler(val) {
+        if (this.transition && this.transition !== 'none') {
+          if (val) {
+            this.visible = val
+            this.currClass = `${this.position}-hidden`
+            this.$nextTick().then(() => {
+              this.currClass = `${this.position}-visible`
+            })
+          } else {
+            this.currClass = `${this.position}-hidden`
+            setTimeout(() => {
+              this.visible = val
+            }, this.duration)
+          }
+        } else {
+          this.visible = val
+        }
+      },
+      immediate: true,
+    },
+  },
+
+  methods: {
+    tapMask() {
+      if (this.closeOnTapMask) this.$emit('update:show', false)
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.base-popup-mask {
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
+.base-popup-wrap {
+  position: fixed;
+  box-sizing: border-box;
+  &.center {
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+  &.top,
+  &.bottom {
+    left: 0;
+    width: 100%;
+  }
+  &.top {
+    top: 0;
+  }
+  &.bottom {
+    bottom: 0;
+  }
+  &.left,
+  &.right {
+    top: 0;
+    height: 100%;
+    .base-popup {
+      height: 100%;
+    }
+  }
+  &.left {
+    left: 0;
+  }
+  &.right {
+    right: 0;
+  }
+  .base-popup {
+    &.center-visible {
+      transform: scale(1) scaleZ(1);
+    }
+    &.center-hidden {
+      transform: scale(0) scaleZ(1);
+    }
+    &.top-visible,
+    &.bottom-visible {
+      transform: translateY(0) translateZ(0);
+    }
+    &.top-hidden {
+      transform: translateY(-100%) translateZ(0);
+    }
+    &.bottom-hidden {
+      transform: translateY(100%) translateZ(0);
+    }
+    &.left-visible,
+    &.right-visibl {
+      transform: translateX(0) translateZ(0);
+    }
+    &.left-hidden {
+      transform: translateX(-100%) translateZ(0);
+    }
+    &.right-hidden {
+      transform: translateX(100%) translateZ(0);
+    }
+  }
+}
+</style>

src/pages/marketing/group/detail/index.vue

@@ -117,7 +117,8 @@
         <view class="no-content" v-else>暂无商品详情</view>
       </view>
     </view>
-    <view class="bottom-option">
+    <view v-if="hasCloseStore" class="store-closed">本店已打烊</view>
+    <view v-else class="bottom-option">
       <view class="navigation">
         <view class="item" @click="toHome">
           <image
@@ -217,6 +218,13 @@ export default {
       limitCount: -1,
     }
   },
+  computed: {
+    hasCloseStore() {
+      const { store_setting = {} } = this.$store.state
+      const { store_temporary_closed = 0 } = store_setting
+      return store_temporary_closed
+    },
+  },
 
   onLoad({ id, storeId }) {
     this._storeId = storeId
@@ -229,8 +237,8 @@ export default {
       if (this._setStoreId) {
         this.$store.commit('SET_STORE_ID', this._storeId)
         this._setStoreId = false
-        storeModel.info()
       }
+      storeModel.info()
       this.fetchGroupDetail()
     })
   },
@@ -775,6 +783,20 @@ $bottomOptionHeight: 100rpx;
   }
 }
 
+.store-closed {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 12;
+  height: 120rpx;
+  text-align: center;
+  line-height: 120rpx;
+  font-size: 34rpx;
+  color: #fff;
+  background-color: rgba(0, 0, 0, 0.75);
+}
+
 .bottom-option {
   position: fixed;
   bottom: 0;

src/pages/marketing/group/share/index.vue

@@ -195,6 +195,13 @@ export default {
       isVisiblePay: false, // 是否弹出支付组件
     }
   },
+  computed: {
+    hasCloseStore() {
+      const { store_setting = {} } = this.$store.state
+      const { store_temporary_closed = 0 } = store_setting
+      return store_temporary_closed
+    },
+  },
 
   onLoad({ teamId, style = 0, status = 0, storeId }) {
     this._storeId = storeId
@@ -208,8 +215,8 @@ export default {
       if (this._setStoreId) {
         this.$store.commit('SET_STORE_ID', this._storeId)
         this._setStoreId = false
-        storeModel.info()
       }
+      storeModel.info()
       const { style, status } = this
       if (style == 0 && status == 0) {
         // 待支付
@@ -434,6 +441,7 @@ export default {
       })
     },
     toPay() {
+      if (this.hasCloseStore) return prompt.toast('本店已打烊')
       if (this.disablePay) return
       this.payParams = this._payParams
       this.togglePayVisible(true)
@@ -443,6 +451,7 @@ export default {
       storage.set('upd-unpay-group-order', true)
     },
     toJoin() {
+      if (this.hasCloseStore) return prompt.toast('本店已打烊')
       this.$refs.goodsBuy.show()
     },
     goodsConfirm(e) {

src/pages/store/goods/list/index.vue

@@ -96,7 +96,7 @@
                   class="item"
                   :class="[item.id === firstCategoryActiveId ? 'active' : '']"
                   @click="selectFirstCategory"
-                  v-for="(item, index) in firstCategoryList"
+                  v-for="item in firstCategoryList"
                   :key="item.id"
                   :data-id="item.id"
                   :data-child="item._child"
@@ -272,7 +272,10 @@
                                   <view class="new-custom">{{ item.sell_price }}</view>
                                 </view>
                               </view>
-                              <view class="goods-control">
+                              <view
+                                v-if="!store_setting.store_temporary_closed"
+                                class="goods-control"
+                              >
                                 <cart-control
                                   :foodInfo="item"
                                   :foodNum="foodNum[item.id]"
@@ -306,8 +309,9 @@
           </view>
         </view>
         <!-- 购物车 -->
+        <view v-if="store_setting.store_temporary_closed" class="store-closed">本店已打烊</view>
         <cart
-          id="cartComponent"
+          v-else
           :cart-data="cartData"
           :cart-count="cartCount"
           @cartFoodAdd="cartFoodAdd"
@@ -533,7 +537,7 @@
                               <view class="new-custom">{{ item.sell_price }}</view>
                             </view>
                           </view>
-                          <view class="goods-control">
+                          <view v-if="!store_setting.store_temporary_closed" class="goods-control">
                             <cart-control
                               :foodInfo="item"
                               :foodNum="foodNum[item.id]"
@@ -565,8 +569,9 @@
         </view>
       </view>
       <!-- 购物车 -->
+      <view v-if="store_setting.store_temporary_closed" class="store-closed">本店已打烊</view>
       <cart
-        id="cartComponent"
+        v-else
         :cart-data="cartData"
         :cart-count="cartCount"
         @cartFoodAdd="cartFoodAdd"
@@ -810,6 +815,7 @@ export default {
   onShow() {
     if (this.firstLoad && !this.isStopUpdate) {
       this.showLoading()
+      storeModel.info()
       // 待优化
       this.pageIndex = 1
       Promise.all([this.getGoodsList(), this.getCartData()])
@@ -2863,6 +2869,20 @@ page {
   color: #fff;
 }
 
+.store-closed {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 12;
+  height: 120rpx;
+  text-align: center;
+  line-height: 120rpx;
+  font-size: 34rpx;
+  color: #fff;
+  background-color: rgba(0, 0, 0, 0.75);
+}
+
 .sale-detail-mark {
   position: fixed;
   top: 0;