diff --git a/pagesMy/setting.vue b/pagesMy/setting.vue
index db18096..55e272c 100644
--- a/pagesMy/setting.vue
+++ b/pagesMy/setting.vue
@@ -23,10 +23,11 @@
-
+
关联手机
{{maskedPhone}}
+
@@ -78,20 +79,20 @@
- 门店认证期限时间
+ 认证到期时间
- 2026-07-31
+ {{barInfo.authEndTime || '--'}}
营业执照
-
+
点击查看
门头照片
-
+
点击查看
@@ -103,6 +104,65 @@
保存
+
+
+
+
+ 确认更换手机号？
+ 更换后现手机号{{maskedPhone}}将不能用于登录，180天内只可更换一次
+
+ 我再想想
+ 确认更换
+
+
+
+
+
+
+
+ 更换手机号
+
+
+ +86
+
+
+
+
+
+ {{counting ? `${countdown}s后重新获取` : '获取验证码'}}
+
+
+
+
+ 取消
+ 确定
+
+
+
+
+
+
+
+
+ 关闭
+
+
@@ -321,6 +381,262 @@
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;
+ }
+ }
+ }
+ }
+ }
}
@@ -338,6 +654,7 @@
reAuth
} from '@/api/bar.js'
import { getToken } from '@/utils/auth.js'
+ import { updatePhone } from '@/api/user.js' // 请确保添加相关API
export default {
data() {
return {
@@ -357,6 +674,15 @@
currentTab: 1,
QQMap: null,
barInfo: {},
+ showPreview: false,
+ previewUrl: '',
+ showPhoneModal: false,
+ showPhoneInputModal: false,
+ newPhone: '',
+ verifyCode: '',
+ showVerifyCode: false,
+ counting: false,
+ countdown: 60,
};
},
computed: {
@@ -492,14 +818,6 @@
})
return
}
- if (!this.form.position) {
- uni.showToast({
- title: '请输入店内职务',
- icon: 'none',
- mask: true
- })
- return
- }
if(!this.form.latitude || !this.form.longitude) {
uni.showToast({
title: '请通过定位获取位置',
@@ -542,8 +860,10 @@
// 选择头像
async onChooseAvatar(e) {
try {
+ console.log('开始选择头像:', e);
// 获取头像临时路径
const avatarUrl = e.detail.avatarUrl;
+ console.log('获取到的头像临时路径:', avatarUrl);
if (!avatarUrl) {
throw new Error('未获取到头像');
@@ -553,66 +873,80 @@
title: '上传中...'
});
+ const token = getToken();
+ console.log('当前token:', token);
+
// 上传头像
- const uploadRes = await uni.uploadFile({
- url: base_url + '/bar/common/upload', // 使用正确的API路径
+ uni.uploadFile({
+ url: base_url + '/api/bar/common/upload',
filePath: avatarUrl,
- name: 'file', // 使用正确的参数名
+ name: 'file',
header: {
- 'Authorization': getToken()
+ 'Authorization': token,
+ 'Content-Type': 'multipart/form-data'
},
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) {
- console.error('选择头像失败:', error);
+ console.error('选择头像完整错误信息:', error);
uni.showToast({
title: error.message || '选择头像失败',
icon: 'none'
});
- } finally {
uni.hideLoading();
}
},
@@ -621,7 +955,134 @@
uni.navigateTo({
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();
+ });
+ },
}
}