adH5/pages/index/index - 副本.vue

<template>
	<view class="content">
		<view class="img-div">
			<img class="img" v-for="url in images" :src="url" />
			<!-- <view class="text-color">
				重庆润天健康管理有限公司，主营中医养生课程，课程内容包括居家养生，食疗食补房子，穴位养生等，针对50岁以上中老年人群，0基础即可学习，每天30分钟，在家轻松学。
			</view> -->
			
			<!-- <view class="foot-box">
				<span>重庆润天健康管理有限公司</span>
				<span>重庆市经开区长生桥镇蔷薇路46号5-1   18523923647</span>
			</view> -->
		</view>
		<view class="box"></view>
		<view class="foot">
			<view class="butt">
				<!-- <u-button type="success" text="加微" @click="show = true"></u-button> -->
				<!-- <button data-agl-cvt="35">复制微信</button> -->
				<div class="copy">
				    <span class='title'>免费领取养生课程</span>
				    <!-- 点击微信号之后复制，设置转化类型为35（微信复制按钮点击） -->
				    <span @click="clickToWx" class="clickbox shake-animation">点击加微</span>
				</div>
			</view>
		</view>
	</view>
</template>
<script>
	import Clipboard from 'clipboard'; // 引入Clipboard
	import {getTemplate,callback,youkuClickCallback} from '../../api/api.js'
	import {clicks} from '../../common/common.js'
		
		
	export default {
		data() {
			return {
				images: [],
				data: {},
				json: {},
				vid: '',
				click_id: '',
				aid: '',
				no: '',
				type: 0,
				show: false,
				name: '',
				tel: '',
				accountId: '',
				ip: ''
			}
		},
		mounted() {
			window.vueInstance = this;  // 将 Vue 实例暴露到全局
		},
		onLoad(option) {
			this.vid = option.bd_vid;
			if(option.type){
				this.type = option.type;
			}
			if(option.aid){
				this.aid = option.aid;
			}
			if(option.click_id){
				this.click_id = option.click_id;
			}
			if(option.ip){
				this.ip = option.ip;
			}
			if(option.accountId){
				this.accountId = option.accountId;
			}
			this.no = option.no;
			if(option.no == null || option.no == "" || option.no == undefined){
				uni.showToast({
					icon:'none',
					title: '地址错误',
				});
				return;
			}
			getTemplate(option.no).then(e => {
				this.data = e.data;
				this.json = JSON.parse(e.data.json)
			})
			// callback({vid: this.vid}).then(e => {
			// 	console.info(e)
			// })
		},
		methods: {
			confirm() {
				this.show = false;
			},
			clickToWx(){
				// 百度
				if(this.type == 0){
					callback({url: window.location.href, no: this.no, bdVid: this.vid, t: 67}).then(e => {
						window.location.href = this.json.wxNo + "?customer_channel=" + this.vid;
					})
				}
				// 优酷
				if(this.type == 1){
					youkuClickCallback({accountId: this.accountId, deeplink_url: window.location.href, no: this.no, bd_vid: this.vid, aid: this.aid, click_id: this.click_id, ip: this.ip}).then(e => {
						window.location.href = this.json.wxNo + "?customer_channel=" + this.vid;
					})
				}
				
			},
		}
	}
</script>

<style lang="scss" scoped>
	.text-color{
		text-align: center;
		width: 90%;
		margin: 0 auto;
		font-size: 14px;
	}
	.foot-box{
		display: flex;
		flex-direction: column;
		margin: 4px 0;
		span{
			margin: 0;
			line-height:16px;
			font-size: 12px;
		}
	}
	.box{
		height: 50px;
	}
	.content {
		text-align: center;
	}
	.img-div{
		margin: 0 auto;
		display: flex;
		flex-direction: column;
	}
	.img{
		width: 100%;
	}
	.foot{
		background-color: #fff;
		font-size: 13px;
		width: 100%;
		margin-top: 20px;
		line-height: 50px;
		color: #848b99;
		text-align: center;
		position: fixed;
		bottom: 0;
	}
	.butt{
		/* width: 80px; */
		margin: 0 auto;
	}
	.copy{
		width: 100%;
		justify-content: space-around;
		background-color: #07c160;
		margin: 0 auto;
		color: #fff;
		display: flex;
		align-items: center;
		// justify-content: center;
		.title{
			font-size: 20px;
			font-weight: bold;
			letter-spacing: 5px;
		}
	}
	.clickbox{
		background-color: #fff;
		color: #07c160;
		display: inline-block;
		width: 100px;
		height: 40px;
		line-height: 40px;
		border-radius: 4px;
		font-size: 18px;
		font-weight: bold;
	}
	 @keyframes shake-animation {
		   0% { transform: scale(1); }
	       25% { transform: scale(1.1); }
	       50% { transform: scale(1); }
	       75% { transform: scale(1.1); }
	       100% { transform: scale(1); }
	  }
	 
	  .shake-animation {
	    animation: shake-animation 1.5s;
	    animation-iteration-count: infinite; /* 使动画无限循环 */
	  }
</style>