import {Component, Vue, Watch} from 'vue-property-decorator';
import Http from "../../extend/Http";
import Utils from "../../extend/Utils";
import router from "../../router";
import {Getter, Action} from 'vuex-class';
import {IndexData} from '@/types/views/index.interface';
import Carousel from '@/components/Carousel/Carousel.vue';
// import {  } from "@/components" // 组件
import {Message} from "element-ui";

@Component({
    components: {
    },
})
export default class Index extends Vue {
    // Getter
    // @Getter author

    // Action
    // @Action GET_DATA_ASYN: any;

    // data
    data: any = {
        markShow:false,
        appid:'wx98622dc60a8a6abb',
        show: 1,
        bannerlist:'',
        id_card: null,
        is_town: true,
        lastRowMargin: ''
    };
    private citycode = localStorage.getItem("citycode");
    private cityname = localStorage.getItem("cityname");

   async  created() {
        let resbanner = await Http.getInstance().getBannerList();
        console.log('resbanner', resbanner);
        this.data.bannerlist = resbanner.data;
        if(localStorage.getItem('access_token')){
            let res = await Http.getInstance().userinfo();
            console.log('res', res);
            
            this.data.id_card = res.data.id_card;
            this.citycode = res.data.social_city  as string;
            this.cityname = res.data.city_name as string;
            this.data.is_town = res.data.is_town
            localStorage.setItem("citycode", this.citycode);
            localStorage.setItem("cityname", this.cityname);
            localStorage.setItem('mobile',res.data.mobile);
            localStorage.setItem("social_type", res.data.social_type);
            localStorage.setItem("social_name", res.data.social_name);
            localStorage.setItem("is_town", res.data.is_town);
            if(res.data.is_first == 0){
                this.data.markShow = true
                let ress = await Http.getInstance().setFirstLogin();
            }else {
                let isWeiXin = () => { return navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1 }
                if (isWeiXin()) {
                    console.log(res.data.openid)
                    if(res.data.openid == null || res.data.openid.length == 0){
                        if(!localStorage.getItem('openid')){
                            let url = Utils.getInstance().getParams(location.href);
                            if(url.code){
                                let ress = await Http.getInstance().getWeixinpay({
                                    code: url.code,
                                });
                                if(ress.data.openid){
                                    let rer = await Http.getInstance().setUserOpenid({
                                        openid: ress.data.openid
                                    });
                                    localStorage.setItem("openid", ress.data.openid);
                                }
                            }else{
                                this.getcode();
                            }
                        }
                    }else{
                        localStorage.setItem("openid", res.data.openid);
                    }

                }
                this.data.markShow = false
            }
        }

        this.changeMargin()
    }
    async getcode(){
        let redirectURI='https://hr.hemadj.com/index';
        window.location.replace(
            'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + this.data.appid + '&redirect_uri=' + redirectURI + '&response_type=code&scope=snsapi_base&state=WXPaySTATE#wechat_redirect'
        )
    }
    async close(event: any){
        // let ress = await Http.getInstance().setFirstLogin();
        // console.log(ress);
        this.data.markShow = false;
        let isWeiXin = () => { return navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1 }
        if (isWeiXin()) {
            if(!localStorage.getItem('openid')){
                let url = Utils.getInstance().getParams(location.href);
                if(url.code){
                    let ress = await Http.getInstance().getWeixinpay({
                        code: url.code,
                    });
                    if(ress.data.openid){
                        let rer = await Http.getInstance().setUserOpenid({
                            openid: ress.data.openid
                        });
                        localStorage.setItem("openid", ress.data.openid);
                    }
                }else{
                    this.getcode();
                }
            }
        }

    }
    yaoqing(){
       this.$router.push('/user/share')
    }
    jiaofei(){
       this.$router.push('/other')
    }
    tanrules(){
         console.log(this.data.show)
        this.$router.push({
            name: "share", params: {
               state: this.data.show
            }
        });

    }

    activated() {
        //
    }



    // 初始化函数
    init() {
        //
    }

    // 点击五险一金
    hFiveSocial() {
        // 获取本地信息
        let name = localStorage.getItem('realname')
        let socialType = localStorage.getItem('token_type')
        if (name !== null && socialType !== null && this.data.id_card !== '') {
            this.$router.push('/social?is_fund=1')
        } else {
            this.$router.push('/user/info')
        }
    }

    // 点击社保
    hSocialInsurance () {
        let name = localStorage.getItem('realname')
        // 获取本地社保类型
        let is_town = localStorage.getItem('is_town')
        console.log(is_town);
        if (is_town === 'true') {
            Message({
                message: '城镇户口只能交五险一金，不能交社保', type: "warning"
            });
            return
        }
        if (name !== null && this.data.id_card !== '') {
            this.$router.push('/social?is_fund=0')
        } else {
            this.$router.push('/user/info')
        } 
    }

    // async test() {
    //     this.$router.push('/policy?housing_policy')
    //     console.log(123);
    //     let res = await `https://hm.hemadj.com/dev/policy?type=1`
    //     console.log('买房', res);
    //     // if(res.data){
    //     //   this.data.sociallist = res.data
    //     // }
    // }

    // 检测屏幕宽度变化 
    changeMargin() {
        // 网页可见区域的宽度
        let clientWidth = document.body.clientWidth || document.documentElement.clientWidth
        // console.log('网页可见区域宽', clientWidth);
        if (clientWidth <= 450) {
            this.data.lastRowMargin = '6rem'
        } else if (clientWidth > 450 && clientWidth <= 550) {
            this.data.lastRowMargin = '7rem'
        } else if (clientWidth > 550 && clientWidth <= 650) {
            this.data.lastRowMargin = '8rem'
        } else if (clientWidth > 650 && clientWidth <= 750) {
            this.data.lastRowMargin = '9rem'
        } else if (clientWidth > 750 && clientWidth <= 850) {
            this.data.lastRowMargin = '10rem'
        } else if (clientWidth > 850 && clientWidth <= 950) {
            this.data.lastRowMargin = '11rem'
        } else if (clientWidth > 950 && clientWidth <= 1050) {
            this.data.lastRowMargin = '12rem'
        } else {
            this.data.lastRowMargin = '13rem'
        }
    }
    @Watch('$route', {immediate: true}) isLogin(newVal: any, oldVal: any) {
        if (newVal.path == '/index' && !localStorage.getItem('access_token')) {
            router.replace('/login')
        }
    }

}
