feat: 完善个人设置页面功能 1. 优化头像上传功能和错误处理 2. 移除店内职务验证 3. 完善手机号更换功能
This commit is contained in:
davy
parent
d539541702
commit
66b36b0207
@ -23,10 +23,11 @@
|
|||||||
<input class="input-field" type="text" v-model="form.nickName" placeholder="请输入用户名" />
|
<input class="input-field" type="text" v-model="form.nickName" placeholder="请输入用户名" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="info-item">
|
<view class="info-item" @click="showChangePhone">
|
||||||
<text>关联手机</text>
|
<text>关联手机</text>
|
||||||
<view class="right-content">
|
<view class="right-content">
|
||||||
<text class="info-text">{{maskedPhone}}</text>
|
<text class="info-text">{{maskedPhone}}</text>
|
||||||
|
<text class="cuIcon-right"></text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -78,20 +79,20 @@
|
|||||||
<view v-if="currentTab === 2" class="section">
|
<view v-if="currentTab === 2" class="section">
|
||||||
<view class="info-list">
|
<view class="info-list">
|
||||||
<view class="info-item">
|
<view class="info-item">
|
||||||
<text>门店认证期限时间</text>
|
<text>认证到期时间</text>
|
||||||
<view class="right-content">
|
<view class="right-content">
|
||||||
<text class="text-gray">2026-07-31</text>
|
<text class="text-gray">{{barInfo.authEndTime || '--'}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="info-item">
|
<view class="info-item">
|
||||||
<text>营业执照</text>
|
<text>营业执照</text>
|
||||||
<view class="right-content" @click="handleUpload('businessLicense')">
|
<view class="right-content" @click="previewImage('businessLicense')">
|
||||||
<text class="text-blue">点击查看</text>
|
<text class="text-blue">点击查看</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="info-item">
|
<view class="info-item">
|
||||||
<text>门头照片</text>
|
<text>门头照片</text>
|
||||||
<view class="right-content" @click="handleUpload('storefrontPhoto')">
|
<view class="right-content" @click="previewImage('storefrontPhoto')">
|
||||||
<text class="text-blue">点击查看</text>
|
<text class="text-blue">点击查看</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -103,6 +104,65 @@
|
|||||||
保存
|
保存
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- 更换手机号弹窗 -->
|
||||||
|
<view class="change-phone-modal" v-if="showPhoneModal" @click.stop>
|
||||||
|
<view class="modal-content">
|
||||||
|
<view class="modal-title">确认更换手机号？</view>
|
||||||
|
<view class="modal-desc">更换后现手机号{{maskedPhone}}将不能用于登录，180天内只可更换一次</view>
|
||||||
|
<view class="modal-buttons">
|
||||||
|
<view class="btn cancel-btn" @click="closePhoneModal">我再想想</view>
|
||||||
|
<view class="btn confirm-btn" @click="confirmChangePhone">确认更换</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 更换手机号输入弹窗 -->
|
||||||
|
<view class="phone-input-modal" v-if="showPhoneInputModal" @click.stop>
|
||||||
|
<view class="modal-content">
|
||||||
|
<view class="modal-title">更换手机号</view>
|
||||||
|
<view class="input-section">
|
||||||
|
<view class="input-box">
|
||||||
|
<text class="prefix">+86</text>
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
v-model="newPhone"
|
||||||
|
maxlength="11"
|
||||||
|
placeholder="请输入新的手机号"
|
||||||
|
class="phone-input"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="verify-box" v-if="showVerifyCode">
|
||||||
|
<input
|
||||||
|
type="number"
|
||||||
|
v-model="verifyCode"
|
||||||
|
maxlength="6"
|
||||||
|
placeholder="请输入验证码"
|
||||||
|
class="verify-input"
|
||||||
|
/>
|
||||||
|
<view
|
||||||
|
class="verify-btn"
|
||||||
|
:class="{'disabled': counting}"
|
||||||
|
@click="getVerifyCode"
|
||||||
|
>
|
||||||
|
{{counting ? `${countdown}s后重新获取` : '获取验证码'}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="modal-buttons">
|
||||||
|
<view class="btn cancel-btn" @click="closePhoneInputModal">取消</view>
|
||||||
|
<view class="btn confirm-btn" @click="saveNewPhone">确定</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 图片预览弹窗 -->
|
||||||
|
<view class="preview-modal" v-if="showPreview" @click.stop>
|
||||||
|
<view class="preview-content">
|
||||||
|
<image :src="previewUrl" mode="aspectFit" class="preview-image"></image>
|
||||||
|
<view class="close-btn" @click="closePreview">关闭</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -321,6 +381,262 @@
|
|||||||
font-size: 32rpx;
|
font-size: 32rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.preview-modal {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgba(0, 0, 0, 0.6);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
.preview-content {
|
||||||
|
width: 600rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding: 32rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.preview-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 600rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.close-btn {
|
||||||
|
width: 160rpx;
|
||||||
|
height: 72rpx;
|
||||||
|
background: #19367A;
|
||||||
|
color: #FFFFFF;
|
||||||
|
font-size: 28rpx;
|
||||||
|
border-radius: 36rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 32rpx auto 0;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.95);
|
||||||
|
background: #142c62;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.change-phone-modal {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgba(0, 0, 0, 0.6);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
width: 600rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding: 48rpx 32rpx;
|
||||||
|
|
||||||
|
.modal-title {
|
||||||
|
font-size: 36rpx;
|
||||||
|
color: #333333;
|
||||||
|
font-weight: 600;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-desc {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #666666;
|
||||||
|
text-align: center;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
margin-bottom: 48rpx;
|
||||||
|
line-height: 1.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-buttons {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 24rpx;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
flex: 1;
|
||||||
|
height: 88rpx;
|
||||||
|
border-radius: 44rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn {
|
||||||
|
background: #F5F5F5;
|
||||||
|
color: #666666;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: #EBEBEB;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.confirm-btn {
|
||||||
|
background: #19367A;
|
||||||
|
color: #FFFFFF;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: #142c62;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone-input-modal {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgba(0, 0, 0, 0.6);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
.modal-content {
|
||||||
|
width: 600rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding: 48rpx 32rpx;
|
||||||
|
|
||||||
|
.modal-title {
|
||||||
|
font-size: 36rpx;
|
||||||
|
color: #333333;
|
||||||
|
font-weight: 600;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 48rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-section {
|
||||||
|
margin-bottom: 48rpx;
|
||||||
|
|
||||||
|
.input-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background: #F5F5F5;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
|
||||||
|
.prefix {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone-input {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.verify-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.verify-input {
|
||||||
|
flex: 1;
|
||||||
|
background: #F5F5F5;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.verify-btn {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #19367A;
|
||||||
|
color: #FFFFFF;
|
||||||
|
font-size: 24rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
background: #142c62;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.disabled {
|
||||||
|
background: #CCCCCC;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-buttons {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 24rpx;
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
flex: 1;
|
||||||
|
height: 88rpx;
|
||||||
|
border-radius: 44rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn {
|
||||||
|
background: #F5F5F5;
|
||||||
|
color: #666666;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: #EBEBEB;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.confirm-btn {
|
||||||
|
background: #19367A;
|
||||||
|
color: #FFFFFF;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background: #142c62;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
@ -338,6 +654,7 @@
|
|||||||
reAuth
|
reAuth
|
||||||
} from '@/api/bar.js'
|
} from '@/api/bar.js'
|
||||||
import { getToken } from '@/utils/auth.js'
|
import { getToken } from '@/utils/auth.js'
|
||||||
|
import { updatePhone } from '@/api/user.js' // 请确保添加相关API
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@ -357,6 +674,15 @@
|
|||||||
currentTab: 1,
|
currentTab: 1,
|
||||||
QQMap: null,
|
QQMap: null,
|
||||||
barInfo: {},
|
barInfo: {},
|
||||||
|
showPreview: false,
|
||||||
|
previewUrl: '',
|
||||||
|
showPhoneModal: false,
|
||||||
|
showPhoneInputModal: false,
|
||||||
|
newPhone: '',
|
||||||
|
verifyCode: '',
|
||||||
|
showVerifyCode: false,
|
||||||
|
counting: false,
|
||||||
|
countdown: 60,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@ -492,14 +818,6 @@
|
|||||||
})
|
})
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if (!this.form.position) {
|
|
||||||
uni.showToast({
|
|
||||||
title: '请输入店内职务',
|
|
||||||
icon: 'none',
|
|
||||||
mask: true
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(!this.form.latitude || !this.form.longitude) {
|
if(!this.form.latitude || !this.form.longitude) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: '请通过定位获取位置',
|
title: '请通过定位获取位置',
|
||||||
@ -542,8 +860,10 @@
|
|||||||
// 选择头像
|
// 选择头像
|
||||||
async onChooseAvatar(e) {
|
async onChooseAvatar(e) {
|
||||||
try {
|
try {
|
||||||
|
console.log('开始选择头像:', e);
|
||||||
// 获取头像临时路径
|
// 获取头像临时路径
|
||||||
const avatarUrl = e.detail.avatarUrl;
|
const avatarUrl = e.detail.avatarUrl;
|
||||||
|
console.log('获取到的头像临时路径:', avatarUrl);
|
||||||
|
|
||||||
if (!avatarUrl) {
|
if (!avatarUrl) {
|
||||||
throw new Error('未获取到头像');
|
throw new Error('未获取到头像');
|
||||||
@ -553,66 +873,80 @@
|
|||||||
title: '上传中...'
|
title: '上传中...'
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const token = getToken();
|
||||||
|
console.log('当前token:', token);
|
||||||
|
|
||||||
// 上传头像
|
// 上传头像
|
||||||
const uploadRes = await uni.uploadFile({
|
uni.uploadFile({
|
||||||
url: base_url + '/bar/common/upload', // 使用正确的API路径
|
url: base_url + '/api/bar/common/upload',
|
||||||
filePath: avatarUrl,
|
filePath: avatarUrl,
|
||||||
name: 'file', // 使用正确的参数名
|
name: 'file',
|
||||||
header: {
|
header: {
|
||||||
'Authorization': getToken()
|
'Authorization': token,
|
||||||
|
'Content-Type': 'multipart/form-data'
|
||||||
},
|
},
|
||||||
formData: {
|
formData: {
|
||||||
type: 'image' // 指定上传类型为图片
|
type: 'image'
|
||||||
|
},
|
||||||
|
success: (uploadFileRes) => {
|
||||||
|
console.log('上传响应原始数据:', uploadFileRes);
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 检查状态码
|
||||||
|
if (uploadFileRes.statusCode !== 200) {
|
||||||
|
throw new Error(`服务器响应错误: ${uploadFileRes.statusCode}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
let result;
|
||||||
|
try {
|
||||||
|
result = JSON.parse(uploadFileRes.data);
|
||||||
|
} catch (parseError) {
|
||||||
|
console.error('解析响应数据失败，原始数据:', uploadFileRes.data);
|
||||||
|
throw new Error('服务器响应格式错误');
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('解析后的响应数据:', result);
|
||||||
|
|
||||||
|
if (result.code === 200) {
|
||||||
|
const imageUrl = result.data || result.url;
|
||||||
|
if (!imageUrl) {
|
||||||
|
throw new Error('未获取到图片地址');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新表单数据
|
||||||
|
this.form.barLogo = imageUrl;
|
||||||
|
|
||||||
|
// 更新本地存储的门店信息
|
||||||
|
const barInfo = uni.getStorageSync('barInfo') || {};
|
||||||
|
barInfo.barLogo = imageUrl;
|
||||||
|
uni.setStorageSync('barInfo', barInfo);
|
||||||
|
|
||||||
|
uni.showToast({
|
||||||
|
title: '更新成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
throw new Error(result.msg || '上传失败');
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('处理响应数据时出错:', error);
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.error('上传请求失败:', err);
|
||||||
|
throw new Error(err.errMsg || '上传失败');
|
||||||
|
},
|
||||||
|
complete: () => {
|
||||||
|
uni.hideLoading();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// 解析响应数据
|
|
||||||
let result;
|
|
||||||
try {
|
|
||||||
// 检查响应数据是否为JSON字符串
|
|
||||||
if (typeof uploadRes.data === 'string' && uploadRes.data.trim().startsWith('{')) {
|
|
||||||
result = JSON.parse(uploadRes.data);
|
|
||||||
} else {
|
|
||||||
// 如果不是JSON，尝试直接使用响应数据
|
|
||||||
result = {
|
|
||||||
code: uploadRes.statusCode === 200 ? 200 : 500,
|
|
||||||
data: uploadRes.data,
|
|
||||||
msg: uploadRes.statusCode === 200 ? '上传成功' : '上传失败'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
console.error('解析响应数据失败:', e);
|
|
||||||
// 如果解析失败，使用默认响应
|
|
||||||
result = {
|
|
||||||
code: uploadRes.statusCode === 200 ? 200 : 500,
|
|
||||||
data: uploadRes.data,
|
|
||||||
msg: '解析响应失败'
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
if (result.code === 200) {
|
|
||||||
// 更新表单数据
|
|
||||||
this.form.barLogo = result.data;
|
|
||||||
|
|
||||||
// 更新本地存储的门店信息
|
|
||||||
const barInfo = uni.getStorageSync('barInfo') || {};
|
|
||||||
barInfo.barLogo = result.data;
|
|
||||||
uni.setStorageSync('barInfo', barInfo);
|
|
||||||
|
|
||||||
uni.showToast({
|
|
||||||
title: '更新成功',
|
|
||||||
icon: 'success'
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
throw new Error(result.msg || '上传失败');
|
|
||||||
}
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('选择头像失败:', error);
|
console.error('选择头像完整错误信息:', error);
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: error.message || '选择头像失败',
|
title: error.message || '选择头像失败',
|
||||||
icon: 'none'
|
icon: 'none'
|
||||||
});
|
});
|
||||||
} finally {
|
|
||||||
uni.hideLoading();
|
uni.hideLoading();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -621,7 +955,134 @@
|
|||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url: '/pagesMy/myAddress'
|
url: '/pagesMy/myAddress'
|
||||||
})
|
})
|
||||||
}
|
},
|
||||||
|
// 预览图片
|
||||||
|
previewImage(type) {
|
||||||
|
const imageUrl = type === 'businessLicense' ? this.barInfo.businessLicense : this.barInfo.storefrontPhoto;
|
||||||
|
if (!imageUrl) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '暂无图片',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.previewUrl = imageUrl;
|
||||||
|
this.showPreview = true;
|
||||||
|
},
|
||||||
|
// 关闭预览
|
||||||
|
closePreview() {
|
||||||
|
this.showPreview = false;
|
||||||
|
this.previewUrl = '';
|
||||||
|
},
|
||||||
|
// 显示更换手机号弹窗
|
||||||
|
showChangePhone() {
|
||||||
|
this.showPhoneModal = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 关闭更换手机号弹窗
|
||||||
|
closePhoneModal() {
|
||||||
|
this.showPhoneModal = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 确认更换手机号
|
||||||
|
confirmChangePhone() {
|
||||||
|
this.closePhoneModal();
|
||||||
|
this.showPhoneInputModal = true;
|
||||||
|
this.newPhone = '';
|
||||||
|
this.verifyCode = '';
|
||||||
|
this.showVerifyCode = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 关闭手机号输入弹窗
|
||||||
|
closePhoneInputModal() {
|
||||||
|
this.showPhoneInputModal = false;
|
||||||
|
this.newPhone = '';
|
||||||
|
this.verifyCode = '';
|
||||||
|
this.showVerifyCode = false;
|
||||||
|
this.counting = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取验证码
|
||||||
|
getVerifyCode() {
|
||||||
|
if (this.counting) return;
|
||||||
|
|
||||||
|
if (!this.newPhone) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入手机号',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!/^1[3-9]\d{9}$/.test(this.newPhone)) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入正确的手机号',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// TODO: 调用发送验证码接口
|
||||||
|
this.showVerifyCode = true;
|
||||||
|
this.counting = true;
|
||||||
|
this.countdown = 60;
|
||||||
|
|
||||||
|
const timer = setInterval(() => {
|
||||||
|
if (this.countdown > 0) {
|
||||||
|
this.countdown--;
|
||||||
|
} else {
|
||||||
|
this.counting = false;
|
||||||
|
clearInterval(timer);
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
|
||||||
|
// 保存新手机号
|
||||||
|
saveNewPhone() {
|
||||||
|
if (!this.newPhone) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入手机号',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!/^1[3-9]\d{9}$/.test(this.newPhone)) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请输入正确的手机号',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
uni.showLoading({
|
||||||
|
title: '保存中...'
|
||||||
|
});
|
||||||
|
|
||||||
|
editBarInfo({ barContactPhone: this.newPhone }).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '更换成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
this.closePhoneInputModal();
|
||||||
|
this.getBarInfoFun(); // 刷新页面信息
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.msg || '更换失败',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err.msg || '更换失败',
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
}).finally(() => {
|
||||||
|
uni.hideLoading();
|
||||||
|
});
|
||||||
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user