mrr.sj.front/pages/share/syrandsjshare.vue

<template>
	<view class="share-page">
	  <custom-navbar title="分享"
					 :showBack="true"></custom-navbar>
	  <!-- 邀请码 -->
	  <view class="invite">
		<text class="invite-num">{{userInfo.invite_code}}</text>
		<text class="invite-tit">邀请码</text>
		<!-- <view class="qrcode-box">
			<u-qrcode ref="qr" canvas-id="qr" :value="text" :size="size" @click="remake" @complete="complete($event)"></u-qrcode>

		</view> -->
	  </view>
	  <!-- 邀请记录 -->
	  <view class="invite-lists">
		<text class="invite-lists-tit">邀请记录</text>
		<view class="invite-lists-cont">
			<view class="invite-list-tit">
				<text class="title tit1">商家/手艺人</text>
				<text class="title tit2">手机号码</text>
				<text class="title tit3">角色</text>
				<text class="title tit4">邀请时间</text>
			</view>
			<!-- 有记录 -->
			<view v-if="invitelist.length!=0">
				<view class="invite-list-item"
					  v-for="(item,i) in invitelist"
					  :key="item.id">
					<text class="item-title tit1">{{item.name}}</text>
					<text class="item-title tit2">{{item.account}}</text>
					<text class="item-title tit3">{{item.type}}</text>
					<text class="item-title tit4">{{item.applyyes_time}}</text>
				</view>
			</view>
			<view class="nothing-box" v-else>
				<text class="nothing-text">当前暂无邀请记录</text>
			</view>
		</view>
	  </view>
	</view>
</template>

<script>
import request from '../../utils/request'
	export default {
		data() {
			return {
				have: false,
			    artisanType: getApp().globalData.artisanType,
			    userInfo: {},
				invitelist: [],
				text: 'https://www.mrrweb.com.cn/junit/login/login.html',
				size: 180
			}
		},
	    async onLoad() {
			let that = this;
			try {
				const type = this.artisanType == 1 ? 2 : this.artisanType == 2 ? 3 : 1;
				const result = await request.post('/user/getuser',{type});
				that.userInfo = result.data;
				const invitelist = await request.post('/user/invitelist',{invite_code: result.data.invite_code});
				console.log(invitelist)
				that.invitelist = invitelist;
			}catch(err) {
				console.log('报错',err)
			}
			
			
	    },
		methods: {
			// getUserInfo() {
			//   const type = this.artisanType == 1 ? 2 : this.artisanType == 2 ? 3 : 1;
			//   request.post('/user/getuser',{type}).then(result=>{
			// 	this.userInfo = result.data;
			//   })
			// },
			complete(e) {
				if (e.success) {
				  console.log('生成成功');
				} else {
				  console.log('生成失败');
				}
			},
			remake() {
				const ref = this.$refs['qr'];
				ref.remake();
			},
			save() {
				uni.showLoading({
				  title: '保存中',
				  mask: true
				});
				const ref = this.$refs['qr'];
				ref.save({
				  success: res => {
					uni.hideLoading();
					uni.showToast({
					  icon: 'success',
					  title: '保存成功'
					});
				  },
				  fail: err => {
					uni.showToast({
					  icon: 'none',
					  title: JSON.stringify(err)
					});
				  }
				});
		
			}
		}
	}
</script>

<style>
.share-page {
	padding-bottom: 30rpx;
}
.invite {
	margin: 24rpx;
	padding: 48rpx;
	display: flex;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	border-radius: 12rpx;
}
.invite-num {
	font-size: 32rpx;
	color: #333333;
	font-weight: 500;
	margin-bottom: 16rpx;
}
.invite-tit {
	font-size: 24rpx;
	color: #858585;
}
.qrcode-box {
	width: 360rpx;
	height: 360rpx;
	border-radius: 16rpx;
	border: 6rpx solid #FF4767;
	margin-top: 34rpx;
}
.invite-lists {
	margin: 24rpx;
	background-color: #fff;
	border-radius: 12rpx;
}
.invite-lists-tit {
	display: block;
	font-size: 32rpx;
	font-weight: 500;
	color: #333333;
	padding: 32rpx 0;
	text-align: center;
	border-bottom: 1rpx solid rgba(0, 0, 0, 0.05);
}
.invite-lists-cont {
	padding: 24rpx;
}
.invite-list-tit,.invite-list-item {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 32rpx;
}
.invite-list-item:last-child {
	margin-bottom: 0;
}
.title {
	font-size: 28rpx;
	color: #333333;
	text-align: center;
}
.item-title {
	font-size: 24rpx;
	color: #333333;
	text-align: center;
}
.tit1 {
	min-width: 140rpx;
}
.tit2 {
	min-width: 150rpx;
}
.tit3 {
	min-width: 114rpx;
}
.tit4 {
	min-width: 226rpx;
}
.nothing-box {
	padding: 150rpx 0;
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
}
.nothing-text {
	font-size: 24rpx;
	font-weight: 400;
	color: #9E9E9E;
}
</style>