odd_job_applet/pages/worker/mpaccount.vue

<template>
	<view>
		<image mode="widthFix" style="width: 100%;" :src="param.mpaccount"></image>
		
		<view class="padding">
			<view class="text-xl text-bold padding-tb solid-bottom">嵌入公众号</view>
			<view class="padding-tb text-lg solids-bottom">APPID：{{appid}}</view>
			<view class="padding-tb text-lg solids-bottom">小店主页路径：/pages/worker/shop?workerid={{workerinfo.id}}</view>
			
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-blue margin-tb-sm lg" @tap="setCopyText">一键复制</button>
			</view>
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-blue lg" @tap="goPage('/pages/tool/sinpage?field=wxmp')">不知道怎么使用？点击看说明！</button>
			</view>
		</view>
		
		<!-- 说明书弹框 -->
		<view class="cu-modal" :class="modal.name=='agreeModal'?'show':''">
			<view class="cu-dialog agreemodal">
				<image class="" src="../../static/images/weituo.png" mode="widthFix"></image>
				<text class="cuIcon-close text-white closeIcon padding" @tap="hideModalzql"></text>
				<view class="flex-direction align-center avatarBox" style="border-radius: 15rpx 15rpx 0 0; background-color: #FFFFFF;">
					<view class="padding-tb text-lg">1.打开微信公众平台 
					2.点击跨界菜单</view>
				</view>
				<view class="agreeBtn padding-top-xs" @tap="agreeCommission">
					<text>&nbsp;</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	var _this;
	export default {
		data() {
			return {
				param: {},
				userinfo: false,
				workerinfo: null,
				appid: "",
				modal: {
					name: null
				}
			}
		},
		onLoad: function() {
			_this = this;
			_this.userinfo = uni.getStorageSync('userinfo') || false;
			_this.workerinfo = uni.getStorageSync('workerinfo') || false;
			if (_this.workerinfo === false) {
				uni.reLaunch({
					url: "/pages/my/my"
				});
				return false;
			}
			_this.$req.ajax({
				path: "worker/pagempaccount",
				data: {}
			}).then((data) => {
				_this.param = data.param;
				_this.appid = data.appid;
			}).catch((err) => {
				uni.showModal({
					title: '信息提示',
					content: err,
					showCancel: false
				});
			});
		},
		methods: {
			setCopyText: function(pageurl) {
				uni.setClipboardData({
				    data: "APPID："+_this.appid+"，小店主页路径：/pages/worker/shop?workerid="+_this.workerinfo.id,
				    success: function () {
				        console.log('success');
				    }
				});
			},
			openShuoming: function() {
				_this.showModal('agreeModal');
			},
			// 弹窗显示隐藏
			showModal: function(e) {
				// var modalname = e.currentTarget ? e.currentTarget.dataset.modalname : e;
				_this.modal.name = e;
				uni.hideTabBar();
				
			},
			goPage: function(pageurl) {
				uni.navigateTo({
					url: pageurl,
					fail: function() {
						uni.switchTab({
							url: pageurl
						});
					}
				});
			},
			hideModalzql: function() {
				console.log("不接受委托，关闭弹窗");
				uni.setStorageSync('parentid', 0);
				_this.modal.name = null;
				uni.showTabBar();
			}
		}
	}
</script>

<style>
	/* 小程序码进入同意经纪人委托弹窗 */
		.agreemodal {
			width: 85%;
			height: auto;
			background: rgba(0,0,0,0);
			border-radius: 15rpx;
		}
		
		.avatarBox {
			position: absolute;
			top: 70rpx;
			left: 0;
			right: 0;
			bottom: 0;
			margin: 0 auto;
			font-weight: 600;
		}
		
		.closeIcon {
			width: 40rpx;
			height: 40rpx;
			font-size: 40rpx;
			position: absolute;
			top: 0;
			right: 0;
		}
		
		.agreeBtn {
			width: 85%;
			position: absolute;
			top: 73%;
			left: 0;
			right: 0;
			bottom: 14.5%;
			margin: 0 auto;
			border-radius: 15rpx;
		}
</style>