事件详情地图

src/views/dialog.vue

@@ -1,211 +1,219 @@
 <template>
-	<div class="visual-con">
-		<!--头部-->
-		<vheader></vheader>
-		<!--主体-->
-		<div class="visual-body">
-			<button @click="showEventDialog"
-				style="position: absolute; left:50%;top: 50vh; transform: translateX(-50%);">触发事件详情</button>
-			<!-- 弹层 -->
-			<el-dialog title="事件详情" :visible.sync="eventDialog" v-if="eventDialog" width="90%"
-				@close="cancelEventShow()">
-				<div class="dia-event-info">
-					<el-row>
-						<!-- 左侧 -->
-						<el-col :span="18" class="dia-left">
-							<!-- 应急预案 -->
-							<div class="dia-left-top">
-								<div class="dia-left-top-tit">应急预案</div>
-								<div class="dia-left-top-carousel">
-									<el-carousel height="30px" direction="vertical" :interval="2000">
-										<el-carousel-item v-for="item in 3" :key="item">
-											<a href="#">这是一条应急预案</a>
-										</el-carousel-item>
-									</el-carousel>
-								</div>
-							</div>
-							<!-- 应急预案end -->
-							<!-- 左侧资源 -->
-							<div class="leftbar w-10 top-2">
-								<div class="forthis">
-									<dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']">
-										<div class="i-list-con h-51">
-											<div class="d-l-con-icon">
-												<div class="icon-con" v-for="(item,index) in resourcesList">
-													<div class="iconfont icon icon-normal" :class="item.icon"></div>
-													<div class="icon-text">
-														<h6>{{item.count}}</h6>
-														<h5>{{item.resourceName}}</h5>
-													</div>
-												</div>
-											</div>
-										</div>
-									</dv-border-box-7>
-								</div>
-							</div>
-							<!-- 左侧资源end -->
-							<!-- 底部工具栏 -->
-							<div class="dia-left-btm-tool">
+  <div class="visual-con">
+    <!--头部-->
+    <vheader></vheader>
+    <!--主体-->
+    <div class="visual-body">
+      <button @click="showEventDialog"
+              style="position: absolute; left:50%;top: 50vh; transform: translateX(-50%);">触发事件详情
+      </button>
+      <!-- 弹层 -->
+      <el-dialog title="事件详情" :visible.sync="eventDialog" v-if="eventDialog" width="90%"
+                 @close="cancelEventShow()">
+        <div class="dia-event-info">
+          <el-row>
+            <!-- 左侧 -->
+            <el-col :span="18" class="dia-left">
+              <!-- 应急预案 -->
+              <div class="dia-left-top">
+                <div class="dia-left-top-tit">应急预案</div>
+                <div class="dia-left-top-carousel">
+                  <el-carousel height="30px" direction="vertical" :interval="2000">
+                    <el-carousel-item v-for="item in 3" :key="item">
+                      <a href="#">这是一条应急预案</a>
+                    </el-carousel-item>
+                  </el-carousel>
+                </div>
+              </div>
+              <!-- 应急预案end -->
+              <!-- 左侧资源 -->
+              <div class="leftbar w-10 top-2">
+                <div class="forthis">
+                  <dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']">
+                    <div class="i-list-con h-51">
+                      <div class="d-l-con-icon">
+                        <div class="icon-con" v-for="(item,index) in resourcesList">
+                          <div class="iconfont icon icon-normal" :class="item.icon"></div>
+                          <div class="icon-text">
+                            <h6>{{ item.count }}</h6>
+                            <h5>{{ item.resourceName }}</h5>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </dv-border-box-7>
+                </div>
+              </div>
+              <!-- 左侧资源end -->
+              <!-- 底部工具栏 -->
+              <div class="dia-left-btm-tool">
 
-							</div>
-							<!-- 底部工具栏end -->
-						</el-col>
-						<!-- 左侧end -->
-						<!-- 右侧 -->
-						<el-col :span="6" class="dia-right">
+              </div>
+              <!-- 底部工具栏end -->
+            </el-col>
+            <!-- 左侧end -->
+            <!-- 地图 -->
+            <supermapDialog ref="supermapDialog" :dynamicPlotting="true"
+                            style="width:100% ;height: 75vh;" :mapDiv="'forestWarmSuperMap'"
+                            :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" @preview="preview"
+                            :isSideBySide="false"></supermapDialog>
+            <!-- 右侧 -->
+            <el-col :span="6" class="dia-right">
+              <div class="e-right">
+                <div class="forthis">
+                  <dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']"
+                                   style="padding-bottom:1rem ;">
+                    <div class="i-list-con">
+                      <div class="this-con h-45">
+                        <div class="z-info-list" style="margin-top: 0;">
+                          <el-timeline>
+                            <el-timeline-item color="#2bacf7" timestamp="2018/4/12"
+                                              placement="top" v-for="(item,index) in 5">
+                              <el-card>
+                                <div class="z-info-list-con">
+                                  <div class="user-and-time flex-d">
+                                    <span>中心管理员</span><span><i
+                                    class="el-icon-location"></i> 定位</span>
+                                  </div>
+                                  <div class="z-info">
+                                    <div class="this-con-list-info">
+                                      请处理单位及时处理
+                                    </div>
+                                    <div>
+                                      <el-image :src="url"
+                                                :preview-src-list="srcList"
+                                                style="width:3rem; height:3rem;margin: 2px;"
+                                                v-for="(item,index) in 10">
+                                      </el-image>
+                                    </div>
+                                  </div>
+                                </div>
+                              </el-card>
+                            </el-timeline-item>
+                          </el-timeline>
+                        </div>
+                      </div>
+                    </div>
+                  </dv-border-box-7>
+                </div>
+                <div class="forthis">
+                  <dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']">
+                    <div class="i-list-con">
+                      <div class="this-con h-25 no-padding">
+                        <div class="z-info-list" style="margin-top: 0;">
+                          <div class="z-info-btm-grp">
+                            <div class="z-info-btm-grp-top">
+                              <div class="z-info-btm-grp-left">
+                                <el-button size="small" icon="el-icon-s-flag">责任制
+                                </el-button>
+                                <el-button size="small" icon="el-icon-upload">上传
+                                </el-button>
+                                <el-button size="small" icon="el-icon-download">保存
+                                </el-button>
+                              </div>
+                              <div class="z-info-btm-grp-right">
+                                <el-button size="small" icon="el-icon-mic">会议
+                                </el-button>
+                              </div>
+                            </div>
+                            <div class="z-info-btm-input">
+                              <el-input type="textarea" v-model="feedback"
+                                        :autosize="{ minRows: 7, maxRows: 7}" placeholder="请输入反馈信息">
+                              </el-input>
+                              <div class="z-info-btm-input-btn">
+                                <el-button size="small" icon="el-icon-chat-dot-square">发送
+                                </el-button>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </dv-border-box-7>
+                </div>
+              </div>
 
-							<div class="e-right">
-								<div class="forthis">
-									<dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']" style="padding-bottom:1rem ;">
-										<div class="i-list-con">
-											<div class="this-con h-45">
-												<div class="z-info-list" style="margin-top: 0;">
-													<el-timeline>
-														<el-timeline-item color="#2bacf7" timestamp="2018/4/12"
-															placement="top" v-for="(item,index) in 5">
-															<el-card>
-																<div class="z-info-list-con">
-																	<div class="user-and-time flex-d">
-																		<span>中心管理员</span><span><i
-																				class="el-icon-location"></i> 定位</span>
-																	</div>
-																	<div class="z-info">
-																		<div class="this-con-list-info">
-																			请处理单位及时处理
-																		</div>
-																		<div>
-																			<el-image :src="url"
-																				:preview-src-list="srcList"
-																				style="width:3rem; height:3rem;margin: 2px;"
-																				v-for="(item,index) in 10">
-																			</el-image>
-																		</div>
-																	</div>
-																</div>
-															</el-card>
-														</el-timeline-item>
-													</el-timeline>
-												</div>
-											</div>
-										</div>
-									</dv-border-box-7>
-								</div>
-								<div class="forthis">
-									<dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']">
-										<div class="i-list-con">
-											<div class="this-con h-25 no-padding">
-												<div class="z-info-list" style="margin-top: 0;">
-													<div class="z-info-btm-grp">
-														<div class="z-info-btm-grp-top">
-															<div class="z-info-btm-grp-left">
-																<el-button size="small" icon="el-icon-s-flag">责任制
-																</el-button>
-																<el-button size="small" icon="el-icon-upload">上传
-																</el-button>
-																<el-button size="small" icon="el-icon-download">保存
-																</el-button>
-															</div>
-															<div class="z-info-btm-grp-right">
-																<el-button size="small" icon="el-icon-mic">会议
-																</el-button>
-															</div>
-														</div>
-														<div class="z-info-btm-input">
-															<el-input type="textarea" v-model="feedback"
-																:autosize="{ minRows: 7, maxRows: 7}" placeholder="请输入反馈信息">
-															</el-input>
-															<div class="z-info-btm-input-btn">
-																<el-button size="small" icon="el-icon-chat-dot-square">发送
-																</el-button>
-															</div>
-														</div>
-													</div>
-												</div>
-											</div>
-										</div>
-									</dv-border-box-7>
-								</div>
-							</div>
-
-						</el-col>
-						<!-- 左侧end -->
-					</el-row>
-				</div>
-			</el-dialog>
-		</div>
-		<vBottomMenu ref="bottomMenu"></vBottomMenu>
-	</div>
+            </el-col>
+            <!-- 左侧end -->
+          </el-row>
+        </div>
+      </el-dialog>
+    </div>
+    <vBottomMenu ref="bottomMenu"></vBottomMenu>
+  </div>
 </template>
 
 <script>
-	import vheader from '@/components/v-header.vue' //一体化共用头部
-	import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
-	export default {
-		components: {
-			vheader,
-			vBottomMenu,
-		},
-		data() {
-			return {
-				eventDialog: false,
-				resourcesList: [{
-						resourceName: '取水口',
-						count: '1',
-						icon: 'sj-icon-waterintake'
-					},
-					{
-						resourceName: '水鹤',
-						count: '1',
-						icon: 'sj-icon-watercrane'
-					},
-					{
-						resourceName: '消防栓',
-						count: '1',
-						icon: 'sj-icon-firehydrant'
-					},
-					{
-						resourceName: '起降点',
-						count: '1',
-						icon: 'sj-icon-landing'
-					},
-					{
-						resourceName: '检查站',
-						count: '1',
-						icon: 'sj-icon-checkpoint'
-					},
-					{
-						resourceName: '防火队',
-						count: '1',
-						icon: 'sj-icon-fireteam'
-					},
-					{
-						resourceName: '重点区域',
-						count: '1',
-						icon: 'sj-icon-tcqh'
-					},
-					{
-						resourceName: '摄像头',
-						count: '1',
-						icon: 'sj-icon-jkzx'
-					}
-				],
-				//图片虚拟
-				url: require('@/assets/images/visual/img-sample.png'),
-				srcList: [
-					require('@/assets/images/visual/img-sample.png'),
-					require('@/assets/images/visual/img-sample2.png'),
-				],
-				//文本域
-				feedback: '',
+import supermapDialog from '@/components/supermap' //超图
+import vheader from '@/components/v-header.vue' //一体化共用头部
+import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
+export default {
+  components: {
+    vheader,
+    vBottomMenu,
+    supermapDialog
+  },
+  data() {
+    return {
+      eventDialog: false,
+      resourcesList: [{
+        resourceName: '取水口',
+        count: '1',
+        icon: 'sj-icon-waterintake'
+      },
+        {
+          resourceName: '水鹤',
+          count: '1',
+          icon: 'sj-icon-watercrane'
+        },
+        {
+          resourceName: '消防栓',
+          count: '1',
+          icon: 'sj-icon-firehydrant'
+        },
+        {
+          resourceName: '起降点',
+          count: '1',
+          icon: 'sj-icon-landing'
+        },
+        {
+          resourceName: '检查站',
+          count: '1',
+          icon: 'sj-icon-checkpoint'
+        },
+        {
+          resourceName: '防火队',
+          count: '1',
+          icon: 'sj-icon-fireteam'
+        },
+        {
+          resourceName: '重点区域',
+          count: '1',
+          icon: 'sj-icon-tcqh'
+        },
+        {
+          resourceName: '摄像头',
+          count: '1',
+          icon: 'sj-icon-jkzx'
+        }
+      ],
+      //图片虚拟
+      url: require('@/assets/images/visual/img-sample.png'),
+      srcList: [
+        require('@/assets/images/visual/img-sample.png'),
+        require('@/assets/images/visual/img-sample2.png')
+      ],
+      //文本域
+      feedback: ''
 
-			}
-		},
-		methods: {
-			showEventDialog() {
-				this.eventDialog = true
-			}
-		}
-	}
+    }
+  },
+  methods: {
+    showEventDialog() {
+      this.eventDialog = true
+    }
+  }
+}
 </script>
 
 <style>

src/views/forest.vue

@@ -100,7 +100,7 @@
 				</div>
 			</div>
 			<!-- 地图 -->
-      <supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'forestMap'" :dynamicPlotting="true"
+      <supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'forestMap'" :dynamicPlotting="false"
                 :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false" @preview="preview"
                 @showEventInfo_notProcessed="showEventInfo_notProcessed"
                 @showEventInfo_Processed="showEventInfo_Processed"></supermap>