<template>
    <view class="info">
      <image
        class="logo"
        :src="logoUrl"
        mode="scaleToFill"
      />

      <view class="storeStatus">
        <view class="title1">{{storeName}}：</view> 
        <view class="status">
          <view>{{businessStatus === 1?'营业中':businessStatus === 0?'临时休息':businessStatus === -1?'休息':'禁用'}}</view>
          <view v-if="businessStatus === 1">(门店正常营业)</view>
          <view v-if="businessStatus === 0">({{switchOpenTime}})</view>
          <view v-if="businessStatus === -1">(门店已休息)</view>
          <view v-if="businessStatus === -2">(门店已禁用)</view>
        </view>
        <view class="title2">营业时间:</view>
        <view class="timeInfo" @tap="setTime">
          <view v-if="businessHours.timer1 != '00:00' && businessHours.timer2 != '00:00'">{{businessHours.timer1}}-{{businessHours.timer2}}</view>
          <view class="timRange2" v-if="businessHours.timer3 != '00:00' && businessHours.timer4 != '00:00'">{{businessHours.timer3}}-{{businessHours.timer4}}</view>
        </view>
      </view>
      <view class="time">
        <view v-for="(item,index) in businessStatusList" :key="index" 
          class="timeItem"
          :class="{'disabledColor':businessStatus === item.id}"
          @tap="setStatus(item)">
          <jx-icon
            v-if="businessStatus === item.id"
            icon="duihao"
            :size="38"
            color="#fff"
          ></jx-icon>
          {{ item.id === 1 && businessStatus === item.id && item.id!==0?'营业中':item.name }}
          <text v-if="item.id === -1">(不推荐)</text>
        </view>
      </view>

      <view class="notice">
        <view>临时休息：在休息一段时间后会自动恢复营业</view>
        <view>休息：在休息后，需要手动点击营业才会进行营业</view>
      </view>
    </view>

    <!-- 临时休息的时间弹框 -->
    <uni-popup ref="popupTime" type="center">
      <view class="jx-popup-update">
        <view class="text">临时休息</view>
        <view class="ipt">
          <radio-group @change="radioChange">
            <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in dayList" :key="index">
              <view class="item">
                <radio :value="item" :checked="index === currentTime" />{{item}}
              </view>
            </label>
          </radio-group>
        </view>
          <view class="btn-root">
            <view class="btn-esc"  @tap="popupTime.close()">取消</view>
            <view class="btn-ok" @tap="storeRest">确定</view>
          </view> 
      </view>
    </uni-popup>

    <!-- 公共组件 -->
    <jx-loading />
  </template>
  
  <script lang="ts" src="./setBusinessStatus" >
  </script>
  
  <style lang="scss" scoped>
  @import './setBusinessStatus.scss';
  </style>
  
  <style>
  page {
    background-color: #fff;
  }
  </style>