h5-webgl-program/src/components/newBottomCom/viewAI/viewAI.vue

<template src="./viewAI.html">

</template>
<script>
	const util = require('@/utils/util.js').default;
	import {
		MessageBox
	} from 'mint-ui';
	import {
		Indicator
	} from 'mint-ui';
	import {
		Toast
	} from 'mint-ui';
	import lottie from "lottie-web"; //lottie
	// const { createWorker } = require('@ffmpeg/ffmpeg');
	import { FFmpeg } from "@ffmpeg/ffmpeg";
	import { fetchFile, toBlobURL } from '@ffmpeg/util';
	var qiniu = require('qiniu-js');
	const baseURL = '.'
	let ffmpeg = null;
	// import { createFFmpeg, fetchFile } from '@/assets/ffmpeg.min.js';

	// import commonMethod from '@/common/commonMethod.js';
	// import touchHandle from '@/mixins/touchHandle.js';
	// import requestConfig from '@/static/lib/requestConfig';

	export default {
		data: function() {
			return {
				leftList: [],
				rightList: [],
				musicList: [], //音乐列表
				dataList: [],
				tabIndex: 0, //当前选中的tab序号
				selectIndex: -1,
				peopleIndex: -1,
				petIndex: -1,
				musicIndex: -1,
				specialIndex: 1,
				specialList:[
					{
						id:1,
						url:'https://dm.static.elab-plus.com/miniProgram/lottieJson/gold.json',
						title:'金光闪闪',
					},
					{
						id:2,
						url:'https://dm.static.elab-plus.com/miniProgram/lottieJson/fireworks.json',
						title:'烟花',
					},
					{
						id:3,
						url:'https://dm.static.elab-plus.com/miniProgram/lottieJson/coloreRibbon.json',
						title:'彩带',
					},
				],
				hasRedBox:false,	//是否添加了红包
				limit:50,
				videoId:'',	//上传视频的id
				videoUrl:'',	//处理好的视频地址
				progress:0,	//进度条
				ktProgress:0,	//抠图进度条
				cProgress:0,	//压缩进度条
				showPersonView:false,	//是否显示个人形象提示弹窗
				showPopView:false,		//是否显示确认取消框
				uploadStatus:0,	//视频处理的状态 -1 压缩中 0 未开始，1 上传中，2绿幕抠图中-服务端处理中，3处理成功 4 处理失败
				count:0,		//结果请求次数
				timeOut:90000,	//超时时间
				outTimer:null,	//延时处理对象
				timer:null,		//轮询对象
				widthHeight:'',	//用户上传视频尺寸
				stopFlag:false,	//停止上传动作
				cancelTokenSource:null,	//取消上传的操作对象
				repeartFlag:false,	//防止重复点击
				videoSrc:'',
			}
		},
		props: {
			relationId: {
				type: String,
				default: '',
			},
			amount: {
				type: String,
				default: '',
			},
		},
		watch: {
			relationId(newVal, oldVal) {
				if (newVal == null) {
					return;
				}
				console.log("当前空间数据relationId:", newVal);
				this.tabIndex = 2;//有红包时默认切换为红包
				if(!this.hasRedBox){
					setTimeout(()=>{
						this.addRedBox();//添加红包
					},500)
					this.$nextTick(() => {
						// 播放lottie动画
						lottie.destroy("markLoading");
						var element = document.getElementById("special-img");
						this.anim = lottie.loadAnimation({
							container: element,
							name: "markLoading",
							renderer: "svg",
							loop: true,
							autoplay: true,
							path: this.specialList[this.specialIndex].url, //动画json
						});
					});
				}
				// this.curSpaceArea = parseFloat(
				// 	(newVal.spaceWidth * newVal.spaceHeight) / 10000
				// ).toFixed(2);
				// this.getOverallArrangementDetailsList();
			},
		},
		// mixins: [touchHandle],
		async mounted() {
			// await this.getCityHouseList();		
			console.warn("***viewAI***")
			// Indicator.open('加载中...');
			this.getDatalist(0);
			this.getDatalist(1);
			this.getDatalist(3);
			// this.getRelationInfo();//获取场景信息
		},
		computed: {
			userId() {
				return this.$store.state.userId;
			},
		},
		// 页面被展示时执行
		onPageShow: function() {

		},
		//页面被隐藏时执行
		onPageHide: function() {
			// console.warn("***detached-hide***")
		},
		methods: {
			format(percentage) {
				let text = "上传中";
				if(this.uploadStatus==1){
					text = "上传中";
				}else if(this.uploadStatus==2){
					text = "抠图中";
				}else if(this.uploadStatus==-1){
					text = "压缩中";
				}
				return `${text}\n${percentage}%`;
			},
			resolveIndex(index) {
				this.selectIndex = index || 0;
			},
			catchTapEvent:function(){
				return false;
			},
			specialChange(index) {
				if (this.specialIndex == index) {
					return false;
				}
				this.specialIndex = index;
				this.$nextTick(() => {
					// 播放lottie动画
					lottie.destroy("markLoading");
					var element = document.getElementById("special-img");
					this.anim = lottie.loadAnimation({
						container: element,
						name: "markLoading",
						renderer: "svg",
						loop: true,
						autoplay: true,
						path: this.specialList[this.specialIndex].url, //动画json
					});
				});
			},
			tabChange(index) {
				if (this.tabIndex == index) {
					return false;
				}
				if (this.$parent.repeatFlag == true) {
					Toast({
						message: '加载中...请稍后再试',
					});
					return false
				}
				this.tabIndex = index;
				this.$emit("tabChange", this.tabIndex); //通知页面，户型大类发生了变更
				if(this.tabIndex==2 && this.specialIndex>-1){
					if(!this.hasRedBox){
						this.addRedBox();//添加红包
					}
					this.$nextTick(() => {
						// 播放lottie动画
						lottie.destroy("markLoading");
						var element = document.getElementById("special-img");
						this.anim = lottie.loadAnimation({
							container: element,
							name: "markLoading",
							renderer: "svg",
							loop: true,
							autoplay: true,
							path: this.specialList[this.specialIndex].url, //动画json
						});
					});
				}
			},
			initStatus(){
				this.progress = 0;
				this.ktProgress = 0;
				this.count = 0;
				this.videoUrl = '';
				this.widthHeight = '';
				this.leftList[0].icon = '';
				this.leftList[0].url = '';
				this.uploadStatus = 0;//处理完毕
			},
			async transcode(file,ffmpeg){
				// if(!crossOriginIsolated) {
				// 	SharedArrayBuffer = ArrayBuffer;
				// }
				const { name } = file;
				console.warn('正在加载 ffmpeg-core.js')
				await ffmpeg.load();
				console.warn('开始压缩');
				ffmpeg.FS('writeFile', name, await fetchFile(file));
				// '-b','2000000'  值越小  压缩率越大
				await ffmpeg.run('-i', name,'-b','2000000','output.mp4');
				console.warn('压缩完成');
				var data = ffmpeg.FS('readFile', 'output.mp4');
				var newfile = new File([data.buffer], name, { type: "video/mp4" });
				var video = document.getElementById('output-video');
				video.src = URL.createObjectURL(new Blob([data.buffer], {
					type: 'video/mp4'
				}));
				// this.uploadMaterielFile(newfile)
			},
			async transcodeNew(file,form){
				if (ffmpeg === null) {
					ffmpeg = new FFmpeg();
				}
				ffmpeg.on("log", ({ message }) => {
					console.warn(message);
				})
				ffmpeg.on("progress", ({ progress }) => {
					let pro  = `${progress * 100} %`;
					console.warn("***progress***",pro)
					this.cProgress = parseInt(progress * 100);
				});
				await ffmpeg.load({
					// coreURL: "/packages/core/dist/esm/ffmpeg-core.js",
					coreURL: await toBlobURL(`${baseURL}/ffmpeg-core.js`, 'text/javascript'),
					wasmURL: await toBlobURL(`${baseURL}/ffmpeg-core.wasm`, 'application/wasm'),
					workerURL: await toBlobURL(`${baseURL}/ffmpeg-core.worker.js`, 'text/javascript')
				});
				
				const {name} = file;
				console.warn('开始压缩');
				this.uploadStatus = -1;
				let d0 = Date.now();
				await ffmpeg.writeFile(name, await fetchFile(file));
				await ffmpeg.exec(['-i', name,  'output.mp4']);
				this.uploadStatus = 1;
				let d1 = Date.now();
				console.warn("***time1**", d0, d1,d1 - d0)
				console.warn('压缩完成');
				const data = await ffmpeg.readFile('output.mp4');
				
				// const video = document.getElementById('output-video');
				// video.src = URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' }));
				
				var newfile = new File([data.buffer], name, { type: "video/mp4" });
				this.uploadMaterielFile({file:newfile},form)
			},
			//上传到七牛云中
			async uploadVideolFile(file,form){
				var self = this;
				let tokenObj = await requestConfig('getUploadToken', {});//获取上传token
			
				var token = tokenObj.single.token;
				var resultUrl =  tokenObj.single.resultUrl; //上传图片的访问前缀this.resultUrl =
				var tp = file.name.substring(file.name.lastIndexOf('.'));
				var putExtra = {
					fname: "",
					params: {},
					mimeType: null
				};
				var config = {
					useCdnDomain: true,
					disableStatisticsReport: false,
					retryCount: 6,
					region: qiniu.region.z0
				};
				self.uploadStatus = 1;//上传中
				self.showPersonView = false;
				self.addSilhouette();//添加剪影视频
				var fileName = decodeURIComponent(encodeURIComponent(Date.now() + '/video' + Math.floor(Math.random()*1000))) + tp;
				var observable = qiniu.upload(file, fileName, token, putExtra, config);
				var subscription = observable.subscribe(self.next, self.error, async function(res){
					self.uploading=false;
					let VideoUrl = resultUrl + fileName;
					console.warn("视频上传七牛成功",VideoUrl);
					// self.$message.success('视频上传成功');
					// alert("***uploadMaterielFile***"+$config.brandId+this.userId);
					let data = {
						"url":VideoUrl,
						"brandId": $config.brandId,
						"userId":self.userId
					}
					let res1 = await requestConfig('robust_videoV2', data, true, false)
					if (res1 && res1.success && res1.single) {
						self.videoId = res1.single;//根据Id查询结果
						self.startInterval();//开始轮询获取结果
					}else{
						self.initStatus();//还原初始状态
					}
					let videoForm = document.getElementById(form); //获取表单对象
					videoForm && videoForm.reset(); // 重置表单
				});
			},
			next(res){
				this.progress = Math.round(res.total.percent);//loaded已经加载的
			},
			// 上传七牛云发生错误
			error(res){
				this.$message.error('视频上传失败'+res.message);
			},
			async uploadImgObj(e,form,type=1){
				this.stopFlag = false;//上传开始时，开启上传
				if(type==2){
					this.initStatus();//重置上传状态到初始值
				}
				//上传图片
				var file = e.target.files[0];
				// this.transcodeNew(file,form);
				var fileSize = file.size / 1024 / 1024;
				// alert('**文件**' + e.target.value + "-fileName=" + file.name+ "-fileSize="+fileSize);
				if (!/\.(MP4|mp4|MOV|mov)$/.test(e.target.value)) {
					this.$message.warning('文件类型必须是mp4或者mov');
					var videoForm = document.getElementById(form); //获取表单对象
					videoForm && videoForm.reset(); // 重置表单
					return false
				}
				if (fileSize > this.limit) {
					this.$message.warning('您的上传的视频过大，请低于' + this.limit + 'MB');
					var videoForm = document.getElementById(form); //获取表单对象
					videoForm && videoForm.reset(); // 重置表单
					return false
				}
				if (file.name.length > 100) {
					this.$message.warning('文件名过长，请不要超过100个字符');
					var videoForm = document.getElementById(form); //获取表单对象
					videoForm && videoForm.reset(); // 重置表单
					return false;
				}
				if(this.$parent.isIOS){//IOS则直接上传
					if(!this.stopFlag){
						var item = {};
						item.file = file;
						console.warn("***uploadImgObj***",file)
						if(fileSize>20){//七牛云上传-服务端压缩
							this.uploadVideolFile(file,form);
						}else{
							this.uploadMaterielFile(item, form); //正常上传图片
						}
					}
				}else{//安卓
					let reader = new FileReader();
					reader.onload = (event) => {
						let video = document.createElement('video');
						video.onloadedmetadata = (event) => {
							let duration = video.duration;
							let width = video.videoWidth;
							let height = video.videoHeight;
							// this.videoWidth = width;
							// this.videoHeight = height;
							console.warn('视频时长：', duration,this.stopFlag);
							console.warn('视频尺寸：x:', width, 'y:', height);
							if (duration > 20) {
								this.$message.warning('您的上传的视频过长，请低于20s');
								var videoForm = document.getElementById(form); //获取表单对象
								videoForm && videoForm.reset(); // 重置表单
								return false
							}else{
								if(!this.stopFlag){
									var item = {};
									item.file = file;
									console.warn("***uploadImgObj***",file)
									if(fileSize>20){//七牛云上传-服务端压缩
										this.uploadVideolFile(file,form);
									}else{
										this.uploadMaterielFile(item, form); //正常上传图片
									}
								}
							}
						};
						video.src = event.target.result;
					};
					reader.readAsDataURL(file);
				}
			},
			//视频上传进度处理
			uploadProgress(e){
				this.progress = Math.round((e.loaded / e.total) * 100);//loaded已经加载的
				console.warn("***uploadProgress***",this.progress)
			},
			//显示弹窗提示框
			showPopViewHandle(){
				this.showPopView = true;//弹出确认框；
			},
			//取消上传
			cancel(cancelTokenSource){
				this.cancelTokenSource = cancelTokenSource;
				console.warn("***取消上传函数定义***")
			},
			//停止上传
			stopUpload(){
				this.showPopView = false;//弹出确认框；
				this.stopFlag = true;//停止上传标志打开
				if(this.uploadStatus == 1){
					this.cancelTokenSource.cancel('上传已取消');//通知取消上传
					Toast({
						message: '上传已取消',
					});
				}
				else if(this.uploadStatus==2 || this.uploadStatus==3){//绿幕抠图中 或者已经完成
					let data = {
						userId:this.userId,
						brandId: $config.brandId,
						processStatus:'canceled',
						virtualNo:this.videoId,
					}
					requestConfig('addUserVirtural', data);//停止该绿幕视频的使用
					this.initStatus();//还原初始状态
				}
				let data = {
					url:'https://dm.static.elab-plus.com/miniProgram/silhouette1.mp4',
					value:'个人形象',
					width:'',
					height:'',
				}
				this.aiPeopleChange(data, 'canel')
				this.peopleIndex = -1;
			},
			//获取用户上传的个人形象
			async getUserVirtural() {
				let data = {
					userId:this.userId,
					brandId: $config.brandId,
					processStatus:'completed',
				}
				let res = await requestConfig('getUserVirtural', data);//停止该绿幕视频的使用
				if (res.success && res.list && res.list[0]) {
					let data = res.list[res.list.length - 1];//获取最新的一个用户的个人形象数据
					this.leftList[0].icon = data.virtualBg;
					this.leftList[0].url = data.virtualUrl;
					this.videoUrl = data.virtualUrl;
					if(data.widthHeight){
						this.leftList[0].width = data.widthHeight.split('x')[0];
						this.leftList[0].height = data.widthHeight.split('x')[1];
					}
				}
			},
			async uploadMaterielFile(item, form) {
				this.uploadStatus = 0;
				this.peopleIndex = 0;	//选中第一个
				if(this.stopFlag){
					return false;
				}
				var self = this;
				let formData = new FormData();
				formData.append('file', item.file);
				formData.append('brandId', $config.brandId);
				formData.append('userId', this.userId);
				console.warn("****uploadMaterielFile**",$config.brandId,this.userId)
				// alert("***uploadMaterielFile***"+$config.brandId+this.userId);
				this.uploadStatus = 1;//上传中
				this.showPersonView = false;
				this.addSilhouette();//添加剪影视频
				let res = await requestConfig('robust_video', formData, true, false,'post',this.uploadProgress,this.cancel)
				// alert("***uploadMaterielFile1***"+JSON.stringify(res));
				if (axios.isCancel(res)) {//取消上传处理
					this.initStatus();//还原初始状态
				}else if (res && res.success && res.single) {
					this.videoId = res.single;//根据Id查询结果
					this.startInterval();//开始轮询获取结果
				}else{
					this.initStatus();//还原初始状态
				}
				var videoForm = document.getElementById(form); //获取表单对象
				videoForm && videoForm.reset(); // 重置表单
			},
			async getVideoUrl() {
				if(this.stopFlag){
					this.stopInterval();
				}
				if(!this.videoId){
					Toast({
						message: '请先上传视频',
					});
					return false;
				}
				this.count = this.count + 1;
				let res = await requestConfig('get_result', {id:this.videoId,userId:this.userId}, true, false,'get')
				if(this.stopFlag){
					this.stopInterval();
				}
				if (res.success && res.single) {
					this.resultHandle(res.single)
				}else{
					this.videoUrl = "https://test.static.elab-plus.com/digital_human/f4c16cffae9711ee9853845cf3fb2826.mp4";//视频地址
					this.leftList[0].icon = this.videoUrl + "?vframe/jpg/offset/0";
					this.leftList[0].url = this.videoUrl;
					this.uploadStatus = 4;//处理失败
				}
			},
			//添加剪影视频
			addSilhouette(){
				let data = {
					url:'https://dm.static.elab-plus.com/miniProgram/silhouette1.mp4',
					value:'个人形象',
					width:'',
					height:'',
				}
				this.aiPeopleChange(data, 'add')
			},
			//添加用户绿幕视频
			addRealVideo(){
				let data = {
					url:this.videoUrl,
					value:'个人形象',
					width:this.widthHeight.split('x')[0],
					height:this.widthHeight.split('x')[1],
				}
				this.aiPeopleChange(data, 'add')
			},
			//上传结果处理
			resultHandle(single){
				if(!single){
					return false;
				}
				if(single.status=='completed' && single.output){//有结果
					this.ktProgress = 100;//抠图进度100%
					this.videoUrl = single.output;//视频地址
					// this.leftList[0].icon = this.videoUrl + "?vframe/jpg/offset/5";
					this.widthHeight = single.widthHeight; //"856x480"
					this.leftList[0].icon = single.virtualBg;
					this.leftList[0].url = this.videoUrl;
					this.leftList[0].width = single.widthHeight.split('x')[0],
					this.leftList[0].height = single.widthHeight.split('x')[1],
					this.uploadStatus = 3;//处理完毕
					// alert("***virtualBg***"+single.virtualBg);
					this.stopInterval();//停止轮询
					if(this.peopleIndex==0 && this.tabIndex==0){//如果当前在个人形象上，则替换视频
						this.addRealVideo();
					}
				}else{//没有结果
					let progress = single.progress;
					progress = progress.replace(this.videoId + ':','');
					let index = progress.indexOf("|");
					progress = progress.substr(0,index);
					let numbers = progress.match(/\d+/g)
					console.warn("***抠图进度条***",progress);
					this.ktProgress = parseFloat(numbers);//提取出来的进度条
					if(this.ktProgress>99){
						this.ktProgress = 99;
					}
				}
			},
			//开始生成AI图的轮询，每隔1s轮询一次
			startInterval() {
				if(this.timer){
					return false;
				}
				let self = this;
				this.count = 0;//轮询次数
				this.uploadStatus = 2;//绿幕抠图中
				this.getVideoUrl();//获取结果
				this.timer = setInterval(()=>{
					this.getVideoUrl();//获取结果
				},1000);//1秒轮询一次
				this.setOutTimer();//设置超时逻辑
			},
			//设置一个超时逻辑，到底指定时间后停止轮询，当前是90s
			setOutTimer() {
				var self = this;
				if (this.outTimer) {
					clearTimeout(this.outTimer)
					this.outTimer = null
				}
				this.outTimer = setTimeout(function() {
					if(!self.videoUrl){//没有结果
						MessageBox.confirm('',{
							title: '提示',
							message: '当前AI使用火爆，请继续尝试?',
							showCancelButton: true,
							confirmButtonText:'继续尝试',
							cancelButtonText:'取消等待',
						}).then(action => {
							console.warn("***MessageBox-action***",action)
							if(action == 'confirm'){
								// self.confirmHandle(1);
							}
						}).catch(err=>{
							console.warn("***MessageBox-err***",err)
							if(err == 'cancel'){
								// self.cancelHandle();
							}
						});
						// MessageBox.confirm('确定执行此操作?')
					}
					self.stopInterval();//停止轮询
				}, this.timeOut);
			},
			//停止轮询
			stopInterval() {
				if (this.timer) {
					clearInterval(this.timer);
					this.timer = null;
				}
				if (this.outTimer) {
					clearTimeout(this.outTimer)
					this.outTimer = null
				}
				// this.uploadStatus = 0;//回到初始上传状态
			},
			
			showMask(){
				//上传过程中，不允许再次上传
				if(this.uploadStatus==1 || this.uploadStatus == 2){
					return false;
				}
				this.showPersonView = true;
				console.warn("***showMask***",this.showPersonView)
			},
			//AI数字人切换
			selectAction(selItem, index) {
				console.log('点击动作111：', selItem, index,this.leftList)
				if (this.tabIndex == 0) {
					if(!this.leftList[index].url){
						return false
					}
					if (this.peopleIndex == index) { //取消选中
						this.aiPeopleChange(this.leftList[this.peopleIndex], 'canel')
						this.peopleIndex = -1;
						return false
					}
				} else if (this.tabIndex == 1) {
					if (this.petIndex == index) { //取消选中
						this.aiPeopleChange(this.rightList[this.petIndex], 'canel')
						this.petIndex = -1;
						return false
					}
				} else if (this.tabIndex == 3) {
					if (this.musicIndex == index) { //取消选中
						this.aiPeopleChange(this.musicList[this.musicIndex], 'canel')
						this.musicIndex = -1;
						return false
					}
				}
				if (this.$parent.repeatFlag == true) {
					Toast({
						message: '加载中...请稍后再试',
					});
					return false
				}
				if (this.tabIndex == 0) {
					this.peopleIndex = index;
					this.aiPeopleChange(this.leftList[this.peopleIndex], 'add')
				} else if (this.tabIndex == 1) {
					this.petIndex = index;
					this.aiPeopleChange(this.rightList[this.petIndex], 'add')
				} else if (this.tabIndex == 3) {
					this.musicIndex = index;
					this.aiPeopleChange(this.musicList[this.musicIndex], 'add')
				}
			},
			// // 获取场景信息
			// async getRelationInfo() {
			// 	if(!this.$parent.relationId){
			// 		return false;
			// 	}
			// 	var parmas = {
			// 		"relationId": this.$parent.relationId,
			// 		"brandId": $config.brandId,
			// 	}
			// 	let res = await requestConfig('getRelationInfo', parmas)
			// 	this.selectIndex = 0;
			// 	if (res && res.success) {
			// 		this.count = res.single.count;
			// 	}
			// },
			// 获取瀑布流数据
			async getDatalist(type) {
				let typeName = "Virtual_Human";
				if (type == 0) {
					typeName = "Virtual_Human";
				} else if (type == 1) {
					typeName = "Virtual_Pet";
				} else if (type == 3) {
					typeName = "Virtual_Music";
					// Indicator.close();
				}
				var parmas = {
					"type": typeName,
					// "brandId": $config.brandId,
				}
				let res = await requestConfig('queryEnumList', parmas)
				this.selectIndex = 0;
				if (res && res.success && res.list) {
					let list = res.list;
					if (type == 0) {
						this.leftList.push({
							icon:'',
							userUpload:true,
							value:'',
							url:'',
							width:'',
							height:'',
						})
						this.leftList = this.leftList.concat(list);
						this.getUserVirtural();
					} else if (type == 1) {
						this.rightList = list;
					} else if (type == 3) {
						this.musicList = list;
					}
				}
			},
			catchTouchMove: function() {
				return false;
			},
			addRedBox(){//添加红包
				console.warn("***添加红包***")
				this.$emit("redBox",'add');
				this.hasRedBox = true;
			},
			removeRedBox(){//去除红包
				this.$emit("redBox",'canel');
				this.hasRedBox = false;
			},
			setRedBox(){
				this.$emit("setRedBox");
			},
			//AI数字人切换
			aiPeopleChange(item, type) {
				this.$emit("aiPeopleChange", item, type, this.tabIndex); //通知页面，AI数字人切换了
			},
			//发布全景
			mynavigateFuc(e) {
				if (e) {
					// if(this.hasRedBox){
					// 	if(!this.$parent.redBoxData.count){
					// 		Toast({
					// 			message: '请输入红包个数！',
					// 		});
					// 		return false;
					// 	}
					// 	if(!this.$parent.redBoxData.money){
					// 		Toast({
					// 			message: '请输入充值金额！',
					// 		});
					// 		return false;
					// 	}
					// }
					if(this.peopleIndex==0 && (this.uploadStatus ==1 || this.uploadStatus ==2)){
						Toast({
							message: '请在个人形象上传完成后发布！',
						});
						return false;
					}
					if(this.repeartFlag){
						return false;
					}
					this.repeartFlag = true;
					let param = {
						type: 'CLK', //埋点类型
						clkId: 'clk_2cmina_23121301', //点击ID
						clkName: 'webgl_public_clk', //点击前往的页面名称
						clkParams: {
							locusName: "720发布",
						}
					};
					util.trackRequest(param);
					let _ps = this.$parent.getPosition();
					if (window.__wxjs_environment === 'miniprogram') {
						let url = '/extraPackage/pages/aiPublishPage/aiPublishPage?houseId=' + (this.$route.query.houseId || '') 
						url += '&bgUrl=' + encodeURIComponent(this.$parent.bgUrl)
						if(this.peopleIndex>-1){
							let people = {
								url:this.leftList[this.peopleIndex].url,
								ath:_ps.peopleAth,
								atv:_ps.peopleAtv,
								width:this.leftList[this.peopleIndex].width || '',
								height:this.leftList[this.peopleIndex].height || '',
								scale:this.$parent.peopleScale,
								userUpload:this.peopleIndex==0?true:false,//是否使用了个人形象
							}
							url += '&AIPeople=' + encodeURIComponent(JSON.stringify(people))
						}
						if(this.petIndex>-1){
							let pet = {
								url:this.rightList[this.petIndex].url,
								ath:_ps.petAth,
								atv:_ps.petAtv,
								scale:this.$parent.petScale,
							}
							url += '&AIPet=' + encodeURIComponent(JSON.stringify(pet))
						}
						if(this.musicIndex>-1){
							let music = {
								url:this.musicList[this.musicIndex].url,
								title:this.musicList[this.musicIndex].value
							};
							url += '&bgMusic=' + encodeURIComponent(JSON.stringify(music))
						}
						if(this.hasRedBox){
							let redBox = {
								url:'https://dm.static.elab-plus.com/miniProgram/redbox.mp4',
								ath:_ps.redBoxAth,
								atv:_ps.redBoxAtv,
								scale:1,
								lottieIndex:this.specialIndex,
								// count:this.$parent.redBoxData.count,
								// money:this.$parent.redBoxData.money,
								// message:this.$parent.redBoxData.message,
							}
							url += '&redBox=' + encodeURIComponent(JSON.stringify(redBox))
						}
						console.warn("data:", _ps, url);
						wx.miniProgram.navigateTo({
							url: url,
							complete:(e)=>{
								this.repeartFlag = false;
							}
						})
					} else {
						console.warn("data:", _ps)
						Toast({
							message: '敬请期待',
						});
					}
				}
			},
		}
	}
</script>
<style lang="scss" scoped>
	@import "./viewAI.scss";
	/* @import "@/common/css/common.css"; */
</style>