<template>
    <div class="page">
        <div class="main">
            <div class="tit">用户登录</div>
            <div class="inp-box">
                <input
                    type="text"
                    name="userName"
                    v-model="userName"
                    placeholder="请输入账号"
                />
            </div>
            <div class="inp-box">
                <input
                    type="password"
                    name="password"
                    v-model="password"
                    placeholder="请输入密码"
                />
            </div>
            <button class="btn" @click="submit">确定</button>
            <div class="login-other">
                <div class="register-box">
                    <!-- <a class="go-register" @click="jumpRegister">去注册</a> -->
                    <!-- <a class="go-register register2" @click="jumpRegister2"
                        >无团长号注册</a
                    > -->
                </div>
                <a
                    class="find-password"
                    @click="jump('/pages/index/find-password')"
                    >找回密码</a
                >
            </div>
        </div>
    </div>
</template>

<script>
import MyImage from "../../components/image/index";

export default {
    name: "",
    components: { MyImage },
    // 数据
    data() {
        return {
            userName: "",
            password: "",
            urlQuery: {},
        };
    },

    onLoad(opts) {
        this.urlQuery = opts;
        uni.hideLoading();
        if (this.$store.state.user.user) {
            this.router.push({
                isTabBar: true,
                path: "/pages/index/index",
            });
        }
    },

    onShow() {},

    // 函数
    methods: {
        jumpRegister() {
            this.router.push({
                path: "/pages/index/register",
                query: this.urlQuery,
            });
        },

        jumpRegister2() {
            this.router.push({
                path: "/pages/index/register2",
                query: this.urlQuery,
            });
        },

        submit() {
            console.log(this.mobile);
            if (!this.userName) {
                this.fn.showToast(`请输入账号`);
                return;
            }
            if (!this.password) {
                this.fn.showToast(`请输入密码`);
                return;
            }

            uni.showLoading({
                title: "提交中",
            });
            uni.login({
                provider: "weixin",
                success: (result) => {
                    // 判断团长号 验证
                    this.login(result.code);
                },
            });
        },

        login(code) {
            this.api
                .post("/Login/LoginBySupplier", {
                    userName: this.userName,
                    password: this.password,
                    code: code,
                })
                .then((res) => {
                    uni.hideLoading();
                    if (res.success) {
                        this.$store.commit("user/login", res.data);
                        this.router.push({
                            isTabBar: true,
                            path: "/pages/index/index",
                        });
                    } else {
                        this.fn.showModal({
                            title: "登录失败",
                            content: res.message,
                            showCancel: false,
                        });
                    }
                });
        },
    },

    // 数据计算
    computed: {},

    // 数据监听
    watch: {},
};
</script>


<style lang="scss" scoped>
.page {
    height: 100vh;
    background-color: #fff;
}
.main {
    padding-top: px(120);
    padding-left: px(40);
    padding-right: px(40);
}
.tit {
    font-size: px(50);
    padding-bottom: px(100);
    text-align: center;
    padding-bottom: px(60);
}
.inp-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #c3c1c2;
    padding: px(30) 0;
    margin-bottom: px(30);
}
.inp-box span {
    font-size: px(32);
    color: #e92e25;
    border-radius: px(15);
    border: 1px solid #e92e25;
    width: px(230);
    height: px(80);
    text-align: center;
    line-height: px(80);
    flex-shrink: 0;
    margin-left: px(30);
}
.inp-box input {
    width: 100%;
}
.inp-box .dis {
    color: #999;
    border-color: #999;
    pointer-events: none;
}
.btn {
    margin-top: px(120);
    color: #fff;
    background-color: rgb(0, 188, 38);
    font-size: px(44);
}
.find-password {
    color: #666;
}
.login-other {
    margin-top: px(50);
    font-size: px(44);
    display: flex;
    justify-content: space-between;
    align-items: center;
    .go-register {
        color: #4395ff;
    }
}
.register2 {
    margin-left: px(30);
}
.register-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
</style>