|
@@ -0,0 +1,287 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <headContent borderBottom>
|
|
|
+ <template #left>
|
|
|
+ <reverse-back />
|
|
|
+ </template>
|
|
|
+ <template #content>
|
|
|
+ <view class="haed-title">
|
|
|
+ 设置资金密码
|
|
|
+ </view>
|
|
|
+ </template>
|
|
|
+ </headContent>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <view class="form-box">
|
|
|
+ <form class="form-content">
|
|
|
+ <view class="form-item ">
|
|
|
+ <view class="form-item-lable">新密码</view>
|
|
|
+ <input class="form-item-input" v-model="formData.newPassword" :maxlength="maxlength"
|
|
|
+ placeholder-class="form-item-place" :type="showNewPsd ? 'text' : 'password'"
|
|
|
+ placeholder="请输入新密码">
|
|
|
+ <view class="form-item-icon" @click.stop="showNewPsd = !showNewPsd">
|
|
|
+ <text v-show="showNewPsd" class="iconfont"></text>
|
|
|
+ <text v-show="!showNewPsd" class="iconfont"></text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="err-hint">{{ formError.newPsdErr }}</view>
|
|
|
+ <view class="form-item ">
|
|
|
+ <view class="form-item-lable">确认密码</view>
|
|
|
+ <input class="form-item-input" v-model="formData.confirmPassword" :maxlength="maxlength"
|
|
|
+ placeholder-class="form-item-place" :type="showConfirmPsd ? 'text' : 'password'"
|
|
|
+ placeholder="请再次输入新密码">
|
|
|
+ <view class="form-item-icon" @click.stop="showConfirmPsd = !showConfirmPsd">
|
|
|
+ <text v-show="showConfirmPsd" class="iconfont"></text>
|
|
|
+ <text v-show="!showConfirmPsd" class="iconfont"></text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="err-hint">{{ formError.confirmPsdErr }}</view>
|
|
|
+ </form>
|
|
|
+ <view class="reminder">
|
|
|
+ 资金密码将用于转账、法币交易、红包、质押借币等功能,请妥善保管,避免泄露!
|
|
|
+ </view>
|
|
|
+ <view :class="['form-btn' , deblockingSubmitBtn() ? 'active-form-btn' : '' ]"
|
|
|
+ @click.stop="SubmitPassWord()">
|
|
|
+ 确定
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- <unopen ref="unopenRef" :content="changeHint" /> -->
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ validPassword
|
|
|
+ } from "@/utils/validate.js"
|
|
|
+ import {
|
|
|
+ Api_setPassword
|
|
|
+ } from "@/api/index.js"
|
|
|
+ import {
|
|
|
+ Way_getUserInfo
|
|
|
+ } from "@/utils/common-request.js"
|
|
|
+ export default {
|
|
|
+ name: 'money-password',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ account: null,
|
|
|
+ maxlength: 20,
|
|
|
+ showPwd: false,
|
|
|
+ showNewPsd: false,
|
|
|
+ showConfirmPsd: false,
|
|
|
+ formData: {
|
|
|
+
|
|
|
+ newPassword: '',
|
|
|
+ confirmPassword: ''
|
|
|
+ },
|
|
|
+ formError: {
|
|
|
+
|
|
|
+ newPsdErr: '',
|
|
|
+ confirmPsdErr: ''
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+
|
|
|
+ 'formData.newPassword'(newPsd, oldPsd) {
|
|
|
+ this.validateField('newPassword')
|
|
|
+ },
|
|
|
+ 'formData.confirmPassword'(newPsd, oldPsd) {
|
|
|
+ this.validateField('confirmPassword')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ // this.getUserInfo();
|
|
|
+ // this.$refs.unopenRef.open();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getUserInfo() {
|
|
|
+ Way_getUserInfo().then(res => {
|
|
|
+ this.account = res;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ validateField(key) {
|
|
|
+ let validateStatus = false
|
|
|
+ switch (key) {
|
|
|
+
|
|
|
+ case 'newPassword':
|
|
|
+ if (!this.formData[key].trim()) {
|
|
|
+ this.formError.newPsdErr = '请输入新密码'
|
|
|
+ validateStatus = false;
|
|
|
+ } else if (!validPassword(this.formData[key])) {
|
|
|
+ this.formError.newPsdErr = '密码长度为8-20位字符,必须同时包含大写字母、小写字母和数字';
|
|
|
+ validateStatus = false;
|
|
|
+ } else {
|
|
|
+ this.formError.newPsdErr = '';
|
|
|
+ validateStatus = true;
|
|
|
+ };
|
|
|
+ break;
|
|
|
+ case 'confirmPassword':
|
|
|
+ if (!this.formData[key].trim()) {
|
|
|
+ this.formError.confirmPsdErr = '请再次输入新密码';
|
|
|
+ validateStatus = false;
|
|
|
+ } else if (this.formData[key] !== this.formData.newPassword) {
|
|
|
+ this.formError.confirmPsdErr = '确认密码和新密码输入不一致';
|
|
|
+ validateStatus = false;
|
|
|
+ } else {
|
|
|
+ this.formError.confirmPsdErr = '';
|
|
|
+ validateStatus = true;
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ validateStatus = false
|
|
|
+
|
|
|
+ };
|
|
|
+ return validateStatus;
|
|
|
+ },
|
|
|
+ confirmValidateField() {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ let validateStatus = true;
|
|
|
+ for (let key in this.formData) {
|
|
|
+ console.log('SubmitPassWord', key)
|
|
|
+ if (validateStatus) {
|
|
|
+ validateStatus = this.validateField(key)
|
|
|
+ } else {
|
|
|
+ this.validateField(key)
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ if (validateStatus) {
|
|
|
+ resolve()
|
|
|
+ } else {
|
|
|
+ reject()
|
|
|
+ };
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ deblockingSubmitBtn() {
|
|
|
+ for (let key in this.formData) {
|
|
|
+ if (this.formData[key] === '') {
|
|
|
+ return false
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ return true
|
|
|
+ },
|
|
|
+ SubmitPassWord() {
|
|
|
+
|
|
|
+ this.confirmValidateField().then(res => {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '修改中',
|
|
|
+ mask: true
|
|
|
+ })
|
|
|
+ const obj = {
|
|
|
+ account: this.account?.account_number,
|
|
|
+ password: this.formData.newPassword,
|
|
|
+ repassword: this.formData.newPassword
|
|
|
+ }
|
|
|
+
|
|
|
+ // Api_setPassword(obj).then(res => {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // uni.navigateBack({
|
|
|
+ // delta: 1
|
|
|
+ // })
|
|
|
+ // }, 501)
|
|
|
+ // }).catch(err => {}).finally(() => {
|
|
|
+ // setTimeout(() => {
|
|
|
+ // uni.hideLoading()
|
|
|
+ // }, 500)
|
|
|
+ // })
|
|
|
+
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .reminder {
|
|
|
+ font-size: 26rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: $Theme-Color;
|
|
|
+ padding: 20rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-box {
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 $pages-padding;
|
|
|
+
|
|
|
+ .form-content {
|
|
|
+ width: 100%;
|
|
|
+
|
|
|
+ .form-item {
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 28rpx;
|
|
|
+ border-bottom: 1rpx solid $border-color;
|
|
|
+
|
|
|
+ .form-item-lable {
|
|
|
+ width: 180rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-item-input {
|
|
|
+ font-size: 28rpx;
|
|
|
+ flex: 1;
|
|
|
+ height: 100%;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-item-place {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #ccc;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-item-icon {
|
|
|
+ width: 50rpx;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ font-size: 26rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .err-hint {
|
|
|
+ width: 100%;
|
|
|
+ min-height: 50rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: red;
|
|
|
+ line-height: 1.2;
|
|
|
+ padding-top: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-btn {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #ccc;
|
|
|
+ height: 90rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 90rpx;
|
|
|
+ color: #fff;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .active-form-btn {
|
|
|
+ background-color: $Theme-Color ;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|