<template><page-meta :root-font-size="fontSize+'px'"></page-meta>
    <member-base :show="false"><view class="div container">
      <view class="div common-header-wrap">
        <view :style="'height:'+navHeight+'px'"></view>
        <view class="common-header-holder"></view>
        <view class="common-header-fixed">
        <title-header />
        <uni-nav-bar title="店铺入驻" class="common-header" left-icon="back" @clickLeft="goBack()">
        </uni-nav-bar>
      </view>
      </view>
        <image mode="aspectFit" class="img back" :src="sellerjoininback" :style="'width:'+getBannerStyle.width+'px;height:'+getBannerStyle.height+'px'">
        <view class="div wrapper mt-20" v-if="config && config.store_joinin_open!=0">
            <view class="div btn-wrapper">
                <view v-if="config.store_joinin_open==1 || config.store_joinin_open==3" class="div common-btn ds-button-large btn" @click="nextStep(1)">个人入驻</view>
                <view v-if="config.store_joinin_open==1 || config.store_joinin_open==2" class="div common-btn ds-button-large btn" @click="nextStep(0)">企业入驻</view>
            </view>
            <view class="div">
                <checkbox-group @change="checkboxChange">
                        <view v-for="(item,index) in options" :key="index">
                            <checkbox :value="item.value" :checked="value==item.value" />
                            <text @click="onAgreement()">{{item.label}}</text>
                        </view>
                </checkbox-group>
            </view>
        </view>
    </view>
<uni-popup background-color="#fff" ref="confirm" type="dialog">
    <uni-popup-dialog :mode="dialog.mode" :title="dialog.title" :content="dialog.content" :placeholder="dialog.content" @confirm="confirmDialog" @close="closeDialog"></uni-popup-dialog>
</uni-popup>
</member-base>
</template>
<script>
import {getFontSize} from '@/util/common'

import TitleHeader from '../../TitleHeader'

import { urlencode } from '@/util/common'
import { env } from '../../../static/config'
import MemberBase from '../MemberBase'
import { mapState, mapMutations, mapActions } from 'vuex'
import { getStoreJoinin } from '../../../api/seller'
export default {
  components:{
  TitleHeader,
  MemberBase,
  },
  data(){
    return {
      navHeight: 0,
      dialog:{},
      options: [{ label: '《同意商家入驻协议》', value: '1' }],
      value: [1],
	  sellerjoininback: env.SITE_URL + "/uploads/home/h5/sellerjoinin_back.png"
    }
  },
  mounted(){
  // #ifdef  MP-WEIXIN
  this.navHeight = uni.getMenuButtonBoundingClientRect().top
  // #endif
  },
  computed:{
      fontSize(){
        return getFontSize()
      },
      ...mapState({
          config: state => state.config.config
      }),
        getBannerStyle: function () {
          const res = uni.getSystemInfoSync()
          var width = res.windowWidth
          var height = res.windowHeight
          let itemWidth = width
          let itemHeight = width * (612 / 500)
          return {
            width: itemWidth,
            height: itemHeight
          }
        },
  },
  created: function () {
    this.fetchConfig({}).then(
      response => {
      },
      error => {
        uni.showToast({icon:'none',title: error.message})
      }
    )
    getStoreJoinin().then(res => {
      var store_joinin = res.result.store_joinin
      if (store_joinin) {
          this.sellerJoininSave({ storeJoinin: store_joinin })
          if(store_joinin.joinin_state == 30){
              this.dialog={title:'初审失败',content:store_joinin.joinin_message}
              this.$refs.confirm.open()
          }
        if (store_joinin.joinin_state == 10 || store_joinin.joinin_state == 11 || store_joinin.joinin_state == 20 || store_joinin.joinin_state == 31) {
          uni.redirectTo({ url: '/pages/member/sellerjoinin/Step5' })
          return
        }
        if (store_joinin.joinin_state == 40) {
          uni.showToast({icon:'none',title: '您的店铺已开通'})
          return
        }


      }
    }).catch(error => {
      uni.showToast({icon:'none',title: error.message})
    })
  },
  methods:{
    checkboxChange(e){
      this.value = e.detail.value;
    },
    closeDialog(){
    },
    confirmDialog(value){
    },
    goBack(){uni.navigateBack({delta:1})},
    ...mapActions({
      fetchConfig: 'fetchConfig'
    }),
    ...mapMutations({
      sellerJoininSave: 'sellerJoininSave',
      sellerJoininTypeSave: 'sellerJoininTypeSave'
    }),
    nextStep (type) {
      this.sellerJoininTypeSave({ storeJoininType: type })
      uni.redirectTo({ url: '/pages/member/sellerjoinin/Step2' })
    },
    onAgreement () {
      uni.navigateTo({ url: '/pages/home/article/Document'+'?'+urlencode( { type: 'open_store' })})
    }
  }
}
</script>
<style  lang="scss" scoped>
.common-header-wrap .common-header{box-shadow: unset}
    .container {
        background: #fff;
    }
.back{width:100%}
    .btn-wrapper{display: flex;padding:0 .5rem}
    .btn{margin:0 .5rem;flex:1}
</style>
