75 lines
1.9 KiB
Vue
75 lines
1.9 KiB
Vue
<route lang="json5">
|
||
{
|
||
style: {
|
||
navigationStyle: 'custom',
|
||
disableScroll: true
|
||
}
|
||
}
|
||
</route>
|
||
<template>
|
||
<view>
|
||
<TopNavigation></TopNavigation>
|
||
<view class="text-6 ml-4 pt-7 custom-color-black font-bold">请输入手机号</view>
|
||
<view class="p-5">
|
||
<wd-input
|
||
v-model="password"
|
||
:maxlength="20"
|
||
class="mt-6"
|
||
clearable
|
||
placeholder="请输入新密码"
|
||
placeholderClass="text-4 custom-color-grey"
|
||
show-password
|
||
size="large"
|
||
@change="passwordChange"
|
||
/>
|
||
<wd-input
|
||
v-model="confirmPassword"
|
||
:maxlength="20"
|
||
class="mt-6"
|
||
clearable
|
||
placeholder="再次输入新密码"
|
||
placeholderClass="text-4 custom-color-grey"
|
||
show-password
|
||
size="large"
|
||
@change="confirmPasswordChange"
|
||
/>
|
||
</view>
|
||
<view class="bg-[#eeeff4] p-2 mx-5 rounded-2">
|
||
<view class="p-2">
|
||
<view class="text-3 color-[#525458]">密码为8-20位，至少含数字/字母/字符中的2种</view>
|
||
</view>
|
||
</view>
|
||
<view class="p-5">
|
||
<wd-button
|
||
:block="true"
|
||
:disabled="!(passwordPass && confirmPasswordPass && password === confirmPassword)"
|
||
:round="false"
|
||
size="large"
|
||
@click="codeLogin"
|
||
>
|
||
提交
|
||
</wd-button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { passwordRegExp } from '@/constants/regular-expressions'
|
||
|
||
const password = ref<string>('')
|
||
const confirmPassword = ref<string>('')
|
||
|
||
const passwordPass = computed(() => passwordRegExp.test(password.value))
|
||
const confirmPasswordPass = computed(() => password.value === confirmPassword.value)
|
||
|
||
const passwordChange = (value: string) => {
|
||
password.value = value
|
||
}
|
||
|
||
const confirmPasswordChange = (value: string) => {
|
||
confirmPassword.value = value
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss"></style>
|