<template>
    <div class="app-container">
        <div style="padding-top: 100px;"></div>

        <p id="loginTitle"> 登 录 </p>

        <van-form @submit="onSubmit">
            <van-field
                v-model="username"
                name="username"
                label="账号"
                placeholder="请输入账号"
                :rules="rules.username"
                clearable
            />
            <van-field
                v-model="password"
                :type="showPwd ? 'text' : 'password'"
                name="password"
                label="密码"
                placeholder="请输入密码"
                :rules="rules.password"
                clearable
            >
                <template #right-icon>
                    <van-icon :name="showPwd ? 'eye-o' : 'closed-eye'" @click="showPwd = !showPwd" />
                </template>
            </van-field>
            <div style="margin: 26px;">
                <van-button round block type="info" size="small" native-type="submit">登录</van-button>
            </div>
            
        </van-form>
    </div>
</template>

<script>
import Vue from 'vue';
import { Dialog,Icon,Form,Field,Button } from 'vant';

Vue.use(Dialog);
Vue.use(Form);
Vue.use(Field);
Vue.use(Icon);
Vue.use(Button);

export default {
    data() {
        return {
            showPwd: false,
            username: '',
            password: '',
            rules: {
                username: [
                    { required: true, message: '请输入账号' },
                    { trigger: 'onBlur', pattern: /^[-_a-zA-Z0-9]{4,18}$/, message: '账号格式错误' },
                ],
                password: [
                    { required: true, message: '请输入密码' },
                    { trigger: 'onBlur', pattern: /^[-_a-zA-Z0-9]{6,16}$/, message: '密码格式错误' },
                ],
            },
        };
    },
    methods: {
        /**
         * 登录
         */
        onSubmit(values) {
            let yysUserid = localStorage.getItem('yysUserid');
            let openid ='2222222';
            // let openid = this.getOpenid();
            
            // if (!openid) {
            //     Dialog.confirm({
            //         title: '提醒',
            //         message: '未授权，请关闭当前页面，重新进入并授权。',
            //         showCancelButton: false,
            //     })
            //     return;
            // }

            let postData = {
                username: values.username,
                password: values.password,
            }
           
            let resp={
                data:{
                    data:{id:232,realname:"yycs",avator:"",phone:'15706857065'},
                    message:'登录成功',
                    success:true
                }
            }
             let data = resp.data.data || {};
            //临时处理的
                    

                    localStorage.setItem('yysUserid', data.id);
                    localStorage.setItem('yysUserinfo', JSON.stringify(data));
                    
                    this.$notify({ 
                        type: 'success',
                        message: resp.data.message || '登录成功',
                    });
                    // 跳转首页
                    this.$nextTick(() => {
                      this.$router.push('/yys');
                    })
        //     this.$http.post('yysLogin&openid='+openid, JSON.stringify(postData)) .then(resp => {
        //             if (!resp.data.success) {
        //                 this.$notify(resp.data.message || '登录失败');
        //                 return;
        //             }

        //             let data = resp.data.data || {};
                    
        //             if (!data.id) {
        //                 this.$notify('获取用户信息失败');
        //                 return;
        //             }

        //             localStorage.setItem('yysUserid', data.id);
        //             localStorage.setItem('yysUserinfo', JSON.stringify(data));
                    
        //             this.$notify({ 
        //                 type: 'success',
        //                 message: resp.data.message || '登录成功',
        //             });
        //             // 跳转首页
        //             this.$nextTick(() => {
        //               this.$router.push('/yys');
        //             })
        //         }).catch(err =>{
        //             console.error(err);
        //         })
        },
        /**
         * 获取openid
         */
        getOpenid() {
            let openid = localStorage.getItem('openid') ;
            if (openid) {
                return openid;
            }
            openid = this.$route.query.openid || '';
            if (openid) {
                localStorage.setItem('openid', openid); 
            }
            return openid;
        }

    },
}
</script>

<style lang="scss" scoped>
#loginTitle {
    font-size: 20px;
    text-align: center;
    padding: 20px 0;
}
</style>