flx:修改样式对齐

This commit is contained in:
X_Rian 2024-08-01 16:19:50 +08:00
parent 77540e3fc6
commit 6740bc5d25

View File

@ -5,47 +5,58 @@
修改密码
</view>
</headers>
<view class="userLogin">
<view class="userLogin">
<u-form style="width: 100%;" :rules="rules" :error-type="['message']" :model="formData" ref="uForm">
<u-form-item prop="account" class="uni-form-item" :border-bottom="false">
<view>当前账号</view>
<input class="uni-input" name="userInfo" readonly :disabled="true" v-model="userInfo.account"
placeholder="请输入您的账号" />
</u-form-item>
<u-form-item prop="pw" class="uni-form-item" :border-bottom="false">
<view>当前密码</view>
<input class="uni-input" name="pw" v-model="formData.pw" :password="showPassword"
placeholder="请输入您的密码" />
<u-icon :name="showPassword ? 'eye-off' : 'eye-fill'" @click="showPassword = !showPassword"></u-icon>
</u-form-item>
<u-form-item prop="newpw" class="uni-form-item" :border-bottom="false">
<view>新密码</view>
<input class="uni-input" name="newpw" :password="showPassword1" v-model="formData.newpw"
placeholder="请输入新密码" />
<u-icon :name="showPassword1 ? 'eye-off' : 'eye-fill'" @click="showPassword1 = !showPassword1"></u-icon>
</u-form-item>
<u-form-item prop="newpwaff" class="uni-form-item" :border-bottom="false">
<view>确认新密码</view>
<input class="uni-input" name="newpwaff" :password="showPassword2" v-model="formData.newpwaff"
placeholder="请输入再次新密码" />
<u-icon :name="showPassword2 ? 'eye-off' : 'eye-fill'" @click="showPassword2 = !showPassword2"></u-icon>
</u-form-item>
<!-- <u-form-item prop="email" class="uni-form-item" :border-bottom="false">
<u-form-item prop="account" class="uni-form-item" :border-bottom="false">
<view>当前账号</view>
<input class="uni-input" name="userInfo" readonly :disabled="true" v-model="userInfo.account"
placeholder="请输入您的账号" />
</u-form-item>
<u-form-item prop="pw" class="uni-form-item" :border-bottom="false">
<view>当前密码</view>
<input class="uni-input" name="pw" v-model="formData.pw" :password="showPassword"
placeholder="请输入您的密码" />
<div class="text-right">
<u-icon :name="showPassword ? 'eye-off' : 'eye-fill'"
@click="showPassword = !showPassword"></u-icon>
</div>
</u-form-item>
<u-form-item prop="newpw" class="uni-form-item" :border-bottom="false">
<view>新密码</view>
<input class="uni-input" name="newpw" :password="showPassword1" v-model="formData.newpw"
placeholder="请输入新密码" />
<div class="text-right">
<u-icon :name="showPassword1 ? 'eye-off' : 'eye-fill'"
@click="showPassword1 = !showPassword1"></u-icon>
</div>
</u-form-item>
<u-form-item prop="newpwaff" class="uni-form-item" :border-bottom="false">
<view>确认新密码</view>
<input class="uni-input" name="newpwaff" :password="showPassword2" v-model="formData.newpwaff"
placeholder="请输入再次新密码" />
<div class="text-right">
<u-icon :name="showPassword2 ? 'eye-off' : 'eye-fill'"
@click="showPassword2 = !showPassword2"></u-icon>
</div>
</u-form-item>
<!-- <u-form-item prop="email" class="uni-form-item" :border-bottom="false">
<image class="icon" mode="widthFix" src="@/static/login/email.png"></image>
<input class="uni-input" type="email" name="email" v-model="formData.email" placeholder="请输入您的电子邮箱" />
</u-form-item> -->
<view class="uni-form-item submit">
<button type="primary" class="btn" @click="formSubmit">完成</button>
</view>
</u-form>
<view class="uni-form-item submit">
<button type="primary" class="btn" @click="formSubmit">完成</button>
</view>
</u-form>
</view>
</view>
</template>
<script>
import headers from '../../../components/headers/headers.vue';
import { exitApp } from "@/utils/tool.js"
import {
exitApp
} from "@/utils/tool.js"
export default {
components: {
headers
@ -55,7 +66,7 @@
showPassword: true,
showPassword1: true,
showPassword2: true,
userInfo:{},
userInfo: {},
formData: {
account: '',
pw: '',
@ -97,17 +108,17 @@
message: '请输入密码',
trigger: ['change', 'blur'],
}, {
pattern: /^(?=.*\d)(?=.*[a-zA-Z])(?=.*[!@#$%^&*()_+~`\-={}[\]:";'<>?,./])[a-zA-Z\d!@#$%^&*()_+~`\-={}[\]:";'<>?,./]{8,}$/,
//
transform: (value) => {
// console.log(value,this.formData);
if(value != this.formData.newpw){
return false
}
return String(value);
},
message: '两次密码不一致'
}],
pattern: /^(?=.*\d)(?=.*[a-zA-Z])(?=.*[!@#$%^&*()_+~`\-={}[\]:";'<>?,./])[a-zA-Z\d!@#$%^&*()_+~`\-={}[\]:";'<>?,./]{8,}$/,
//
transform: (value) => {
// console.log(value,this.formData);
if (value != this.formData.newpw) {
return false
}
return String(value);
},
message: '两次密码不一致'
}],
email: [{
required: true,
message: '请输入邮箱',
@ -142,17 +153,17 @@
Authorization: "Bearer " + this.userInfo.token
},
data: {
userId:this.userInfo.userId,
oldPassword:this.formData.pw,
showPassword:this.formData.newpwaff,
isCheckCode:0
userId: this.userInfo.userId,
oldPassword: this.formData.pw,
showPassword: this.formData.newpwaff,
isCheckCode: 0
},
method: "POST",
success: (res) => {
console.log(res);
if (res.code == 200) {
uni.showToast({
title:'修改成功!'
title: '修改成功!'
})
setTimeout(() => {
this.logout();
@ -183,6 +194,11 @@
</script>
<style lang="scss" scoped>
.text-right {
flex: 1;
text-align: right;
}
.userLogin {
padding: 30rpx;