100 lines
2.7 KiB
Vue
100 lines
2.7 KiB
Vue
<template>
|
||
<view class="pd-lr-20">
|
||
<up-gap height="20" bgColor="#0000"></up-gap>
|
||
<view class="mg-t-20" style="display: flex;align-items: baseline;">
|
||
<up-icon name="lock-fill" size="15" />
|
||
<span style="margin-left: 4rpx;">原密码</span>
|
||
</view>
|
||
<up-input class="mg-t-20" v-model="state.formData.paswOld" border="surround" placeholder="输入原密码" />
|
||
<up-gap height="20" bgColor="#0000"></up-gap>
|
||
|
||
<view class="mg-t-20" style="display: flex;align-items: baseline;">
|
||
<up-icon name="lock-fill" size="15" />
|
||
<span style="margin-left: 4rpx;">新密码</span>
|
||
</view>
|
||
<up-input class="mg-t-20" v-model="state.paswNew" border="surround" placeholder="请输入新的密码" @blur="newCode"></up-input>
|
||
<up-input class="mg-t-20" v-model="state.formData.paswNew" border="surround" placeholder="再次输入确认密码" @blur="newCode2"></up-input>
|
||
|
||
<view class="txt">
|
||
<view :class="state.isTrue?'':'red'"> {{state.tstxt}} </view>
|
||
</view>
|
||
<up-gap height="40" bgColor="#0000"></up-gap>
|
||
<up-button class="mg-t-20" icon="checkmark-circle" iconColor="#fff" text="提交" @click="onsubmit"></up-button>
|
||
</view>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import { reactive } from 'vue';
|
||
import { sm2 } from 'sm-crypto'
|
||
import { env } from '@/utils/.env.js'
|
||
import { changePwdApi } from '@/api/auth.js'
|
||
|
||
const state = reactive({
|
||
isTrue: false,
|
||
tstxt: '',
|
||
paswNew: '',
|
||
formData: {} as any,
|
||
})
|
||
|
||
const newCode = () => {
|
||
if (state.paswNew.length >= 6 && state.paswNew.length <= 15) {
|
||
state.tstxt = ''
|
||
state.isTrue = true
|
||
} else {
|
||
state.isTrue = false
|
||
state.tstxt = '请输入6-15位，字母或数字'
|
||
}
|
||
}
|
||
|
||
const newCode2 = () => {
|
||
if (state.formData.paswNew != state.paswNew) {
|
||
state.isTrue = false
|
||
state.tstxt = '两次密码不一致'
|
||
} else {
|
||
state.tstxt = ''
|
||
state.isTrue = true
|
||
}
|
||
}
|
||
|
||
const onsubmit = () => {
|
||
if (!state.isTrue) return uni.showToast({ title: state.tstxt, icon: 'none' })
|
||
let publicKey = env.smKey
|
||
state.formData.passwordOld = sm2.doEncrypt(state.formData.paswOld, publicKey, 1)
|
||
state.formData.passwordNew = sm2.doEncrypt(state.formData.paswNew, publicKey, 1)
|
||
changePwdApi(state.formData).then((res : any) => {
|
||
if (res.code == 200) {
|
||
uni.showToast({ title: '修改成功', icon: 'none' })
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 1000)
|
||
}
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
::v-deep.u-icon__icon {
|
||
margin-top: 2px;
|
||
margin-right: 5px !important;
|
||
font-size: 35rpx !important;
|
||
}
|
||
|
||
.red {
|
||
color: red;
|
||
}
|
||
|
||
.pd-lr-20 {
|
||
padding: 0 16rpx;
|
||
}
|
||
|
||
.mg-t-20 {
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
::v-deep.u-button--info {
|
||
color: white !important;
|
||
width: 90%;
|
||
border-radius: 30px !important;
|
||
background: $uni-color-primary !important;
|
||
}
|
||
</style> |