65 lines
2.2 KiB
Vue
65 lines
2.2 KiB
Vue
<template>
|
||
<view class="page">
|
||
<fy-header title="修改密码" back />
|
||
<view class="body">
|
||
<text class="hint">首次登录或管理员要求改密，请设置新密码后继续。</text>
|
||
<view class="card group">
|
||
<view class="field">
|
||
<text class="lab">新密码</text>
|
||
<view class="box"><input v-model="next" password placeholder="至少 6 位" /></view>
|
||
</view>
|
||
<view class="field">
|
||
<text class="lab">确认新密码</text>
|
||
<view class="box"><input v-model="confirm" password placeholder="再输入一次" /></view>
|
||
</view>
|
||
</view>
|
||
<wd-button type="primary" block size="large" @click="ok">确认修改</wd-button>
|
||
<text v-if="error" class="err">{{ error }}</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import FyHeader from '../../components/fy-header.vue'
|
||
import { store } from '../../utils/store.js'
|
||
import { toast } from '../../utils/format.js'
|
||
|
||
export default {
|
||
components: { FyHeader },
|
||
data() {
|
||
return { next: '', confirm: '', error: '', off: null, left: false }
|
||
},
|
||
onShow() {
|
||
if (this.off) this.off()
|
||
this.off = store.on(() => {
|
||
this.error = store.error
|
||
if (this.left || store.phase !== 'app') return
|
||
this.left = true
|
||
uni.switchTab({ url: '/pages/tabs/messages' })
|
||
})
|
||
},
|
||
onHide() {
|
||
if (this.off) this.off()
|
||
this.off = null
|
||
},
|
||
methods: {
|
||
async ok() {
|
||
if (!this.next || this.next.length < 6) return toast('密码至少 6 位')
|
||
if (this.next !== this.confirm) return toast('两次密码不一致')
|
||
await store.changePassword(this.next, this.confirm)
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.body { padding: 16rpx 24rpx 48rpx; }
|
||
.hint { font-size: 26rpx; color: #6B7280; display: block; margin: 8rpx 8rpx 20rpx; line-height: 1.5; }
|
||
.group { padding: 8rpx 24rpx 24rpx; margin-bottom: 24rpx; }
|
||
.field { margin-top: 20rpx; }
|
||
.lab { font-size: 26rpx; color: #6B7280; display: block; margin-bottom: 10rpx; }
|
||
.box { height: 92rpx; background: #F5F7FA; border-radius: 16rpx; padding: 0 24rpx; display: flex; align-items: center; }
|
||
.box input { flex: 1; font-size: 30rpx; color: #111827; }
|
||
.err { color: #DC2626; font-size: 24rpx; margin-top: 16rpx; display: block; }
|
||
</style>
|