|
@@ -8,63 +8,91 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="position">
|
|
|
- <image src="../../static/imgs/mySet/share.png" mode="widthFix" class="right-img"></image>
|
|
|
- <image src="../../static/imgs/mySet/ewm.png" mode="widthFix" class="right-img"></image>
|
|
|
+ <image @click='selectCard' src="../../static/imgs/mySet/share.png" mode="widthFix" class="right-img">
|
|
|
+ </image>
|
|
|
+ <image @click='selectCard1' src="../../static/imgs/mySet/ewm.png" mode="widthFix" class="right-img">
|
|
|
+ </image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="content2">
|
|
|
- <view class="row flex flex-between" v-for="(item,index) in menuList" :key='index' @click="menuClick(item.type)">
|
|
|
+ <view class="row flex flex-between" v-for="(item,index) in menuList" :key='index'
|
|
|
+ @click="menuClick(item.type)">
|
|
|
<view class="flex">
|
|
|
<image :src="item.src" mode="widthFix" class="nav-img"></image>
|
|
|
- <button class="left-btn" v-if='item.type=="contactCustomer"' open-type='contact'>{{item.name}}</button>
|
|
|
+ <button class="left-btn" v-if='item.type=="contactCustomer"'
|
|
|
+ open-type='contact'>{{item.name}}</button>
|
|
|
<span class="left" v-else>{{item.name}}</span>
|
|
|
</view>
|
|
|
-
|
|
|
- <span class="right"><image src="../../static/imgs/mySet/yjt.png" mode="widthFix" class="row-right-img"></image></span>
|
|
|
+
|
|
|
+ <span class="right">
|
|
|
+ <image src="../../static/imgs/mySet/yjt.png" mode="widthFix" class="row-right-img"></image>
|
|
|
+ </span>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <u-popup :show="isShowCode" @close="isShowCode=false" mode="center" :round='10'>
|
|
|
+ <image :src="selectCode" mode="widthFix"></image>
|
|
|
+ </u-popup>
|
|
|
+ <u-picker keyName="cardBusiness" :confirmType='"share"' :confirmText='"分享"' title="选择名片" @cancel="show=false"
|
|
|
+ closeOnClickOverlay @change="cardChange" :show="show" :columns="cardList"></u-picker>
|
|
|
+ <u-picker keyName="cardBusiness" confirmText='确定' title="选择名片" @cancel="show1=false" closeOnClickOverlay
|
|
|
+ @confirm="cardConfirm" :show="show1" :columns="cardList"></u-picker>
|
|
|
+ <poster :data="canvasData" background-color="#FFF" :width='750' :height='420' @on-success="posterSuccess"
|
|
|
+ ref="poster" @on-error="posterError"></poster>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import Poster from '../../components/zhangyuhao-poster/Poster.vue'
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ Poster
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
userInfo: {},
|
|
|
+ cardList: [],
|
|
|
+ canvasData: {},
|
|
|
+ currectData: {},
|
|
|
+ selectCode: '',
|
|
|
+ show: false,
|
|
|
+ clicknum: 0,
|
|
|
+ popupshow: false,
|
|
|
+ show1: false,
|
|
|
+ isShowCode: false,
|
|
|
menuList: [{
|
|
|
name: "我的名片",
|
|
|
type: 'myInfo',
|
|
|
- src:'../../static/imgs/mySet/card.png'
|
|
|
+ src: '../../static/imgs/mySet/card.png'
|
|
|
},
|
|
|
{
|
|
|
name: "我的主页",
|
|
|
type: 'myHome',
|
|
|
- src:'../../static/imgs/mySet/home.png'
|
|
|
+ src: '../../static/imgs/mySet/home.png'
|
|
|
},
|
|
|
{
|
|
|
name: "名片分类",
|
|
|
type: "cardType",
|
|
|
- src:'../../static/imgs/mySet/type.png'
|
|
|
+ src: '../../static/imgs/mySet/type.png'
|
|
|
},
|
|
|
{
|
|
|
name: "我的证件",
|
|
|
type: "myCard",
|
|
|
- src:'../../static/imgs/mySet/card1.png'
|
|
|
+ src: '../../static/imgs/mySet/card1.png'
|
|
|
},
|
|
|
{
|
|
|
name: "帮助说明",
|
|
|
type: "help",
|
|
|
- src:'../../static/imgs/mySet/help.png'
|
|
|
+ src: '../../static/imgs/mySet/help.png'
|
|
|
},
|
|
|
{
|
|
|
name: "联系客服",
|
|
|
type: "contactCustomer",
|
|
|
- src:'../../static/imgs/mySet/kf.png'
|
|
|
+ src: '../../static/imgs/mySet/kf.png'
|
|
|
},
|
|
|
{
|
|
|
name: "设置",
|
|
|
type: 'set',
|
|
|
- src:'../../static/imgs/mySet/set.png'
|
|
|
+ src: '../../static/imgs/mySet/set.png'
|
|
|
},
|
|
|
]
|
|
|
};
|
|
@@ -72,18 +100,354 @@
|
|
|
onShow() {
|
|
|
this.userInfo = uni.getStorageSync("userInfo")
|
|
|
console.log(this.userInfo)
|
|
|
+ this.$request.baseRequest('admin.unimall.cardManagementInfo', 'list', {
|
|
|
+ commonId: uni.getStorageSync("userInfo").id
|
|
|
+ }, failres => {
|
|
|
+ this.$refs.uToast.show({
|
|
|
+ type: 'error',
|
|
|
+ message: failres.errmsg,
|
|
|
+ })
|
|
|
+ uni.hideLoading()
|
|
|
+ }).then(res => {
|
|
|
+ this.cardList = [res.data.items]
|
|
|
+ this.cardChange({
|
|
|
+ value: this.cardList[[0]]
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onShareAppMessage(res) {
|
|
|
+ this.popupshow = false
|
|
|
+ console.log(res, this.popupshow)
|
|
|
+ let that = this;
|
|
|
+ //生成名片图片
|
|
|
+ let imageUrl = this.poster
|
|
|
+ console.log("imageUrl", imageUrl)
|
|
|
+ if (res.from === 'button') {
|
|
|
+ let path = `/pages/mySet/lookCard?id=${that.currectData.id}`
|
|
|
+ return {
|
|
|
+ title: `${that.currectData.name}分享的名片~`,
|
|
|
+ path: path,
|
|
|
+ imageUrl: imageUrl,
|
|
|
+ };
|
|
|
+ }
|
|
|
+ if (res.from === 'menu') {
|
|
|
+ return {
|
|
|
+ title: '商通线上商城',
|
|
|
+ path: '/pages/tabBarPro/index/index',
|
|
|
+ imageUrl: this.popupshow ? imageUrl : ''
|
|
|
+ };
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 分享到朋友圈
|
|
|
+ onShareTimeline() {
|
|
|
+ return {
|
|
|
+ title: '商通线上商城',
|
|
|
+ path: '/pages/index/index',
|
|
|
+ imageUrl: 'https://cdn.uviewui.com/uview/swiper/1.jpg'
|
|
|
+ };
|
|
|
},
|
|
|
methods: {
|
|
|
- menuClick(typeName) {debugger
|
|
|
- if(typeName=="contactCustomer") return
|
|
|
- let _url = '/pages/mySet/' + typeName
|
|
|
- console.log(_url)
|
|
|
- uni.navigateTo({
|
|
|
- url: _url
|
|
|
+ handleHiddenShare() {
|
|
|
+ this.popupshow = false
|
|
|
+ },
|
|
|
+ selectCard() {
|
|
|
+ this.show = true
|
|
|
+ },
|
|
|
+ selectCard1() {
|
|
|
+ this.show1 = true
|
|
|
+ },
|
|
|
+ cardConfirm(e) {
|
|
|
+ console.log(e)
|
|
|
+ this.currectData = e.value[0]
|
|
|
+ this.selectCode = e.value[0].qrCodeMyself
|
|
|
+ this.show1 = false
|
|
|
+ this.isShowCode = true
|
|
|
+ },
|
|
|
+ cardChange(e) {
|
|
|
+
|
|
|
+ this.currectData = e.value[0]
|
|
|
+ uni.showLoading({
|
|
|
+ title: '加载中',
|
|
|
+ mask: true
|
|
|
})
|
|
|
+ var data = [{
|
|
|
+ type: 'image',
|
|
|
+ path: this.currectData.currentBackground,
|
|
|
+ use: 'bg',
|
|
|
+ x: -10,
|
|
|
+ y: 0,
|
|
|
+ width: 530,
|
|
|
+ height: 325
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: this.currectData.headSculpture,
|
|
|
+ shape: 'circle',
|
|
|
+ use: 'head',
|
|
|
+ x: 30,
|
|
|
+ y: 30,
|
|
|
+ width: 100,
|
|
|
+ height: 100
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ text: this.currectData.name,
|
|
|
+ use: 'name',
|
|
|
+ x: 150,
|
|
|
+ y: 50,
|
|
|
+ size: 24,
|
|
|
+ color: '#000'
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ text: this.currectData.post,
|
|
|
+ use: 'post',
|
|
|
+ x: 240,
|
|
|
+ y: 55,
|
|
|
+ size: 18,
|
|
|
+ color: '#666666'
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ text: this.currectData.companyName,
|
|
|
+ use: 'companyName',
|
|
|
+ x: 150,
|
|
|
+ y: 95,
|
|
|
+ size: 18,
|
|
|
+ color: '#000'
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/address1.png',
|
|
|
+ use: 'address-icon',
|
|
|
+ x: 145,
|
|
|
+ y: 130,
|
|
|
+ width: 15,
|
|
|
+ height: 20
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'textarea',
|
|
|
+ text: this.currectData.province + this.currectData.city + this.currectData.area + this
|
|
|
+ .currectData.detailedAddress,
|
|
|
+ lineSpace: 1,
|
|
|
+ width: 320,
|
|
|
+ use: 'address',
|
|
|
+ x: 175,
|
|
|
+ y: 135,
|
|
|
+ size: 14,
|
|
|
+ color: '#000'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/phone1.png',
|
|
|
+ use: 'phone-icon',
|
|
|
+ x: 145,
|
|
|
+ y: 163,
|
|
|
+ width: 16,
|
|
|
+ height: 16
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ text: this.currectData.phone,
|
|
|
+ use: 'phone',
|
|
|
+ x: 175,
|
|
|
+ y: 167,
|
|
|
+ size: 14,
|
|
|
+ color: '#000'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/remark1.png',
|
|
|
+ use: 'remark-icon',
|
|
|
+ x: 145,
|
|
|
+ y: 197,
|
|
|
+ width: 13,
|
|
|
+ height: 16
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'textarea',
|
|
|
+ text: this.currectData.remark ? this.currectData.remark : '单击添加备注',
|
|
|
+ use: 'remark',
|
|
|
+ lineSpace: 2,
|
|
|
+ width: 200,
|
|
|
+ x: 175,
|
|
|
+ y: 200,
|
|
|
+ size: 13,
|
|
|
+ color: '#000'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/bg3.png',
|
|
|
+ use: 'bg1',
|
|
|
+ x: 0,
|
|
|
+ y: 243,
|
|
|
+ width: 370,
|
|
|
+ height: 67
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/bg4.png',
|
|
|
+ use: 'bg2',
|
|
|
+ x: 355,
|
|
|
+ y: 243,
|
|
|
+ width: 150,
|
|
|
+ height: 67
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/home.png',
|
|
|
+ use: 'home',
|
|
|
+ x: 65,
|
|
|
+ y: 260,
|
|
|
+ width: 33,
|
|
|
+ height: 33
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ text: this.currectData.classifyName ? this.currectData.classifyName : '默',
|
|
|
+ use: 'classify',
|
|
|
+ x: 145,
|
|
|
+ y: 263,
|
|
|
+ size: 34,
|
|
|
+ color: '#fff'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'image',
|
|
|
+ path: '../../static/imgs/card/share.png',
|
|
|
+ use: 'share',
|
|
|
+ x: 235,
|
|
|
+ y: 263,
|
|
|
+ width: 33,
|
|
|
+ height: 28
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ console.log(this.currectData.cuttentTemplate, 111111)
|
|
|
+ for (var i = 0; i < data.length; i++) {
|
|
|
+ switch (this.currectData.cuttentTemplate) {
|
|
|
+ case '2':
|
|
|
+ if (data[i].use === 'name' ||
|
|
|
+ data[i].use === 'companyName' ||
|
|
|
+ data[i].use === 'address-icon' ||
|
|
|
+ data[i].use === 'phone-icon' ||
|
|
|
+ data[i].use === 'remark-icon') {
|
|
|
+ data[i].x = 30
|
|
|
+ }
|
|
|
+ if (data[i].use === 'post') {
|
|
|
+ data[i].x = 100
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address' ||
|
|
|
+ data[i].use === 'phone' ||
|
|
|
+ data[i].use === 'remark') {
|
|
|
+ data[i].x = 60
|
|
|
+ }
|
|
|
+ if (data[i].use == 'head') {
|
|
|
+ data[i].x = 370
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case '3':
|
|
|
+ if (data[i].use === 'name') {
|
|
|
+ data[i].x = 30
|
|
|
+ data[i].y = 150
|
|
|
+ }
|
|
|
+ if (data[i].use === 'companyName') {
|
|
|
+ data[i].x = 30
|
|
|
+ data[i].y = 180
|
|
|
+ }
|
|
|
+ if (data[i].use === 'post') {
|
|
|
+ data[i].x = 100
|
|
|
+ data[i].y = 153
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address-icon' ||
|
|
|
+ data[i].use === 'phone-icon' ||
|
|
|
+ data[i].use === 'remark-icon') {
|
|
|
+ data[i].x = 170
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address-icon') {
|
|
|
+ data[i].y = 150
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address') {
|
|
|
+ data[i].y = 155;
|
|
|
+ data[i].width = 300
|
|
|
+ }
|
|
|
+ if (data[i].use === 'phone-icon') {
|
|
|
+ data[i].y = 180
|
|
|
+ }
|
|
|
+ if (data[i].use === 'phone') {
|
|
|
+ data[i].y = 183
|
|
|
+ }
|
|
|
+ if (data[i].use === 'remark-icon') {
|
|
|
+ data[i].y = 210
|
|
|
+ }
|
|
|
+ if (data[i].use === 'remark') {
|
|
|
+ data[i].y = 212
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address' ||
|
|
|
+ data[i].use === 'phone' ||
|
|
|
+ data[i].use === 'remark') {
|
|
|
+ data[i].x = 190
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case '4':
|
|
|
+ if (data[i].use === 'name' ||
|
|
|
+ data[i].use === 'companyName') {
|
|
|
+ data[i].x = 30
|
|
|
+ }
|
|
|
+ if (data[i].use === 'companyName') {
|
|
|
+ data[i].y = 90
|
|
|
+ }
|
|
|
+ if (data[i].use === 'post') {
|
|
|
+ data[i].x = 100
|
|
|
+ }
|
|
|
+ if (data[i].use == 'head') {
|
|
|
+ data[i].x = 25
|
|
|
+ data[i].y = 120
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address-icon' ||
|
|
|
+ data[i].use === 'phone-icon' ||
|
|
|
+ data[i].use === 'remark-icon') {
|
|
|
+ data[i].x = 170
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address') {
|
|
|
+ data[i].width = 300
|
|
|
+ }
|
|
|
+ if (data[i].use === 'address' ||
|
|
|
+ data[i].use === 'phone' ||
|
|
|
+ data[i].use === 'remark') {
|
|
|
+ data[i].x = 190
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.canvasData = {
|
|
|
+ clicknum: this.clicknum++,
|
|
|
+ list: data
|
|
|
+ }
|
|
|
+ },
|
|
|
+ posterError(err) {
|
|
|
+ console.log(err)
|
|
|
+ uni.hideLoading()
|
|
|
+ },
|
|
|
+ posterSuccess(url) {
|
|
|
+ console.log("hahahah", url)
|
|
|
+ // 生成成功,会把临时路径在这里返回
|
|
|
+ this.poster = url;
|
|
|
+ console.log(url)
|
|
|
+ // this.show=false
|
|
|
+ uni.hideLoading()
|
|
|
+ },
|
|
|
+ menuClick(typeName) {
|
|
|
+ if (typeName == "contactCustomer") return
|
|
|
+ let _url = '/pages/mySet/' + typeName
|
|
|
+ uni.navigateTo({
|
|
|
+ url: _url
|
|
|
+ })
|
|
|
}
|
|
|
+
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
</script>
|
|
|
|
|
@@ -119,35 +483,41 @@
|
|
|
.content2 {
|
|
|
background: #fff;
|
|
|
margin: 20rpx;
|
|
|
- padding:0 40rpx;
|
|
|
+ padding: 0 40rpx;
|
|
|
position: relative;
|
|
|
top: -100rpx;
|
|
|
border-radius: 20rpx;
|
|
|
- .nav-img{
|
|
|
+
|
|
|
+ .nav-img {
|
|
|
width: 32rpx;
|
|
|
- margin-right:20rpx ;
|
|
|
+ margin-right: 20rpx;
|
|
|
}
|
|
|
- .row{
|
|
|
+
|
|
|
+ .row {
|
|
|
border-bottom: 1px solid #E6E6E6;
|
|
|
padding: 35rpx 0;
|
|
|
- .row-right-img{
|
|
|
+
|
|
|
+ .row-right-img {
|
|
|
width: 12rpx;
|
|
|
}
|
|
|
}
|
|
|
- .row:last-child{
|
|
|
+
|
|
|
+ .row:last-child {
|
|
|
border: none;
|
|
|
}
|
|
|
- .left-btn{
|
|
|
+
|
|
|
+ .left-btn {
|
|
|
background: #fff;
|
|
|
padding: 0;
|
|
|
margin: 0;
|
|
|
font-size: 32rpx;
|
|
|
- height: 42rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ height: 42rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
- .left-btn:after{
|
|
|
- border: none!important;
|
|
|
+
|
|
|
+ .left-btn:after {
|
|
|
+ border: none !important;
|
|
|
}
|
|
|
}
|
|
|
</style>
|