修复

src/api/base/region.js

@@ -33,12 +33,12 @@ export const select = (code) => {
   })
 }
 
-export const getDetail = (code) => {
+export const getDetail = (params) => {
   return request({
     url: '/api/blade-system/region/detail',
     method: 'get',
     params: {
-      code
+	  ...params
     }
   })
 }

src/api/device/videoclouddevice.js

@@ -59,3 +59,12 @@ export const pageByBuilding = (current, size, params) => {
     }
   })
 }
+export const pushStream = (params) => {
+  return request({
+    url: '/api/cyzh-smart-device/videoclouddevice/pushStream',
+    method: 'get',
+    params: {
+      ...params,
+    }
+  })
+}

src/api/grid/index.js

@@ -2,7 +2,7 @@ import request from '@/router/axios';
 //所有统计、社区列表
 export const getCommunityList = (codeOrgPosition) => {
   return request({
-    url: '/api/statistics/screen/estate/static',
+    url: '/api/cyzh-community/statistics/screen/estate/static',
     method: 'get',
     params: {
       codeOrgPosition:codeOrgPosition
@@ -12,7 +12,7 @@ export const getCommunityList = (codeOrgPosition) => {
 //社区统计、小区列表
 export const getCommunityDetail = (params) => {
   return request({
-    url: '/api/statistics/agency',
+    url: '/api/cyzh-community/statistics/agency',
     method: 'get',
     params: {
       id:params
@@ -22,7 +22,7 @@ export const getCommunityDetail = (params) => {
 //小区统计
 export const getResidentialDetail = (params) => {
   return request({
-    url: '/api/statistics/residential/index',
+    url: '/api/cyzh-community/statistics/residential/index',
     method: 'get',
     params: {
       id:params
@@ -32,7 +32,7 @@ export const getResidentialDetail = (params) => {
 //小区车辆统计
 export const getResidentialCar = (params) => {
   return request({
-    url: '/api/statistics/residential/car',
+    url: '/api/cyzh-community/statistics/residential/car',
     method: 'get',
     params: {
       id:params
@@ -42,7 +42,7 @@ export const getResidentialCar = (params) => {
 //小区设备统计
 export const getResidentialDevices = (params) => {
   return request({
-    url: '/api/statistics/residential/device',
+    url: '/api/cyzh-community/statistics/residential/device',
     method: 'get',
     params: {
       id:params
@@ -64,7 +64,7 @@ export const getSmartdeviceAll = (type,id,status) => {
 //社区地磁、人脸、视频云、车辆统计
 export const getMultiCount = (codeOrgPosition) => {
   return request({
-    url: '/api/statistics/screen/MultiStatic/static',
+    url: '/api/cyzh-community/statistics/screen/MultiStatic/static',
     method: 'get',
     params: {
       codeOrgPosition
@@ -74,7 +74,7 @@ export const getMultiCount = (codeOrgPosition) => {
 //社区设备列表、设备统计
 export const getDeviceCount = (deviceType,codeOrgPosition) => {
   return request({
-    url: '/api/statistics/screen/smartDevice/static',
+    url: '/api/cyzh-community/statistics/screen/smartDevice/static',
     method: 'get',
     params: {
       deviceType,
@@ -85,7 +85,7 @@ export const getDeviceCount = (deviceType,codeOrgPosition) => {
 //社区设备列表、设备统计
 export const getDeviceVideo = (id) => {
   return request({
-    url: '/api/yc_video_cloud_device/videoclouddevice/getByResidentialAndDeviceName',
+    url: '/api/cyzh-smart-device/videoclouddevice/list',
     method: 'get',
     params: {
       residentialId:id
@@ -96,7 +96,7 @@ export const getDeviceVideo = (id) => {
 //园区当日体温统计
 export const getTodayTemperature = (id) => {
   return request({
-    url: '/api/statistics/screen/park/todayTemperature',
+    url: '/api/cyzh-community/statistics/screen/park/todayTemperature',
     method: 'get',
     params: {
       residentialId:id
@@ -107,7 +107,7 @@ export const getTodayTemperature = (id) => {
 //园区车辆出入趋势
 export const getCarTendency = (params) => {
   return request({
-    url: '/api/statistics/screen/park/carTendency',
+    url: '/api/cyzh-community/statistics/screen/park/carTendency',
     method: 'get',
     params: {
        ...params
@@ -118,7 +118,7 @@ export const getCarTendency = (params) => {
 //园区当日动态数据
 export const getTodayData = (params) => {
   return request({
-    url: '/api/statistics/screen/park/todayData',
+    url: '/api/cyzh-community/statistics/screen/park/todayData',
     method: 'get',
     params: {
       ...params
@@ -128,7 +128,7 @@ export const getTodayData = (params) => {
 //园区电表
 export const getElectricMeterStatic = (id) => {
   return request({
-    url: '/api/statistics/electricMeterStatic',
+    url: '/api/cyzh-community/statistics/electricMeterStatic',
     method: 'get',
     params: {
       agencyId:id
@@ -138,7 +138,7 @@ export const getElectricMeterStatic = (id) => {
 //社区维度的设备告警
 export const getSmartdevice = (params) => {
   return request({
-    url: '/api/smartapplication/smartdevice/page',
+    url: '/api/cyzh-smart-device/iotdevice/page',
     method: 'get',
     params: {
       ...params
@@ -148,7 +148,7 @@ export const getSmartdevice = (params) => {
 //获取地区json
 export const getAreaFullJson = (params) => {
   return request({
-    url: '/api/blade-sysarea/sysarea/getFullJson',
+    url: '/api/blade-system-expand/sysarea/getFullJson',
     method: 'get',
     params: {
       ...params

src/api/system/user.js

@@ -73,7 +73,7 @@ export const getUserPlatform = (id) => {
 
 export const getUserInfo = () => {
   return request({
-    url: '/api/blade-user/info',
+    url: '/api/blade-system-expand/blade-user/info-strength',
     method: 'get',
   })
 }
@@ -121,8 +121,8 @@ export const grant = (userIds, roleIds) => {
 
 export const getUserByTenantIdAndAccount = (tenantId,account) => {
   return request({
-    // url: '/api/blade-system-expand/blade-user/info-strength',
-    url: '/api/blade-user/info',
+    url: '/api/blade-system-expand/blade-user/info-strength',
+    // url: '/api/blade-user/info',
     method: 'get',
     params: {
       tenantId,

src/components/3DMap/Map3D.vue

@@ -1,18 +1,55 @@
+<!--
+  (仅限公司内部使用！！！)
+   使用方法： Cesium 官网下载源码，复制到public目录下，cdn 引入以下内容
+
+  <link rel="stylesheet" href="Cesium/Widgets/widgets.css">
+  <script src="Cesium/Cesium.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/@dvgis/cesium-map"></script>
+
+    方法列表： ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓  （。。。完善中）
+
+    //隐藏图层                                                  hideLayer(layerId)
+    //显示图层                                                  showLayer(layerId)
+    //初始化地图                                                initMap(option=this.mapOption)
+    //添加建筑矢量数据，url为建模json数据                          addBuildingData(url)
+    //添加图层                                                  addLayer(layer,layerId)
+    //移除指定图层                                              removeLayer(layerId)
+    //移除所有图层                                              removeAllLayers()
+    //指定位置并删除图层                                         flyToPositionWithoutLayers(longitude,latitude,height,heading,pitch,roll)
+    //添加图标覆盖物(单个)                                       addBillBoard(longitude,latitude,height,image,option= {},id)
+    //添加图标覆盖物(多个)                                       addBillBoards(element,option= {},layerId)           例: this.addBillBoards([[113.682062,34.662187, 0,'/data/device.png']],{scale: 0.1},'device')
+    //去除覆盖物                                                removeEntity(id)
+    //初始化数据                                                onload()
+
+   信息框  --------------------->
+    添加相应的信息框在相应的数组添加数据即可，具体添加可看数组元素注释部分
+-->
+
 <template>
-  <div class="full">
-    <div class="full" id="viewer-container"></div>
-    <info-layer></info-layer>
+  <div class="full" >
+    <div class="full" id="viewer-container">
+      <danger-circle :viewer="viewer" ref="dangerCircle"></danger-circle>
+    </div>
+    <info-layer ref="infoLayer" style="background: radial-gradient(transparent,rgba(0,0,0,0.1),rgba(0,0,0,0.5),rgba(0,0,0,1))"
+      :box1="box1"
+      :box2="box2"
+    ></info-layer>
+    <tools-bar></tools-bar>
+    <el-button size="mini" style="position:absolute;top: 50px;left: 30%;z-index: 99" @click="changeMap">切换地图</el-button>
   </div>
 </template>
 
 <script>
  import InfoLayer from "./map-components/InfoLayer";
- let viewer = undefined;
+ import DangerCircle from "./map-components/overlays/dangerCircle";
+ import ToolsBar from "./map-components/tools-bar/tools-bar";
+ let scratch = new Cesium.Cartesian2();
 export default {
   name: "Map3D",
-  components: {InfoLayer},
+  components: {ToolsBar, DangerCircle, InfoLayer},
   data(){
     return{
+      viewer: {},
       //默认场景参数
       mapOption: {
         animation: false, // 动画小组件
@@ -29,39 +66,117 @@ export default {
         // 如果最初应该看到导航说明，则为true；如果直到用户明确单击该按钮，则该提示不显示，否则为false。
         navigationInstructionsInitiallyVisible: false,
         imageryLayers: [],
+        // skyBox: new Cesium.SkyBox({
+        //   sources: {
+        //     positiveX: '/sky/SKY_u.jpg',
+        //     negativeX: '/sky/SKY_r.jpg',
+        //     positiveY: '/sky/SKY_b.jpg',
+        //     negativeY: '/sky/SKY_l.jpg',
+        //     positiveZ: '/sky/SKY_f.jpg',
+        //     negativeZ: '/sky/SKY_d.jpg',
+        //   }
+        // }),
       },
+      isRound: true,
+      layers: [],
+      handle: {},
+      box1: [
+        // {position: [113.682062,34.702187],title: '汤阴小学',data:[{label: '地点' , value: '汤阴县'},{label: '联系方式' , value: '4664-858585'}],x:0,y:0}
+      ],
+      box2: [
+        // {position: [113.682062,34.702187],data:'我是数据',x:0,y:0},
+      ],
     }
   },
   mounted() {
     this.onload();
   },
   methods: {
-    //初始化地图
-    initMap(option=this.mapOption){
-      viewer = new Cesium.Viewer("viewer-container",option);
-      this.$viewer = viewer;
-      // 隐藏logo
-      viewer._cesiumWidget._creditContainer.style.display = "none";
-      viewer.scene.globe.baseColor = Cesium.Color.fromCssColorString("rgba(20,56,76,0.5)");
-      viewer.imageryLayers.removeAll();
-      viewer.imageryLayers.addImageryProvider(
+    //隐藏图层
+    hideLayer(layerId){
+      this.layers.forEach(item => {
+        if(item.layerId==layerId){
+          item.layer.show = false;
+        }
+      })
+    },
+    //显示图层
+    showLayer(layerId){
+      this.layers.forEach(item => {
+        if(item.layerId==layerId){
+          item.layer.show = true;
+        }
+      })
+    },
+    changeMap(){
+      this.viewer.imageryLayers.removeAll();
+      this.viewer.imageryLayers.addImageryProvider(
         new Cesium.BaiduImageryProvider({
           style: 'midnight',
           crs: 'WGS84'
         })
-      )
-    },
 
+      );
+      //定位建筑群位置
+      this.flyToPosition(113.682062,34.702187, 2000.0,0,-20.0,0.0);
+      this.round();
+    },
+    //初始化地图
+    initMap(option=this.mapOption){
+      this.viewer = new Cesium.Viewer("viewer-container",option);
+      // 隐藏logo
+      this.viewer._cesiumWidget._creditContainer.style.display = "none";
+       // viewer.scene.globe.show = false;   // 隐藏地球实体
+      this.viewer.imageryLayers.removeAll();
+      this.addBaiduLayer()
+      this.viewer.scene.globe.baseColor = Cesium.Color.fromCssColorString("rgba(20,56,76,0.5)");
+      this.viewer.scene.preRender.addEventListener(this.moveListener);
+      // this.addGltf([113.682062,34.702187,0],'/demo/8H.gltf');
+    },
     //添加建筑矢量数据，url为建模json数据
     addBuildingData(url){
-      this.$viewer.scene.primitives.add(
+      this.viewer.scene.primitives.add(
         new Cesium.Cesium3DTileset({url})
       );
     },
-
+    //添加图层
+    addLayer(layer,layerId){
+      this.layers.push({layerId, layer});
+      this.viewer.scene.primitives.add(layer);
+    },
+    //移除指定图层
+    removeLayer(layerId){
+      this.layers.forEach(item => {
+        if(item.layerId==layerId){
+          this.viewer.scene.primitives.remove(item.layer);
+        }
+      })
+    },
+    //移除所有信息框
+    removeAllBox(){
+      this.box1 = [];
+      this.box2 = [];
+    },
+    //添加gltf模型
+    addGltf(position=[113.682062,34.702187,0],url,option={scale : 100.0}){
+      var scene = this.viewer.scene;
+      var modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(
+        Cesium.Cartesian3.fromDegrees(position[0],position[1],position[2]));
+      var model = scene.primitives.add(Cesium.Model.fromGltf({
+        url,
+        modelMatrix,
+        ...option,
+      }));
+    },
+    //移除所有图层
+    removeAllLayers(){
+      this.layers.forEach(item => {
+        this.viewer.scene.primitives.remove(item.layer);
+      })
+    },
     //指定相机位置
     flyToPosition(longitude,latitude,height,heading,pitch,roll){
-      this.$viewer.camera.flyTo({
+      this.viewer.camera.flyTo({
         destination : Cesium.Cartesian3.fromDegrees(longitude,latitude,height),
         orientation : {
           heading : Cesium.Math.toRadians(heading),
@@ -70,10 +185,14 @@ export default {
         }
       });
     },
-
+    //指定位置并删除图层
+    flyToPositionWithoutLayers(longitude,latitude,height,heading,pitch,roll){
+      this.removeAllLayers();
+      this.flyToPosition(longitude,latitude,height,heading,pitch,roll);
+    },
     //添加图标覆盖物(单个)
     addBillBoard(longitude,latitude,height,image,option= {},id){
-      this.$viewer.entities.add(
+      this.viewer.entities.add(
         {
           position : Cesium.Cartesian3.fromDegrees(longitude, latitude,height),
           billboard : {
@@ -84,62 +203,89 @@ export default {
         }
       );
     },
-
-    //添加图标覆盖物(多个)------------未完善（开发中）
-    addBillBoards(positions,image,option= {},layerId){
+    //添加百度地图地图
+    addBaiduLayer(){
+      this.viewer.imageryLayers.removeAll();
+      this.viewer.imageryLayers.addImageryProvider(
+        new Cesium.BaiduImageryProvider({
+          style: 'normal',
+          crs: 'WGS84'
+        })
+      );
+    },
+    //添加图标覆盖物(多个)
+    addBillBoards(element,option= {},layerId){
      let layer =  new Cesium.BillboardCollection(option);
-     positions.forEach(item => {
-
+     element.forEach(item => {
+       layer.add(
+         {
+           show : true,
+           position : Cesium.Cartesian3.fromDegrees(item[0], item[1],item[2]),
+           image : item[3],
+           ...option
+         }
+       );
      })
-      this.$viewer.entities.add(
-        layer
-      );
+     this.addLayer(layer,layerId)
     },
-
-
     //去除覆盖物
     removeEntity(id){
-      this.$viewer.entities.removeById(id);
+      this.viewer.entities.removeById(id);
     },
-
     //去除所有覆盖物
     removeAllEntity(){
-      this.$viewer.entities.removeAll();
+      this.viewer.entities.removeAll();
     },
+    //屏幕坐标转化
+    convertScreen(list){
+      list.forEach(item => {
+        let location = this.viewer.scene.cartesianToCanvasCoordinates(
+          Cesium.Cartesian3.fromDegrees(item.position[0], item.position[1], 0),
+          new Cesium.Cartesian2()
+        );
+        if(Cesium.defined(location)) {
+          item.x = location.x;
+          item.y = location.y;
+        }
+      })
 
-    test(){},
-
+    },
+    //绕点旋转
+    round(){
+      let _this = this;
+      let x= Cesium.Math.toDegrees(_this.viewer.camera.heading);
+      this.viewer.scene.preUpdate.addEventListener( () => {
+        if(_this.isRound){
+         x=x+0.1;
+          this.viewer.scene.camera.setView({
+            orientation: {
+              heading : Cesium.Math.toRadians(x),
+              pitch :this.viewer.camera.pitch,
+            }
+          });
+        }
+      });
+    },
+    //相机移动事件
+    moveListener(){
+      this.convertScreen(this.box1);
+      this.convertScreen(this.box2);
+    },
+    //初始化数据
     onload(){
       //创建场景实例
       this.initMap();
+      //初始化弹框图层
+      this.$refs['infoLayer'].onload();
+      this.$refs['dangerCircle'].onLoad();
+      // this.addBuildingData('/data/ningxia.json');
       //添加建筑矢量数据
       this.addBuildingData('http://139.9.103.171/mapData/zhengzhou/tileset.json')
       //定位建筑群位置
-      this.flyToPosition(113.682062,34.662187, 2000.0,0,-20.0,0.0);
-
-      this.addBillBoard(113.682062,34.662187,0,'/data/device.png',{
-        scale: 0.05
-      },"device");
-      //疫苗接种点
-      this.addBillBoard(113.670852,34.781468,0,'/data/epidemic.png',{
-        scale: 0.35
-      },"epidemic");
-      this.addBillBoard(113.74715,34.719967,0,'/data/epidemic.png',{
-        scale: 0.35
-      },"epidemic");
-      this.addBillBoard(113.646203,34.727969,0,'/data/epidemic.png',{
-        scale: 0.35
-      },"epidemic");
-      //政府部门
-      this.addBillBoard(113.631557,34.75261,0,'/data/government.png',{
-        scale: 0.35
-      },"government");
-      //垃圾场
-      this.addBillBoard(113.829591,34.713823,0,'/data/environment.png',{
-        scale: 0.35
-      },"environment");
+      this.flyToPosition(114.357763,35.924515, 2000.0,0,-20.0,0.0);
     },
-  }
+
+ }
 }
 </script>
 

src/components/3DMap/TimeBar.vue

@@ -7,7 +7,9 @@
         <div class=" center" style="width: 15%;">{{weekStr[dateTime.week]}}</div>
         <div class=" center" style="width: 10%;font-size: 26px;font-style: italic;">{{temperature}}℃</div>
         <div class=" center" style="width: 15%;">
-          <div class="weather" style="width: 30px;height: 30px;"></div>
+          <div  style="width: 30px;height: 30px;"
+            :class="[weatherClass]"
+          ></div>
           <div style="text-indent: 8px">{{weather}} </div>
         </div>
       </div>
@@ -21,7 +23,7 @@ import {dateFormat} from "../../util/date";
 export default {
   name: "TimeBar",
   async mounted() {
-    this.getTime();
+    this.currentTime();
     await this.getWeather();
     },
   data(){
@@ -30,8 +32,14 @@ export default {
       weekStr: ['星期天','星期一','星期二','星期三','星期四','星期五','星期六',],
       temperature: '',
       weather: '',
+      weatherClass: 'duoyun',
     }
   },
+  watch: {
+    weather(){
+      this.weatherClass = this.getWeatherClass(this.weather);
+    },
+  },
   methods: {
     currentTime() {
       setInterval(this.getTime, 500);
@@ -47,12 +55,28 @@ export default {
         time: str[1]
       }
     },
+    getWeatherClass(weather){
+      let duoyun = ['少云','晴间多云','多云','阴'];
+      let wu = ['雾','浓雾','强浓雾','轻雾','大雾','特强浓雾'];
+      let mai = ['霾','中度霾','重度霾','严重霾'];
+      let feng = ['有风','平静','微风','和风','清风','强风/劲风', ,'疾风','大风','烈风','风暴','狂爆风','飓风','热带风暴'];
+      let yu = ['阵雨','雷阵雨','雷阵雨并伴有冰雹','小雨','中雨','大雨','暴雨','大暴雨','特大暴雨','强阵雨','强雷阵雨','极端降雨','毛毛雨/细雨','雨','小雨-中雨','中雨-大雨','大雨-暴雨','暴雨-大暴雨','大暴雨-特大暴雨','雨雪天气','雨夹雪','阵雨夹雪','冻雨'];
+      let sun = ['晴'];
+      let xue = ['雪','阵雪','小雪','中雪','大雪','暴雪','小雪-中雪','中雪-大雪','大雪-暴雪'];
+      if(duoyun.indexOf(weather)>=0) return'duoyun';
+      if(wu.indexOf(weather)>=0) return'wu';
+      if(yu.indexOf(weather)>=0) return'yu';
+      if(sun.indexOf(weather)>=0) return'sun';
+      if(xue.indexOf(weather)>=0) return'xue';
+      if(mai.indexOf(weather)>=0) return'mai';
+      if(feng.indexOf(weather)>=0) return'feng';
+      return 'duoyun';
+    },
     async getWeather(){
       console.log(this.$map)
       let  weather = new this.$AMap.Weather();
       //执行实时天气信息查询
       weather.getForecast('郑州市', (err, data) => {
-        console.log(data)
         this.temperature = data.forecasts[0].dayTemp;
         this.weather  = data.forecasts[0].dayWeather;
       });
@@ -67,7 +91,25 @@ export default {
     justify-content: center;
     align-items: center;
   }
-  .weather{
+  .duoyun{
     background: url("/data/duoyun.png") no-repeat center/contain;
   }
+  .wu{
+    background: url("/data/wu.png") no-repeat center/contain;
+  }
+  .xue{
+    background: url("/data/xue.png") no-repeat center/contain;
+  }
+  .yu{
+    background: url("/data/yu.png") no-repeat center/contain;
+  }
+  .sun{
+    background: url("/data/sun.png") no-repeat center/contain;
+  }
+  .mai{
+    background: url("/data/mai.png") no-repeat center/contain;
+  }
+  .feng{
+    background: url("/data/feng.png") no-repeat center/contain;
+  }
 </style>

src/components/3DMap/map-components/InfoLayer.vue

@@ -1,19 +1,45 @@
 <template>
-  <div class="info-layer">
-      <box1 v-for="item of box1" :title="item.title" :position="item.position" :data="item.data"></box1>
+  <div class="info-layer" style="overflow: hidden">
+      <box1 v-if="initFlag"  v-for="(item,index) of box1" :title="item.title" :position="[item.y,item.x]" :data="item.data"></box1>
+      <box2 v-if="initFlag"  v-for="(item,index) of box2" :title="item.title" :position="[item.y,item.x]" :data="item.data"></box2>
+      <box3 v-if="initFlag"  v-for="(item,index) of box3" :title="item.title" :position="[item.y,item.x]" :data="item.data"></box3>
   </div>
 </template>
 
 <script>
 import Box1 from "./infobox/box1";
+import Box2 from "./infobox/box2";
+import Box3 from "./infobox/box3";
 export default {
   name: "InfoLayer",
-  components: {Box1},
+  components: {Box3, Box1,Box2},
+  inject: ['screen'],
+  props: {
+    box1: {
+      type: 'Array',
+      default: []
+    },
+    box2: {
+      type: 'Array',
+      default: []
+    },
+    box3: {
+      type: 'Array',
+      default: []
+    },
+  },
   data(){
     return{
-      box1: []
+      initFlag: false,
     }
-  }
+  },
+
+  methods: {
+    onload(){
+      this.initFlag = true;
+    },
+
+  },
 }
 </script>
 

src/components/3DMap/map-components/infobox/box1.vue

@@ -1,6 +1,6 @@
 <template>
     <div id="box1" :style="{
-      top: position[0]+'px',
+      top: position[0]-300+'px',
       left: position[1]+ 'px'
     }">
       <div class="wrap">
@@ -33,6 +33,7 @@
         </div>
       </div>
       <div class="line"></div>
+      <div class="" style="position: absolute;bottom: 0;left: 0;width: 10px;height: 10px;border-radius: 50%;background: radial-gradient(#00ffff,#004480,#02004a)"></div>
     </div>
 </template>
 
@@ -62,12 +63,11 @@ export default {
   height: 100%;
 }
 #box1{
+  /*background: #ef1717;*/
   width: 300px;
   height: 300px;
   position: absolute;
   /*background: #ffffff;*/
-  top: 30%;
-  left: 30%;
 }
 .wrap{
   width: 250px;
@@ -102,4 +102,15 @@ export default {
   margin-left: 30px;
   background-image: linear-gradient(135deg, transparent 25px, #2299c4 25px);
 }
+.changColor{
+  animation: color 0.2s linear infinite;
+}
+@keyframes color {
+  from{
+    background: radial-gradient(red, #ff00e5)
+  }
+  to{
+    background: radial-gradient(blue,red)
+  }
+}
 </style>

src/components/3DMap/map-components/infobox/box2.vue

@@ -0,0 +1,41 @@
+<template>
+  <div id="box2" :style="{
+      top: position[0]-300+'px',
+      left: position[1]+ 'px'
+    }">
+    <div style="position: absolute;bottom: 0;left: 0;background: url('/data/popupLbl.png') no-repeat;width: 300px;height: 38px"></div>
+    <div class="center" style="position: absolute;bottom: 38px;left: 20px;background: rgba(0,0,0,0.5);width: 280px;height: 50px;color: white;font-style: 20px;font-weight: bold">
+      {{data}}
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "box2",
+  props: {
+    data: {
+      type: "String",
+      default: '暂无数据'
+    },
+    position: {
+      type: "Array",
+      default: [0,0]
+    }
+  }
+}
+</script>
+
+<style scoped>
+  #box2{
+    width: 300px;
+    height: 300px;
+    /*background: rgba(0,0,0,0.5);*/
+    position: absolute;
+  }
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+</style>

src/components/3DMap/map-components/infobox/box3.vue

@@ -0,0 +1,91 @@
+<template>
+  <div id="box1" :style="{
+      top: position[0]-100+'px',
+      left: position[1]+ 'px'
+    }">
+    <div class="wrap center" style="color: white">
+      {{data}}
+    </div>
+    <div class="line"></div>
+    <div class="" style="position: absolute;bottom: 0;left: 0;width: 10px;height: 10px;border-radius: 50%;background: radial-gradient(#00ffff,#004480,#02004a)"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "box3",
+  props: {
+    title: {
+      type: "String",
+      default: '建筑'
+    },
+    data: {
+      type: "Array",
+      default: []  //[ {label: '姓名' , value: '梁汉强'}]
+    },
+    position: {
+      type: "Array",
+      default: [0,0]
+    }
+  }
+}
+</script>
+
+<style scoped>
+.full{
+  width: 100%;
+  height: 100%;
+}
+#box1{
+  /*background: #ef1717;*/
+  width: 300px;
+  height: 100px;
+  position: absolute;
+  /*background: #ffffff;*/
+}
+.wrap{
+  width: 250px;
+  height: 50px;
+  margin-left: 50px;
+  background: linear-gradient(to top, #147f83, rgba(0,0,0,0));
+  /*background-image:*/
+  /*  linear-gradient(135deg, transparent 30px, #28abf06c 30px, #28abf06c 50%, transparent 50%),*/
+  /*  linear-gradient(-45deg, transparent 30px, #28abf06c 30px, #28abf06c 50.1%, transparent 50%);*/
+}
+.line{
+  height: 70px;
+  width: 1px;
+  background: linear-gradient(to top, #00bdff, #11bcf8);
+  transform: rotate(45deg) translate(10px, -25px);
+}
+.center{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.border{
+  position: absolute;
+  background-color: #29baf1;
+  box-shadow: 0 0 10px 2px #29baf1;
+}
+.title{
+  letter-spacing: 5px;
+  color: white;
+  font-weight: bold;
+  width: 220px;
+  height: 40px;
+  margin-left: 30px;
+  background-image: linear-gradient(135deg, transparent 25px, #2299c4 25px);
+}
+.changColor{
+  animation: color 0.2s linear infinite;
+}
+@keyframes color {
+  from{
+    background: radial-gradient(red, #ff00e5)
+  }
+  to{
+    background: radial-gradient(blue,red)
+  }
+}
+</style>

src/components/3DMap/map-components/overlays/dangerCircle.vue

@@ -0,0 +1,26 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: "dangerCircle",
+  props: {
+    viewer: {
+      type: 'Object'
+    }
+  },
+  methods: {
+    onLoad() {
+      let r1 = 50;
+      let r2 = 50;
+      console.log(this.viewer,66)
+
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/3DMap/map-components/tools-bar/tools-bar.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="center" style="position: absolute;right: 1%;bottom: 2%;width: 350px;height: 50px">
+    <div class="click" @click="handleRound" style="background: url('/data/round.png') no-repeat center/70%;width: 50px;height: 50px"></div>
+    <div class="click" @click="handleFull" style="background: url('/data/full.png') no-repeat center/70%;width: 50px;height: 50px"></div>
+  </div>
+</template>
+
+<script>
+import {fullscreenToggel} from "../../../../util/util";
+
+export default {
+  name: "tools-bar",
+  inject: ['screen'],
+  methods: {
+    handleRound(){
+      this.screen.$refs['map'].isRound = !this.screen.$refs['map'].isRound;
+      this.screen.$refs['map'].round();
+    },
+    handleFull(){
+      fullscreenToggel();
+    }
+  },
+}
+</script>
+
+<style scoped>
+    .full{
+      width: 100%;
+      height: 100%;
+    }
+    .center{
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+    .click:hover{
+      cursor: pointer;
+      transform: translate(2px,2px);
+    }
+</style>

src/components/3DScene/3DScene.vue

@@ -0,0 +1,153 @@
+<template>
+  <div class="full">
+    <div class="full" id="3DScene"></div>
+    <map-for-scene ref="map"></map-for-scene>
+    <info-layer ref="infoLayer"
+                :box3="box3"
+    ></info-layer>
+  </div>
+</template>
+
+<script>
+import * as d3 from 'd3';
+import * as Three from 'three'
+import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
+import Box1 from "../3DMap/map-components/infobox/box1";
+import InfoLayer from "../3DMap/map-components/InfoLayer";
+import MapForScene from "./map";
+export default {
+  name: "Scene3D",
+  components: {MapForScene, InfoLayer, Box1},
+  provide(){
+    return {
+      scene: this
+    }
+  },
+  data(){
+    return{
+      position: [0,0],
+      camera: null,
+      scene: null,
+      renderer: null,
+      mesh: null,
+      controls: null,
+      container: null,
+      box3: [],
+    }
+  },
+  methods: {
+    //加载json文件
+    async addJson(url){
+      return new Promise((resolve, reject) => {
+        let loader = new Three.FileLoader();
+        loader.load(url,  (data) => {
+          resolve( JSON.parse(data));
+        });
+      } )
+    },
+    //添加天空盒子===》urls 6张方位图图片路径  //六张图片分别是朝前的（posz）、朝后的（negz）、朝上的（posy）、朝下的（negy）、朝右的（posx）和朝左的（negx）。
+    addSkyBox(urls){
+      let cubeTextureLoader = new Three.CubeTextureLoader();
+      let cubeTexture = cubeTextureLoader.load( urls);
+      this.scene.background = cubeTexture;
+    },
+    //添加平行光
+    addDirectionalLight(position,color=0xffffff){
+      //添加光源
+      let dirLight = new Three.DirectionalLight(color, 1)
+      dirLight.position.set(position[0], position[1], position[2]);
+      dirLight.castShadow = true //可以产生阴影
+      dirLight.shadow.mapSize = new Three.Vector2(1024, 1024)
+      this.scene.add(dirLight)
+    },
+    //添加gltf模型
+    addGltf(url){
+      let loader = new GLTFLoader();
+      loader.load( url,  (gltf) => {
+          this.scene.add(gltf.scene)
+          gltf.scene.traverse( function ( child ) {
+            if ( child.isMesh ) {
+              child.material.emissive =  child.material.color;
+              child.material.emissiveMap = child.material.map ;
+            }
+          } );
+        }, undefined,
+        ( error ) => {
+          console.error( error );
+        } );
+    },
+    //初始化场景
+    init() {
+      //挂载容器
+      let container = document.getElementById('3DScene');
+      this.container = container;
+      //初始化相机
+      this.camera = new Three.PerspectiveCamera(50, container.clientWidth/container.clientHeight, 0.001, 10000);
+      this.camera.position.z = 1000;
+      this.camera.position.x = 0;
+      this.camera.position.y = -200;
+
+      //初始化场景
+      this.scene = new Three.Scene();
+
+      //渲染器
+      this.renderer = new Three.WebGLRenderer({antialias: true,alpha: true});
+      this.renderer.setSize(container.clientWidth, container.clientHeight);
+      this.setAlpha(1);
+      container.appendChild(this.renderer.domElement);
+
+
+      //坐标轴
+      let axes = new Three.AxisHelper(30000);
+      // this.scene.add(axes);
+
+      this.addDirectionalLight([1000,1000,1000]);
+      // this.addGltf('/demo/8H.gltf');
+      //控制器
+      this.controls = new OrbitControls(this.camera, this.renderer.domElement);
+      this.controls.enableDamping = true;
+
+      //初始化信息框图层
+      this.$refs['infoLayer'].onload();
+    },
+    //每帧渲染函数
+    animate() {
+      requestAnimationFrame(this.animate);
+      this.controls.update();
+      this.renderer.render(this.scene, this.camera);
+      this.$refs['map'].renderPosition();
+      this.$refs['map'].animate();
+    },
+    //设置背景颜色
+    setBackground(color){
+      this.renderer.setClearColor(color);
+    },
+    //设置背景透明度
+    setAlpha(num){
+      this.renderer.setClearAlpha(num);
+    },
+  },
+
+  async mounted() {
+    const _this = this;
+    this.init();
+    this.animate();
+    this.$refs['map'].onLoad();
+    await this.$refs['map'].addMap('/data/ningxia.json');
+  }
+}
+</script>
+
+<style scoped>
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+</style>

src/components/3DScene/map.vue

@@ -0,0 +1,250 @@
+<template>
+  <div class="slide-in-top"  v-if="infoShow" style="width: 300px;height: 250px;position: absolute;"  :style="{
+    left: infoPosition.x-150 + 'px',
+    top: infoPosition.y-265 + 'px',
+  }">
+    <div  style="height: 200px;width: 100%;">
+      <dv-border-box-7 class="full" :color="['rgba(0, 0, 0, 0.3)', '#0dcbec']" backgroundColor="rgba(0, 0, 0, 0.3)">
+        <div class="full text-blur-out">
+          <div style="width: 100%;height: 50px;color: #00ffe2;font-weight: bold;letter-spacing: 20px" class="center">{{infoProperties.name}}</div>
+          <div style="width: 100%;height: 200px">
+            <slot></slot>
+          </div>
+        </div>
+      </dv-border-box-7>
+    </div>
+    <div class="line"></div>
+    <div class="point"></div>
+  </div>
+</template>
+
+<script>
+import * as d3 from "d3";
+import * as Three from "three";
+
+export default {
+  name: "mapForScene",
+  inject: ['scene'],
+  data(){
+    return {
+      infoShow: false,
+      infoPosition: {x:0,y:0},
+      mapCenterPosition: [106.292249,37.206647],
+      scale: 8000,
+      infoProperties: {},
+      raycaster: null,
+      mouse: {},
+      map: {},
+      onClickList: [],
+      eventOffset: {x:0,y:0},
+      activeInstersect: [],
+      isInit: false,
+    }
+  },
+  methods: {
+    onLoad(){
+      this.raycaster = new Three.Raycaster();
+      this.mouse = new Three.Vector2();
+      this.eventOffset = {};
+      const _this = this;
+      window.addEventListener( 'mousemove', this.onMouseMove, false );
+      window.addEventListener( 'click', this.onMouseClick, false );
+      this.isInit = true;
+       // this.addPoints();
+    },
+    //三维坐标转换屏幕坐标
+    transPosition(position=[0,0,0]){
+      let world_vector = new Three.Vector3(position[0],position[1],position[2]);
+      let vector =world_vector.project(this.scene.camera);
+      let halfWidth =  this.scene.container.clientWidth / 2,
+        halfHeight =  this.scene.container.clientHeight / 2;
+      return [
+        Math.round(vector.x * halfWidth + halfWidth),
+        Math.round(-vector.y * halfHeight + halfHeight)
+      ];
+    },
+    //添加地图
+    async addMap(url='/data/ningxia.json'){
+      const _this =this;
+      let json = await this.scene.addJson(url)
+      // 墨卡托投影转换
+      const projection = d3.geoMercator().center(this.mapCenterPosition).scale(this.scale).translate([0, 0]);
+      //地图对象模型（省份）
+      let map = new Three.Object3D();
+      this.map = map;
+      json['features'].forEach(city => {
+        let City = new Three.Object3D();
+        city['geometry']['coordinates'].forEach(polygons => {
+          polygons.forEach(polygon => {
+            const shape = new Three.Shape();
+            let linePoints = [];
+            polygon.forEach((position,index) => {
+              const [x,y] = projection(position)
+              if(index==0){
+                shape.moveTo(x,y);
+              }
+              shape.lineTo(x,y);   //添加区域定点
+              linePoints.push(x,y);  //添加区域边界顶点
+            })
+
+            const extrudeSettings = {
+              depth: 20,
+              bevelEnabled: false
+            };
+
+            //构建区域模型
+            const geometry = new Three.ExtrudeGeometry(shape, extrudeSettings)
+            const material = new Three.MeshBasicMaterial({ color: '#02A1E2', transparent: true, opacity: 0.6 })
+            const material1 = new Three.MeshBasicMaterial({ color: '#3480c4', transparent: true, opacity: 0.6 })
+            const mesh = new Three.Mesh(geometry, [material, material1])
+
+            //构建区域边界模型
+            const lineGeometry = new Three.BufferGeometry();
+            lineGeometry.attributes.position = new Three.BufferAttribute(new Float32Array(linePoints),2);
+            const lineMaterial = new Three.LineBasicMaterial({ color: '#02A1E2' });
+            const line = new Three.Line(lineGeometry, lineMaterial)
+
+            City.add(mesh);
+            City.add(line);
+          })
+        })
+        //添加区域属性（GeoJson文件所包含的属性）
+        City.properties = city.properties;
+        if (city.properties.contorid) {
+          const [x, y] = projection(city.properties.contorid);
+          City.properties._centroid = [x, y];
+        }
+        // _this.scene.box3.push({
+        //   position: city.properties.center,
+        //   data: city.properties.name,
+        //   areaCode: city.properties.adcode,
+        //   x:0,
+        //   y:0
+        // })
+        map.add(City)
+      })
+      _this.scene.scene.add(map)
+    },
+    //坐标渲染
+    renderPosition(){
+      const projection = d3.geoMercator().center(this.mapCenterPosition).scale(this.scale).translate([0, 0]);
+      this.scene.box3.forEach(item => {
+        const [x,y] =  projection(item.position);
+        const [x2,y2] = this.transPosition([x,y,0]);
+        item.x =x2;
+        item.y = y2;
+      })
+    },
+    //地图添加圆点标记
+    addPoints(positionList=[[106.292249,38.206647],[106.492249,37.206647],[107.292249,37.206647]]){
+      const projection = d3.geoMercator().center(this.mapCenterPosition).scale(this.scale).translate([0, 0]);
+      let points = [];
+      let normals = [];
+      positionList.forEach(item => {
+        const [x,y] =  projection(item);
+        points.push(x,y);
+        normals.push(0,0,1);
+      })
+       let geometry = new Three.BufferGeometry();
+       let textureMap = new Three.TextureLoader().load( "/data/point.png");
+       geometry.attributes.position = new Three.BufferAttribute(new Float32Array(points), 2);
+      geometry.attributes.normal = new Three.BufferAttribute(new Float32Array(normals), 3);
+       let material = new Three.PointsMaterial({
+        wireframe: true,
+        map: textureMap,
+       color: 0xff000,
+       size: 100.0,
+         transparent: true,
+       });
+     let mesh  = new Three.Points(geometry, material);
+     this.scene.scene.add(mesh);
+    },
+    //鼠标移动事件
+    onMouseMove(event) {
+      const _this =this;
+      _this.mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
+      _this.mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
+      _this.eventOffset.x = event.clientX;
+      _this.eventOffset.y = event.clientY;
+      _this.infoPosition.x = _this.eventOffset.x + 2 ;
+      _this.infoPosition.y = _this.eventOffset.y + 2 ;
+    },
+    //鼠标单击事件
+    onMouseClick(){
+      this.onClickList.forEach(item => {
+        item(this.infoProperties);
+      })
+    },
+    //判断鼠标指向（渲染鼠标指向实体）
+    animate() {
+      if(this.isInit){
+        this.raycaster.setFromCamera( this.mouse, this.scene.camera );
+        if(this.map) {
+          let intersects = this.raycaster.intersectObjects(this.map.children, true);
+          if (this.activeInstersect && this.activeInstersect.length > 0) {
+            this.activeInstersect.forEach(element => {
+              element.object.material[0].color.set('#02A1E2');
+              element.object.material[1].color.set('#02A1E2');
+            });
+          }
+          this.activeInstersect = [];
+          for (let i = 0; i < intersects.length; i++) {
+            if (intersects[i].object.material && intersects[i].object.material.length === 2) {
+              this.activeInstersect.push(intersects[i]);
+              intersects[i].object.material[0].color.set('#34ead5');
+              intersects[i].object.material[1].color.set('#34ead5');
+              intersects[i].object.geometry.parameters.options.depth = Math.random() * 10;
+              intersects[i].object.geometry.needsUpdate = true;
+              break; // 只取第一个
+            }
+          }
+          this.createCityInfo();
+        }
+      }
+    },
+    //添加鼠标点击事件
+    onClick(f){
+      this.onClickList.push(f);
+    },
+    //信息框配置
+    createCityInfo() { // 显示省份的信息
+      if (this.activeInstersect.length !== 0 && this.activeInstersect[0].object.parent.properties.name) {
+        this.infoProperties =  this.activeInstersect[0].object.parent.properties;
+        this.infoShow = true;
+      } else {
+        this.infoShow = false;
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .line{
+    width: 1px;
+    height: 48px;
+    margin: auto;
+    background: linear-gradient(to top,rgba(0,0,0,1),rgba(0,0,0,0.5));
+  }
+  .point{
+    width: 10px;
+    height: 10px;
+    margin: auto;
+    border-radius: 50%;background: radial-gradient(#00ffe2,#004480,#02004a)
+  }
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .slide-in-top{animation:slide-in-top .5s cubic-bezier(.25,.46,.45,.94) both}
+  @keyframes slide-in-top{0%{transform:translateY(-200px);opacity:0}100%{transform:translateY(0);opacity:1}}
+  @keyframes slide-in-elliptic-top-fwd{0%{transform:translateY(-600px) rotateX(-30deg) scale(0);transform-origin:50% 100%;opacity:0}100%{transform:translateY(0) rotateX(0) scale(1);transform-origin:50% 1400px;opacity:1}}
+
+  .text-blur-out{animation:text-blur-out 0.3s cubic-bezier(.55,.085,.68,.53) both}
+  @keyframes text-blur-out{0%{filter:blur(12px) opacity(0)}100%{filter:blur(.01)}}
+</style>

src/components/home-page/topMenu.vue

@@ -150,7 +150,6 @@
             }
           }
         }
-
         this.$router.push({
           path: path
         })

src/main.js

@@ -27,12 +27,34 @@ import crudCommon from '@/mixins/crud';
 import {select} from "./api/base/region";
 import dataV from '@jiaminghi/data-view'
 import deviceJob from "./components/job/job_solve.vue";
+require('echarts');
+import VideoPlayer from 'vue-video-player'
+import 'video.js/dist/video-js.css' //videoJs的样式
+import 'vue-video-player/src/custom-theme.css' //vue-video-player的样式
+import 'videojs-flash'; //引入才能播放rtmp视屏
+import 'videojs-contrib-hls' //引入才能播放m3u8文件
+// 按需引入vue-awesome图标
+import Icon from 'vue-awesome/components/Icon';
+import 'vue-awesome/icons/chart-bar.js';
+import 'vue-awesome/icons/chart-area.js';
+import 'vue-awesome/icons/chart-pie.js';
+import 'vue-awesome/icons/chart-line.js';
+import 'vue-awesome/icons/align-left.js';
+// 适配flex
+import './views/grid/common/flexible.js';
+// 引入全局css
+import './views/grid/assets/scss/style.scss';
+import alert from './views/grid/common/popup.js' //这里引入的是js文件
 // import $ from 'jquery'
 // import layer from "layui-layer";
-
+Vue.prototype.$datavAlert = alert;
 // 注册全局crud驱动
 window.$crudCommon = crudCommon;
+// 全局注册图标
+Vue.component('icon', Icon);
+Vue.prototype.$echarts = echarts;
 // 加载Vue拓展
+Vue.use(VideoPlayer);
 Vue.use(router);
 Vue.use(dataV);
 Vue.use(VueAxios, axios);

src/router/views/index.js

@@ -67,83 +67,84 @@ export default [
       import( /* webpackChunkName: "views" */ '@/views/grid/smartCommunity')
   },
 
-    // {
+  //   {
   //   path: 'index1',
   //   name:'社区全景',
   //   component: () =>
   //     import( /* webpackChunkName: "views" */ '@/views/grid/index')
-  // },{
-  //   path: 'index2',
-  //   name:'社区态势',
-  //   component: () =>
-  //     import( /* webpackChunkName: "views" */ '@/views/grid/index2')
   // },
-  //   {
-  //     path: 'index21',
-  //     name:'园区态势',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/index2')
-  //   },{
-  //     path: 'index3',
-  //     name:'小区态势',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/index3')
-  //   },{
-  //     path: 'peopleManage',
-  //     name:'人员管理',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/peopleManage')
-  //   },{
-  //     path: 'carManage',
-  //     name:'车辆管理',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/carManage')
-  //   },{
-  //     path: 'houseManage',
-  //     name:'房屋管理',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/houseManage')
-  //   },{
-  //     path: 'contentUnion',
-  //     name:'智能设备',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/contentUnion')
-  //   }, {
-  //     path: 'videoSurveillance',
-  //     name:'监控设备',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/videoSurveillance')
-  //   }, {
-  //     path: 'fireControl',
-  //     name: '消防场景',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/fireControl')
-  //   }, {
-  //     path: 'fireDevices',
-  //     name: '消防设备态势分析',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/fireDevices')
-  //   },{
-  //     path: 'smartPension',
-  //     name:'智慧养老',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/smartPension')
-  //   },{
-  //     path: 'smartPolice',
-  //     name:'警务平台',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/smartPolice')
-  //   },{
-  //     path: 'policeData',
-  //     name:'公安数据',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/policeData')
-  //   }, {
-  //     path: 'operatePlatform',
-  //     name:'运营平台',
-  //     component: () =>
-  //       import( /* webpackChunkName: "views" */ '@/views/grid/operatePlatform')
-  //   },
+  {
+    path: 'index2',
+    name:'社区态势',
+    component: () =>
+      import( /* webpackChunkName: "views" */ '@/views/grid/index2')
+  },
+    {
+      path: 'index21',
+      name:'园区态势',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/index2')
+    },{
+      path: 'index3',
+      name:'小区态势',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/index3')
+    },{
+      path: 'peopleManage',
+      name:'人员管理',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/peopleManage')
+    },{
+      path: 'carManage',
+      name:'车辆管理',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/carManage')
+    },{
+      path: 'houseManage',
+      name:'房屋管理',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/houseManage')
+    },{
+      path: 'contentUnion',
+      name:'智能设备',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/contentUnion')
+    }, {
+      path: 'videoSurveillance',
+      name:'监控设备',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/videoSurveillance')
+    }, {
+      path: 'fireControl',
+      name: '消防场景',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/fireControl')
+    }, {
+      path: 'fireDevices',
+      name: '消防设备态势分析',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/fireDevices')
+    },{
+      path: 'smartPension',
+      name:'智慧养老',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/smartPension')
+    },{
+      path: 'smartPolice',
+      name:'警务平台',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/smartPolice')
+    },{
+      path: 'policeData',
+      name:'公安数据',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/policeData')
+    }, {
+      path: 'operatePlatform',
+      name:'运营平台',
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/grid/operatePlatform')
+    },
     {
     path: 'dashboard',
     name: '控制台',

src/views/base/region.vue

@@ -317,7 +317,7 @@
         column.disabled = true;
         this.treeCode = data.id;
         this.treeParentCode = data.parentId;
-        getDetail(this.treeCode).then(res => {
+        getDetail({code:this.treeCode}).then(res => {
           this.regionForm = res.data.data;
           this.regionForm.subCode = this.regionForm.code.replace(this.regionForm.parentCode, '');
         })

src/views/community/agency.vue

@@ -41,6 +41,7 @@ import {
 } from "@/util/validator"
 import CyExcelImport from "../../components/excel/cy-excel-import"
 import editPolygonMap from "../../components/residential/editPolygonMap.vue"
+import {getDetail as getRegDetail} from "@/api/base/region"
 export default {
   components: {CyExcelImport,editPolygonMap},
   data() {
@@ -302,6 +303,33 @@ export default {
     },
   },
   watch: {
+    'form.address': {
+      handler: function(value) {
+        if (!value){
+          return
+        }else{
+          var _this = this
+          AMap.plugin('AMap.Geocoder', function() {
+            var geocoder = new AMap.Geocoder({})
+            let lnglat = [_this.form.longitude,_this.form.latitude]
+            geocoder.getAddress(lnglat, function(status, result) {
+              if (status === 'complete'&&result.regeocode&&result.regeocode.addressComponent.township) {
+                let parentCode = result.regeocode.addressComponent.adcode
+                let name = result.regeocode.addressComponent.township
+                getRegDetail({"name":name,"regionLevel":"4","parentCode":parentCode}).then((res)=>{
+                  let data = res.data.data
+                  _this.form.regionCity = data.cityCode
+                  _this.form.regionProvince = data.provinceCode
+                  _this.form.regionArea = data.districtCode
+                  _this.form.regionStreet = data.code
+                  console.log(_this.form)
+                })
+              }
+            })
+          })
+        }
+      },
+    },
     'form.mapSelect': {
       handler: function(value) {
         if (!value){

src/views/grid/components/video2.vue

@@ -26,19 +26,33 @@
 
 <script>
   import {getDeviceVideo} from "@/api/grid/index.js";
+  require("../common/sockjs.min.js")
+  import Stomp from "stompjs"
+  import stompClient from "sockjs-client"
+  import {pushStream} from "@/api/device/videoclouddevice"
   export default{
     data(){
       return{
         // baseUrlVedio: "http://139.9.103.171/live?port=1935&app=myapp&stream=",
-        baseUrlVedio: "ws://36.103.228.148:8888/live/",
+        baseUrlVedio: "http://36.103.228.148:8888/live/",
         data:[],
         videoList:[],
         boxWidth:'25%',
-        switchIndex:true
+        switchIndex:true,
+        path:"ws://192.168.1.128:7006/ws",
+        socket:""
       }
     },
     mounted() {
-      this.getVedioData();
+      var _this = this
+      this.$nextTick(()=>{
+        _this.init()
+      })
+      // this.getVedioData();
+    },
+    destroyed () {
+        // 销毁监听
+        this.socket.onclose = this.close
     },
     props: {
       residential: {
@@ -48,6 +62,22 @@
     },
 
     methods:{
+      init(){
+        let socket = new SockJS('http://192.168.1.128:7006/ws');
+        let stompClient = Stomp.over(socket);
+        stompClient.connect({Referer:""}, ()=>{
+          stompClient.subscribe("/topic/" + 'asdfasd', (res)=> {
+            console.log(res)
+          });
+          stompClient.send("/wsapp/videocloud.addUser",{},JSON.stringify({sender: 'asdfasd', type: 'JOIN'})
+          )
+        }, ()=>{
+          console.log('连接失败')
+        });
+        pushStream({deviceNum:"64010500011327707125"}).then((res)=>{
+          console.log(res)
+        })
+      },
       switchLay(){
         var _this = this;
         this.switchIndex = !this.switchIndex
@@ -114,11 +144,11 @@
         let _this = this;
         let residentialName = this.residential.id;
         if (residentialName){
-          getDeviceVideo(residentialName).then(res => {
-            if (res.data.code == 200){
-              this.data = [];
-              const data = res.data.data;
-              data.forEach((item,index) => {
+          // getDeviceVideo(residentialName).then(res => {
+          //   if (res.data.code == 200){
+              this.data = ['64010600011327432977'];
+              // const data = res.data.data;
+              this.data.forEach((item,index) => {
                 let obj = {};
                 obj.src = this.baseUrlVedio + item.deviceNum + ".flv";
                 obj.name = item.deviceName;
@@ -127,9 +157,9 @@
                    _this.play(obj,index);
                 })
               })
-            }
+            // }
 
-          });
+          // });
         }
       }
     },

src/views/grid/index2.vue

@@ -2,6 +2,7 @@
   <div id="index2">
     <containerCmp v-if="agencies" :titHeader="agencies.agencyName" :index="2" :visitBoMenu="false">
       <div class="centerCmp">
+        <!-- <mapScene></mapScene> -->
         <mapCmp mapIndex="2" :zoom="13" :agencies="agencies" :residentials="residentials"></mapCmp>
       </div>
       <div class="centerTop">
@@ -68,9 +69,11 @@ import flowScrollBoard from "./components/flowScrollBoard.vue"
 import ammeterStat from "./components/ammeterStat.vue"
 import peopleThermometry from './components/peopleThermometry.vue'
 import {getUserInfo} from "../../util/util.js"
+import mapScene from "../../components/3DScene/3DScene.vue"
 export default {
   name: 'index2',
   components: {
+    mapScene,
     containerCmp,
     alarmScrollBoard,
     peopleScrollBoard,

src/views/grid/smartCommunity.vue

@@ -255,7 +255,7 @@ export default {
       alarmDetailData:null,
       alarmData:null,
       popupShow:false,
-      loadFinish:true,
+      loadFinish:false,
       alarmType:1,
       alarmTit:'',
       adCode:'',