merge

src/components/newQCCom/viewAI/viewAI.vue

@@ -13,6 +13,14 @@
 		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';
@@ -48,22 +56,25 @@
 					},
 				],
 				hasRedBox:false,	//是否添加了红包
-				limit:20,
+				limit:200,
 				videoId:'',	//上传视频的id
 				videoUrl:'',	//处理好的视频地址
 				progress:0,	//进度条
 				ktProgress:0,	//抠图进度条
+				cProgress:0,	//压缩进度条
 				showPersonView:false,	//是否显示个人形象提示弹窗
 				showPopView:false,		//是否显示确认取消框
-				uploadStatus:0,	//视频处理的状态 0 未开始，1 上传中，2绿幕抠图中-服务端处理中，3处理成功 4 处理失败
+				uploadStatus:0,	//视频处理的状态 -1 压缩中 0 未开始，1 上传中，2绿幕抠图中-服务端处理中，3处理成功 4 处理失败
 				count:0,		//结果请求次数
-				timeOut:90000,	//超时时间
+				timeOut:20*60*1000,	//超时时间
 				outTimer:null,	//延时处理对象
 				timer:null,		//轮询对象
 				widthHeight:'',	//用户上传视频尺寸
 				stopFlag:false,	//停止上传动作
 				cancelTokenSource:null,	//取消上传的操作对象
 				repeartFlag:false,	//防止重复点击
+				videoSrc:'',
+				subscription:null,	//七牛云上传的对象，用于取消上传
 			}
 		},
 		props: {
@@ -111,7 +122,7 @@
 		async mounted() {
 			// await this.getCityHouseList();		
 			console.warn("***viewAI***")
-			Indicator.open('加载中...');
+			// Indicator.open('加载中...');
 			this.getDatalist(0);
 			this.getDatalist(1);
 			this.getDatalist(3);
@@ -137,6 +148,8 @@
 					text = "上传中";
 				}else if(this.uploadStatus==2){
 					text = "抠图中";
+				}else if(this.uploadStatus==-1){
+					text = "压缩中";
 				}
 				return `${text}\n${percentage}%`;
 			},
@@ -206,15 +219,128 @@
 				this.leftList[0].url = '';
 				this.uploadStatus = 0;//处理完毕
 			},
-			uploadImgObj(e,form,type=1){
+			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;
+				self.uploadStatus = 1;//上传中
+				self.showPersonView = false;
+				self.addSilhouette();//添加剪影视频
+				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
+				};
+				
+				let _name = Math.floor(Math.random()*1000);
+				var fileName = decodeURIComponent(encodeURIComponent(Date.now() + '/video' +_name )) + tp;
+				var observable = qiniu.upload(file, fileName, token, putExtra, config);
+				this.subscription = observable.subscribe(self.next, self.error, async function(res){
+					let videoUrl = resultUrl + fileName;
+					let realVideoUrl = 'https://dm.static.elab-plus.com/' + "video" + _name +'_elab.mp4';
+					console.warn("视频上传七牛成功",videoUrl ,realVideoUrl);
+					// 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);
+				// 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); //获取表单对象
@@ -234,37 +360,18 @@
 					return false;
 				}
 				if(this.$parent.isIOS){//IOS则直接上传
-					// let reader = new FileReader();
-					// reader.onload = (event) => {
-					// 	alert("onloadedmetadata0")
-					// 	let video = document.getElementById('videoPlayer');
-					// 	video.setAttribute("crossOrigin", "Anonymous");
-					// 	video.src = event.target.result;
-					// 	video.controls = false;
-					// 	video.autoplay = true;
-					// 	video.preload = 'auto';
-					// 	video.setAttribute('webkit-playsinline', true);
-					// 	video.setAttribute('playsinline', true);
-					// 	video.load();
-					// 	// video.play();
-					// 	video.onloadedmetadata = (event) => {
-					// 		alert("onloadedmetadata1")
-					// 		if(!this.stopFlag){
-					// 			var item = {};
-					// 			item.file = file;
-					// 			console.warn("***uploadImgObj***",file)
-					// 			this.uploadMaterielFile(item, form); //正常上传图片
-					// 		}
-					// 	}
-					// };
-					// reader.readAsDataURL(file);
 					if(!this.stopFlag){
 						var item = {};
 						item.file = file;
 						console.warn("***uploadImgObj***",file)
-						this.uploadMaterielFile(item, form); //正常上传图片
+						if(fileSize>20){//七牛云上传-服务端压缩
+							this.uploadVideolFile(file,form);
+						}else{
+							this.uploadMaterielFile(item, form); //正常上传图片
+						}
 					}
 				}else{//安卓
+					Indicator.open('加载中');
 					let reader = new FileReader();
 					reader.onload = (event) => {
 						let video = document.createElement('video');
@@ -276,6 +383,7 @@
 							// this.videoHeight = height;
 							console.warn('视频时长：', duration,this.stopFlag);
 							console.warn('视频尺寸：x:', width, 'y:', height);
+							Indicator.close();
 							if (duration > 20) {
 								this.$message.warning('您的上传的视频过长，请低于20s');
 								var videoForm = document.getElementById(form); //获取表单对象
@@ -286,7 +394,11 @@
 									var item = {};
 									item.file = file;
 									console.warn("***uploadImgObj***",file)
-									this.uploadMaterielFile(item, form); //正常上传图片
+									if(fileSize>20){//七牛云上传-服务端压缩
+										this.uploadVideolFile(file,form);
+									}else{
+										this.uploadMaterielFile(item, form); //正常上传图片
+									}
 								}
 							}
 						};
@@ -314,10 +426,12 @@
 				this.showPopView = false;//弹出确认框；
 				this.stopFlag = true;//停止上传标志打开
 				if(this.uploadStatus == 1){
-					this.cancelTokenSource.cancel('上传已取消');//通知取消上传
+					this.subscription && this.subscription.unsubscribe();//上传取消
+					this.cancelTokenSource && this.cancelTokenSource.cancel('上传已取消');//通知取消上传
 					Toast({
 						message: '上传已取消',
 					});
+					this.initStatus();//还原初始状态
 				}
 				else if(this.uploadStatus==2 || this.uploadStatus==3){//绿幕抠图中 或者已经完成
 					let data = {
@@ -363,21 +477,26 @@
 				if(this.stopFlag){
 					return false;
 				}
+				this.uploadStatus = 1;//上传中
+				this.showPersonView = false;
+				this.addSilhouette();//添加剪影视频
 				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***");
-				this.uploadStatus = 1;//上传中
-				this.showPersonView = false;
-				this.addSilhouette();//添加剪影视频
+				console.warn("****uploadMaterielFile**",$config.brandId,this.userId)
+				// alert("***uploadMaterielFile***"+$config.brandId+this.userId);
+				
 				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.success && res.single) {
+				}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(); // 重置表单
@@ -451,8 +570,9 @@
 					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(progress);//提取出来的进度条
+					this.ktProgress = parseFloat(numbers);//提取出来的进度条
 					if(this.ktProgress>99){
 						this.ktProgress = 99;
 					}
@@ -590,7 +710,7 @@
 					typeName = "Virtual_Pet";
 				} else if (type == 3) {
 					typeName = "Virtual_Music";
-					Indicator.close();
+					// Indicator.close();
 				}
 				var parmas = {
 					"type": typeName,
@@ -692,6 +812,7 @@
 								height:this.leftList[this.peopleIndex].height || '',
 								scale:this.$parent.peopleScale,
 								userUpload:this.peopleIndex==0?true:false,//是否使用了个人形象
+								deg:_ps.deg,
 							}
 							url += '&AIPeople=' + encodeURIComponent(JSON.stringify(people))
 						}

src/main.js

@@ -40,7 +40,7 @@ Vue.prototype.$message = message//重写提示
 
 // 引入echarts
 import * as echarts from 'echarts'
-window.echarts = echarts
+window.echarts = echarts;
 
 console.log('***process.env***production', process.env);
 window.env = process.env.NODE_ENV;

src/mixins/loadModel.js

@@ -1196,17 +1196,19 @@ export default {
 			return cubeInfo;
 		},
 		//切换单个空间的布局到指定的布局上
-		changeSingleLayout(spaceId,layoutObj){
+		changeSingleLayout(space,layoutObj){
 			if(!layoutObj){
 				console.warn("***changeSingleLayout***数据错误")
 				return false
 			}
 			// 更新空间的布局id
-			const element = this.spaceList.find(it=>it.spaceId == spaceId);
+			const element = this.spaceList.find(it=>it.spaceId == space.spaceId);
 			this.deleteLayoutModel(element, layoutObj);//删除当前空间的布局
 			element.layoutId = layoutObj.id;//更新布局信息到空间对象里面
-			element.layoutSpaceType = layoutObj.type;//更新布局信息到空间对象里面
-			element.layoutSpaceName = layoutObj.spacexName || layoutObj.name;//更新布局信息到空间对象里面
+			if(space.spaceType==15){
+				element.layoutSpaceType = layoutObj.type;//更新布局信息到空间对象里面
+				element.layoutSpaceName = layoutObj.spacexName || layoutObj.name;//更新布局信息到空间对象里面
+			}
 			this.changeLayouts = [];
 			this.changeLayouts.push(layoutObj)
 			let changeSpaces = [];

src/pages/webgl_rxdz_krpano720/webgl_rxdz_krpano720.vue

@@ -144,7 +144,7 @@
 						this.lottieAni()
 					}else if(this.result.status==99){
 						Toast({
-							message: '网络异常,请稍后再试',
+							message: '礼包已经抢完',
 						});
 					}
 				}else{

src/pages/webgl_rxdz_test/webgl_rxdz_test.vue

@@ -1602,6 +1602,7 @@
 				}
 				this.selectSpace = this.spaceList.find(it=>it.spaceId==gltf.spaceId);
 				this.changeSpaceColor(this.selectSpace.spaceId,1);//设置选中空间的颜色
+				console.warn("***selectSpaceHandle***",this.selectSpace)
 			},
 			//用户选择的布局id-需要切换到这个布局去
 			userSelectPlot(layoutObj,space=null){
@@ -1611,7 +1612,7 @@
 				}
 				let spaceId = space ? space.spaceId : this.selectSpace.spaceId;
 				console.warn("***userSelectPlot***",spaceId,layoutObj)
-				this.changeSingleLayout(spaceId,layoutObj);
+				this.changeSingleLayout(space,layoutObj);
 				this.updataLable(spaceId,layoutObj);
 			},
 			async goRoam1(spaceId){

src/services/request.js

@@ -7,6 +7,7 @@ var requestCount = 0; //记录下同时的请求数
 
 axios.defaults.headers.post['elabEnvironment'] = '4'; //axios默认的请求方式,可以自己设置
 axios.defaults.headers.post['userType'] = '1000'; //axios默认的请求方式,可以自己设置
+axios.defaults.timeout = 10*60*1000; //axios默认的请求方式,可以自己设置
 // axios.defaults.headers.post['Authorization'] = 'Token 9837b7480a99ab4df7e3a06ad0d990fbc7b941e4'; //axios默认的请求方式,可以自己设置
 axios.interceptors.request.use(function(config) {
 	if(config.noLoading){
@@ -31,13 +32,13 @@ axios.interceptors.request.use(function(config) {
 		}
 		if (config.url.includes('elab-marketing-operate/mofangTest/user/login')
 		||config.url.includes('elab-marketing-user/vcode/send/verifyCode')) {
-			config.headers['userId'] = "";
-			config.headers['ip'] = "";
+			// config.headers['userId'] = "";
+			// config.headers['ip'] = "";
 		} else {//uploadOss 上传format文件过大时提示不成功，接口500，通过测试与header有关，注释掉上传的header就好了
 			if (!config.url.includes('elab-marketing-sms/aliyun/openapi/uploadOss')
 			&& !config.url.includes('/robust_video')){
-				config.headers['userId'] = mapVue.$route.query.leavePhoneCustomerId || '';
-				config.headers['openId'] = mapVue.$route.query.openid || '';
+				// config.headers['userId'] = mapVue.$route.query.leavePhoneCustomerId || '';
+				// config.headers['openId'] = mapVue.$route.query.openid || '';
 				// config.headers['ip'] = getStorage('ip');
 				// config.headers['maiya_token'] =  getStorage('userInfoThing') ? JSON.parse(getStorage('userInfoThing')).maiya_token || "" : ""; //token
 			}
@@ -63,6 +64,7 @@ axios.interceptors.response.use(function(response) {
 	return result;
 }, function(error) {
 	console.log("***error***", error, requestCount)
+	// alert("***error***"+JSON.stringify(error))
 	if (axios.isCancel(error)) {
 		console.log('上传已取消');
 		requestCount = requestCount - 1;

src/services/requestConfig.js

@@ -43,6 +43,7 @@ const endpoints = {
 	queryEnumList: 'elab-marketing-user/enum/queryEnumList', // 获取数字人
 	rob: 'elab-marketing-file/redpack/rob', // 抢红包
 	robust_video: 'https://robustvideomatting.elab-plus.com/robust_video', // 上传视频
+	// robust_video: 'http://192.168.50.52:5000/robust_video', // 上传视频
 	get_result: 'https://robustvideomatting.elab-plus.com/get_result', // 获取视频上传结果
 	getUserVirtural: 'elab-marketing-file/virtual/getUserVirtural', // 查询用户上传的数字人 
 	addUserVirtural: 'elab-marketing-file/virtual/addUserVirtural', // 修改数字人信息