<template>
  <view class="check-mall">
    <view>
      <uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="">
        <view class="check-mall-title">切换商城</view>
        <view slot="left"></view>
        <view slot="right"></view>
      </uni-nav-bar>
    </view>
    <view v-for="(item, index) in enterpriseList" :key="index" @click="checkCompany(item, index)">
      <uni-list>
        <uni-list-item>
          <!-- 自定义 header -->
          <view slot="header" class="slot-box">
            <image class="slot-image check-mall-image" :src="item.logo || '/static/logo.png'" mode="scaleToFill"></image>
          </view>
          <!-- 自定义 body -->
          <view slot="body" class="slot-box check-mall-text">
            <view class="check-mall-text-textTitle">
              <text>{{ item.name }}</text>
            </view>
            <view class="check-mall-text-textSubTitle">
              <text>全部商品{{ item.productNumber }}</text>
            </view>
          </view>
          <view v-if="supplierId === item.supplierId" slot="footer" class="slot-box check-mall-sure"><icon type="success_no_circle" size="26" /></view>
        </uni-list-item>
      </uni-list>
    </view>
  </view>
</template>

<script>
import { back, go2 } from '@/utils/hook.js'
import { getStoreList } from '@/apis/add-paper.js'
export default {
  data() {
    return {
      companyData: [],
      enterpriseList: [],
      supplierId: null
    }
  },
  onLoad(option) {
    this.supplierId = option.supplierId
    this.queryData()
  },
  methods: {
    back,
    queryData() {
      getStoreList().then((res) => {
        console.log('==', res)
        this.enterpriseList = res
      })
    },
    // 选择切换企业
    checkCompany(item) {
      let isVip = new Date().getTime() - new Date(item.vipExpireDate).getTime() < 0
      this.$store.commit('setSupplierInfo', {
        id: item.id,
        name: item.name,
        fddEnterpriseStatus: item.fddEnterpriseStatus,
        supplierId: item.supplierId,
        isVip,
        vipExpireTime: item.vipExpireDate || null
      })
      go2('mall')
    }
  }
}
</script>

<style lang="scss">
.check-mall {
  .check-mall-title {
    width: 100%;
    font-size: 36rpx;
    color: #000000;
    letter-spacing: 0;
    text-align: center;
    font-weight: 500;
  }
  .check-mall-image {
    width: 100rpx;
    height: 100rpx;
    border-radius: 50%;
  }
  .check-mall-text {
    line-height: 60rpx;
    margin-left: 20rpx;
    width: 75%;
  }
  .check-mall-textTitle {
    font-size: 30rpx;
    color: #333333;
    letter-spacing: 0;
    font-weight: 500;
  }
  .check-mall-text-textSubTitle {
    font-size: 26rpx;
    color: #888888;
    letter-spacing: 0;
    text-align: left;
    line-height: 32rpx;
    font-weight: 400;
  }
  .check-mall-sure {
    padding-top: 20rpx;
  }
}
</style>
