<template>
    <div>
        <!-- 修改密码页面 -->
        <!-- 头部标签 -->
        <LHeader :text="$route.meta.title"></LHeader>

        <van-form
            @submit="onSubmit"
            :scroll-to-error="true"
            :show-error="false"
            validate-trigger="onSubmit"
        >
            <van-field
                v-model="form.oldPassword"
                required
                type="text"
                name="oldPassword"
                label="旧密码"
                placeholder="请输入旧密码"
                :rules="[{ required: true, message: '请填写密码' }]"
            />
            <van-field
                required
                v-model="form.newPassword"
                type="password"
                name="newPassword"
                label="新密码"
                placeholder="请输入新密码"
                :rules="[
                    { required: true, message: '请填写密码' },
                    {
                        message: '密码必须大于6个字符小于20个字符',
                        validator: (val) => {
                            return val['length'] >= 6 && val['length'] < 20;
                        },
                    },
                ]"
            />
            <van-field
                required
                v-model="form.confirm"
                type="password"
                name="confirm"
                label="再次输入"
                placeholder="再次输入新密码"
                :rules="[
                    { validator, required: true, message: '二次密码输入不一致' },
                    {
                        message: '密码必须大于等于6个字符小于20个字符',
                        validator: (val) => {
                            return val['length'] >= 6 && val['length'] < 20;
                        },
                    },
                ]"
            />

            <div style="margin: 16px">
                <van-button round block type="info" native-type="submit"
                    >提交
                </van-button>
            </div>
        </van-form>
    </div>
</template>

<script>
import LHeader from "@/components/header.vue";
import { getFun, postFun } from "@/service/table.js";
import { getUserInfo } from "@/utils/userInfo";
import { removeToken } from "@/utils/auth"; // get token from cookie
export default {
    components: {
        LHeader,
    },
    data() {
        return {
            form: {
                oldPassword: "",
                newPassword: "",
                confirm: "",
            },
        };
    },
    mounted() {
        console.log(getUserInfo());
    },
    methods: {
        validator(val) {
            return this.form.newPassword == val;
        },
        onSubmit(val) {
            this.$toast.loading({
                message: "请求中...",
                forbidClick: true,
                loadingType: "spinner",
                duration: 0,
            });
            postFun("/mobile/resetPwd", this.obj2formdata(val))
                .then((data) => {
                    if (data.code == 0) {
                        this.$toast.clear();
                        this.$toast.success('密码修改成功!');
                        this.$router.back()
                    }
                })
        },
        obj2formdata(data) {
            console.log(data, "fasfasdfsd");
            let fd = new FormData();
            for (let k in data) {
                if (data[k]) {
                    fd.append(k, data[k]);
                }
            }
            return fd;
        },
    },
};
</script>

<style>
</style>