From 7319b657c363c1738c1dca926847c8f6b1015596 Mon Sep 17 00:00:00 2001 From: hflllll Date: Tue, 14 Oct 2025 13:23:15 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0H5=E5=B9=B3=E5=8F=B0?= =?UTF-8?q?=E6=94=AF=E6=8C=81=E5=B9=B6=E4=BC=98=E5=8C=96=E7=94=A8=E6=88=B7?= =?UTF-8?q?=E4=BF=A1=E6=81=AF=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在Vuex store中为H5平台添加localStorage存储用户信息 - 为H5平台添加头像选择和上传功能 - 优化二维码生成逻辑,为H5平台添加official类型参数 - 修复分享链接参数从vid改为inviter - 移除默认头像和会员权益的硬编码内容 - 优化代码格式和注释 --- App.vue | 6 +- mixins/config.js | 10 +- pages/index/member.vue | 40 +- stores/index.js | 3 + subPages/login/userInfo.vue | 82 +++- subPages/member/recharge.vue | 875 +++++++++++++++++++++---------------------- subPages/user/profile.vue | 67 +++- subPages/user/share.vue | 6 +- utils/share.js | 24 +- 9 files changed, 624 insertions(+), 489 deletions(-) diff --git a/App.vue b/App.vue index 97ca28f..a569a50 100644 --- a/App.vue +++ b/App.vue @@ -7,7 +7,11 @@ // 提前获取二维码并保存起来 async getQrcode() { uni.getImageInfo({ - src: `${this.$config.baseURL}/promotion/qrCode?token=${uni.getStorageSync('token')}`, + src: `${this.$config.baseURL}/promotion/qrCode?token=${uni.getStorageSync('token')}` + // #ifdef H5 + + '&type=official' + // #endif + , success: (image) => { this.Qrcode = image.path; this.$store.commit('setQrcode', this.Qrcode) diff --git a/mixins/config.js b/mixins/config.js index 0acd8ba..dfcc980 100644 --- a/mixins/config.js +++ b/mixins/config.js @@ -16,17 +16,17 @@ export default { const statusBarHeight = systemInfo.statusBarHeight || 0; const navigationBarHeight = 44; // 默认导航栏高度 this.containerHeight = 2 * (systemInfo.windowHeight - statusBarHeight - navigationBarHeight); - console.log('最后的容器高度为', this.containerHeight/2 + 'px', '状态栏高度:', statusBarHeight + 'px', 'nav导航栏高度:', navigationBarHeight + 'px'); + console.log('最后的容器高度为', this.containerHeight / 2 + 'px', '状态栏高度:', statusBarHeight + 'px', 'nav导航栏高度:', navigationBarHeight + 'px'); }, }, computed: { // 获取全局配置的文本 configParamInfo() { - return key => this.$store.state.configList[key]?.info || '默认资料' + return key => this.$store.state.configList[key]?.info }, // 获取全局配置的图片 configParamContent() { - return key => this.$store.state.configList[key]?.content || '默认内容' + return key => this.$store.state.configList[key]?.content }, // 默认的全局分享参数 @@ -34,7 +34,7 @@ export default { const obj = {} if (this.$store.state.userInfo.id) { obj.path = this.configParamContent('xcxSharePage') + '?inviter=' + this.$store.state.userInfo.id - }else { + } else { obj.path = this.configParamContent('xcxSharePage') } return { @@ -61,7 +61,7 @@ export default { }, onLoad(args) { // this.calculateContainerHeight(); - if (args.inviter){ + if (args.inviter) { uni.setStorageSync('inviter', args.inviter) } } diff --git a/pages/index/member.vue b/pages/index/member.vue index 52faf5c..411002c 100644 --- a/pages/index/member.vue +++ b/pages/index/member.vue @@ -22,12 +22,12 @@ - 共19项会员特权 | 3 项年VIP专属特权 - + {{ configParamContent('member_info') || '共19项会员特权 | 3 项年VIP专属特权'}} + - - - - + + + @@ -105,7 +107,7 @@ 精心设计科学的学习流程 「测试-讲解-练习-检验」知识掌握更牢固 - + --> @@ -139,7 +141,7 @@ {{ book.book.categoryName || '--' }}/ - + {{ book.book.duration }} @@ -171,7 +173,7 @@ {{ book.booksName }} {{ book.categoryName }}/ - + {{ book.duration }} @@ -191,7 +193,7 @@ export default{ memberBenefits: [], userInfo: { name: '战斗世界', - avatar: '/static/default-avatar.png' + avatar: '/static/默认头像.png' }, // 学习计划书籍数据 @@ -293,7 +295,7 @@ export default{ this.isLogin = false this.userInfo = { name: '登录后查看会员情况', - avatar: '/static/default-avatar.png' + avatar: '/static/默认头像.png' } } } @@ -462,10 +464,10 @@ export default{ } .benefit-item { - background: #F8F8F8; - border: 1px solid #FFFFFF; - border-radius: 48rpx; - padding: 27rpx 40rpx; + // background: #F8F8F8; + // border: 1px solid #FFFFFF; + // border-radius: 48rpx; + // padding: 27rpx 40rpx; display: flex; align-items: center; justify-content: space-between; @@ -490,8 +492,8 @@ export default{ } .benefit-icon { - width: 152rpx; - height: 152rpx; + // width: 152rpx; + // height: 152rpx; // flex-shrink: 0; } diff --git a/stores/index.js b/stores/index.js index 2d698db..0cf0e6e 100644 --- a/stores/index.js +++ b/stores/index.js @@ -59,6 +59,9 @@ const store = new Vuex.Store({ }, setUserInfo(state, data) { state.userInfo = data + // #ifdef H5 + localStorage.setItem('userInfo', data) + // #endif }, setQrcode(state, data) { state.Qrcode = data diff --git a/subPages/login/userInfo.vue b/subPages/login/userInfo.vue index cea1768..02eb0c7 100644 --- a/subPages/login/userInfo.vue +++ b/subPages/login/userInfo.vue @@ -17,6 +17,7 @@ 头像 + + + + + + @@ -43,6 +55,7 @@ 手机号 + + + + + + @@ -136,7 +156,7 @@ export default { uni.hideLoading(); console.error('头像上传异常:', error); // 异常情况下使用本地头像 - this.userInfo.avatar = e.detail.avatarUrl; + // this.userInfo.avatar = e.detail.avatarUrl; uni.showToast({ title: '头像处理异常,使用本地头像', icon: 'none' @@ -149,10 +169,51 @@ export default { }); } }, + + // 公众号/H5 选择图片并上传头像 + // #ifndef MP-WEIXIN + async chooseImageH5() { + try { + const res = await uni.chooseImage({ + count: 1, + sizeType: ['compressed'], + sourceType: ['album', 'camera'] + }) + + const filePath = (res.tempFilePaths && res.tempFilePaths[0]) + || (res.tempFiles && res.tempFiles[0] && (res.tempFiles[0].path || res.tempFiles[0].tempFilePath)) + + if (!filePath) { + uni.showToast({ title: '未选择图片', icon: 'none' }) + return + } + + uni.showLoading({ title: '上传头像中...' }) + + const file = { path: filePath, tempFilePath: filePath } + const uploadResult = await this.$utils.uploadImage(file) + + uni.hideLoading() + + if (uploadResult && uploadResult.success) { + this.userInfo.avatar = uploadResult.url + uni.showToast({ title: '头像上传成功', icon: 'success' }) + } else { + // 上传失败则先本地显示 + this.userInfo.avatar = filePath + uni.showToast({ title: '头像已选择', icon: 'none' }) + } + } catch (error) { + uni.hideLoading() + console.error('选择/上传头像异常:', error) + uni.showToast({ title: '头像处理异常', icon: 'none' }) + } + }, + // #endif // 保存资料 async saveProfile() { - if (!this.userInfo.name.trim()) { + if (!this.userInfo.name?.trim()) { uni.showToast({ title: '请输入昵称', icon: 'none' @@ -160,7 +221,7 @@ export default { return } - if (!this.userInfo.phone.trim()) { + if (!this.userInfo.phone?.trim()) { uni.showToast({ title: '请输入手机号', icon: 'none' diff --git a/subPages/user/share.vue b/subPages/user/share.vue index 1651f25..8a337a6 100644 --- a/subPages/user/share.vue +++ b/subPages/user/share.vue @@ -162,7 +162,11 @@ export default { async getQrcode() { this.isLoading = true uni.getImageInfo({ - src: `${this.$config.baseURL}/promotion/qrCode?token=${uni.getStorageSync('token')}`, + src: `${this.$config.baseURL}/promotion/qrCode?token=${uni.getStorageSync('token')}` + // #ifdef H5 + + '&type=official' + // #endif + , success: (image) => { this.Qrcode = image.path; diff --git a/utils/share.js b/utils/share.js index 94ca59c..9075584 100644 --- a/utils/share.js +++ b/utils/share.js @@ -37,21 +37,21 @@ function share() { //微信分享 'checkJsApi', 'scanQRCode', ], - success: function() { - console.log('配置成功'); - } + success: function () { + console.log('配置成功'); + } }); - jWeixin.ready(function() { + jWeixin.ready(function () { // 微信分享的数据 var shareData = { "link": addQueryParams(data.url), "desc": "四零语境", "title": "四零语境,温柔呵护每一刻!", - imgUrl : location.href.split('#')[0] + '/static/share/logo.png', - success: function() { + imgUrl: location.href.split('#')[0] + '/static/share/logo.png', + success: function () { //分享成功可以做相应的数据处理 - console.log('注册分享成功'); + console.log('注册分享成功'); // uni.showToast({ // mask: true, // duration: 1000, @@ -66,10 +66,10 @@ function share() { //微信分享 //分享到微博内容设置 jWeixin.onMenuShareWeibo(shareData); }); - - jWeixin.error(function(err){ + + jWeixin.error(function (err) { console.error(err); - // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。 + // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。 }) } }) @@ -79,8 +79,8 @@ function addQueryParams(url) { if (url) { //获取用户id let userInfo = localStorage.getItem('userInfo') ? JSON.parse(localStorage.getItem('userInfo')) : null - if(userInfo){ - url += `?vid=${userInfo.id}` + if (userInfo) { + url += `?inviter=${userInfo.id}` } } return url