H5_module/share/invite/index.vue

<template>
	<view v-if="isShowView">
		<view class="con-top">
			<block v-for="(item, index) in params.params.jsonContent" :key="index">
				<view class="ban" v-if="item.key == 'banner'">
					<swiper class="swiper" @change="swiperChange" autoplay="true" interval="5000" duration="300">
						<block v-for="(it, idx) in item.value.imageList" :key="idx">
							<swiper-item><image lazy-load="true" :src="it.src" mode="aspectFill" @click="clickBanner(item)"></image></swiper-item>
						</block>
					</swiper>
					<view class="dots ddflex">
						<block v-for="(it, idx) in item.value.imageList" :key="idx"><view :class="['dot', idx == swiperCurrent ? 'active' : '']"></view></block>
					</view>
				</view>

				<view class="richText" v-if="item.key == 'text'"><rich-text :nodes="item.value.content"></rich-text></view>
				<!-- <block v-if="item.key == 'product'">
					<view class="product" v-if="item.value.layoutNum == 1">
						<view class="li ddflex" v-for="(it, idx) in item.value.productList" :key="idx" @click="jumpUrl('/product/detail/detail?id=' + it.id)">
							<image :src="it.pic" mode="aspectFill" class="pro-img"></image>
							<view class="pro-info fflex">
								<view class="pro-name tovers">{{ it.title }}</view>
								<view class="pro-bri tover" v-if="it.brief">{{ it.brief }}</view>
								<view class="pro-opt ddflex">
									<view class="money">
										￥{{ it.minSalePrice }}
										<text>/起</text>
									</view>
									<view class="pro-btn">立即购买</view>
								</view>
							</view>
						</view>
					</view>
				</block> -->

				<view class="images" v-if="item.key == 'images'"><image :src="item.value.src" mode="widthFix"></image></view>
				<block v-if="item.key == 'customerService'"></block>
				<button open-type="contact" class="contact ddflex" v-if="item.value.type == '0'">
					<image src="../static/kfico.png"></image>
					客服
				</button>
				<view class="contact ddflex" @click="customerServiceChat(item.value)" v-if="item.value.type == '1'">
					<image src="../static/kfico.png"></image>
					客服
				</view>
				<view class="contact ddflex" @click="jumpHref(item.value)" v-if="item.value.type == '2'">
					<image src="../static/kfico.png"></image>
					客服
				</view>
			</block>
			<!-- #ifdef MP-WEIXIN -->
			<!-- <image src="../static/images/kdx_img6.jpg" mode="widthFix"></image> -->
			<!-- #endif -->
		</view>
		<view class="item6">
			<view class="item6-top">
				<image :src="picUrlss+'lvluo/home_bg3.png'" class="bg3"></image>
				<view class="item6-top-c ddflex">
					<view>添加金牌顾问微信~</view>
					<text>领取超值优惠</text>
				</view>
			</view>
			<view class="item6-con">
				<view class="item6-con-t">
					<image :src="sysUserInfo.headUrl?sysUserInfo.headUrl:'../../static/pages/images/userimg.png'" class="kf-img"></image>
					<view class="name">{{sysUserInfo.realName?sysUserInfo.realName:sysUserInfo.username}}</view>
					<view class="mobile" @click="call(sysUserInfo.mobile)" v-if="sysUserInfo.mobile">{{sysUserInfo.mobile}}</view>
					<view class="tag">绿萝云-诊所私域专家</view>
				</view>
				<view class="qrcode" v-if="sysUserInfo.wechatQrcode">
					<image :src="sysUserInfo.wechatQrcode" show-menu-by-longpress="true"></image>
					<view>长按扫码添加微信</view>
				</view>
			</view>
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<view class="price-list" v-if="skuList.length>0">
			<view class="li" v-for="(item, index) in skuList" :key="index" @click="checkSkuClick(index)">
				<block v-if="index == 0">
					<image src="../static/images/xianliang_bg.png" class="li-bg"></image>
					<image src="../static/images/xianliang.png" class="price-tag"></image>
					<view class="li-c ddflex" style="background: none;">
						<image :src="item.active ? '../static/images/kdx_gou_h.png' : '../static/images/kdx_gou.png'" class="gou"></image>
						<view class="price ddflex fflex">
							<text class="price-fh">￥</text>
							{{ item.salePrice }}
							<text class="price-dw">/{{ item.skuStr }}</text>
						</view>
						<view class="price-txt">
							抢先价
							<text>2023-01-01恢复定价</text>
						</view>
					</view>
				</block>
				<view class="li-c ddflex" v-else>
					<image :src="item.active ? '../static/images/kdx_gou_h.png' : '../static/images/kdx_gou.png'" class="gou"></image>
					<view class="price ddflex fflex">
						<text class="price-fh">￥</text>
						{{ item.salePrice }}
						<text class="price-dw">/{{ item.skuStr }}</text>
					</view>
				</view>
			</view>
		</view>
		<!-- #endif -->
		<!-- <view class="supp">由智企云提供技术支持</view> -->
		<view class="bot">
			<!-- #ifndef MP-WEIXIN -->
			<!-- <view class="btn" @click="toWxShare()">推荐给朋友，赢免单机会</view> -->
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<!-- <view class="btn" @click="directBuy()">支付 ￥{{ checkSku.salePrice }} 马上开通</view> -->
			<!-- #endif -->
		</view>
	</view>
</template>

<script>
const req = require('../../utils/request.js');
const api = require('../../utils/api.js');
const util = require('../../utils/util.js');
const app = getApp();
export default {
	data() {
		return {
			picUrlss: req.public.picUrls,
			isShowView: '',
			options: {},
			params: '',
			swiperCurrent: 0,
			hideShare: true,
			codeUrl: '',
			userInfo: {},
			sys_userInfo: {},
			saveId: '',
			skuList: [],
			checkSku: '',
			productId: '',
			sysUserInfo: ''
		};
	},
	async onLoad(options) {
		this.options = options;
		this.userInfo = req.getStorage('userInfo');
		this.sys_userInfo = req.getStorage('sys_userInfo');
		if (options.userId) {
			req.setStorage('pidCode', options.userId);
		}
		if (options.saveBehaviorId) {
			this.saveId = options.saveBehaviorId;
		}
		
		// #ifdef MP-WEIXIN
		req.silenceLogin(options.userId, '');
		// #endif
		await this.getParams();
		await this.saveBehavior(4);
		if(options.sys_userId) await this.getSysDetail();
	},
	onShow() {},
	onUnload() {
		this.updateBehavior();
	},
	methods: {
		getSysDetail() {
			let that = this;
			let apiUrl = '/api/v3/sysUser/info';
			return new Promise((resolve,reject)=>{
				req.getRequest(apiUrl,{ id: that.options.sys_userId },async res => {
					that.sysUserInfo = res;
					resolve();
				},true);
			})
		},
		getParams() {
			let that = this;
			let params = {
				code: this.options.code
			};
			return new Promise((resolve, reject) => {
				req.getRequest('/api/v3/material/library/detail', params, data => {
					data.params.jsonContent.map(item => {
						if (item.key == 'applicationForm') {
							item.value.formItemList.map(it => {
								if (it.label.indexOf('姓名') > -1) {
									if (that.userInfo.nickName) {
										it.fieldValue = that.userInfo.nickName;
									}
								}
								if (it.dataType == 1) {
									if (that.userInfo.mobile) {
										it.fieldValue = that.userInfo.mobile;
									}
								}
								if (it.type == 5) {
									it.option = ['大健康', '快销品'];
								}
							});
						}
						return item;
					});
					that.params = data;
					uni.setNavigationBarTitle({
						title: data.title
					});
					console.log('data.title==', data.title);
					that.getProductSku();
					that.isShowView = true;
					resolve();
				});
			});
		},

		/**
		 * 获取产品的sku
		 */
		getProductSku() {
			var tha = this;
			tha.params.params.jsonContent.map(item => {
				if (item.key == 'product') {
					item.value.productList.map(it => {
						tha.getProductDetail(it.id);
					});
				}
			});
		},

		getProductDetail(productId) {
			this.productId = productId;
			let form = {
				id: productId
			};
			req.getRequest('/api/product/sku', form, data => {
				data.forEach(it => {
					if (it.properties == -1 || it.properties == 'DEFAULT_SKU') {
					} else {
						it.skuStr = JSON.parse(it.properties)
							.map(ij => ij.value.replace(' ', ''))
							.join(' ');
						it.active = false;
					}
				});
				data[0].active = true;
				this.skuList = data;
				this.checkSku = this.skuList[0];
				console.log('skuList====', this.skuList);
			});
		},

		checkSkuClick(idx) {
			this.skuList.map(it => {
				it.active = false;
				return it;
			});
			this.skuList[idx].active = true;
			this.checkSku = this.skuList[idx];
		},

		saveBehavior(behavior) {
			let params = {
				behavior: behavior,
				type: 7,
				bindId: this.params.libraryId
			};
			if (req.getStorage('pidCode')) {
				params.pid = req.getStorage('pidCode');
			}
			if (this.saveId) {
				params.parentId = this.saveId;
			}
			req.saveBehavior(params, data => {
				if (behavior != 6) {
					this.saveId = data;
				}
			});
		},
		updateBehavior() {
			let params = {
				id: this.saveId
			};
			req.getBehaviorUpdate(params, data => {});
		},
		swiperChange(e) {
			this.swiperCurrent = e.detail.current;
		},
		jumpUrl(url) {
			uni.navigateTo({
				url: url
			});
		},
		customerServiceChat(item) {
			wx.openCustomerServiceChat({
				extInfo: {
					url: item.target
				},
				corpId: item.id,
				success(res) {
					console.log('调用微信客服');
				}
			});
		},
		jumpHref(item) {
			window.location.href = item.target;
		},

		toWxShare() {
			req.getWXOriginalId(data => {
				if (data) {
					this.share(data);
				} else {
					req.msg('未获取到小程序原始ID');
				}
			}, req.public.appId);
		},

		share(originalId) {
			uni.share({
				provider: 'weixin',
				scene: 'WXSceneSession',
				type: 5,
				imageUrl: this.params.pic + '?x-oss-process=style/w375',
				title: this.params.title,
				summary: '来自' + (this.userInfo.realName ? this.userInfo.realName : this.userInfo.nickName) + '的邀请',
				miniProgram: {
					id: originalId,
					path: '/share/invite/index?userId=' + this.sys_userInfo.id + '&code=' + this.params.code,
					type: req.env[req.env.NODE_ENV].typeMiniProgram,
					webUrl: 'http://www.zhiqiyun.com'
				},
				success: ret => {
					console.log(JSON.stringify(ret));
				}
			});
		},

		getDataParams() {
			//加入购物车
			let _ts = this;
			const params = {
				skuId: this.checkSku.skuId,
				quantity: 1,
				productId: this.productId
			};
			return params;
		},

		directBuy() {
			let _ts = this;
			if (_ts.checkSku.stock == 0) return req.msg('库存不足');
			let params = _ts.getDataParams();
			let isShowLoading = false;
			if (!isShowLoading) {
				req.loadIng('加载中');
				isShowLoading = true;
			}
			req.postRequest('/api/purchase/direct/buy', params, res => {
				let redirect = '/product/subOrder/subOrder?ids=' + res;
				redirect += '&orderType=' + 1;
				if (isShowLoading) {
					uni.hideLoading();
					isShowLoading = false;
				}
				uni.navigateTo({
					url: redirect
				});
			});
		}
	}
};
</script>

<style>
@import './index.css';
</style>