<template>
    <view class="info">
      <!-- logo -->
      <view class="logo">
        <view class="vendor">
        <text :class="`icon icon-${vendorInfo.vendorID}`"></text>
        </view>
      </view>
      
      <!-- 平台名字 -->
      <view class="vendorName">{{vendorName[vendorInfo.vendorID]? vendorName[vendorInfo.vendorID]: '未知平台'}}</view>
  
      <!-- 营业状态 -->
      <view class="onlineStatus">
        <view  class="title" style="font-weight:bold">营业状态</view>
        <view style="margin-top:20rpx">（该状态表示第三方平台的营业状态）</view>
      </view>
      <view class="time">
        <view 
          class="timeItem" 
          :class="{'disabledColor':vendorInfo.status === item.id}"
          v-for="item in businessStatusList"
          @tap="setStatus(item)">
          <jx-icon
            v-if="vendorInfo.status === item.id"
            icon="duihao"
            :size="38"
            color="#fff"
          ></jx-icon>
          <text>{{ item.name }}</text>
        </view>
      </view>
  
      <view class="notice">
        <text class="text">该操作仅更新第三方平台（{{vendorName[vendorInfo.vendorID]? vendorName[vendorInfo.vendorID]: '未知'}}）的营业状态</text>
      </view>
    </view>
    
  
    <!-- 公共组件 -->
    <jx-loading />
  </template>
    
  <script lang="ts" setup>
  import { ref,computed } from 'vue'
  import { onLoad } from '@dcloudio/uni-app'
  import { store } from '@/store'
  import configCms from '@/utils/configCms'
  import merchant from '@/api/https/merchant';
  import { getStorage } from '@/utils/storage';
  import toast from "@/utils/toast";
  
  const vendorInfo = ref<AnyObject>({})
  const businessStatusList = ref([
          { id: 1, name: '营业' },
          { id: -1, name: '休息' },
          { id: -2, name: '下线' },
      ])
  
  onLoad((options:any) => {
    vendorInfo.value = JSON.parse(options.vendorInfo)
    // 目前美团门店不自持下线
    if(vendorInfo.value.vendorID === 1 ) businessStatusList.value = businessStatusList.value.filter(item => item.id!==-2)
  })
    
  /**
   * 平台名字
   */
  const vendorName = computed(() => {
    let storeInfo:AnyObject = configCms.serveInfo
    return storeInfo.vendorName
  })
  
  /**
   * 设置营业状态
   */
  async function setStatus(item:AnyObject) {
    if(item.id === vendorInfo.value.status) return
    let data = {
        storeID: getStorage('storeID'),
        vendorIDs: vendorInfo.value.vendorID + '',
        status: item.id
    }
    await merchant.update_vendors_store_states(data);
    await merchant.update_store_vendor_map({
      storeID:getStorage('storeID'),
      vendorID:vendorInfo.value.vendorID,
      payload:{
        status:item.id
      }
    })
    await store.dispatch('storeInfo/getOneStore',getStorage("storeID"))
    vendorInfo.value.status = item.id
    toast("操作成功", 1);
  }
  </script>
  
  <style lang="scss" scoped>
  @import './index.scss';
  </style>
  
  <style>
  page {
    background-color: #fff;
  }
  </style>