<template>
	<view class="survey-detail-container">
		<uni-popup ref="popup" type="top" v-show="showPopMenu"><button @click="submitSurvey">提交</button><button>退回</button></uni-popup>
		<view class="uni-padding-wrap uni-common-mt">
			<uni-segmented-control :current="current" :values="items" :style-type="styleType"
				:active-color="activeColor" @clickItem="onClickItem" />
		</view>
		<view class="content"  style="height: 80vh; overflow: auto;">			
		<uni-card>
			<view v-show="current === 2">
				<uni-section title="业务信息" type="line">
					<uni-list>
						<uni-list-item title="物业名称" :rightText="basicInfo.property_full_name" />
						<uni-list-item title="所在城市" :rightText="basicInfo.city" />
						<uni-list-item title="业务员" :rightText="basicInfo.username" />
						<uni-list-item title="联系人" :rightText="basicInfo.survey_contacts" />
						<uni-list-item title="备注">
							<template v-slot:footer>
								<view class="desc"><text>{{basicInfo.remark}}</text></view>
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="周边设施信息" type="line">
					<uni-list>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>毗邻物业</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.adjacent_property" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>公交线路</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.bus_lines" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item title="四至" />
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>东至</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.boundaries.east" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>南至</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.boundaries.south" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>西至</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.boundaries.west" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>北至</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.boundaries.north" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="公共服务设施" type="line">
					<uni-list>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>银行</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.bank" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>学校</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.school" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>超市</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.supermarket" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>酒店</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.hotel" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>菜市场</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.food_market" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>邮局</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.post_office" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>医院</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.hospital" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>公园</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.park" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>会所</view>
							</template>
							<template v-slot:body>
								<input class="uni-input" v-model="formItem.pub_serv.club" maxlength="50"
									placeholder="文字(最多50字)" />
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="环境与景观" type="line">
					<uni-list>
						<uni-list-item>
							<template v-slot:footer>
								<text class="require">*</text>
								<view class="uni-textarea">
									<textarea v-model="formItem.scenery" maxlength="50"
										placeholder="文字(最多50字)" />
								</view>
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="楼盘介绍" type="line">
					<uni-list>
						<uni-list-item>
							<template v-slot:footer>

								<view class="uni-textarea">
									<textarea v-model="formItem.property_intro" maxlength="200"
										placeholder="请输入，最多200字" />
								</view>

							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
			</view>
			<view v-show="current === 0">
				<uni-section title="楼栋物业信息" type="line">
					<uni-list>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>物业地址</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.address" maxlength="50"
										placeholder="文字(最多50字)" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
						
								<view> <text class="require">*</text> 户型</view>
						
							</template>
							<template v-slot:body>
								<view class='slot-box'>
									<view class="eva-label" >房</view>
									<input class="uni-input" type="digit" v-model="typeObj.house" maxlength="5"
										placeholder="数字" />
										
									<!--<uni-data-checkbox  mode="tag" v-model="typeObj.house"
										:localdata="house_type_range">
									</uni-data-checkbox>-->
								</view>
								<view class='slot-box'>
									<view class="eva-label">厅</view>
									<input class="uni-input" type="digit"  v-model="typeObj.hall" maxlength="5"
										placeholder="数字" />
								<!--	<uni-data-checkbox  mode="tag" v-model="typeObj.hall"
										:localdata="house_type_range">
									</uni-data-checkbox>>-->
								</view>
								<view class='slot-box'>
									<view class="eva-label">卫</view>
									<input type="digit" class="uni-input" v-model="typeObj.toilet" maxlength="5"
										placeholder="数字" />
									<!--<uni-data-checkbox  mode="tag" v-model="typeObj.toilet"
										:localdata="house_type_range">
									</uni-data-checkbox>-->
								</view>
								<view class='slot-box'>
									<view class="eva-label">阳</view>
									<input class="uni-input" type="digit"  v-model="typeObj.balcony" maxlength="5"
										placeholder="数字" />
								<!--	<uni-data-checkbox  mode="tag" v-model="typeObj.balcony"
										:localdata="house_type_range">
									</uni-data-checkbox>-->
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column" >		
							<template v-slot:header>
								<view class="slot-box">
									<view class="eva-label" ><text class="require"> * </text> 朝向 </view>
								</view>
							</template>
							<template v-slot:footer>								
								<view class="slot-box">									
									<uni-data-checkbox mode="tag" v-model="formItem.towards"
										:localdata="residence_towards">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>层高</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.floor_height" type="digit"
										placeholder="数字" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'><text class="require">*</text>评估楼层(层)</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.floor_no" type="digit"
										placeholder="数字" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'><text class="require">*</text> 总楼层(层)</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.floor_total" type="digit"
										placeholder="数字" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'><text class="require">*</text> 梯户</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.elevator_apartment_count" maxlength="50"
										placeholder="文字(最多50字)" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'><text class="require">*</text> 电梯(部)</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.elevator" type="digit"
										placeholder="数字" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item title="停车场库">
							<template v-slot:footer>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple v-model="formItem.parking_lot"
										:localdata="residence_parking_garage">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view class="slot-box">
									<view class="eva-label" ><text class="require"> * </text> 使用现状 </view>
								</view>
							</template>
							<template v-slot:footer>								
								<view class="slot-box">					
									<uni-data-checkbox mode="tag" multiple v-model="formItem.parking_lot_usage"
										:localdata="residence_parking_garage_status">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view class="slot-box">
									<view class="eva-label" ><text class="require"> * </text> 装修档次 </view>
								</view>
							</template>
							<template v-slot:footer>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" v-model="formItem.decoration"
										:localdata="residence_decoration_grade">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view class="slot-box">
									<view class="eva-label" ><text class="require"> * </text> 实际用途 </view>
								</view>
							</template>
							<template v-slot:footer>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" v-model="formItem.usage"
										:localdata="residence_practical_application">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'><text class="require">*</text> 物业管理</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.property_mgm" maxlength="50"
										placeholder="文字(最多50字)" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view class="slot-box">
									<view class="eva-label" ><text class="require"> * </text> 成新率 </view>
								</view>
							</template>
							<template v-slot:footer>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" v-model="formItem.newness_rate"
										:localdata="residence_new_rate">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item >
							<template v-slot:header>
								<view class='eva-label'>建筑结构</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<input class="uni-input" v-model="formItem.structure" maxlength="50"
										placeholder="文字(最多50字)" />
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">	
							<template v-slot:header>
								<view class="slot-box">
									<view class="eva-label" ><text class="require"> * </text> 小片区 </view>
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
								<uni-data-checkbox mode="tag" v-model="formItem.area_id" :localdata="areaArray">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
			</view>
			<view v-show="current === 1">
				<uni-section title="装修标准信息" type="line">
					<uni-list>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view class="slot-box">
									<view>外景</view>
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple v-model="formItem.exterior_view"
										:localdata="residence_outdoor_scene">
									</uni-data-checkbox>
								</view>
							</template>
							<template v-slot:footer>
								<view><text class="require">*</text>上传图片</view>
								
								<uni-file-picker :auto-upload="false" v-model="formItem.outdoor_scene_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'exterior_view_img_ids')" @delete="handleDelete"/>
									
							</template>
						</uni-list-item>

						<uni-list-item direction="column">
							<template v-slot:header>

								<view>门窗</view>

							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple v-model="formItem.doorplate"
										:localdata="residence_doorplate">
									</uni-data-checkbox>
								</view>
							</template>
							<template v-slot:footer>

								<view><text class="require">*</text>上传图片</view>
								<uni-file-picker :auto-upload="false" v-model="formItem.doorplate_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'doorplate_img_ids')" @delete="handleDelete"/>

							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="客厅/餐厅" type="line">
					<uni-list>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>内景</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.living_room.residence_living_room_inside_wall"
										:localdata="residence_living_room_inside_wall">
									</uni-data-checkbox>
								</view>
							</template>

						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>天花板</view>
							</template>

							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.living_room.residence_living_room_ceiling"
										:localdata="residence_living_room_ceiling">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>地面</view>
							</template>

							<template v-slot:body>

								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.living_room.residence_living_room_ground"
										:localdata="residence_living_room_ground">
									</uni-data-checkbox>
								</view>
							</template>
							<template v-slot:footer>

								<view><text class="require">*</text>上传图片</view>
								<uni-file-picker :auto-upload="false" v-model="formItem.living_room_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'living_room_img_ids')" @delete="handleDelete"/>

							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="卧室" type="line">
					<uni-list>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>内景</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bedroom.residence_bedroom_inside_wall"
										:localdata="residence_bedroom_inside_wall">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>天花板</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bedroom.residence_bedroom_ceiling"
										:localdata="residence_bedroom_ceiling">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>地面</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bedroom.residence_bedroom_ground"
										:localdata="residence_bedroom_ground">
									</uni-data-checkbox>
								</view>
							</template>
							<template v-slot:footer>
								<view><text class="require">*</text>上传图片</view>
								<uni-file-picker :auto-upload="false" v-model="formItem.bedroom_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'bedroom_img_ids')" @delete="handleDelete"/>

							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="厨房" type="line">
					<uni-list>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>天花
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.kitchen.residence_kitchen_ceiling"
										:localdata="residence_kitchen_ceiling">
									</uni-data-checkbox>
								</view>
							</template>

						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>墙面
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.kitchen.residence_kitchen_wall"
										:localdata="residence_kitchen_wall">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>地面
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.kitchen.residence_kitchen_ground"
										:localdata="residence_kitchen_ground">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>设备
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.kitchen.residence_kitchen_equipment"
										:localdata="residence_kitchen_equipment">
									</uni-data-checkbox>
								</view>
							</template>
							<template v-slot:footer>
								<view><text class="require">*</text>上传图片</view>
								<uni-file-picker :auto-upload="false" v-model="formItem.kitchen_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'kitchen_img_ids')" @delete="handleDelete"/>
							</template>
						</uni-list-item>

					</uni-list>
				</uni-section>
				<uni-section title="卫生间" type="line">
					<uni-list>

						<uni-list-item direction="column">
							<template v-slot:header>
								<view>天花
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bathroom.residence_bathroom_ceiling"
										:localdata="residence_bathroom_ceiling">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>墙面</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bathroom.residence_bathroom_wall"
										:localdata="residence_bathroom_wall">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>地面</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bathroom.residence_bathroom_ground"
										:localdata="residence_bathroom_ground">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>洁具</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.bathroom.residence_bathroom_sanitary"
										:localdata="residence_bathroom_sanitary">
									</uni-data-checkbox>
								</view>
							</template>
							<template v-slot:footer>
								<view><text class="require">*</text>上传图片</view>
								<uni-file-picker :auto-upload="false" v-model="formItem.bathroom_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'bathroom_img_ids')" @delete="handleDelete"/>
							</template>
						</uni-list-item>

					</uni-list>
				</uni-section>
				<uni-section title="设施" type="line">
					<uni-list>

						<uni-list-item direction="column">
							<template v-slot:header>
								<view>水电
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.facility.residence_facility_hydropower"
										:localdata="residence_facility_hydropower">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>通信
								</view>
							</template>
							<template v-slot:body>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple
										v-model="formItem.facility.residence_facility_communication"
										:localdata="residence_facility_communication">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="其他" type="line">
					<uni-list>

						<uni-list-item>
							<template v-slot:footer>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple v-model="formItem.other.residence_other"
										:localdata="residence_other">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="特殊户型备注" type="line">
					<uni-list>

						<uni-list-item>

							<template v-slot:footer>
								<view class="slot-box">
									<uni-data-checkbox mode="tag" multiple v-model="formItem.special_remarks"
										:localdata="residence_special_remarks">
									</uni-data-checkbox>
								</view>
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="备注" type="line">
					<uni-list>
						<uni-list-item>
							<template v-slot:footer>				
								<view class="uni-textarea">
									<textarea v-model="formItem.remarks" maxlength="200"
										placeholder="请输入，最多200字" />
								</view>				
							</template>
						</uni-list-item>
					</uni-list>
				</uni-section>
				<uni-section title="图片" type="line">
					<uni-list>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>入户花园</view>
							</template>
							<template v-slot:body>
								<uni-file-picker :auto-upload="false" v-model="formItem.apartment_layout_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'house_type_img_ids')" @delete="handleDelete"/>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>景观(楼梯)</view>
							</template>
							<template v-slot:body>
							<uni-file-picker :auto-upload="false" v-model="formItem.oriented_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'orientation_img_ids')" @delete="handleDelete"/>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view><text class="require">*</text>物业位置图</view>
							</template>
							<template v-slot:body>
								<uni-file-picker :auto-upload="false" v-model="formItem.location_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'supplement_img_ids')" @delete="handleDelete"/>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>补充图片</view>
							</template>
							<template v-slot:body>
								<uni-file-picker :auto-upload="false" v-model="formItem.supplement_imgs_arr" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg"   @progress="progress($event)"
									@success="success" @fail="fail" @select="selectImg($event,'supplement_imgs')" @delete="handleDelete"/>
							</template>
						</uni-list-item>
						<uni-list-item direction="column">
							<template v-slot:header>
								<view>查勘图库</view>
							</template>
							<template v-slot:body>
								<uni-file-picker :auto-upload="false" v-model="img_details.survey_gallery_imgs_details" file-mediatype="image"
									mode="grid" file-extname="png,jpg,jpeg" :readonly="true"/>
							</template>
						</uni-list-item>


					</uni-list>
				</uni-section>
			</view>
			</uni-card>
		</view>
	</view>
</template>

<script>
	import config from '@/config'
	import { toast } from '@/utils/common'
	import { uploadImg } from "@/api/common"
	import {
		surveyDetail,
		surveyOptions,
		surveySubmit
	} from '../../api/survey/survey'
	
	export default {
		components: {},
		data() {
			return {				
				uploadImgTotal:0, // 共要上传图片数量
				uploadImgOKQueue:[], // 上传队列
				showPopMenu:false,
				items: ['楼栋物业', '装修标准','周边设施'],
				styles: [{
						value: 'button',
						text: '按钮',
						checked: true
					},
					{
						value: 'text',
						text: '文字'
					}
				],
				colors: ['#007aff', '#4cd964', '#dd524d'],
				current: 0,
				colorIndex: 0,
				activeColor: '#007aff',
				styleType: 'button',

                imagevalues:[],
				filePathsList:[],
				typeObj: {
					house: "",
					hall: "",
					toilet: "",
					balcony: ""
				},
				typeList: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20],
				
				house_type_range: [{"value": 0,"text": "0"	},{"value": 1,"text": "1"},{"value": 2,"text": "2"},{"value": 3,"text": "3"},
				                   {"value": 4,"text": "4"	},{"value": 5,"text": "5"},{"value": 6,"text": "6"},{"value": 7,"text": "7"}],
				list: [1, 2, 3, 4],
				codeList: [],
				residence_towards: [], // 朝向
				residence_parking_garage: [], // 停车场库
				residence_parking_garage_status: [], // 停车场库使用现状
				residence_practical_application: [], // 实际用途
				residence_decoration_grade: [], // 装修档次
				residence_new_rate: [], // 成新率
				residence_outdoor_scene: [], // 外景
				residence_doorplate: [], // 门窗
				residence_living_room_inside_wall: [], // 客厅-内景
				residence_living_room_ceiling: [], // 客厅-天花板
				residence_living_room_ground: [], // 客厅-地面
				residence_balcony: [], // 阳台
				residence_bedroom_inside_wall: [], // 卧室-天花
				residence_bedroom_ceiling: [], // 卧室-天花
				residence_bedroom_ground: [], // 卧室-天花
				residence_kitchen_ceiling: [], // 厨房-天花
				residence_kitchen_wall: [], // 厨房-墙面
				residence_kitchen_ground: [], // 厨房-地面
				residence_kitchen_equipment: [], // 厨房-设备
				residence_bathroom_ceiling: [], // 卫生间-天花
				residence_bathroom_wall: [], // 卫生间-墙面
				residence_bathroom_ground: [], // 卫生间-地面
				residence_bathroom_sanitary: [], // 卫生间-洁具
				residence_facility_hydropower: [], // 设施-水电
				residence_facility_communication: [], // 卫生间-通讯
				residence_other: [], // 其他
				residence_special_remarks: [], // 特殊户型备注

				data: {
					basicData: {
						bank_name: '',
						bank_customer_mgr_name: '',
						evaluate_purposes: ''
					}
				},
				basicInfo: {},
				areaArray: [],
				formItem: {
					survey_type: this.$route.query.survey_type, //  1.住宅 2.商业
					survey_id: this.$route.query.survey_id,
					adjacent_property: '', // 毗邻物业
					bus_lines: '', // 公交线路
					boundaries: { // 四至
						east: '', // 东
						south: '', // 南
						west: '', // 西
						north: '' // 北
					},
					pub_serv: { // 公共服务设施
						bank: '', // 银行
						school: '', // 学校
						supermarket: '', // 超市
						hotel: '', // 酒店
						food_market: '', // 菜市场
						post_office: '', // 邮局
						hospital: '', // 医院
						park: '', // 公园
						club: '' // 会所
					},
					special_remarks:"",// 
					remarks: '', // 备注
					scenery: '', // 环境和景观
					property_intro: '', // 楼盘介绍
					address: '', // 物业地址
					unit_type: '', // 户型
					towards: '', // 朝向
					elevator_apartment_count: '', // 梯户
					floor_height: '', // 层高
					floor_no: '', // 评估楼层
					floor_total: '', // 总楼层
					elevator: '', // 电梯
					parking_lot: [], // 停车场库
					parking_lot_usage: '', // 停车场库使用现状
					decoration: '', // 装修档次
					usage: '', // 实际用途
					property_mgm: '', // 物业管理
					newness_rate: '', // 成新率
					area_id: '', // 小片区
					area: '', // 小片区
					structure: '', // 建筑结构
					floor_plan: '', // 平面布局
					greening: '', // 绿化环境
					exterior_view: [], // 外景
					exterior_view_img_ids: [], // 外景图片
					doorplate: [], // 门窗
					doorplate_img_ids: [], // 门窗图片
					living_room: {
						residence_living_room_inside_wall: [], // 客厅（卧室）-内景
						residence_living_room_ceiling: [], // 客厅（卧室）-天花板
						residence_living_room_ground: [] // 客厅（卧室）-地面
					},
					living_room_img_ids: [], // 客厅图片
					balcony: [], // 阳台
					balcony_img_ids: [], // 阳台图片
					bedroom: {
						residence_bedroom_inside_wall: [], // 卧室-内景
						residence_bedroom_ceiling: [], // 卧室-天花板
						residence_bedroom_ground: [] // 卧室-地面
					},
					bedroom_img_ids: [],
					kitchen: {
						residence_kitchen_ceiling: [], // 厨房-天花
						residence_kitchen_wall: [], // 厨房-墙面
						residence_kitchen_ground: [], // 厨房-地面
						residence_kitchen_equipment: [] // 厨房-设备
					},
					kitchen_img_ids: [], // 厨房图片
					bathroom: {
						residence_bathroom_ceiling: [], // 卫生间-天花
						residence_bathroom_wall: [], // 卫生间-墙面
						residence_bathroom_ground: [], // 卫生间-地面
						residence_bathroom_sanitary: [] // 卫生间-洁具
					},
					bathroom_img_ids: [], // 卫生间图片
					facility: {
						residence_facility_hydropower: [], // 设施-水电
						residence_facility_communication: [] // 设施-通讯
					},
					facility_img_ids: [], // 设施图片
					other: {
						residence_other: [] // 其他-其他
					},
					special_remarks: [], // 特殊户型备注
					others_img_ids: [], // 其他图片
					supplement_img_ids: [], // 物业位置图
					supplement_imgs: [], // 补充图片
					survey_loc_img_ids: [], // 定位图
					house_type_img_ids: [], // 入户花园
					orientation_img_ids: [], // 景观(楼梯)
					auto_loc_img_ids: [], //自动定位图
					appraisal_img_ids: [] // 查勘图库
				},
				img_details: {
					survey_gallery_imgs_details: [] // 查勘图库
				}
			}
		},
		created() {
			this.route = this.$route.query
			this.surveyDetail()
			this.surveyOptions()
			this.initial_uploadMgr()
		},
		
		
		methods: {
			 checkRule () {
			      if (this.typeObj.house === '' ||
			        this.typeObj.hall === '' ||
			        this.typeObj.toilet === '' ||
			        this.typeObj.balcony === ''
			      ) {
			        toast('户型未填写完整，无法提交')
			        return false
			      }
			      if (this.formItem.towards === '') {
			        toast('朝向未填写，无法提交')
			        return false
			      }
			      if (this.formItem.elevator_apartment_count === '') {
			        toast('梯户未填写，无法提交')
			        return false
			      }
			      if (this.formItem.floor_no === '') {
			        toast('评估楼层(层)未填写，无法提交')
			        return false
			      }
			      if (this.formItem.floor_total === '') {
			        toast('总楼层(层)未填写，无法提交')
			        return false
			      }
			      if (this.formItem.elevator === '') {
			        toast('电梯(部)未填写，无法提交')
			        return false
			      }
			      if (this.formItem.parking_lot_usage === '') {
			        toast('使用现状未填写，无法提交')
			        return false
			      }
			      if (this.formItem.decoration === '') {
			        toast('装修档次未填写，无法提交')
			        return false
			      }
			      if (this.formItem.usage === '') {
			        toast('实际用途未填写，无法提交')
			        return false
			      }
			      if (this.formItem.area_id === '') {
			        toast('小片区未填写，无法提交')
			        return false
			      }
			      if (this.formItem.exterior_view_img_ids.length === 0) {
			        toast('外景图片未填写，无法提交')
			        return false
			      }
			      if (this.formItem.doorplate_img_ids.length === 0) {
			        toast('门窗图片未填写，无法提交')
			        return false
			      }
			      if (this.formItem.living_room_img_ids.length === 0) {
			        toast('客厅/餐厅图片未填写，无法提交')
			        return false
			      }
			      if (this.formItem.bedroom_img_ids.length === 0) {
			        toast('卧室图片未填写，无法提交')
			        return false
			      }
			      if (this.formItem.kitchen_img_ids.length === 0) {
			        toast('厨房图片未填写，无法提交')
			        return false
			      }
			      if (this.formItem.bathroom_img_ids.length === 0) {
			        toast('卫生间图片未填写，无法提交')
			        return false
			      }
			      // if (this.formItem.house_type_img_ids.length === 0) {
			      //   toast('入户花园未填写，无法提交')
			      //   return false
			      // }
			      // if (this.formItem.orientation_img_ids.length === 0) {
			      //   toast('景观(楼梯)未填写，无法提交')
			      //   return false
			      // }
			      if (this.formItem.supplement_img_ids.length === 0) {
			        toast('物业位置图片未填写，无法提交')
			        return false
			      }
				  if (this.formItem.scenery === '') {
				    toast('环境与景观未填写，无法提交')
				    return false
				  }
			      return true
			    },
			   
			onClickItem(e) {
				if (this.current !== e.currentIndex) {
					this.current = e.currentIndex
				}
			},
			styleChange(e) {
				if (this.styleType !== e.detail.value) {
					this.styleType = e.detail.value
				}
			},
			colorChange(e) {
				if (this.styleType !== e.detail.value) {
					
					this.activeColor = e.detail.value
				}
			},
			
			initial_uploadMgr()
			{
				this.uploadImgDelQueue = [];
				this.uploadImgDelQueue = [];
				this.uploadImgTotal = 0;
				
			},
			
			// 选择文件，获取上传状态
			selectImg(e,name){				
				let tempFilePaths = e.tempFilePaths
				if (!tempFilePaths.length) 
					return
					
				// 加入上传队列				
				for( let i=0; i<tempFilePaths.length; ++i )
				{
					const path = tempFilePaths[i]
					this.uploadImgOKQueue.push( {path:path, name:name, e:e } );										
					this.uploadImgTotal++;
					this.filePathsList.push({url:path,name:""})	
				}
				console.log('select img',this.uploadImgOKQueue,this.uploadImgTotal)
				// 开始loading界面
				uni.showLoading({
					title:'正在上传图片 '+ (this.uploadImgTotal-this.uploadImgOKQueue.length)+'/'+this.uploadImgTotal
				})
				
				// 开始逐个图上传
				let next = this.uploadImgOKQueue.pop();
				this.UploadImageNext( next.path , next.name ,this.onUploadOKCallBack, this.onUploadFaildCallback )

			},
			
			// 通过path 从Queue里删除一个队列节点
			// return Bool
			deletUploaFileFromQueue( path )
			{
				for( let i=0 ; i < this.uploadImgOKQueue; ++i )
				{
					let node = this.uploadImgOKQueue[i];
					if( node.path == path )
					{
						this.uploadImgOKQueue.splice( i,1 )
						this.uploadImgTotal-- ; // 总数减一
						return true;
					}
				}
				
				return false;
			},
			
			// 上传图片成功回调
			onUploadOKCallBack( response ,name  )
			{
				const data = response.data
				 const id = data.id
								 
				 this.formItem[name].push(id)
				if (name != 'supplement_imgs' && name != 'supplement_img_ids' && name !='auto_loc_img_ids') {
				  this.formItem.appraisal_img_ids.push(id)
				  data['extname'] = data['ext']
				  data['url'] = data['url'].replaceAll("\\","/")
				  this.img_details.survey_gallery_imgs_details.push(data)
				}
				
				// 每成功加载，上传成功加1					
				title:'正在上传图片 '+ (this.uploadImgTotal-this.uploadImgOKQueue.length)+'/'+this.uploadImgTotal	
				
				if( this.uploadImgOKQueue.length <= 0 )
				{						
				   this.uploadImgTotal = 0;
					uni.hideLoading();
					toast("图片全部上传完毕！")
				}else{				
					console.log( 'on load no complitete',this.uploadImgOKQueue,this.uploadImgTotal)
					uni.showLoading({
						title:'正在上传图片 '+ (this.uploadImgTotal-this.uploadImgOKQueue.length)+'/'+this.uploadImgTotal
					})
				}						
				
				// 进行下一幅图的上传(因为多图上传会产生 timeout )
				if( 0 < this.uploadImgOKQueue.length )
				{
					let next = this.uploadImgOKQueue.pop();
					this.UploadImageNext( next.path , next.name ,this.onUploadOKCallBack, this.onUploadFaildCallback )
				}			
			},			
			
			// 当上传图片错误的回调
			onUploadFaildCallback( err )
			{
				uni.hideLoading();
				uni.showToast({ title: err, icon: 'error' })
				window.console.log(err)						
			},
			
			// 上传图片（下一张）
			UploadImageNext( path , name  , callback , faildCallback  )
			{
				uploadImg({filePath: path}).then(response => {
									callback( response , name )
								}).catch((err) => {
									faildCallback(err)					
								});		
			},
			
			// 删除图片
			handleDelete(e) { 
				
				this.uploadImgDelQueue.push({name:e.tempFile.name})
			    const num = this.filePathsList.findIndex(v => v.url === e.tempFilePath);
			    this.filePathsList.splice(num, 1);
				this.deletUploaFileFromQueue( e.tempFilePath );				
				
				if( this.uploadImgOKQueue.length > 0)
				{					
					uni.showLoading({
						title:'正在上传图片 '+ (this.uploadImgTotal-this.uploadImgOKQueue.length)+'/'+this.uploadImgTotal
					})
				}
				else{
					uni.hideLoading();
				}
			},
			
			// 获取上传进度
			progress(e){
				console.log('上传进度：',e)
			},
			
			// 上传成功
			success(e){
				console.log('上传成功')
			},
			
			// 上传失败
			fail(e){
				console.log('上传失败：',e)
			},
			onNavigationBarButtonTap(e) {
			  var index = e.index;
			  this.showPopMenu = !this.showPopMenu
			  this.$refs.popup.open('top')
			},
			
			submitSurvey() {
				console.log( "submitSurvey", this.formItem )
				uni.hideLoading();
				
				 if (!this.checkRule()) {
				        return
				      }
				let vm = this;
				this.formItem.unit_type = `${this.typeObj.house}-${this.typeObj.hall}-${this.typeObj.toilet}-${this.typeObj.balcony}`
				this.areaArray.forEach((item)=>{
					if(item.value == vm.formItem.area_id) {
						vm.formItem.area = item.text
					}
				})
				
				if( this.uploadImgOKQueue.length > 0)
				{
					toast("已提交，但图片未上传完整!!!")
				}
				
				surveySubmit(this.formItem).then(res=>{
					if (res.code === 1) {
					    this.$tab.navigateTo('/pages/survey/index')
					}else if (res.code === -1) {
						this.$modal.msgError(res.msg)
					}
				})
			},
			surveyOptions() {
				surveyOptions().then(res => {
					if (res.code === 1) {
						let data = res.data.residence
						this.residence_towards = this.adapter(data.residence_towards._child)
						this.residence_parking_garage = this.adapter(data.residence_parking_garage._child)
						this.residence_parking_garage_status = this.adapter(data.residence_parking_garage_status
							._child)
						this.residence_practical_application = this.adapter(data.residence_practical_application
							._child)
						this.residence_decoration_grade = this.adapter(data.residence_decoration_grade._child)
						this.residence_new_rate = this.adapter(data.residence_new_rate._child)
						this.residence_outdoor_scene = this.adapter(data.residence_outdoor_scene._child)
						this.residence_doorplate = this.adapter(data.residence_doorplate._child)
						this.residence_living_room_inside_wall = this.adapter(data
							.residence_living_room_inside_wall._child)
						this.residence_living_room_ceiling = this.adapter(data.residence_living_room_ceiling
							._child)
						this.residence_living_room_ground = this.adapter(data.residence_living_room_ground._child)
						this.residence_balcony = this.adapter(data.residence_balcony._child)
						this.residence_bedroom_inside_wall = this.adapter(data.residence_bedroom_inside_wall
							._child)
						this.residence_kitchen_ceiling = this.adapter(data.residence_kitchen_ceiling._child)
						this.residence_bedroom_ceiling = this.adapter(data.residence_bedroom_ceiling._child)
						this.residence_bedroom_ground = this.adapter(data.residence_bedroom_ground._child)
						this.residence_special_remarks = this.adapter(data.residence_special_remarks._child)
						this.residence_kitchen_wall = this.adapter(data.residence_kitchen_wall._child)
						this.residence_kitchen_ground = this.adapter(data.residence_kitchen_ground._child)
						this.residence_kitchen_equipment = this.adapter(data.residence_kitchen_equipment._child)
						this.residence_bathroom_ceiling = this.adapter(data.residence_bathroom_ceiling._child)
						this.residence_bathroom_wall = this.adapter(data.residence_bathroom_wall._child)
						this.residence_bathroom_ground = this.adapter(data.residence_bathroom_ground._child)
						this.residence_bathroom_sanitary = this.adapter(data.residence_bathroom_sanitary._child)
						this.residence_facility_hydropower = this.adapter(data.residence_facility_hydropower
							._child)
						this.residence_facility_communication = this.adapter(data.residence_facility_communication
							._child)
						this.residence_other = this.adapter(data.residence_other._child)
					}
				})
			},
			adapter(data) {
				if (Array.isArray(data) && data.length !== 0) {
					data.forEach((item) => {
						item.value = item.code
						item.text = item.name
					})
				}
				return data
			},
			transArea(areaObj) {
				let areaArray = []
				for (let key in areaObj) {
					
					areaArray.push({
						"value": key,
						"text": areaObj[key]
					})
				}
				return areaArray
			},
			surveyDetail() {
				let data = {
					order_no: this.route.order_no,
					id: this.route.id
				}
				surveyDetail(data).then(res => {
					if (res.code === 1) {
						const data = res.data
						this.basicInfo = data.inquiry
						this.areaArray = this.transArea(data.area)

					} else if (res.code == -1) {
						this.$modal.msgError(res.msg)
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f8f8f8;
	}
    .eva-label {
		margin-right: 20px;
		width: 170rpx;
	}
	.uni-common-mt {
		margin-top: 30px;
	}

	.uni-padding-wrap {
		// width: 750rpx;
		padding: 0px 30px;
	}

	.survey-detail-container {
		margin-bottom: 100rpx;
		padding: 20rpx;
	}

	.btnSurvey {
		color: #ff6a00;
	}

	.line {
		width: 100%;
		height: 5rpx;
		background-color: #E6E6E6;
	}

	.line2 {
		width: 100%;
		height: 20rpx;
		background-color: #F5F5F5;
	}

	.desc {
		width: 70%;
		//background-color: #bb11ff;
	}

	.slot-box-col {
		display: flex;
		flex-direction: column;
	}
	.slot-box {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items:center;
		flex-wrap: wrap;
		//width: 80%;
	}

	.tag-view {
		margin-right: 10px;
		margin-bottom: 10px;
	}

	.uni-list {
		flex: 1;
	}

	.uni-list-item {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex: 1;
		flex-direction: row;
		background-color: #FFFFFF;
	}


	.uni-list-item__container {
		padding: 12px 15px;
		width: 100%;
		flex: 1;
		position: relative;
		/* #ifndef APP-NVUE */
		display: flex;
		box-sizing: border-box;
		/* #endif */
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		border-bottom-style: solid;
		border-bottom-width: 1px;
		border-bottom-color: #eee;
	}

	.uni-list-item__content-title {
		font-size: 14px;
	}

	.uni-input {
		height: 28px;
		line-height: 28px;
		font-size: 15px;
		padding: 0px;
		flex: 1;
		width: 280rpx;		
		background-color: #FFFFFF;
		text-align: center;
	}
	
	.require {
		color: RED;
	}

	// .flex-item {
	// 	width: 33.3%;
	// 	height: 30rpx;
	// 	text-align: center;
	// 	line-height: 200rpx;
	// }
</style>
