.

src/main/mobile/src/views/forgot.vue

@@ -0,0 +1,116 @@
+<template>
+    <div class="register">
+        <nav-bar @click-left="$router.go(-1)" title="忘记密码"></nav-bar>
+        <van-cell-group>
+            <van-field placeholder="请输入手机号" v-model="phone"></van-field>
+            <van-field placeholder="请输入验证码" v-model="code">
+                <template #button>
+                    <van-button size="small" type="primary" :disabled="t > 0" :color="$theme.prim" @click="sendCode">
+                        {{ t > 0 ? `${t}秒后重新发送` : '发送验证码' }}
+                    </van-button>
+                </template>
+            </van-field>
+            <van-field placeholder="请输入6-10位重置密码" v-model="password" type="password"></van-field>
+            <van-field placeholder="请确认输入密码" v-model="password1" type="password"></van-field>
+        </van-cell-group>
+        <div class="btns">
+            <van-button :color="$theme.prim" type="primary" block @click="register">重置密码</van-button>
+            <van-checkbox v-model="checked" :icon-size="14" :checked-color="$theme.prim" shape="square">
+                已阅读<span class="highlight">用户协议</span>和<span class="highlight">隐私条款</span>
+            </van-checkbox>
+        </div>
+    </div>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            nickname: '',
+            phone: '',
+            t: 0,
+            checked: true,
+            password: '',
+            password1: '',
+            code: ''
+        };
+    },
+    methods: {
+        sendCode() {
+            if (!/^1[3-9]\d{9}$/.test(this.phone)) {
+                this.$toast('请输入正确的手机号');
+                return;
+            }
+            this.$toast.loading();
+            this.$http
+                .get('/sms/sendVerify', { phone: this.phone })
+                .then(res => {
+                    this.$toast.clear();
+                    this.t = 60;
+                    let interval = setInterval(() => {
+                        this.t--;
+                        if (this.t <= 0) {
+                            clearInterval(interval);
+                        }
+                    }, 1000);
+                })
+                .catch(e => {
+                    this.$toast.clear();
+                    this.$toast(e.error || '发送失败');
+                });
+        },
+        register() {
+            if (!/^1[3-9]\d{9}$/.test(this.phone)) {
+                this.$toast('请输入正确的手机号');
+                return;
+            }
+            if (!this.code) {
+                this.$toast('请输入验证码');
+                return;
+            }
+            if (!this.password) {
+                this.$toast('请输入密码');
+                return;
+            }
+            if (this.password !== this.password1) {
+                this.$toast('两次密码输入不一致');
+                return;
+            }
+            this.$toast.loading();
+            this.$http
+                .post('/user/resetPassword', {
+                    phone: this.phone,
+                    code: this.code,
+                    password: this.password
+                })
+                .then(res => {
+                    this.$toast.success('密码修改成功');
+                    this.$router.go(-1);
+                })
+                .catch(e => {
+                    console.log(e);
+                    this.$toast(e.error || '密码修改失败');
+                });
+        }
+    }
+};
+</script>
+<style lang="less" scoped>
+.register {
+    background: @bg !important;
+}
+.btns {
+    padding: 0 16px;
+    margin-top: 30px;
+    .van-button {
+        margin-top: 15px;
+    }
+    .van-checkbox {
+        justify-content: center;
+        margin-top: 15px;
+        font-size: 13px;
+        .highlight {
+            color: @prim;
+        }
+    }
+}
+</style>