Skip to content

7
7-Eleven
Commit f8757c28 by 谢中龙
Options

导购对外名片修改

parent a0bef573
Showing with 151 additions and 107 deletions
src/shoppingGuid/page/pages/home/home.js
......@@ -63,6 +63,30 @@ wxService.page({
onShow: function () {
this.getRecruitRanking() // 招募榜
},
//打开我的名片
onTapOpenMyFile(){
// let uInfo = wx.getStorageSync('_baseUserInfo');
// if (uInfo){
// let myUserId = uInfo.member.qiyeInfo.userid;
// console.log(myUserId)
// wx.qy.openUserProfile({
// type : 1,
// userid: myUserId,
// success : res => {
// console.log('ok',res)
// },
// fail : err => {
// console.log('error')
// },
// })
// }
wx.navigateTo({
url: '/shoppingGuid/page/pages/qrcode/qrcode',
});
// console.log(uInfo)
},
//获取排行榜
getRecruitRanking() {
wx.showLoading({
......
src/shoppingGuid/page/pages/home/home.wxml
......@@ -16,6 +16,10 @@
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_member_center.png' mode='aspectFit'></image>
<view class='tool-name'>会员中心</view>
</view>
<view class='tools-item' bindtap='onTapOpenMyFile'>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/icon_my_card.jpg' mode='aspectFit'></image>
<view class='tool-name'>我的名片</view>
</view>
</view>
</view>
<!-- 整体布局 -->
......
src/shoppingGuid/page/pages/home/home.wxss
......@@ -44,8 +44,8 @@ view{
.top-items .tools-item{
flex: 0;
min-width: 30%;
max-width: 30%;
min-width: 25%;
max-width: 25%;
height: auto;
display: flex;
flex-direction: column;
......
src/shoppingGuid/page/pages/qrcode/qrcode.js
......@@ -13,7 +13,29 @@ wxService.page({
avator: '',
name :'',
template : {},
cardImg : ''
cardImg : '',
companyName: '',
bottomTypeArr : [
{
name: "关注公众号",
url: 'https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_focus_wx_no_bg.png',
active: false,
type:1
},
{
name: "企业微信",
url: 'https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_qiye_wx_no_bg.png',
active: true ,
type: 2
},
{
name: "开卡页",
url: 'https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_open_card_no_bg.png',
active: false ,
type: 3
},
],
currentBottomType : '2'
},
/**
......@@ -63,7 +85,6 @@ wxService.page({
//获取企业二维码
getEnterpriseQrcode(){
let guideCodeImg = wx.getStorageSync('guideCodeImg');
console.log('guideCodeImg---', guideCodeImg)
if (!guideCodeImg){
wx.qy.getQrCode({
success: res => {
......@@ -99,58 +120,36 @@ wxService.page({
});
},
//保存名片按钮
onTapSaveCardToColumn(){
if (!this.data.codeImg){
wx.showToast({
title: '导购二维码不存在',
icon : 'none'
});
return ;
}
wx.showLoading({
title: '图片生成中...',
//改变二位方式
onTapChangeType(e){
let index = e.currentTarget.dataset.index;
this.data.bottomTypeArr.map(item => {
item.active = false;
});
let avatar = this.data.avator ? this.data.avator : 'https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/biaka_default_u_logo.png';
let self = this;
wx.downloadFile({
url: this.data.codeImg,
success(res){
if (res.statusCode === 200) {
let codeImg = res.tempFilePath;
wx.downloadFile({
url: avatar,
success(res) {
if (res.statusCode === 200) {
let avatarImg = res.tempFilePath;
console.log('头像---', avatarImg)
console.log('图片---', codeImg)
self.setData({
template: new GuiderCard().palette(codeImg, avatarImg, self.data.name)
});
}
},
fail(res) {
wx.showToast({
title: '头像下载失败',
icon: 'none'
});
}
});
}
},
fail(res){
wx.showToast({
title: '二维码下载失败',
icon : 'none'
})
}
this.data.bottomTypeArr[index].active = true;
this.data.currentBottomType = this.data.bottomTypeArr[index].type;
this.setData({
bottomTypeArr: this.data.bottomTypeArr,
currentBottomType: this.data.currentBottomType
});
this.changeQrcode();
},
//根据类型切换qrcode
changeQrcode(){
console.log(this.data.currentBottomType)
if(this.data.currentBottomType == 2){ //企业二维码
this.getEnterpriseQrcode();
}
else if (this.data.currentBottomType == 1){ //带门店参数的关注公众号二维码
}
else if (this.data.currentBottomType == 3){ //开卡页
}
},
/**
......@@ -160,40 +159,6 @@ wxService.page({
},
//生成二维码后
onImgOK(e) {
console.log('生成成功!',e);
let imgUrl = e.detail.path;
wx.saveImageToPhotosAlbum({
filePath: imgUrl,
success(res) {
wx.hideLoading();
setTimeout(() => {
wx.showToast({
title: '保存成功,请前往相册查看~',
icon: 'none'
}, 2000)
})
},
fail(err) {
console.log(err)
let txt = '保存失敗';
if (err.errMsg == 'saveImageToPhotosAlbum:fail auth deny') {
txt = '获取相册授权失败'
}
wx.hideLoading();
setTimeout(() => {
wx.showToast({
title: txt,
icon: 'none'
}, 2000)
})
}
});
},
/**
* 用户点击右上角分享
*/
......
src/shoppingGuid/page/pages/qrcode/qrcode.wxml
<!--shoppingGuid/page/pages/qrcode/qrcode.wxml-->
<view class='qrcode'>
<view class='taps'>
<text>添加为企微好友</text>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_right_three.png' mode='aspectFit'></image>
<text>发送欢迎语卡片</text>
<image src='https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_right_three.png' mode='aspectFit'></image>
<text>引导注册成为会员</text>
</view>
<view class='card'>
<image class='g-qrcode' mode='aspectFit' src='{{codeImg}}'></image>
<image class='g-logo' mode='aspectFit' src='{{avator}}'></image>
<text class='name'>{{name}}</text>
<text class='company'>{{companyName}}</text>
</view>
</view>
<!-- 底部操作按钮 -->
<view class='bottom-operator' bindtap='onTapSaveCardToColumn'>
<icon type='download' size='16' color="rgb(0, 145, 255)"></icon>保存名片到相册
</view>
<!-- 预览 -->
<view class='preview'>
<painter palette="{{template}}" bind:imgOK="onImgOK" />
<view class='bottom-operator'>
<view class='items {{item.active ? "active" : ""}}'
wx:for="{{bottomTypeArr}}"
wx:for-item="item"
wx:for-index="idx"
wx:key="{{idx}}"
data-index="{{idx}}"
bindtap='onTapChangeType'>
<image src='{{item.url}}' mode='aspectFit'></image>
<view>{{item.name}}</view>
</view>
</view>
src/shoppingGuid/page/pages/qrcode/qrcode.wxss
......@@ -15,16 +15,39 @@ view{
.qrcode{
padding: 50rpx;
padding-top: 130rpx;
width: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-image: url(https://bigaka-xie.oss-cn-shanghai.aliyuncs.com/7_3_0/icon_shoudi_mingp.png);
margin-top: 30rpx;
position: relative;
}
.qrcode .taps{
position: absolute;
display: flex;
color: #0091FF;
top: 30rpx;
left: 0;
align-items: center;
justify-content: center;
width: 100%;
font-size: 24rpx;
}
.qrcode .taps image{
width: 40rpx;
height: 24rpx;
}
.qrcode .card{
width: 100%;
height: auto;
padding: 100rpx 30rpx;
background: #ffffff;
background: transparent;
border-radius: 10rpx;
/* border: 12rpx solid rgba(0, 145, 255, 0.46); */
box-shadow: 0 0 20rpx 8rpx rgba(0, 145, 255, 0.46);
display: flex;
flex-direction: column;
align-items: center;
......@@ -49,6 +72,12 @@ view{
font-size: 36rpx;
color: #333333;
font-weight: bold;
margin-bottom: 20rpx;
}
.qrcode .card .company{
font-size: 24rpx;
color: #999999;
}
/* 底部操作按钮 */
......@@ -57,7 +86,7 @@ view{
bottom: 20rpx;
left: 0;
width: 100%;
height: 80rpx;
height: 140rpx;
display: flex;
align-items: center;
padding: 0 30rpx;
......@@ -66,18 +95,29 @@ view{
font-size: 28rpx;
}
.bottom-operator icon{
margin-right: 10rpx;
.bottom-operator .items{
width: 140rpx;
height: 140rpx;
margin-right: 30rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 22rpx;
color: #999999;
border-radius: 8rpx;
}
.bottom-operator .items image{
width: 80rpx;
height: 80rpx;
margin-bottom: 5rpx;
}
.bottom-operator:active{
.bottom-operator .items:active{
opacity: 0.7;
}
.preview{
width: 100%;
height: 100vh;
.bottom-operator .items.active{
background: #ffffff;
position: absolute;
transform: translateX(-100%);
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment