<!-- 布局切换操作视图 -->
<div class="plot-view">
	<!-- <div class="title rows justify-center">选择要更换成的功能空间</div> -->
	<div class="close rows justify-center" @click="closeHandle">
		<div class="iconfont icon-close"></div>
	</div>
	<!-- 布局空间列表数据 -->
	<div class="swiper-view">
		<div class="tab-content rows flex-start">
			<div @click="changeType(index)" class="tab-item columns"
				:class="{'tabActive': tabIndex == index}" 
				v-for="(tab,index) in plotList" :key="index" >
				<!-- <img class="tab-img" :src="tab.imageUrl" mode="aspectFill" /> -->
				<div class="tab-title">{{tab.name}}</div>
				<div class="tab-text">{{tab.count}}个布局</div>
			</div>
		</div>
	</div>
	<div class="plot-content" v-if="plotList && plotList.length>0">
		<div class="content  rows flex-start">
			<div @click="changeOption(item,index)" class="item columns"
				:class="{'active': selectIndex == index}" 
				v-for="(item,index) in plotList[tabIndex].dataList" :key="index" >
				<img class="img" :src="item.renderImage" mode="aspectFill" />
				<!-- <div class="gou rows justify-center">√</div> -->
				<i class="iconfont icon-Hook-1 gou rows justify-center"></i>
				<div class="text eslipe">{{item.name}}</div>
			</div>
		</div>
	</div>
	<div class="btn-list rows rows-between" v-if="unSelect">
		<div class="btn rows up up3 justify-center">确认</div>
	</div>
	<div class="btn-list rows rows-between" v-else>
		<div class="btn rows up up2 justify-center" @click="confirm">确认</div>
	</div>
</div>