h5-webgl-program/src/pages/webgl_rxdz_text_customize/webgl_rxdz_text_customize.html

<div class="bookingSheet">
    <!-- <shareOption @afterUserHandle="afterShareOptionHandle" @optionChange="optionChange" :showShareOptions="showShareOptions"></shareOption> -->
    <mynavbar :barData='navbar'/>
	<!-- <authview id="authView" :showPhoneModel="showPhoneModel"></authview> -->
    <div class="contentBox">
        <!-- 图片区域 -->
        <div class="picArea">
            <div class="master-pic" v-if="tabData[tabIndex] && tabData[tabIndex].hardboundEffect.length>0">
				<el-carousel :autoplay="false" :loop="false" :indicator-dots="false"
					@change="swiperChangeImg" class="master-pic-swiper" 
					:current="currImgIdx" ref="carousel">
                    <el-carousel-item v-for="(img,s) in tabData[tabIndex].hardboundEffect" :key="s" :item-id="s" class="master-pic-img">
                        <img @touchstart="mytouchstart" @touchmove="mytouchmove" @touchend="mytouchend" class="master-pic-img" :src="img" mode="aspectFill" />
						<div class="lookHouseView rows justify-center" v-if="tabIndex==0 && (!shareUserId || shareUserId==userId)" @click="toMode">
							<img class="icon-ai" src="https://dm.static.elab-plus.com/miniProgram/iconfont/icon-ai.png" mode="widthFix"/>
							查看户型
						</div>
                        <!-- <c-img class="master-pic-img" :style="'background-color:#fff'" :src="img" mode="aspectFill"></c-img> -->
                    </el-carousel-item>
                </el-carousel>
				<div class="indicator-view rows" v-if="tabData[tabIndex].hardboundEffect && tabData[tabIndex].hardboundEffect.length > 1">
					<div class="indicator-item" :class="{'active': currImgIdx == idx}" 
					v-for="(item, idx) in tabData[tabIndex].hardboundEffect" :key="idx"></div>
				</div>
            </div>
			<img class="text-img" src="https://dm.static.elab-plus.com/miniProgram/text-img.png" mode="widthFix"/>
            <div class="tabList rows flex-start">
				<div @click="changeTab(index)" class="tab-item columns" :class="{'tabActive': tabIndex == index}" 
					v-for="(tab,index) in tabData" :key="index" >
					<img class="tab-img" :src="tab.imgUrl" mode="aspectFill" />
					<div class="tab-info rows rows-between">
						<div class="eslipe">{{tab.name || '-'}}</div>
						<div class="eslipe" v-if="tab.area">{{tab.area || '-'}}㎡</div>
					</div>
				</div>
            </div>
        </div>
        <!-- 提交信息区域 -->
        <div class="booking-info" :style="{'color':tabIndex==0?'#fff':'#fff'}" v-if="layoutStruct">
			<!-- <div class="left-line line"></div>
			<div class="right-line line"></div>
			<div class="writingBox rows">
				<img class="writing-img" :src="layoutStruct.houseImg || plotHeadDeafultImg" />
				<div class="wiriting-right" >
					<div class="font40 wiriting-text">{{shareUserId&&shareUserId!=userId?'':'我的'}}私人定制</div>
					<div class="font52 wiriting-text">{{layoutStruct.houseName || ''}}</div>
				</div>
			</div> -->
			<div class="title">金融岛 · 我的梦想设计</div>
            <!-- 文字信息区域 -->
            <div class="info-bar">
				<div class="info-item" v-for="(item,index) in expand" :key="index">
				    <div class="info-item-label">{{item.name}}</div>
				    <div class="info-item-value">{{item.value || '-'}}</div>
				</div>
            </div>
        </div>
		
		<!-- 底部按钮 -->
		<div class="info-view columns justify-center" v-if="layoutStruct && typeStatus">
			<div class="bottom-title" :style="{'color':tabIndex==0?'#fff':'#000'}">
				- 支持我的梦想家 -
			</div>
			<div class="bottom-tips" :style="{'color':tabIndex==0?'#fff':'#000'}">
				喜欢我的设计吗，给我投一票吧~
			</div>
			<!-- 支持率 -->
			<div class="rows justify-center info-point">
				<div class="left-word">{{proportion}}%</div>
				<div class="line-view rows">
					<div class="left-line" :style="{width:proportion+'%'}"></div>
					<div class="right-line" :style="{width:(100 - proportion)+'%'}"></div>
				</div>
				<div class="right-word">{{100 - proportion}}%</div>
			</div>
			<div class="sub-view-result columns" v-if="layoutStruct.clickLike!=null">
				<img class="img" :src="layoutStruct.clickLike?'https://dm.static.elab-plus.com/miniProgram/like.png':'https://dm.static.elab-plus.com/miniProgram/unlike.png'"></img>
				<div class="text rows justify-center">感谢您的投票</div>
			</div>
			<div class="sub-view rows justify-center" v-else>
				<div class="left rows justify-center" @click="likeOrView(1)">喜欢</div>
				<div class="right rows justify-center" @click="likeOrView(2)">不喜欢</div>
			</div>
			
			<div class="info-head columns rows-between" v-if="total && headList && headList.length>0">
				<div class="head-list rows justify-center">
					<img class="wg-head" v-for="(item,idx) in headList" :key="idx" 
					:src="item?item:'https://dm.static.elab-plus.com/elabWepy/default-head.png'"></img>
				</div>
				<div class="text-sty">
					已经有{{total}}人参与梦想家创建
				</div>
			</div>
		</div>
		<div class="bottom-view rows rows-between" v-if="typeStatus">
			<div class="bottom-btn btn-qw rows justify-center" @click="toIndex">
			    设计我的梦想家
			</div>
			<div class="bottom-btn btn-share rows justify-center" @click="share">
				分享我的设计
			</div>
		</div>
		<div class="bottom-view rows rows-between" v-else>
			<div class="bottom-btn btn-qw rows justify-center" @click="conectUS">
			    联系我们了解更多
			</div>
			<div class="bottom-btn btn-share rows justify-center" @click="share">
				<!-- <i class="iconfont icon-Shared"></i> -->
				分享我的设计
			</div>
		</div>
		<!-- 高斯背景图 -->
		<div class="swiper-img-gs-mh"  >
			<img class="img" mode="aspectFill" src="https://dm.static.elab-plus.com/miniProgram/test-bg.jpg" />
		</div>
		
    </div>
	<!-- 弹窗 -->
	<div class="pop-view" v-if="showUserInput">
		<div class="pop-main">
			<i class="modelClose iconfont icon-close" @click="hidePop"></i>
			<div class="title">提交我的梦想家</div>
			<div class="content">
				<div class="item" style="margin-bottom: 40px;">
					<div class="item-title">姓名</div>
					<div class="item-input">
						<input class="input-real" type="text" autofocus placeholder="请填写您的姓名昵称" 
						v-model="name" />
					</div>
				</div>
				<div class="item" style="margin-bottom: 20px;">
					<div class="item-title">手机号</div>
					<div class="item-input">
						<input class="input-real" type="number" autofocus placeholder="请填写您的手机号" 
						v-model="tel" />
						<div v-if="verifyText" class="input-tips rows justify-center" @click="getVerifyCode">{{verifyText}}</div>
					</div>
				</div>
				<div class="item">
					<div class="item-input rows">
						<input class="input-real" type="number" autofocus placeholder="请填写验证码" 
						v-model="verifyCode"/>
						<div class="input-tips rows justify-center" @click="getVerifyCode">发送验证码</div>
					</div>
				</div>
			</div>
			<div class="btn rows justify-center" @click="sendPhone">确定</div>
		</div>
	</div>
	<!-- 添加企微弹出层 -->
    <!-- <div class="f-popup-bom-container" @click.stop.prevent="showPopup=false" v-show="showPopup">
		<div class="f-popup-view">
            <img class="closeIcon" @click="showPopup = false;" src="https://dm.static.elab-plus.com/mini-program/closeIcon.png" mode="widthFix" />
			<scroll-view scroll-y="true" class="f-popup-bom" @click.stop.prevent="catchEvent" :enhanced="true" :show-scrollbar="false">
                <img mode="widthFix" :show-menu-by-longpress="true" class="qrCode" :src="enterpriseWechat" />
            </scroll-view>
		</div>
	</div> -->
</div>