代码更新

surprise

2024-01-10 8f85627f215bd0ee61db7a35ca9a83eaca1e892c

代码更新

 src/api/api.js

@@ -53,17 +53,26 @@

export function Img_DeleteByIds(params) {
  //请求地址
  return service.get("Img/DeleteByIds?ids=" + params);
  return service.get("/Img/DeleteByIds?ids=" + params);
}


export function Grid_SelectById(params) {
  //请求地址
  return service.get("Grid/SelectById?id=" + params);
  return service.get("/Grid/SelectById?id=" + params);
}
export function Grid_Insert(params) {
  //请求地址
  return service.post("Grid/Insert", params);
  return service.post("/Grid/Insert", params);
}
 
export function Grid_UpdateById(params) {
  //请求地址
  return service.post("/Grid/UpdateById", params);
}
export function Grid_DeleteByIds(params) {
  //请求地址
  return service.get("/Grid/DeleteByIds?ids=" + params);
}
 
//京办登录

 src/assets/img/right/gewang.png

 src/assets/img/right/tongji.png

 src/assets/js/Layer/drawGrid.js

@@ -154,15 +154,62 @@

        store.state.isshowGrid = false;

        this.drawPoint(res);
        // this.drawPoint(res);
        this.drawRects(res)

    },

    drawRects: function (res) {
        this.cc = 0;
        var rect = viewer.entities.getById(this.id);
        if (!rect) return;
        var points = rect.polygon.hierarchy.getValue().positions;
        viewer.entities.removeAll(); // viewer.entities.remove(rect);

        var r0 = Cesium.Cartographic.fromCartesian(points[0]);
        var r1 = Cesium.Cartographic.fromCartesian(points[1]);
        var r2 = Cesium.Cartographic.fromCartesian(points[2]);

        var p0 = turf.point([(r0.longitude * 180) / Math.PI, (r0.latitude * 180) / Math.PI]);
        var p1 = turf.point([(r1.longitude * 180) / Math.PI, (r1.latitude * 180) / Math.PI]);
        var p2 = turf.point([(r2.longitude * 180) / Math.PI, (r2.latitude * 180) / Math.PI]);

        // åšæˆ 3 * 4 çš„网格
        // var wCount = 3, hCount = 4;
        var wCount = res.col, hCount = res.row;
        this.flag = parseInt(wCount) * parseInt(hCount);
        var op = { units: "meters", };
        var wStep = turf.distance(p0, p1, op) / wCount;
        var hStep = turf.distance(p1, p2, op) / hCount;
        var wAngle = turf.bearing(p0, p1);
        var hAngle = turf.bearing(p1, p2);
        this.removeRect();
        for (var i = 0; i < wCount; i++) {
            var ds = turf.destination(p0, wStep * i, wAngle, op);
            for (var j = 0; j < hCount; j++) {
                var d1 = turf.destination(ds.geometry.coordinates, hStep * j, hAngle, op);
                var d2 = turf.destination(d1.geometry.coordinates, wStep, wAngle, op);
                var d3 = turf.destination(d2.geometry.coordinates, hStep, hAngle, op);
                var d4 = turf.destination(d1.geometry.coordinates, hStep, hAngle, op);

                // var arr = [d1.geometry.coordinates, d2.geometry.coordinates, d3.geometry.coordinates, d4.geometry.coordinates];
                var arr = [
                    [d1.geometry.coordinates[0], d1.geometry.coordinates[1], 18],
                    [d2.geometry.coordinates[0], d2.geometry.coordinates[1], 18],
                    [d3.geometry.coordinates[0], d3.geometry.coordinates[1], 18],
                    [d4.geometry.coordinates[0], d4.geometry.coordinates[1], 18],
                    [d1.geometry.coordinates[0], d1.geometry.coordinates[1], 18]
                ]
                this.setInsertGridData(arr, ((i + 1) * (j + 1)));
            }
        }
    },
    async setInsertGridData(res, num) {
        var obj =
        {
            "type": "Feature",
            "properties":
                { "ID": num, "NAME": "Area8", "REMARK": "" },
                { "ID": num, "NAME": "Area" + num, "REMARK": "", "TYPE": 'DrawGrid' },
            "geometry":
            {
                "type": "Polygon",
@@ -171,13 +218,10 @@
                ]
            }
        }

        const data = await Grid_Insert({ json: JSON.stringify(obj) })
        if (data.status == 200) {
            this.ids.push(data.data)
        }

        if (this.flag == num) {
            if (this.ids.length == this.flag) {
            var obj = {
                id: new Date().getTime(),
                sourceType: 'DrawGrid',
@@ -190,5 +234,8 @@
            Bus.$emit("addOtherData", "对象", obj);
        }
    }


    }
};
export default drawGrid

 src/assets/js/Layer/mapGeo.js

@@ -1,9 +1,10 @@
var source = []
import { Grid_SelectById } from '@/api/api'
import { Grid_SelectById ,Grid_DeleteByIds} from '@/api/api'
const mapGeo = {
    source1: null,
    type: null,
    feature: [],
    gridId: null,
    init(res) {
        if (this.type && this.type === res) {
            return this.type = null
@@ -33,31 +34,52 @@
    addGridLayer(res) {
        var ids = res.style.ids;
        var length = ids.length ;

        if (res.id == this.gridId) {
            this.gridId = null;
            return
        }
        this.gridId = res.id;
        this.feature = [];
        for (var i = 0; i < length; i++) {
            this.getGridids(ids[i], length-1, i);
            this.getGridids(ids[i], length);
        }
    },
    delGridLayer(res) {
        if(!res)return
        Viewer.dataSources.remove(Viewer.dataSources.getByName(res.id)[0])
    },
    removeGridData(res) {
        this.delGridLayer(res);
        var ids = res.style.ids;
        for (var i = 0; i < ids.length; i++) {
            this.delGridIds(ids[i]);
        }
    },
    async delGridIds(res) {
        console.log(res)
        const data = await Grid_DeleteByIds(res);
    },
    async getGridids(id, length, index) {
        const data = await Grid_SelectById(id)
        if (data.status == 200) {
            this.feature.push(data.data.features[0])
        }
        console.log(index,length)
        if (index == length) {
            var val_data = data.data.features[0];
            val_data.properties["gid"] = id;
            this.feature.push(val_data)
            if (this.feature.length == length) {
            var feature = {
                "type": "FeatureCollection",
                "name": "wangge",
                "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } },
                "features": this.feature,
            }
            console.log(feature);

            this.addGridMenuGeoJson(feature)
        }
        }


    },
    addGridMenuGeoJson(res){
        console.log(res);
        var data = Cesium.GeoJsonDataSource.load(res, //要加载的 url、GeoJSON å¯¹è±¡æˆ– TopoJSON å¯¹è±¡ã€‚
            {
                stroke: Cesium.Color.ORANGE, //折线和多边形轮廓的默认颜色。
@@ -66,7 +88,7 @@
            }
        )
        data.then((dataSource) => {
            dataSource.name = "格网"
            dataSource.name = this.gridId;
            Viewer.dataSources.add(
                dataSource
            );

 src/assets/js/Layer/mapInfo.js

@@ -20,7 +20,9 @@
        this.mssageInfo = null;
           store.state.isShowImgUpDate = false; 
        store.state.isShowImgUrl= null;
        this.propertyNames=null
        this.propertyNames=null;
        store.state.isireamUrl = null;
        store.state.isShowMenuCount = false;
     
    },
    setGeoJsonInfo(res) {

 src/assets/js/Layer/mapViewer.js

@@ -37,14 +37,22 @@
                store.state.isShowMeasureCoord = true;
            }
            if (Cesium.defined(nPickFeature)) {
                console.log(nPickFeature);
                mapInfo.setRestLayer();
                if (nPickFeature.id && nPickFeature.id.id == 'Rectangle') 
                return

                if (nPickFeature.id && nPickFeature.id.properties) {
                    mapInfo.setGeoJsonInfo(nPickFeature.id.properties)

                } else if (nPickFeature && nPickFeature.getProperty("name")) {
                    if (nPickFeature.getProperty("name") == "DLJQT0007") {
                    var name = nPickFeature.getProperty("name");
                    if (name == "DLJQT0007") {
                        store.state.isShowVideo = true;
                    } else if (name == "sensor001") {

                    } else if (name == "DLLMJ0001") {
                        store.state.isireamUrl = "/Data/html/hd3dmap.html?id=3493&type=8";
                        store.state.isShowMenuCount = true;
                    }
                }
            }

 src/components/index.vue

@@ -60,6 +60,7 @@
    <meu-grid v-if="$store.state.isshowGrid"></meu-grid>
    <batch-grid-menu v-if="$store.state.isshowBatchGrid"></batch-grid-menu>
    <map-video  v-if="$store.state.isShowVideo"></map-video>
    <map-ifeam v-if="$store.state.isShowMenuCount"></map-ifeam>
  </div>
</template>

@@ -85,6 +86,7 @@
import batchGridMenu from "@/components/left/layerTree/batchGridMenu.vue";
import mapVideo from "@/components//left/layerTree/mapVideo.vue";
import BatchGridMenu from './left/layerTree/batchGridMenu.vue';
import mapIfeam from "./left/layerTree/mapIfeam.vue";
export default {
  name: "index",
  components: {
@@ -107,7 +109,8 @@
    meuGrid,
    batchGridMenu,
    mapVideo,
    BatchGridMenu
    BatchGridMenu,
    mapIfeam
  },
  data() {
    return {

 src/components/left/layerTree/Layer.vue

@@ -630,6 +630,12 @@
        } else {
          mapOL.removeLayerData(treeNode);
        }
      }else if(treeNode.sourceType == "DrawGrid"){
        if (isCheck) {
          mapGeo.addGridLayer(treeNode);
        } else {
          mapGeo.delGridLayer(treeNode);
        }
      }
      // åªèƒ½åŒæ—¶åŠ è½½ä¸€ä¸ªåœ°å½¢
      if (
@@ -1001,6 +1007,9 @@
      if (this.selectNode.sourceType === "imgUp") {
        this.removeimgUpData(this.selectNode)
      }
      if (this.selectNode.sourceType === "DrawGrid") {
        mapGeo.removeGridData(this.selectNode)
      }
      this.remove(this.selectNode);
      this.$refs.tree && this.$refs.tree.setCurrentKey(null);
      this.selectNode = undefined;

 src/components/left/layerTree/mapIfeam.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,112 @@
<template>
  <div id="mapInfo" class="modelBox">
    <div>
      <div class="modleTitle ">
        <div>详情</div>
        <div class="modelClose" @click="$store.state.isShowMenuCount = false"> X</div>
      </div>
    </div>
    <div class="modelContent ">
      <div>
        <iframe :src="src" width="100%" height="100%" frameborder="0" scrolling="auto"></iframe>
      </div>
    </div>


  </div>
</template>

<script>

export default {
  name: "maoIfeam",
  components: {

  },

  data() {
    return {
      src: null,
      srcList: null,
    };
  },
  mounted() {
    this.setLayerStart();
  },
  destroyed() {

  },

  methods: {

    setLayerStart() {
      this.src = layerData.config.BASE_URL + this.$store.state.isireamUrl;
    },

    setUrl(res) {
      this.url = res;


    }

  }
};
</script>

<style scoped lang="less">
.modelBox {
  width: 45%;
  height: 70%;
  border: 1px solid white;
  top: 15%;
  left: 25%;

  background-color: rgba(0, 0, 0, 0.6); // #0048fd69 !important
  z-index: 9999;
  position: absolute;


  .modleTitle {
    height: 42px;
    width: 90%;
    background: #0048fd69 !important;
    border-bottom: 1px solid white;
    color: white;
    font-weight: 700px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0% 5%;

    .modelClose {
      height: 16px;
      width: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(128, 128, 128, 0.6);
      font-size: 14x;

    }
  }

  .modelContent {
    width: calc(100% - 20px);
    height: calc(100% - 42px);
    padding: 10px 10px;

    position: absolute;

    div {
      width: 100%;
      height: calc(100% - 20px);
    }




  }


}
</style>

 src/components/left/layerTree/messageInfo.vue

@@ -5,7 +5,8 @@
        <div>属性信息</div>
        <div class="modelmenu">
          <div v-show="showMenuGrid">
            <el-link style="color: white;font-size: 14x;">编辑</el-link>
            <el-link v-show="disabled" @click="disabled = false" style="color: white;font-size: 14x;">编辑</el-link>
            <el-link v-show="!disabled" @click="setObjSave" style="color: white;font-size: 14x;">保存</el-link>
          </div>
          <div class="modelClose" @click="$store.state.showMessageInfo = false"> X</div>
        </div>
@@ -21,7 +22,10 @@
        <div>{{ item.name }}</div>
        <div v-show="item.name == 'ID'">{{ item.value }}
        </div>
        <div v-show="item.name != 'ID'"><el-input style="width: 100%;" v-model="item.value" placeholder=""></el-input>
        <div v-show="item.name == 'type'">{{ item.value }}
        </div>
        <div v-show="item.name != 'ID' && item.name != 'type'"><el-input style="width: 100%;  text-align: center;"
            v-model="item.value" :disabled="disabled"></el-input>
        </div>
      </div>
    </div>
@@ -32,7 +36,7 @@
<script>
import model from '../../../assets/js/Layer/model';
import mapInfo from '../../../assets/js/Layer/mapInfo';
import {Grid_SelectById} from '@/api/api'
import { Grid_SelectById, Grid_UpdateById } from '../../../api/api'
export default {
  name: "modelEdit",
  components: {
@@ -43,6 +47,9 @@
    return {
      modelOption: null,
      showMenuGrid: false,
      disabled: true,
      gid: null,
      obj: null,
    };
  },
  mounted() {
@@ -52,41 +59,78 @@

  },
  methods: {

    setLayerStart() {
      this.obj = null;
      var data = mapInfo.mssageInfo;
      if (!data) {
        this.$store.state.showMessageInfo = false;
        return
      }
      var flag = false;
      var id=null;
      // for(var i in data){
      //   if(data[i].name == '类型' && data[i].value =='网格'){
      //     flag = true;
      //   }
      //   if(data[i].name =='ID'){
      //     id=data[i].value;
      //   }
      // }
      // if(flag){
      //   this.getInfoMessage(id)
      // }else{
      //   this.setInfoMesgData(data);
      // }
      for (var i in data) {
        if (data[i].name == "TYPE" && data[i].value == 'DrawGrid') {
          flag = true;
          break;
        }
      }
      if (flag) {
        for (var i in data) {
          if (data[i].name == "gid") {
            this.gid = data[i].value
            this.getInfoMessage(this.gid);
            break;
          }
        }

      } else {
      this.setInfoMesgData(data);
      }
    },
    setInfoMesgData(res) {
      this.modelOption = res
    },
    async setObjSave() {
      var properties = this.obj.features[0].properties;
      for (var key in properties) {
        for (var i in this.modelOption) {
          if (this.modelOption[i].name == key) {
            properties[key] = this.modelOption[i].value
          }
        }
      }
      const data = await Grid_UpdateById({
        id: this.gid,
        json: JSON.stringify(this.obj.features[0])
      });
      if (data.status == 200) {
        this.$message({
          message: "保存成功",
          type: "success",
        });
        this.disabled = true;
      }
    },
   async getInfoMessage(res){
      const data = await Grid_SelectById(res);
       if(data.status == 200){
        this.obj = data.data;
        var properties = this.obj.features[0].properties;
        console.log(data.data.features[0])
        var std = [];
        for (var key in properties) {
          std.push({
            name: key,
            value: properties[key]
          })
        }
        this.showMenuGrid = true
        this.modelOption = std;

       }
    }
  }

  },

};
</script>

@@ -131,6 +175,7 @@
      font-size: 14x;
      margin-left: 20px;


    }
  }

@@ -157,6 +202,7 @@
        // margin-bottom: 5%;
        line-height: 50px;
        border-right: 1px solid white;
        border-top: 1px solid white !important;
      }

      div:first-child {
@@ -167,8 +213,8 @@
    }

    .contentMessage:first-child {
      border-top: 1px solid white;
      ;
      border-top: 1px solid white !important;

    }
  }


 src/components/menu/menulist.vue

@@ -25,12 +25,16 @@
        </div>

        <div class="menubtn" @click="setMenuGrid()">
          <img class="bhImg" title="格网" src="@/assets/img/right/cx-s.png" />
          <img class="bhImg" title="格网" src="@/assets/img/right/gewang.png" />
          <span>格网</span>
        </div>  
        <div class="menubtn" @click="setMenuQuery()">
          <img class="bhImg" title="查询" src="@/assets/img/right/queyr.png" />
          <span>查询</span>
        </div>
        <div class="menubtn" @click="setMenuCount()">
          <img class="bhImg" title="统计" src="@/assets/img/right/tongji.png" />
          <span>统计</span>
        </div>
        <div class="menubtn" @click="setImgUpDate()">
          <input id="imgs" type="file" multiple="multiple" v-show="false" @change="setImgUpload" accept=".jpg,.png" />
@@ -271,6 +275,10 @@
    setMenuGrid() {
      drawGrid.drawRect();
    },
    setMenuCount(){
      this.$store.state.isireamUrl = "/Data/html/index.html"
      this.$store.commit("setMenuCount", true)
    },
    setImgUpDate() {
      // this.$store.commit("setImgUpdate",true)


 src/store/index.js

@@ -53,6 +53,8 @@
    isShowVideo: false,
    isshowBatchGrid: false,
    batchGridArr: [],
    isShowMenuCount:false,
    isireamUrl:null,
  },
  mutations: {
    selectedLayer(state, b) {
@@ -114,6 +116,9 @@
    setMenuQuery(state, b) {
      state.isShowMenuQuery = b;
    },
    setMenuCount(state, b) {
      state.isShowMenuCount = b;
    },
    setImgUpdate(state, b) {
      state.isShowImgUpDate = b;
    },