master

分支 (1)

管理

管理

master

xcx-vr
/
index.html

<!DOCTYPE html>
<html>

<head>
	<title>美璟展厅</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, viewport-fit=cover" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<meta name="apple-mobile-web-app-status-bar-style" content="black" />
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<meta http-equiv="x-ua-compatible" content="IE=edge" />
	<!-- 每个项目添加的样式 -->
	<meta name="keywords" content="木智工坊、MZGF、家具、实木家具、高端家具品牌、北欧、日式家具、黑胡桃家具、白橡、榉木、现代家具、设计师品牌、环保家具、梵几、木墨、平板包装">
	<meta name="description" content="MZGF木智工坊是由建筑师赵雷于2010年创立的国际美学家具品牌。MZGF将追求高端品质生活的愿景融入每一件产品中，在传统与现代，时尚和舒适中，寻找完美平衡。">
	<link rel="icon" href="https://mzgf.com/public/images/icon_180.png" type="image/x-icon" />
	<link rel="stylesheet" type="text/css" href="./public/css/swiper-3.4.2.min.css">
	<link rel="stylesheet" type="text/css" href="./public/css/reset.css">
	<style>
		@-ms-viewport { width:device-width; }
		@media only screen and (min-device-width:800px) { html { overflow:hidden; } }
		html { height:100%; }
		body { height:100%; overflow:hidden; margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#FFFFFF; background-color:#000000; }
	</style>
</head>

<body>

	<div id="main" v-cloak>
		<transition name="fade">
			<div class="mengban" v-show="isShow || sheyingShow || xcxShow ||deatilIsShow"></div>
		</transition>
		<!-- 摄影热点的弹窗 -->
		<transition name="fade">
			<div class="sheying all-center" v-show="sheyingShow">
				<div class="content">
					<img :src="sheyingtxt[3]" />
					<span class="txt1">{{ sheyingtxt[0] }}</span>
					<span class="txt2">{{ sheyingtxt[1] }}</span>
					<span class="txt3">{{ sheyingtxt[2] }}</span>

				</div>
				<div class="off-box">
					<span class="off" @click="sheyingShow=false"></span>
				</div>
			</div>
		</transition>
		<!-- 优惠券 -->
		<transition name="fade">
			<div class="sheying all-center" v-show="yhqShow">
				<div class="content content2">
					<img :src="yhqtxt[2]" />
					<span class="txt1">{{ yhqtxt[0] }}</span>
					<span class="txt2">{{ yhqtxt[1] }}</span>
					<div class="more" onclick="navigateTo('../myConpous/myConpous')">查看详情</div>
				</div>

				<div class="off-box">
					<span class="off" @click="yhqShow=false"></span>
				</div>
			</div>
		</transition>
		<!-- 寻宝 -->
		<transition name="fade">
			<div class="sheying all-center" v-show="false">
				<div class="content content2">
					<img :src="yhqtxt[2]" />
					<span class="xunbtxt">线索2：在项目场景中找到它，点击头枕弹出宝物！</span>
					<span class="txt2">{{ yhqtxt[1] }}</span>
					<div class="xunb">
						<div><div class="icon-m"></div><div class="xunbpri">5</div><div class="xunbpri2">元</div></div>
						<div class="buttomlq">领取宝物</div>
					</div>
				</div>

				<div class="off-box">
					<span class="off" @click="xunbShow=false"></span>
				</div>
			</div>
		</transition>
		<transition name="fade">
				<div class="sheying all-center" v-show="true">
					<div class="content content2">
						<img :src="yhqtxt[2]" />
						<span class="xunbtxt">恭喜您完成本项目的寻宝任务，我
								们下一个项目再见！</span>
						<span class="txt2">{{ yhqtxt[1] }}</span>
						<div class="xunb">
							<div><div class="icon-m"></div><div class="xunbpri">10</div><div class="xunbpri2">元 会员专享</div></div>
							<div class="buttomlq" @click="ylq=true">领取宝物</div>
						</div>
					</div>

					<div class="off-box">
						<span class="off" @click="xunbShow=false"></span>
					</div>
				</div>
		</transition>
		<transition name="fade">
			<div v-show="false" class="info1 all-center">
				<div class="info-con">
					您还没有开通美璟会员
				</div>
				<div class="choose">
					<div class="cancel">取消</div>
					<div class="cancle yes">立即开通</div>
				</div>
			</div>
		</transition>
		<transition name="fade">
			<div v-show="false" class="info2 all-center">
					今日寻宝现金领取数量已<br/>
					达上限，明天继续加油！
			</div>
		</transition>
		<transition name="yes">
				<div v-show="ylq" class="info3 all-center" @click="ylq=!ylq">
						<img src="./public/image/ylq.png" v-bind:style = "styleobj">
				</div>
		</transition>
		<!-- 启动页  qdshow-->
		<transition name="fade">
			<div class="sheying all-center men" v-show="false">
				<div class="content3 qdygao">
					<div class="con">如需隐藏热点信息，您可以<br />点击正下方按钮<div class="zhong"></div>切换为空间模式</div>
					<div @click="qdshow=false" class="wzd">我知道了</div>
				</div>
			</div>
		</transition>

		<!--  商品详情的弹窗  -->
		<transition name="fade">
			<div class="detail_popup all-center" v-if="isShow">
				<div class="cont">
					<div class="swiper-container">
						<div class="swiper-wrapper">
							<div class="swiper-slide" v-for="img in imgs">
								<img @click.prevent="" :src="img">
							</div>
						</div>
						<div class="swiper-pagination"></div>
					</div>

					<p class="desc" v-html="desc"></p>
					<div class="operation">
						<div :class="['sc-gwc', scClass]" @click.stop="collectProduct"></div>
						<div :class="['sc-gwc', gwcClass]" @click.stop="joinShopCar"></div>
						<div class="xq" @click.stop="navigateToDetail">
							查看详情
						</div>
					</div>
				</div>

				<div class="off-box">
					<span class="off" @click="isShow=false"></span>
				</div>
			</div>
		</transition>


		<!-- 故事详情的弹窗 由于和上面产品详情样式一样，所以class公用了  -->
		<transition name="fade">
			<div class="detail_popup all-center" v-if="deatilIsShow">
				<div class="cont">
					<div class="swiper-container">
						<div class="swiper-wrapper">
							<div class="swiper-slide" v-for="img in deatil.imgs">
								<img @click.prevent="" :src="img">
							</div>
						</div>
						<div class="swiper-pagination"></div>
					</div>

					<p class="desc">{{deatil.txt}}</p>
					<div class="operation">
						<div class="xq" @click.stop="navigateToDetail">
							查看详情
						</div>
					</div>
				</div>

				<div class="off-box">
					<span class="off" @click="deatilIsShow=false"></span>
				</div>
			</div>
		</transition>

		<div class="full-screen" v-show="showMsg" @click="showMsg=false">
			<transition name="fade">
				<p class="msg all-center" v-show="showMsg" v-html="msg"></p>
			</transition>
		</div>

		<!-- 视频热点弹窗 -->
		<div class="video-box" v-if="goodsVideoShow" @click="hideVideo" ref="videoBox">
			<video class="goods-video all-center" controls="controls" @click.stop="" ref="video">
				<source :src="goodsVideoSrc" type="video/mp4" />
				<source :src="goodsVideoSrc.split('.mp4')[0] + '.ogg'" type="video/ogg" />
				<source :src="goodsVideoSrc.split('.mp4')[0] +'.mpeg'" type="video/mpeg4" />
				<source :src="goodsVideoSrc.split('.mp4')[0] +'.webm'" type="video/webm" />
			</video>
		</div>


		<!-- 小程序功能弹窗 -->
		<transition name="fade">
			<div class="xcx_popup all-center" v-show="xcxShow" ref="xcx_popup">
				<img :src="xcxImgSrc" alt="" />
				<div class="off-box">
					<span class="off" @click="xcxShow=false"></span>
				</div>
			</div>
		</transition>
	</div>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
	<script src="./public/js/jquery.min.js"></script>
	<script src="./public/js/swiper-3.4.2.min.js"></script>
	<script src="./public/js/vue.js"></script>
	<script src="./public/js/util.js"></script>
	<script src="./public/js/detail.js"></script>
	<script src="./001/tour.js"></script>
	<div id="pano" style="width:100%;height:100%;">
		<noscript>
			<table style="width:100%;height:100%;">
				<tr style="vertical-align:middle;">
					<td>
						<div style="text-align:center;">ERROR:<br /><br />Javascript not activated<br /><br /></div>
					</td>
				</tr>
			</table>
		</noscript>
		<script>
			setTimeout(() => {
				embedpano({
					swf: `../${itemCode}/tour.swf`,
					xml:  `../${itemCode}/tour.xml`,
					target: "pano",
					html5: "auto",
					mobilescale: 1.0,
					passQueryParameters: true
				});
			}, 100);
			setTimeout(() => {
				console.log(1);
				vm.qdshow = true
			}, 1000);
			// const sceneList = [
			// 	{
			// 		index: 0,
			// 		text: '客厅'
			// 	},
			// 	{
			// 		index: 1,
			// 		text: '餐厅'
			// 	},
			// 	{
			// 		index: 2,
			// 		text: '主卧'
			// 	},
			// 	{
			// 		index: 3,
			// 		text: '次卧'
			// 	},
			// 	{
			// 		index: 4,
			// 		text: '浴室1'
			// 	},
			// 	{
			// 		index: 5,
			// 		text: '浴室2'
			// 	}
			// ]
			// const orderList = [
			// 	"24310",
			// 	"32140",
			// 	"04123",
			// 	"42130",
			// 	"31245",
			// 	"32145"
			// ]
			// window.setInterval(() => {
			// 	let index = Util.getRequest('startscene');
			// 	let orderItem = orderList[index];
			// 	let order = orderItem.split("");
			// 	let List = [];
			// 	order.forEach(element => {
			// 		List.push(sceneList[element]);
			// 	});
			// 	console.log(List);
			// }, 1000);
		</script>
	</div>
</body>

</html>