管道基础大数据平台系统开发-【前端】-新系統界面
surprise
2024-02-05 fb98e10c76d7e6c2d01f3a9f8c1b727f905cbdca
代码更新
已添加1个文件
已修改9个文件
386 ■■■■■ 文件已修改
public/config/config.js 4 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/api.js 4 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/Screen/mapsdk.vue 42 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/chart/DataStorage.vue 32 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/chart/DataStorageType.vue 32 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/js/index.js 35 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/mapsdk.vue 66 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Archive/index.vue 26 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Synthesis/LeftMenu.vue 7 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Tools/LayerTree.vue 138 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
public/config/config.js
@@ -2,8 +2,8 @@
var isWeb = false;
var is_production = false;//判断是否为生产环境 //192.168.21.194
var webHost = isWeb ? "103.85.165.99" + ":8052" : '192.168.20.205' + ":8088";
// var webHost = isWeb ? "103.85.165.99" + ":8052" : '192.168.21.194' + ":12316";
// var webHost = isWeb ? "103.85.165.99" + ":8052" : '192.168.20.205' + ":8088";
var webHost = isWeb ? "103.85.165.99" + ":8052" : '192.168.20.106' + ":12316";
var fmeHost = isWeb ? "103.85.165.99" + ":8051" : '192.168.20.205' + ":88";
src/api/api.js
@@ -1220,3 +1220,7 @@
export function getArcGis(params){
  return service.get('https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/?callback=loadJsonp940826&f=json', { params: params });
}
src/components/Screen/mapsdk.vue
@@ -6,6 +6,7 @@
<script>
let yunxuanLayer = null
import mapMenu from '../js/index.js'
export default {
  name: "",
  components: {},
@@ -39,25 +40,9 @@
    // })
  },
  methods: {
    init3DMap() {
      //地图初始化
      // window.sgworld = new SmartEarth.SGWorld("Centermapdiv", {
      //   licenseServer: window.sceneConfig.licenseServer,
      // })
      // window.sgworld = new SmartEarth.SGWorld(
      //   "Centermapdiv",
      //   function () { }
      // )
      window.sgworld = new SmartEarth.SGWorld("Centermapdiv", {
        licenseServer: window.sceneConfig.licenseServer,
      });
      window.viewer = window.Viewer = window.sgworld._Viewer;
    initData() {
      if (is_production) {
        Viewer.imageryLayers.removeAll();
      }
      // Viewer.imageryLayers._layers[0].show = false
      sgworld.Navigate.jumpTo({      //跳转视角
@@ -148,6 +133,28 @@
      //背景透明
      Viewer.scene.backgroundColor = new Cesium.Color(0.0, 0.0, 0.0, 0.0)
    },
    init3DMap() {
      //地图初始化
      // window.sgworld = new SmartEarth.SGWorld("Centermapdiv", {
      //   licenseServer: window.sceneConfig.licenseServer,
      // })
      // window.sgworld = new SmartEarth.SGWorld(
      //   "Centermapdiv",
      //   function () { }
      // )
      window.sgworld = new SmartEarth.SGWorld("Centermapdiv", {
        licenseServer: window.sceneConfig.licenseServer,
      });
      window.viewer = window.Viewer = window.sgworld._Viewer;
      var data = mapMenu.init();
      data.then((res) => {
        if (!res) {
          mapMenu.addGaoDeMap();
        }
        this.initData();
      })
    },
  },
}
</script>
@@ -158,6 +165,7 @@
  height: 100%;
  width: 100%;
}
#Centermapdiv {
  height: 100%;
  width: 100%;
src/components/chart/DataStorage.vue
@@ -90,40 +90,12 @@
  data() {
    return {
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 å·",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 å¼„",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 å¼„",
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 å¼„",
        },
      ],
      config: {
        header: ["编号", "名称", "文件数"],
        data: [
          ["行1列1", "行1列2", "行1列3"],
          ["行2列1", "行2列2", "行2列3"],
          ["行3列1", "行3列2", "行3列3"],
          ["行4列1", "行4列2", "行4列3"],
          ["行5列1", "行5列2", "行5列3"],
          ["行6列1", "行6列2", "行6列3"],
          ["行7列1", "行7列2", "行7列3"],
          ["行8列1", "行8列2", "行8列3"],
          ["行9列1", "行9列2", "行9列3"],
          ["行10列1", "行10列2", "行10列3"],
        ],
        columnWidth: [40, 300, 50],
        align: ["center"],
src/components/chart/DataStorageType.vue
@@ -102,40 +102,12 @@
  data() {
    return {
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 å·",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 å¼„",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 å¼„",
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 å¼„",
        },
      ],
      config: {
        header: ["编号", "名称", "文件数"],
        data: [
          ["行1列1", "行1列2", "行1列3"],
          ["行2列1", "行2列2", "行2列3"],
          ["行3列1", "行3列2", "行3列3"],
          ["行4列1", "行4列2", "行4列3"],
          ["行5列1", "行5列2", "行5列3"],
          ["行6列1", "行6列2", "行6列3"],
          ["行7列1", "行7列2", "行7列3"],
          ["行8列1", "行8列2", "行8列3"],
          ["行9列1", "行9列2", "行9列3"],
          ["行10列1", "行10列2", "行10列3"],
        ],
        columnWidth: [40, 300, 50],
        align: ["center"],
src/components/js/index.js
¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,35 @@
const mapMenu = {
    async init() {
        var url = "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/?f=json"; // callback=loadJsonp
        var flag;
        $.ajax({
            type: "GET",
            url: url,
            data: null,
            async: false, // è®©Ajax同步
            timeout: 1500,
            success: function (data) {
                flag = true;
            },
            error: function (e) {
                flag = false;
            }
        });
        return flag;
    },
    addGaoDeMap() {
        Viewer.imageryLayers.removeAll();
        var base_ulr = window.sceneConfig.baseUrl;
        if (base_ulr.indexOf('{host}') > -1) {
            base_ulr = base_ulr.replace("{host}", iisHost)
        }
        Viewer.imageryLayers.addImageryProvider(
            new Cesium.UrlTemplateImageryProvider({
                url: base_ulr,
                maximumLevel: 5
            })
        );
    },
}
export default mapMenu;
src/components/mapsdk.vue
@@ -463,6 +463,7 @@
} from '../api/api'
import { getToken } from '@/utils/auth'
import * as echarts from "echarts"
import mapMenu from "./js/index";
import axios from 'axios';
export default {
  name: "",
@@ -942,46 +943,10 @@
        window.TerrainFlattening && window.TerrainFlattening.remove();
      }
    },
    addGaoDeMap() {
      Viewer.imageryLayers.removeAll();
      var base_ulr = window.sceneConfig.baseUrl;
      if (base_ulr.indexOf('{host}') > -1) {
        base_ulr = base_ulr.replace("{host}", iisHost)
      }
      Viewer.imageryLayers.addImageryProvider(
        new Cesium.UrlTemplateImageryProvider({
          url: base_ulr,
          maximumLevel: 5
        })
      );
    initData() {
    },
    init3DMap() {
      var webKey = "94a34772eb88317fcbf8428e10448561";
      //地图初始化
      window.sgworld = new SmartEarth.SGWorld("mapdiv", {
        licenseServer: window.sceneConfig.licenseServer,
      });
      var url = "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/?callback=loadJsonp940826&f=json"
      $.ajax({
        url: url,
        timeout: 1500, // è¯·æ±‚è¶…æ—¶æ—¶é—´
        async: true,
        type: "GET",
        success: (res) => {
          console.log("在线地址获取成功")
        },
        error: (res) => {
          console.log("在线地址获获取失败")
         this.addGaoDeMap();
        }
      })
      window.Viewer = window.sgworld._Viewer;
      if (is_production) {
        this.addGaoDeMap();
        mapMenu.addGaoDeMap();
      }
      //定位
      // sgworld.Navigate.jumpTo({
@@ -1046,6 +1011,31 @@
      window.terrainFlag = 'MPT'
      window.elevationTool = new SmartEarth.ElevationTool(window.sgworld);
      elevationTool.setContourColor("#F1D487");
      this.$bus.$emit('addImageLayer', true);
    },
    init3DMap() {
      var webKey = "94a34772eb88317fcbf8428e10448561";
      //地图初始化
      window.sgworld = new SmartEarth.SGWorld("mapdiv", {
        licenseServer: window.sceneConfig.licenseServer,
      });
      window.Viewer = window.sgworld._Viewer;
      if (is_production) {
        this.initData();
      } else {
        var data = mapMenu.init();
        data.then((res) => {
          if (!res) {
            mapMenu.addGaoDeMap();
          }
          this.initData();
        })
      }
    },
    //dem切换
    changeTerrainLayer() {
src/views/Archive/index.vue
@@ -2568,7 +2568,7 @@
      this.listData.dirs = "";
      this.listData.types = ""
      if (this.formInline.category.length != 0) {
        this.listData.dirs += this.formInline.category.toString();
        // this.listData.dirs += this.formInline.category.toString();
      }
      var val_data = this.formInline.category;
@@ -2618,7 +2618,9 @@
      this.listData.dirs = "";
      if (this.formInline.category.length != 0) {
        this.listData.dirs += this.formInline.category.toString();
        this.listData.types = this.formInline.category.toString();
      }else{
        this.listData.types=null;
      }
      if (this.formInline.item.length != 0) {
        if (this.listData.dirs.length != 0) {
@@ -2677,12 +2679,22 @@
    },
    //获取资料类别数据
    async getCategorySelectData() {
      const data = await dataLib_selectDirTypes();
      if (data.code != 200) {
        this.$message.error('资料类别列表调用失败');
      }
      // const data = await dataLib_selectDirTypes();
      // if (data.code != 200) {
      //   this.$message.error('资料类别列表调用失败');
      // }
      this.categoryOptions = data.result;
      this.categoryOptions = [
        {key:'基础测绘',value:'基础测绘'},
        {key:'基础地灾',value:'基础地灾'},
        {key:'基础勘察',value:'基础勘察'},
        {key:'合规数据',value:'合规数据'},
        {key:'管理数据',value:'管理数据'},
        {key:'测绘(ESV)',value:'测绘(ESV)'},
        {key:'勘察(EGE)',value:'勘察(EGE)'},
        {key:'地灾(EGD)',value:'地灾(EGD)'},
        {key:'洞库(EGD)',value:'洞库(EGD)'},
      ];
    },
    //关键字查询
    setSearchKeyWords() {
src/views/Synthesis/LeftMenu.vue
@@ -3194,8 +3194,13 @@
    this.$store.state.treeData = null;
    this.$store.state.checkedKeys = [];
    // this.setCoverage("a1");
    this.layersStart();
    // this.layersStart();
    this.$bus.$on('addImageLayer',  (res)=>{
      if(res){
        this.layersStart();
      }
    });
    this.$bus.$on("setDialogInsertVisible", (res) => {
      if (res == true) {
src/views/Tools/LayerTree.vue
@@ -2,113 +2,49 @@
  <div class="lalala tree-container">
    <el-form ref="form">
      <el-form-item>
        <el-select
          v-model="$store.state.pigCode"
          clearable
          filterable
          style="width :100%"
          @change="prjChanged"
          placeholder="请选择项目"
        >
          <el-option
            v-for="item in menus"
            :key="item.code"
            :label="item.name"
            :value="item.code"
          >
        <el-select v-model="$store.state.pigCode" clearable filterable style="width :100%" @change="prjChanged"
          placeholder="请选择项目">
          <el-option v-for="item in menus" :key="item.code" :label="item.name" :value="item.code">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-input
          placeholder="输入关键字进行过滤"
          v-model="filterText"
          class="search"
        >
        <el-input placeholder="输入关键字进行过滤" v-model="filterText" class="search">
        </el-input>
      </el-form-item>
    </el-form>
    <el-tree
      ref="tree"
      :data="treeData"
      node-key="id"
      show-checkbox
      :props="defaultProps"
      @node-click="handleLeftclick"
      @node-contextmenu="rightClick"
      @check="handleCheckChange"
      :default-checked-keys="handleTreeCheck"
      :expand-on-click-node="false"
      :filter-node-method="filterNode"
    >
      <span
        class="slot-t-node"
        slot-scope="{ node, data }"
      >
    <el-tree ref="tree" :data="treeData" node-key="id" show-checkbox :props="defaultProps" @node-click="handleLeftclick"
      @node-contextmenu="rightClick" @check="handleCheckChange" :default-checked-keys="handleTreeCheck"
      :expand-on-click-node="false" :filter-node-method="filterNode">
      <span class="slot-t-node" slot-scope="{ node, data }">
        <span v-show="!data.isEdit">
          <span :class="[data.id >= 99 ? 'slot-t-node--label' : '']">{{
                              node.label
                            }}</span>
            node.label
          }}</span>
        </span>
        <span v-show="data.isEdit">
          <el-input
            class="slot-t-input"
            size="mini"
            autofocus
            v-model="data.label"
            :ref="'slotTreeInput' + data.id"
            @blur.stop="nodeBlur(node, data)"
            @keydown.native.enter="nodeBlur(node, data)"
          ></el-input>
          <el-input class="slot-t-input" size="mini" autofocus v-model="data.label" :ref="'slotTreeInput' + data.id"
            @blur.stop="nodeBlur(node, data)" @keydown.native.enter="nodeBlur(node, data)"></el-input>
        </span>
      </span>
    </el-tree>
    <el-card
      class="box-card"
      ref="card"
      :style="{ ...rightClickMenuStyle }"
      v-show="menuVisible"
    >
      <div
        class="edit"
        @click="showLayerAttribute()"
        v-if="showProp && !shwoHistogram"
      >
    <el-card class="box-card" ref="card" :style="{ ...rightClickMenuStyle }" v-show="menuVisible">
      <div class="edit" @click="showLayerAttribute()" v-if="showProp && !shwoHistogram">
        <i class="el-icon-tickets"></i>&nbsp;&nbsp;属性
      </div>
      <div
        class="edit"
        @click="positioning()"
        v-if="showLocal"
      >
      <div class="edit" @click="positioning()" v-if="showLocal">
        <i class="el-icon-tickets"></i>&nbsp;&nbsp;定位
      </div>
      <div
        class="edit"
        @click="pellucidity()"
        v-if="showOpacity"
      >
      <div class="edit" @click="pellucidity()" v-if="showOpacity">
        <i class="el-icon-tickets"></i>&nbsp;&nbsp;透明度
      </div>
      <div
        class="edit"
        @click="histogram()"
        v-show="shwoHistogram"
      >
      <div class="edit" @click="histogram()" v-show="shwoHistogram">
        <i class="el-icon-tickets"></i>&nbsp;&nbsp;钻孔柱状图
      </div>
      <div
        class="edit"
        v-show="shwoTileDown"
        @click="tileDownload()"
      >
      <div class="edit" v-show="shwoTileDown" @click="tileDownload()">
        <i class="el-icon-download"></i>&nbsp;&nbsp;瓦片下载
      </div>
      <div
        class="edit"
        v-show="shwoAnnex"
        @click="annexDownload()"
      >
      <div class="edit" v-show="shwoAnnex" @click="annexDownload()">
        <i class="el-icon-tickets"></i>&nbsp;&nbsp;附件
      </div>
    </el-card>
@@ -287,7 +223,15 @@
      this.shwoTileDown = ["TMS", "DOM"].indexOf(object.serveType) > -1 && object.pubid; // ç“¦ç‰‡ä¸‹è½½
      this.menuVisible = this.showProp || this.shwoHistogram || this.showLocal || this.showOpacity || this.shwoTileDown; // èœå•
      this.shwoAnnex = ['DEM', 'TMS'].indexOf(object.serveType) > -1;//附件
      this.$refs.card.$el.style.left = event.pageX + 20 + "px";
      var left = window.innerWidth - 140;
      var pageLeft = event.pageX + 20
      if(pageLeft>left){
        pageLeft = left - 25
      }
      this.$refs.card.$el.style.left =pageLeft+ "px";
      this.$refs.card.$el.style.top = event.pageY + "px";
    },
    // å±žæ€§æ˜¾ç¤º
@@ -917,7 +861,7 @@
</script>
<style scoped lang="less">
/* ç‚¹å‡»èŠ‚ç‚¹æ—¶çš„é€‰ä¸­é¢œè‰² */
.tree-container /deep/.el-tree-node.is-current > .el-tree-node__content {
.tree-container /deep/.el-tree-node.is-current>.el-tree-node__content {
  color: #409eff !important;
}
@@ -949,19 +893,19 @@
  padding-left: 16px;
}
.tree-container /deep/ .el-tree > .el-tree-node:before {
.tree-container /deep/ .el-tree>.el-tree-node:before {
  border-left: none;
}
.tree-container /deep/ .el-tree > .el-tree-node:after {
.tree-container /deep/ .el-tree>.el-tree-node:after {
  border-top: none;
}
.tree-container /deep/ .el-tree > .el-tree-node:before {
.tree-container /deep/ .el-tree>.el-tree-node:before {
  border-left: none;
}
.tree-container /deep/ .el-tree > .el-tree-node:after {
.tree-container /deep/ .el-tree>.el-tree-node:after {
  border-top: none;
}
@@ -1024,11 +968,7 @@
  z-index: 8;
}
.tree-container
  /deep/
  .el-tree-node
  .el-tree-node__children
  .el-tree-node__content::before {
.tree-container /deep/ .el-tree-node .el-tree-node__children .el-tree-node__content::before {
  border-left: 0px dashed #ccc;
  height: 100%;
  top: 0;
@@ -1048,7 +988,7 @@
}
.tree-container /deep/ .el-tree-node {
  .is-leaf + .el-checkbox .el-checkbox__inner {
  .is-leaf+.el-checkbox .el-checkbox__inner {
    display: inline-block;
  }
@@ -1057,11 +997,7 @@
  }
}
.tree-container
  /deep/
  .el-tree-node
  .el-tree-node__children
  .el-tree-node__content::after {
.tree-container /deep/ .el-tree-node .el-tree-node__children .el-tree-node__content::after {
  border-top: 0px dashed #ccc;
}
@@ -1079,7 +1015,7 @@
/deep/.el-card__body {
  padding: 10px !important;
  > div {
  >div {
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;