| 
					
				 | 
			
			
				@@ -1,218 +1,494 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   <div class="home"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="title"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="logo"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <img src="../../assets/image/title.png" alt=""> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="yyInfo" @click="$router.push('/subscribe-info')">预约信息</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="sh">第20届上海国际社会</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="gg">公共安全展览会</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="ggEl">The 20th Shanghai CPSE Expo</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="blh">暨上海国际警用及安防无人系统博览会</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="yqh">邀请函</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="yqhEl">INVITATION</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="ghgl">永天科技诚挚地恭候您的光临!</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <van-divider dashed class="yyfs"><span>预约方式</span></van-divider> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="yyfsEl">the appointment mode</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="formBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <van-form @submit="onSubmit" validate-trigger="onSubmit" :submit-on-enter="false" ref="formT"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field v-model="form.name" name="姓名" label="姓名*" type="text" placeholder="请输入你的姓名" :rules="[{ required:true, pattern: /^.{1,10}$/, message: '请输入姓名,不得超过10字' }]"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <span class="infoT">*请留真实信息,以便商务验证和联系您</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field v-model="form.phone" name="手机*" label="手机" type="tel" placeholder="请输入你的手机号" :rules="[{ required:true, pattern: /^1[345678]\d{9}$/, message: '请输入正确的手机号' }]"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field v-model="form.smsCode" name="验证码*" label="验证码" type="tel" placeholder="请输入验证码" :rules="[{ required:true, pattern: /^\d{6}$/, message: '请输入正确的验证码' }]"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <template #button>  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            <van-loading v-if="smsCodeLoading"  color="#1989fa" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            <span class="hqyzm" v-else @click="getsmsCode">{{showsmsCode?'获取验证码':timesmsCode + 's'}}</span>  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        </van-field> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field v-model="form.companyName" name="单位名称*" label="单位名称" type="text" placeholder="请输入单位名称" :rules="[{ required:true, pattern: /^.{0,50}$/, message: '内容不得超过50字' }]"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field v-model="form.post" name="职务" label="职务" type="text" placeholder="请输入单位职务" :rules="[{ required:false, pattern: /^.{0,30}$/, message: '内容不得超过30字' }]"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field readonly clickable label="省份" :value="form.sf" placeholder="选择省份" @click="showPicker = true"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-popup v-model="showPicker" round position="bottom"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <van-picker show-toolbar :columns="columns" @cancel="showPicker = false" @confirm="onConfirm" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        </van-popup> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field readonly clickable name="dateOfVisit" :value="form.dateOfVisit" label="到访日期" placeholder="点击选择到访日期" @click="showTimePicker = true" :rules="[{ required:true, message: '请选择到访日期' }]"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-popup v-model="showTimePicker" position="bottom"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <van-datetime-picker type="datetime" @confirm="onConfirmTime" @cancel="showTimePicker = false" :min-date="minDate" :max-date="maxDate" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        </van-popup> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-field readonly clickable label="随行人数" :value="form.accompanys" placeholder="选择随行人数" validate-trigger="onSubmit" @click="showacCompany = true"/> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-popup v-model="showacCompany" round position="bottom"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <van-picker show-toolbar :columns="columns2" @cancel="showacCompany = false" @confirm="onConfirmCompany" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        </van-popup> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div style="margin: 16px;"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <van-button  plain round block type="info" native-type="submit">立即预约</van-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <div class="headerBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <div class="headerLeft"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div>{{ dateDay }}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="time">{{ dataTime }}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="week">{{ timeWeek }}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="address">{{$store.state.weaterRes.aqiDetail.area}}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="weather"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <img :src="$store.state.weaterRes.weather_pic || ''" alt="" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          {{ $store.state.weaterRes.weather || "" }} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          {{ $store.state.weaterRes.temperature || "" }}℃ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      </van-form> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <van-divider dashed class="yyfs" style="margin-top:50px;"><span>活动信息</span></van-divider> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="yyfsEl">the Activity information</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="hdxxInfo"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="hdxxInfoLable"><span></span>时间:2021.8.11-8.13</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="hdxxInfoLable"><span></span>上海·世博馆<i class="boldColor">1</i> 号馆 展位号<i class="boldColor">E10</i></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="hdxxInfoLable"><span></span>上海浦东新区国展路1099号</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div class="bottomBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="bottomBoxL"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div class="title1">入场须知:</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div class="title2">* 预约成功后将通过手机短信及电话回访的方式确认,请保持通话顺畅</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div class="title3">* 如有疑问请咨询 :<br/> 电话:021-65376655<br/> 邮箱:yujia.chi@chinausky.com</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="bottomBoxR"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div class="bottomBoxRT">FOLLOW US<br> <span>关注我们获取更多咨询</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <img src="../../assets/image/ewm.png" alt=""> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <div class="headerCenter"></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <div class="headerRight"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="boxBgRight"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <img src="../../assets/image/headerIcon.png" alt="" />巡检维保 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div>当前待处理:5</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <van-overlay :show="showSuccessBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      <div class="successBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div class="iconSuccess"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <img src="../../assets/image/icon.png" alt="">预约成功! 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <div class="contentBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <div class="mapBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="Amap" id="mapF"></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div class="rightIconBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div @click="isTypeMap('isNormal')"><img src="../../assets/image/zcIcon.png" alt="" />正常</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <span></span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div @click="isTypeMap('isWarning')"><img src="../../assets/image/jcIcon.png" alt="" />告警</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <span></span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div @click="isTypeMap('isLine')"><img src="../../assets/image/lxIcon.png" alt="" />离线</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <div class="tzxx">我们会在24小时内联系您, 请保持手机通畅。</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <van-button plain round type="info" @click="showSuccessBoxC">知道了</van-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    </van-overlay> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      <div class="echartsBox"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="titleBox">整体情况</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="echartsBoxList box1"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <div class="box1Left"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <img src="../../assets/image/jg.png" alt="" /> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <span>井盖总数(100)</span> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <div class="box1Right"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div>井盖在线数:<span class="green">90</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div>在线率:<span class="green">90%</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div>离线告警数:<span class="yellow">5</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div>离线率:<span class="yellow">5%</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div>异常告警数:<span class="red">5</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <div>告警率:<span class="red">5%</span></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="titleBox">近7日告警情况统计</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="echartsBoxList"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <div ref="echartD1" class="echartD"></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="titleBox">近7日液位情况统计</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="echartsBoxList"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <div ref="echartD2" class="echartD"></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="titleBox">告警列表</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <el-table 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            :data="tableData" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            style="width: 100%" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            height="calc(100% - 38px)" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            header-row-class-name="tableHeaderClass" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            row-class-name="rowCalss" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            fit 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            :highlight-current-row="false" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="name" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="设备编号" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="dpName" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="告警类型" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="jf" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="负责人" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="zl" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="联系方式" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="je" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="位置" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="time" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="告警时间" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <el-table-column 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              prop="time" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              label="处理状态" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              :min-width="20" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              show-overflow-tooltip 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <template #default="scope"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <el-tag 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  :type="scope.$index > 2 ? 'success' : 'danger'" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  disable-transitions 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  >{{ scope.$index > 2 ? "已处理" : "未处理" }}</el-tag 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </el-table-column> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </el-table> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 // @ is an alias to /src 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-import { Notify } from 'vant'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+// import { Notify } from 'vant'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import * as echarts from "echarts"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import getDataE1 from "./echarts1"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import getDataE2 from "./echarts2"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import AMap from "AMap"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import xh from "../../assets/image/xh.png"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import dc from "../../assets/image/dc.png"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import zcIcon from "../../assets/image/zcIcon.png"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import jcIcon from "../../assets/image/jcIcon.png"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import lxIcon from "../../assets/image/lxIcon.png"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   data() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      form:{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        name: '',//客户姓名 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        phone: '',//手机号 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        smsCode: '',//短信验证码 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        companyName: '',//单位名称 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        post: '',//职位 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        sf: '',//省份 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        dateOfVisit: '',//到访日期 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        accompany: '',//随行人数 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        remark: '',//备注 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        userId: '',//接待人ID 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        userName: '',//接待人姓名 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      minDate: new Date(2021, 7, 11 , 0,0,0), 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      maxDate: new Date(2021, 7, 13 , 23,59,59), 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      showTimePicker: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      showacCompany: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      showPicker: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      showsmsCode:true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      timesmsCode:60, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      showSuccessBox:false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      smsCodeLoading:false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      smsCodeInter:null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      columns: [ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "北京市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "天津市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "河北省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "山西省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "内蒙古自治区", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "辽宁省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "吉林省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "黑龙江省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "上海市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "江苏省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "浙江省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "安徽省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "福建省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "江西省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "山东省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "河南省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "湖北省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "湖南省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "广东省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "广西省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "海南省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "重庆市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "四川省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "贵州省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "云南省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "西藏自治区", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "陕西省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "甘肃省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "青海省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "宁夏回族自治区", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "新疆维吾尔自治区", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "台湾省", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "香港特别行政区", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        "澳门特别行政区", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      dateDay: "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      dataTime: "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      timeArea: "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      timeWeek: "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      weatherObj: {}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      map: null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      echartsBox1: null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      echartsBox2: null, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      dataWeekList: ["一", "二", "三", "四", "五", "六", "七"], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      tableData: [ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0021", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "液位过高", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:23:26", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0022", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "运行异常", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:22:00", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0023", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "液位过高", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:21:00", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0024", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "运行异常", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:20:00", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0025", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "液位过高", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:19:00", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0026", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "运行异常", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:18:00", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          name: "0027", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          dpName: "运行异常", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          jf: "周文斌", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zl: "13571202367", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          je: "江西省上饶市", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          time: "15:17:00", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       ], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      columns2: ['1-3人', '3-7人', '7人以上'], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      infoForm:{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				- 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      lnglats: [ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { x: 118.004933, y: 28.47108, type: 1 }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { x: 118.004205, y: 28.470654, type: 2 }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        { x: 118.005709, y: 28.471602, type: 3 }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      ], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      mapListType:{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        isNormal: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        isWarning: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        isLine: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      overlayGroupMap:[] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // components: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  // }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  methods:{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    showSuccessBoxC(){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.$router.push({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        path:'/subscribe-info', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        query:{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          ...this.form 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.showSuccessBox = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      for (const key in this.form) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.form[key] = ""; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.$refs.formT.resetValidation() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  watch: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    "$store.state.windowWidth"() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      echarts.init(this.$refs.echartD1).resize(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      echarts.init(this.$refs.echartD2).resize(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    async onSubmit(values) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      console.log('submit', values); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      let res = await this.$axios.post('/AF/addRegister' + '?' +this.$qs.stringify({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        ...this.form 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      })) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      if(res.data.success){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.showSuccessBox = true; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.infoForm = res.data.data 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  created() {}, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  mounted() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    this.getData(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    this.initMap(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    setInterval(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let day = new Date(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.dateDay = 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        day.getFullYear() + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        "-" + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        (day.getMonth() + 1 < 10 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          ? "0" + (day.getMonth() + 1) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          : "" + (day.getMonth() + 1)) + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        "-" + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        (day.getDate() < 10 ? "0" + day.getDate() : day.getDate()); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.timeWeek = " 星期" + this.dataWeekList[day.getDay()]; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.dataTime = 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        (day.getHours() < 10 ? "0" + day.getHours() : day.getHours()) + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        ":" + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        (day.getMinutes() < 10 ? "0" + day.getMinutes() : day.getMinutes()) + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        ":" + 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        (day.getSeconds() < 10 ? "0" + day.getSeconds() : day.getSeconds()); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 1000); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  methods: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    isTypeMap(val){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      console.log(val) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.mapListType[val] = !this.mapListType[val] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let type = val === "isNormal" ? 1 : val === "isWarning" ? 2 : 3; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let markers = this.lnglats.filter(val=>val.type === type) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let marksList = this.overlayGroupMap.getOverlays().filter(element => element.getExtData().type === type); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if(this.mapListType[val]){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.overlayGroupMap.addOverlays(this.addMarker(markers)); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.overlayGroupMap.removeOverlays(marksList); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    async getsmsCode(){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      if(!this.form.phone || !/^1[345678]\d{9}$/.test(this.form.phone)) return  Notify({ type: 'primary', message: '请输入正确的手机号' }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.smsCodeLoading = true 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      let res = await this.$axios.get('/AF/msgTest' + '?' + this.$qs.stringify({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        phone:this.form.phone 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      })) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      if(res.data.success){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        Notify({ type: 'success', message: '验证码已发送' }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.showsmsCode = !this.showsmsCode 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.smsCodeInter = setInterval(()=>{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          --this.timesmsCode 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          if(this.timesmsCode <= 0 ){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-             clearInterval(this.smsCodeInter) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-             this.showsmsCode = !this.showsmsCode 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        },1000) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } else{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        Notify({ type: 'primary', message: res.message }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.smsCodeLoading = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    async getData() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.echartsBox1 = echarts.init(this.$refs.echartD1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.echartsBox1.setOption(getDataE1()); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.echartsBox2 = echarts.init(this.$refs.echartD2); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.echartsBox2.setOption(getDataE2()); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    onConfirm(value) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.showPicker = false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.form.sf = value 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    async initMap() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.map = await new AMap.Map("mapF", { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        mapStyle: "amap://styles/d0ddc09bd7cbd7331a8e8fa691e5b0da", //设置地图的显示样式 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        resizeEnable: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        zoom: 13, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        zooms: [3, 18], 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        // features: [] //清空背景道路等 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      AMap.plugin(["AMap.Geolocation"], () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        var geolocation = new AMap.Geolocation({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          showButton: true, //是否显示定位按钮 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          buttonPosition: "RT", //定位按钮的位置 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          /* LT LB RT RB */ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          buttonOffset: new AMap.Pixel(10, 20), //定位按钮距离对应角落的距离 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zoomToAccuracy: false, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          showMarker: true, //是否显示定位点 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          markerOptions: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            //自定义定位点样式,同Marker的Options 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            offset: new AMap.Pixel(-18, -36), 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            content: 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              '<img src="https://a.amap.com/jsapi_demos/static/resource/img/user.png" style="width:36px;height:36px"/>', 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          showCircle: true, //是否显示定位精度圈 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          circleOptions: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            //定位精度圈的样式 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            strokeColor: "#0093FF", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            noSelect: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            strokeOpacity: 0.5, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            strokeWeight: 1, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            fillColor: "#02B0FF", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            fillOpacity: 0.25, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.map.addControl(geolocation); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.overlayGroupMap = new AMap.OverlayGroup(this.addMarker()) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.map.add(this.overlayGroupMap); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.map.setFitView(); // 根据所有点自适应 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    onConfirmCompany(value,ind) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.showacCompany = false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.form.accompanys = value 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.form.accompany = ind === 1 ? 0 : ind + 1 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    addMarker(lnglats = this.lnglats, type) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // 创建标点和点击事件 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let icon = ""; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      return lnglats.map((val, ind) => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        if (type !== "water") { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          icon = 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            val.type == 1 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              ? zcIcon 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              : val.type == 2 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              ? jcIcon 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              : val.type == 3 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              ? lxIcon 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              : zcIcon; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        console.log(icon); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let marker = new AMap.Marker({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          position: new AMap.LngLat(val.x, val.y), 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          icon: icon || "", 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          zIndex: 9, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          extData: { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            id: ind + 1, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            type:val.type 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        marker.on("click", async () => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          await this.addMarkerInfo([val.x, val.y], val); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        return marker; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    onConfirmTime(value) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.showTimePicker = false; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.form.dateOfVisit = new Date(value).Format("yyyy-MM-dd hh:mm:ss") 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // 添加标点 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    addMarkerInfo(position, value) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // this.map.getIsOpen(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.map.clearInfoWindow(); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      var infoWindow = new AMap.InfoWindow({ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        isCustom: true, //使用自定义窗体 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        closeWhenClickMap: true, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        content: ` 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                <div class="mapTab"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class="closeInfo ${value.type === 1  ? 'green' : value.type === 2  ? 'red' : 'gray'}">${value.type === 1  ? '正常' : value.type === 2  ? '告警' : '离线'}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class="tableTitle"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <img src="${xh}" alt=""> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <img src="${dc}" alt=""> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div>98%</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div>3.6V</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div>     
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class="tableContent"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div class="yztBox ${value.type === 2  ? 'waning' : 'gray'}""> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div class="${value.type === 1  ? 'green' : value.type === 2  ? 'white' : 'gray'}">${value.type === 1  ? '正常' : value.type === 2  ? '水位过高' : '---'}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                      <div>实时水况</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div><span>运行状态:</span><b class="${value.type === 1  ? 'green' : value.type === 2  ? 'red' : 'gray'}">${value.type === 1  ? '运行正常' : value.type === 2  ? '井盖打开' : '设备离线'}</b></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div><span>实时水位:</span>${value.type === 1  ? '1米' : value.type === 2  ? '10米' : '---'}</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div><span>负责人:</span>张三</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div><span>联系电话:</span>13666666666</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div><span>时间:</span>2021-08-19 15:12:12</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                    <div><span>位置:</span>上海市青浦区徐乐路208号</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                  <div class="sbh">设备号:868646515</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+                </div>`, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        offset: new AMap.Pixel(0, -30), 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      infoWindow.open(this.map, position); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+}; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </script> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <style lang="scss" scoped> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-@import  './index'; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+@import "./index"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </style> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+<style lang="scss"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+.mapTab { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  width: 300px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  height: 265px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  background: url("../../assets/image/mapBox.png"); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  background-size: 100% 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  padding: 10px 15px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  color: #fff; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .sbh { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    bottom: 9px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    left: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    right: 0; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    margin: auto; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    text-align: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: bold; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-size: 14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .closeInfo { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    right: 13px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    top: 5px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-size: 16px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: 700; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .tableTitle { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    padding: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-size: 12px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: 400; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    text-align: left; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    img, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    div { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      margin-right: 10px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    img { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .tableContent { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    width: 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    height: 150px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    line-height: 27px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: 400; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    text-align: left; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-size: 14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    text-shadow: 2px 2px 0px 0px #004f8c; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    padding-top: 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    box-sizing: border-box; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    position: relative; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    div { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: block; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      span { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        width: 80px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        display: inline-block; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        text-align: right; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      b { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        font-weight: normal; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .yztBox { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      position: absolute; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      right: 17px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      top: 20px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      width: 68px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      height: 104px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: url("../../assets/image/yzt.png"); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background-size: 100% 100%; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      flex-direction: column; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      justify-content: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      div { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        font-size: 14px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        text-align: left; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        line-height: 27px; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    .waning{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      background: url("../../assets/image/yc.png"); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .green { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #01ff19; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: bold; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .red { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: rgba(255, 1, 1, 1); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: bold; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .white{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #FFF; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: bold; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  .gray { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    color: #ccc; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    font-weight: bold; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+  } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+</style> 
			 |