20261008
This commit is contained in:
@@ -0,0 +1,189 @@
|
||||
<template> <!-- 账户管理 -->
|
||||
<view>
|
||||
<view class="layout layout-account">
|
||||
<view class="account-title m-top-20">用户名管理</view>
|
||||
<!-- <view class="account-head m-top-30">-->
|
||||
<!-- <view class="flex justify-center direction-column align-center">-->
|
||||
<!-- <u--image :showLoading="true" src="https://cdn.uviewui.com/uview/album/1.jpg" width="100rpx" height="100rpx" radius="10rpx"></u--image>-->
|
||||
<!-- <view class="xiu">修改头像</view>-->
|
||||
<!-- </view>-->
|
||||
<!-- <view class="tip m-top-30">选择你喜欢的图片，格式为jpg、png、jpeg，大小不超过2M。</view>-->
|
||||
<!-- </view>-->
|
||||
<view class="account-form m-top-30">
|
||||
<view class="group">
|
||||
<u-icon name="account" color="#666" size="26"></u-icon>
|
||||
<view class="lb">用户名</view>
|
||||
<view class="vl">{{ userData.nickname }}</view>
|
||||
<!-- <view class="op">修改</view>-->
|
||||
</view>
|
||||
<view class="group">
|
||||
<u-icon name="phone" color="#666" size="26"></u-icon>
|
||||
<view class="lb">绑定手机号</view>
|
||||
<view class="vl">{{ userData.mobile.replace(/(\d{3})\d{4}(\d{4})/, "$1****$2") }}</view>
|
||||
<!-- <view class="op">修改</view>-->
|
||||
</view>
|
||||
<!-- <view class="group">-->
|
||||
<!-- <u-icon name="email" color="#666" size="26"></u-icon>-->
|
||||
<!-- <view class="lb">绑定邮箱</view>-->
|
||||
<!-- <view class="vl">649077859@163.com</view>-->
|
||||
<!-- <view class="op">修改</view>-->
|
||||
<!-- </view>-->
|
||||
<view class="group">
|
||||
<u-icon name="lock" color="#666" size="26"></u-icon>
|
||||
<view class="lb">登录密码</view>
|
||||
<view class="vl">已设置</view>
|
||||
<view class="op" @click="showPopup = true">修改</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-popup closeable :show="showPopup"
|
||||
round="10"
|
||||
mode="center"
|
||||
:custom-style="{width: '80%'}"
|
||||
@close="showPopup = false">
|
||||
<view class="p-20 m-20 flex flex-center">
|
||||
<u-text text="修改登录密码" size="17" align="center"/>
|
||||
</view>
|
||||
<view class="mt-15">
|
||||
<u-cell-group :border="false">
|
||||
<u-cell title="原密码">
|
||||
<u-input v-model="formData.oldPassword" slot="value" placeholder="请输入原密码"/>
|
||||
</u-cell>
|
||||
<u-cell title="新密码">
|
||||
<u-input v-model="formData.newPassword" slot="value" placeholder="请输入新密码"/>
|
||||
</u-cell>
|
||||
<u-cell title="确认密码" :border="false">
|
||||
<u-input v-model="formData.passwordConfirmation" slot="value" placeholder="请输入确认密码"/>
|
||||
</u-cell>
|
||||
|
||||
</u-cell-group>
|
||||
</view>
|
||||
<view class="mt-15">
|
||||
<u-button type="primary" shapre="circle" @click="submit"
|
||||
:disabled="!formData.oldPassword || !formData.newPassword || !formData.passwordConfirmation">
|
||||
确定
|
||||
</u-button>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
props: {
|
||||
userData: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showPopup: false,
|
||||
formData: {
|
||||
oldPassword: null,
|
||||
newPassword: null,
|
||||
passwordConfirmation: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
submit() {
|
||||
if (!this.formData.oldPassword) return this.$message.error('请输入原密码');
|
||||
if (!this.formData.newPassword) return this.$message.error('请输入原密码');
|
||||
if (!this.formData.passwordConfirmation) return this.$message.error('请输入原密码');
|
||||
if (this.formData.newPassword !== this.formData.passwordConfirmation) return this.$message.error('两次输入的密码不一致!');
|
||||
if (this.formData.newPassword === this.formData.oldPassword) return this.$message.error('新密码不能与原密码相同!');
|
||||
if (this.formData.newPassword.length < 6 || this.formData.newPassword.length > 20) return this.$message.error('密码长度在 6 到 20 个字符');
|
||||
const reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]+$/
|
||||
if (!reg.test(this.formData.newPassword)) {
|
||||
return this.$message({
|
||||
message: '密码必须由数字和字母组成',
|
||||
type: 'error'
|
||||
})
|
||||
}
|
||||
vk.callFunction({
|
||||
url: 'user/kh/updatePwd',
|
||||
data: this.formData
|
||||
}).then(res => {
|
||||
this.$message.success('修改成功')
|
||||
this.formData = {
|
||||
oldPassword: null,
|
||||
newPassword: null,
|
||||
passwordConfirmation: null,
|
||||
}
|
||||
this.showPopup = false
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.layout-account {
|
||||
padding: 10rpx 30rpx;
|
||||
|
||||
.account-title {
|
||||
position: relative;
|
||||
padding-left: 20rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 48rpx;
|
||||
color: #A92924;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
margin-top: -14rpx;
|
||||
content: '';
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: #A92924;
|
||||
}
|
||||
}
|
||||
|
||||
.tip {
|
||||
font-size: 24rpx;
|
||||
line-height: 48rpx;
|
||||
color: #999999;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.xiu {
|
||||
font-size: 24rpx;
|
||||
line-height: 48rpx;
|
||||
color: #A92924;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.group {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
|
||||
.lb {
|
||||
width: 150rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 48rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.vl {
|
||||
flex: 1;
|
||||
font-size: 24rpx;
|
||||
line-height: 48rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.op {
|
||||
font-size: 24rpx;
|
||||
line-height: 48rpx;
|
||||
color: #A92924;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user