二维码分享功能

This commit is contained in:
donqi 2022-07-14 00:39:45 +08:00
parent ed9a8ccd88
commit 3ac990eb63
4 changed files with 308 additions and 122 deletions

View File

@ -10,9 +10,9 @@ export default {
title: '加载中'
})
// request 触发前拼接 url
// args.url = 'https://www.opsoul.com' + args.url;
args.url = 'https://www.opsoul.com' + args.url;
// args.url = 'http://192.168.2.42:80' + args.url;
args.url = 'http://127.0.0.1:80' + args.url;
// args.url = 'http://127.0.0.1:80' + args.url;
if (args.data) {
args.data.deptId = globalData.deptId;
args.data.from = globalData.from;
@ -172,7 +172,7 @@ export default {
})
return res[1].data;
},
async updateUserPhone(params = {}) {
async updateUser(params = {}) {
let res = await uni.request({
url: '/customer/update',
method: 'POST',
@ -181,9 +181,16 @@ export default {
// 更新用户信息的方法顺便更新本地缓存
if (res[1].data.code === 0) {
let userInfo = this.getCurUserInfo();
userInfo.phone = params.phone;
userInfo.account = params.account;
uni.setStorageSync('userProfile', userInfo);
let wxGetUserRes = await this.qryUserInfo(userInfo.openId);
let newUserInfo;
if (wxGetUserRes.data) {
newUserInfo = {
...wxGetUserRes.data,
wxLoginCode: userInfo.wxLoginCode
}
}
console.log(newUserInfo)
uni.setStorageSync('userProfile', newUserInfo);
}
return res[1].data;
},
@ -198,7 +205,7 @@ export default {
}
if (phoneRes && phoneRes.data) {
let userInfo = this.getCurUserInfo();
await this.updateUserPhone({
await this.updateUser({
customerId: userInfo.customerId,
account: phoneRes.data,
phone: phoneRes.data
@ -212,6 +219,19 @@ export default {
getCurUserInfo() {
let userProfile = uni.getStorageSync('userProfile');
return userProfile;
},
async getCurUserNoCache() {
let userInfo = this.getCurUserInfo();
let wxGetUserRes = await this.qryUserInfo(userInfo.openId);
if (!wxGetUserRes.data) {
userInfo = null;
} else {
userInfo = {
...wxGetUserRes.data,
wxLoginCode: userInfo.wxLoginCode
}
}
return userInfo;
},
getProductCategories(params = {}) {
return uni.request({
@ -423,5 +443,13 @@ export default {
data: params
})
return res[1].data;
},
},
async getUnlimitedWxacode(params = {}) {
let res = await uni.request({
url: '/wx/unlimited/wxacode',
method: 'POST',
data: params
})
return res[1].data;
}
}

View File

@ -3,14 +3,14 @@
<index v-if="curPageCode === 'indexPage'"></index>
<worker-circle v-if="curPageCode === 'workerCirclePage'"></worker-circle>
<personal-center v-if="curPageCode === 'myPage'"></personal-center>
<!-- <publish-home v-if="curPageCode === 'publishPage'"></publish-home> -->
<!-- <publish-home v-if="curPageCode === 'publishPage'"></publish-home> -->
<msg-page v-if="curPageCode === 'msgPage'"></msg-page>
<module-bar ref="moduleBar" :moduleBarInfos="moduleBarInfos" @getCurPageInfo="getCurPageInfo"></module-bar>
<!-- 登录校验弹窗 -->
<vertify-login ref="vertifyLogin" @reload="reloadForwardPage"></vertify-login>
<vertify-phone ref="vertifyPhone" @reload="reloadForwardPage"></vertify-phone>
<module-bar ref="moduleBar" :moduleBarInfos="moduleBarInfos" @getCurPageInfo="getCurPageInfo"></module-bar>
<!-- 登录校验弹窗 -->
<vertify-login ref="vertifyLogin" @reload="reloadForwardPage"></vertify-login>
<vertify-phone ref="vertifyPhone" @reload="reloadForwardPage"></vertify-phone>
<!-- 发布 -->
<view class="cu-modal content-mask" :class="isShowPublish?'show':''">
<view class="cu-dialog bottom-dialog margin-bottom-with-bar">
@ -19,38 +19,39 @@
<view class="cu-avatar round middle-avatar first-avatar">
<view class="cuIcon-formfill"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white" @click="showPage('/pages/publish/publish-task')">
<view class="flex flex-column-around text-left margin-left-sm text-white"
@click="showPage('/pages/publish/publish-task')">
<view class="text-xl">发布任务</view>
<view>公司家居家政雇佣上门服务</view>
</view>
</view>
<!-- <view class="flex justify-start margin-tb-xl">
<view class="cu-avatar round middle-avatar second-avatar">
<view class="cuIcon-cameraaddfill"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white">
<view class="text-xl">发闲置</view>
<view class="text-gray">30s发布宝贝</view>
<view class="text-sm">手机/家电卖出/非上门类</view>
</view>
</view> -->
<!-- <view class="flex justify-start margin-tb-xl">
<view class="cu-avatar round middle-avatar third-avatar">
<view class="cuIcon-footprint"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white">
<view class="text-xl">社区跑腿</view>
<view>同楼盘跑腿服务</view>
</view>
</view> -->
<!-- <view class="flex justify-start margin-tb-xl">
<view class="cu-avatar round middle-avatar fourth-avatar">
<view class="cuIcon-shopfill"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white">
<view class="text-xl">品牌厂商发布</view>
<view>销售商电商雇佣</view>
</view>
</view>
<!-- <view class="flex justify-start margin-tb-xl">
<view class="cu-avatar round middle-avatar second-avatar">
<view class="cuIcon-cameraaddfill"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white">
<view class="text-xl">发闲置</view>
<view class="text-gray">30s发布宝贝</view>
<view class="text-sm">手机/家电卖出/非上门类</view>
</view>
</view> -->
<!-- <view class="flex justify-start margin-tb-xl">
<view class="cu-avatar round middle-avatar third-avatar">
<view class="cuIcon-footprint"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white">
<view class="text-xl">社区跑腿</view>
<view>同楼盘跑腿服务</view>
</view>
</view> -->
<!-- <view class="flex justify-start margin-tb-xl">
<view class="cu-avatar round middle-avatar fourth-avatar">
<view class="cuIcon-shopfill"></view>
</view>
<view class="flex flex-column-around text-left margin-left-sm text-white">
<view class="text-xl">品牌厂商发布</view>
<view>销售商电商雇佣</view>
</view>
</view> -->
</view>
</view>
@ -68,7 +69,7 @@
import moduleBar from '@/components/custom-bar/module-bar.vue';
import index from '@/pages/index/home.vue';
import workerCircle from '@/pages/index/worker-home.vue';
import personalCenter from '@/pages/index/my-home.vue';
import personalCenter from '@/pages/index/my-home.vue';
import msgPage from '@/pages/index/msg-home.vue';
// import publishHome from '@/pages/index/publish-home.vue';
@ -77,7 +78,7 @@
moduleBar,
index,
workerCircle,
personalCenter,
personalCenter,
msgPage
// publishHome
},
@ -85,69 +86,127 @@
return {
moduleBarInfos: [],
curPageCode: 'indexPage',
isShowPublish: false,
forwardingPageCode: null
isShowPublish: false,
forwardingPageCode: null,
curUserInfo: null,
inByShare: false,
inParam: null
}
},
onLoad() {
this.loadData();
onLoad(option) {
if (option && option.scene) {
let paraStr = decodeURIComponent(option.scene);
let kvStrArr = paraStr.split("&");
kvStrArr.forEach((kvStr) => {
let kvArr = kvStr.split("=");
option[kvArr[0]] = kvArr[1];
});
}
this.inParam = option;
this.loadData(option);
},
onShareAppMessage(e) {
let shareInfo = null;
if (e && e.target && e.target.dataset) {
shareInfo = e.target.dataset.shareInfo;
}
if (!this.curUserInfo) {
this.curUserInfo = this.$request.getCurUserNoCache();
if (!this.curUserInfo) {
uni.showToast({
title: '请前往“我的”完成登录',
icon: 'none'
})
return;
}
}
if (!shareInfo) {
shareInfo = {
title: '家政服务就找工圈子',
path: '/pages/index/index?distributor=' + this.curUserInfo.customerId,
imageUrl: 'http://gqz.opsoul.com/sys/group-selfie.png'
}
}
return shareInfo;
},
methods: {
async loadData() {
this.moduleBarInfos = await this.$api.data('moduleBarInfos');
},
reloadForwardPage() {
this.getCurPageInfo({
curPageCode: this.forwardingPageCode
})
},
async getCurPageInfo(data) {
let pageCode = data.curPageCode;
this.forwardingPageCode = pageCode;
//
if (['publishPage', 'myPage'].indexOf(pageCode) >= 0) {
async loadData(option) {
this.moduleBarInfos = await this.$api.data('moduleBarInfos');
this.curUserInfo = this.$request.getCurUserInfo();
//
if (option && option.distributor) {
let loginRes = await this.authLogin();
if (!loginRes) {
this.inByShare = true;
return;
}
}
this.forwardingPageCode = null;
if (pageCode === 'publishPage') {
this.isShowPublish = true;
this.inByShare = false;
let res = await this.$request.updateUser({
customerPlace: option.distributor,
customerId: this.curUserInfo.customerId
});
if (res && res.code === 0) {
this.inParam = null;
}
}
},
reloadForwardPage() {
if (this.inByShare) {
this.loadData(this.inParam);
} else {
this.isShowPublish = false;
this.curPageCode = pageCode;
}
this.getCurPageInfo({
curPageCode: this.forwardingPageCode
})
}
},
async getCurPageInfo(data) {
let pageCode = data.curPageCode;
this.forwardingPageCode = pageCode;
//
if (['publishPage', 'myPage'].indexOf(pageCode) >= 0) {
let loginRes = await this.authLogin();
if (!loginRes) {
return;
}
}
this.forwardingPageCode = null;
if (pageCode === 'publishPage') {
this.isShowPublish = true;
} else {
this.isShowPublish = false;
this.curPageCode = pageCode;
}
},
hidePublish() {
this.isShowPublish = false;
},
showPage(url) {
uni.navigateTo({
url: url
})
},
async authLogin() {
// userInfo
let res = await this.$request.storageExistUser();
// userInfo
let curUserInfo = this.$request.getCurUserInfo();
//
if (!curUserInfo || !curUserInfo.openId) {
this.$refs.vertifyLogin.showModal();
return false;
} else {
this.$refs.vertifyLogin.hideModal();
}
//
if (!curUserInfo.phone) {
this.$refs.vertifyPhone.showModal();
return false;
} else {
this.$refs.vertifyPhone.hideModal();
}
return true;
},
showPage(url) {
uni.navigateTo({
url: url
})
},
async authLogin() {
// userInfo
let res = await this.$request.storageExistUser();
// userInfo
let curUserInfo = this.$request.getCurUserInfo();
//
if (!curUserInfo || !curUserInfo.openId) {
this.$refs.vertifyLogin.showModal();
return false;
} else {
this.$refs.vertifyLogin.hideModal();
}
//
if (!curUserInfo.phone) {
this.$refs.vertifyPhone.showModal();
return false;
} else {
this.$refs.vertifyPhone.hideModal();
}
return true;
}
}
}
@ -175,25 +234,25 @@
.cu-avatar.first-avatar {
background-color: #0081ff;
color: #ffffff;
}
.cu-avatar.second-avatar {
background-color: #fbbd08;
color: #ffffff;
}
.cu-avatar.third-avatar {
background-color: #f37b1d;
color: #ffffff;
}
.cu-avatar.fourth-avatar {
background-color: #1cbbb4;
color: #ffffff;
}
.cu-dialog.bottom-dialog {
background-color: unset;
vertical-align: bottom;
}
.cu-avatar.second-avatar {
background-color: #fbbd08;
color: #ffffff;
}
.cu-avatar.third-avatar {
background-color: #f37b1d;
color: #ffffff;
}
.cu-avatar.fourth-avatar {
background-color: #1cbbb4;
color: #ffffff;
}
.cu-dialog.bottom-dialog {
background-color: unset;
vertical-align: bottom;
}
</style>

View File

@ -209,10 +209,10 @@
<view class="cuIcon-servicefill text-olive"></view>
<text>联系客服</text>
</view> -->
<!-- <view class="cu-item">
<view class="cu-item" @click="showAppInviteQrcode">
<view class="cuIcon-qr_code text-green"></view>
<text>二维码分享</text>
</view> -->
</view>
<!-- <view class="cu-item">
<view class="cuIcon-moneybagfill text-cyan"></view>
<text>钱包</text>
@ -250,14 +250,40 @@
</view>
</view>
</view> -->
</view>
<!-- app二维码分享 -->
<view class="cu-modal" :class="appShareQrcodeModal?'show':''">
<view class="cu-dialog bg-white">
<view class="cu-bar bg-white justify-end">
<view class="content">小程序邀请二维码</view>
<view class="action" @click="hideModal" data-modal="appShareQrcodeModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-tb-sm">
<image :src="'data:image/png;base64,' + appQrcode" mode="aspectFit"></image>
</view>
<view class="text-center padding">
<view class="padding-bottom-sm text-lg">请通过扫码或分享链接给好友进行邀请</view>
<button class="cu-btn bg-main-color shadow-blur" open-type="share">
<text class="cuIcon-share"></text>
<text>分享链接给好友</text>
</button>
</view>
</view>
</view>
</view>
</template>
<script>
<script>
// import appInviteQrcode from '@/pages/my/app-invite-qrcode.vue';
export default {
name: 'personal-center',
components: {},
// components: {
// appInviteQrcode
// },
data() {
return {
pageContentTop: this.CustomBar,
@ -302,7 +328,10 @@
type: -1,
name: '已完成'
}],
productOrderType: 1
productOrderType: 1,
appQrcode: '',
appShareQrcodeModal: false
}
},
onReady() {
@ -342,6 +371,13 @@
url: '/pages/my/apply-operator'
})
},
async showAppInviteQrcode() {
let res = await this.$request.getUnlimitedWxacode({
scene: "distributor=" + this.curUserInfo.customerId
});
this.appQrcode = res.data;
this.appShareQrcodeModal = true;
},
showPage(pageUrl) {
if (pageUrl) {
uni.navigateTo({
@ -353,6 +389,9 @@
title: '功能开发中'
})
}
},
hideModal(e) {
this[e.currentTarget.dataset.modal] = false;
}
}
}

View File

@ -0,0 +1,60 @@
<template>
<!-- 报价/客户支付模态框 -->
<view class="cu-modal" :class="show?'show':''">
<view class="cu-dialog bg-white">
<view class="cu-bar bg-white justify-end">
<view class="content">小程序邀请二维码</view>
<view class="action" @click="hideModal">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="padding-tb-sm">
<image :src="'data:image/png;base64,' + url"></image>
</view>
<view class="text-center">
<view>请通过扫码或分享链接给好友进行邀请</view>
<button class="cu-btn bg-main-color shadow-blur" open-type="share" :data-shareInfo="shareInfo"
style="width: 100%;">
<text class="cuIcon-share"></text>
<text>分享链接给好友</text>
</button>
</view>
</view>
</view>
</template>
<script>
export default {
nama: 'app-invite-qrcode',
data() {
return {
url: '',
show: false,
shareTemplate: {
title: '家政服务就找工圈子',
path: '/pages/index/index?customerPlace=',
imageUrl: 'http://gqz.opsoul.com/sys/group-selfie.png'
},
shareInfo: null
}
},
methods: {
showModal(url) {
this.show = true;
this.url = url;
let curUserInfo = this.$request.getCurUserInfo();
if (curUserInfo.customerId && curUserInfo.customerId > 0) {
let path = this.shareTemplate.path + curUserInfo.customerId;
this.shareInfo = {
...this.shareTemplate,
path: path
}
}
},
hideModal() {
this.shareInfo = null;
this.show = false;
}
}
}
</script>