大屏更新

src/config/bigScreenConfig.js

@@ -43,7 +43,9 @@ export const appconfig = {
           },
           "gcgdcj": {
             "name": "设计管网",
-            "url": "http://192.168.2.238:8090/iserver/services/3D-hbyc_sj/rest/realspace"
+            // "url": "http://192.168.2.238:8090/iserver/services/3D-hbyc_sj/rest/realspace"
+            "url": "http://192.168.2.20:8090/iserver/services/3D-hbyc_sj_20220808/rest/realspace"
+
           }
         }
       },
@@ -53,7 +55,7 @@ export const appconfig = {
         "config": {
           "sjdt": {
             "name": "设计管线",
-            "url": "http://192.168.2.238:8090/iserver/services/map-sxgk_yc/rest/maps/hnyy_sj"
+            "url": "http://192.168.2.20:8090/iserver/services/map-sxgk_yc/rest/maps/hnyy_sj"
           },
         }
       },
@@ -63,13 +65,11 @@ export const appconfig = {
         "config": {
           "sjfw": {
             "name": "宜昌数据服务",
-            // "url": "http://192.168.2.238:8090/iserver/services/data-sxgk_yc/rest/data"
-            "url": "http://192.168.2.238:8090/iserver/services/data-sxgk/rest/data"
+            "url": "http://192.168.2.20:8090/iserver/services/data-sxgk_yc/rest/data"
           },
           "bjsmidfw": {
             "name": "部件SMID查询",
-            // "url": "http://192.168.2.238:8090/iserver/services/map-sxgk_yc/rest/maps/hnyy_query"
-            "url": "http://192.168.2.238:8090/iserver/services/map-sxgk/rest/maps/hnyy_query"
+            "url": "http://192.168.2.20:8090/iserver/services/map-sxgk_yc/rest/maps/hnyy_query"
           },
         }
       },

src/views/groupPage/components/ComCardBox.vue

@@ -50,7 +50,6 @@ export default class ComCardBox extends Vue {
   left: 0.260417rem /* 50/192 */;
   top: -0.520833rem /* 100/192 */;
   position: absolute;
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
   color: #fff;
   .box {
     position: relative;

src/views/groupPage/components/ComTreeList.vue

@@ -0,0 +1,94 @@
+<template>
+  <div class="widget-ComTreeList">
+    <el-select
+      ref="stlectTree"
+      v-model="treeSelectText"
+      placeholder=""
+      clearable
+      filterable
+      :filter-method="filterMethod"
+      @clear="clearInput"
+      size="small"
+    >
+      <el-option :value="treeValue.id" :label="treeValue.label" style="max-width: 260px; height: auto; padding: 0">
+        <el-tree
+          :data="datas"
+          :props="defaultProps"
+          :expand-on-click-node="false"
+          node-key="pbsTree"
+          highlight-current
+          @node-click="nodeClick"
+          :filter-node-method="filterNode"
+          ref="tree"
+        />
+      </el-option>
+    </el-select>
+  </div>
+</template>
+
+<script lang="ts">
+import { pbsTreeList_api } from '@/api/APIs'
+import { Vue, Component, Prop, Watch } from 'vue-property-decorator'
+//公共结构树列表
+@Component({ name: 'ComTreeList' })
+export default class ComTreeList extends Vue {
+  @Prop(Number) prjId!: number
+  treeSelectText = ''
+  treeValue = { id: '', label: '' }
+  datas = []
+  defaultProps = {
+    children: 'children',
+    label: 'name'
+  }
+  created() {
+    this.getPbsTree()
+  }
+  async getPbsTree() {
+    const res = await pbsTreeList_api({ prjId: this.prjId })
+    const { code, result } = res
+    if (code === 1) {
+      function formatTree(obj) {
+        const copyedObj = JSON.parse(JSON.stringify(obj)) // 深拷贝源数据
+        return copyedObj.filter((parent) => {
+          const findChildren = copyedObj.filter(
+            (child) => parent.id === child.pid && child.levelname != '分部工程（专业）'
+          )
+          findChildren.length > 0 ? (parent.children = findChildren) : delete (parent as any).children
+          return parent.pid === null // 返回顶层，依据实际情况判断这里的返回值
+        })
+      }
+      if (result[0]) this.datas = formatTree(result[0].structures)
+    } else {
+      this.$message.error('信息获取失败')
+    }
+  }
+  // 点击tree节点
+  nodeClick(item) {
+    const { id, name, code } = item
+    this.treeValue.id = id
+    this.treeValue.label = name
+    this.treeSelectText = name
+    ;(this.$refs.stlectTree as any).blur()
+    //项目改变
+    let emitInfo = item
+    this.$emit('changeProjectName', emitInfo)
+  }
+  // 搜索逻辑
+  filterMethod(value) {
+    ;(this.$refs.tree as any).filter(value)
+  }
+  // tree节点过滤
+  filterNode(value, data) {
+    if (!value) return true
+    return data.name.indexOf(value) !== -1
+  }
+  clearInput() {
+    ;(this.$refs.tree as any).filter('')
+    //项目改变
+    this.$emit('changeProjectName', '')
+  }
+}
+</script>
+
+<style lang="scss">
+</style>

src/views/groupPage/districtPageModules/commonModules/PropertiesView.vue

@@ -179,11 +179,6 @@ export default class PropertiesView extends Vue {
   margin-right: var(--right); //2.34375rem /* 450/192 */;
   position: absolute;
   right: 0;
-  //size
-  //background
-  background-color: rgba(20, 24, 47, 0.5);
-  color: #eee;
-  box-shadow: 0 0 20px rgba(1, 9, 20, 1);
   //font
   font-family: Source Han Sans CN;
   .wrap {

src/views/groupPage/districtPageModules/commonModules/SearchBox.vue

@@ -7,12 +7,17 @@
   >
     <div class="widget-SearchBox" ref="widget-SearchBox">
       <div class="search">
-        <el-input placeholder="" v-model="inputText" class="input-with-select" size="small" clearable>
-          <el-select v-model="selectValue" slot="prepend" placeholder="请选择" :popper-append-to-body="false">
-            <el-option label="工程" value="1"></el-option>
+        <el-input placeholder="" v-model="searchInput" class="input-with-select" size="small" clearable>
+          <el-select v-model="selectType" slot="prepend" placeholder="请选择" :popper-append-to-body="false">
+            <el-option label="工程" value="4"></el-option>
           </el-select>
-          <el-button slot="append" icon="el-icon-search"></el-button>
+          <el-button slot="append" icon="el-icon-search" @click="searching()"></el-button>
         </el-input>
+        <ComTreeList
+          :prjId="prjId"
+          style="position: absolute; top: 0; left: 0.46875rem; /* 90/192 */"
+          @changeProjectName="changeProjectName($event)"
+        />
       </div>
       <div class="lifting">
         <span>抬升：</span>
@@ -31,8 +36,14 @@
 
 <script lang="ts">
 import { Vue, Component, Prop, Watch } from 'vue-property-decorator'
+import { mapSearch_api } from '@/api/APIs'
+import { queryMapByAttribute } from '@/views/groupPage/util'
+import ComTreeList from '@/views/groupPage/components/ComTreeList.vue'
+import Config from '@/views/groupPage/districtPageModules/commonModules/config.json'
 import _ from 'lodash'
 const Cesium = (window as any).Cesium
+const SuperMap = (window as any).SuperMap
+let _customDataSource = null
 const gLayerList = [
   'NETWORK_SJ_PSWS@sxgk#1',
   'NETWORK_SJ_PSYS@sxgk#1',
@@ -44,10 +55,18 @@ const gLayerList = [
   'TF_SJ_PSWS_JG_B_3D@sxgk#1'
 ]
 //搜索栏
-@Component({ name: 'SearchBox' })
+@Component({ name: 'SearchBox', components: { ComTreeList } })
 export default class SearchBox extends Vue {
-  inputText = ''
-  selectValue = '1'
+  searchInput = ''
+  selectType = '4'
+  loading = null
+  apiurl = {
+    sjfw: '',
+    dtfw: '',
+    smiddtfw: '',
+    pipeAndNodeProcess: '/tofly-sxgk/newPipeAndNodeScan/mapSearch'
+  }
+  backImg = require('@/views/groupPage/images/searchBoxBack.png')
   layerdown = 0
   //地表透明度配置
   opacity = 0
@@ -58,6 +77,12 @@ export default class SearchBox extends Vue {
     target.style.setProperty('--left', '2.34375rem')
   }
   viewer
+  get prjId() {
+    return 45
+  }
+  get config() {
+    return Config
+  }
   get mapConfig() {
     return this.$store.state.bigScreen.mapConfig
   }
@@ -67,6 +92,7 @@ export default class SearchBox extends Vue {
   @Watch('isInitViewer')
   onChangeMethod() {
     this.viewer = (window as any).viewer
+    this.init()
   }
   //透明度变化
   @Watch('opacity')
@@ -106,6 +132,303 @@ export default class SearchBox extends Vue {
       }
     })
   }
+  //工程搜索模块
+  init() {
+    this.apiurl.sjfw = this.mapConfig.gisResource.tiplayers.config['sjfw'].url
+    this.apiurl.dtfw = this.mapConfig.gisResource.maps.config['sjdt'].url
+    this.apiurl.smiddtfw = this.mapConfig.gisResource.tiplayers.config['bjsmidfw'].url
+    _customDataSource = new Cesium.CustomDataSource('SearchBox')
+    this.viewer.dataSources.add(_customDataSource)
+  }
+  changeProjectName(data) {
+    if (data != '') {
+      const { name, code } = data
+      this.searchInput = name
+      this.searching()
+    } else {
+      this.clearInput()
+    }
+  }
+  clearInput() {
+    this.searchInput = ''
+    this.removeLabels()
+  }
+  searching() {
+    const searchType = this.selectType
+    const inputObj = this.searchInput
+    //   if (xss.isXSS(inputObj)) {
+    if (!inputObj) {
+      this.$message.warning('请选择工程!')
+      return
+    }
+    switch (searchType) {
+      case '4':
+        this.searchPrjSpeedInfo(inputObj)
+        break
+    }
+  }
+  /**
+   * 该方法用于查询工程进度
+   * @param prjName 工程(包括工程项目、单项工程、单位工程、子单位工程)
+   * @returns
+   */
+  searchPrjSpeedInfo(prjName) {
+    if (!prjName) {
+      this.removeLabels()
+      // this.clearSelection()
+      return
+    }
+    this.loading = this.$loading({
+      lock: true,
+      text: '正在搜索中，请耐心等待...',
+      spinner: 'el-icon-loading',
+      background: 'rgba(0, 0, 0, 0.3)',
+      customClass: 'loadingclass'
+    })
+    const data = { queryText: prjName } //查询条件
+    const pipe = (this.config as any).pipe
+    const that = this
+    const fieldName = 'CODE'
+    const geourl = this.apiurl.smiddtfw
+    mapSearch_api(data).then((res) => {
+      const result = res
+      if (result.code !== 1) return
+      if (result.result.length === 0) {
+        this.$message('未搜索到相关工程')
+        this.loading.close()
+        return
+      }
+      const filters = []
+      const cwpInfos = []
+      const len = result.result.length
+      for (let i = 0; i < len; i++) {
+        const item = result.result[i]
+        const pipename = item.firstLayerName.split(',')[0]
+        const layer = _.find(pipe, function (pipeItem) {
+          return pipeItem.origindataset === pipename
+        })
+        if (!layer) {
+          continue
+        }
+        //组装
+        let cwpInfo = {
+          name: '',
+          roadName: '',
+          code: '',
+          percent: '',
+          design: {
+            name: '',
+            total: 0,
+            pipe: 0,
+            node: 0
+          },
+          spv: {
+            name: '',
+            pipeLen: 0,
+            times: 0,
+            part: 0,
+            pictures: 0
+          },
+          con: {
+            name: '',
+            pipeLen: 0,
+            times: 0,
+            part: 0,
+            pictures: 0
+          }
+        }
+        cwpInfo.percent = !item.percent ? 0 : item.percent
+        cwpInfo.code = item.firstPbs
+        cwpInfo.name = item.zdwName
+        cwpInfo.roadName = item.roadName
+        //设计
+        const design = _.find(item.tjData, (djData) => {
+          return djData.dataType === 'DESIGN'
+        })
+        if (design) {
+          cwpInfo.design.name = design.designUnit
+          cwpInfo.design.total = design.tfPipeLength
+          cwpInfo.design.pipe = design.tfPipeCount
+          cwpInfo.design.node = design.tfNodeCount
+        }
+        //施工
+        const con = _.find(item.tjData, (djData) => {
+          return djData.dataType === 'CON'
+        })
+        if (con) {
+          cwpInfo.con.name = con.buildUnit
+          cwpInfo.con.pipeLen = con.smLength
+          cwpInfo.con.times = con.scanTimes
+          cwpInfo.con.part = con.partsTotal
+          cwpInfo.con.pictures = con.pictures
+        }
+        //监理
+        const spv = _.find(item.tjData, (djData) => {
+          return djData.dataType === 'SPV'
+        })
+        if (spv) {
+          cwpInfo.spv.name = spv.supervisionUnit
+          cwpInfo.spv.pipeLen = spv.smLength
+          cwpInfo.spv.times = spv.scanTimes
+          cwpInfo.spv.part = spv.partsTotal
+          cwpInfo.spv.pictures = spv.pictures
+        }
+        cwpInfos.push(cwpInfo)
+        //多图层搜索
+        const queryname = layer.smidmapnameNT ? layer.smidmapnameNT : layer.smidmapname
+        const JGFilter = new SuperMap.REST.FilterParameter({
+          name: queryname,
+          attributeFilter: fieldName + " = '" + item['firstPbs'] + "'",
+          fields: [fieldName]
+        })
+        filters.push(JGFilter)
+      }
+      const onComplete = function (geoResult) {
+        that.loading.close()
+        //交互事件
+        // that.getCurrentInfo()
+        // that.clickHightLight()
+        geoResult.originResult.recordsets.forEach((record) => {
+          const features = record.features
+          if (features.length > 1) {
+            console.log('pbs重复')
+            return true
+          }
+          if (features.length == 0) {
+            return true
+          }
+          const scanProj = _.find(cwpInfos, function (scanItem) {
+            return scanItem.code === features[0]['fieldValues'][0]
+          })
+
+          let labelText = ''
+          let imgSrc = that.backImg
+
+          let position = features[0].geometry.points[0]
+          position = Cesium.Cartesian3.fromDegrees(position.x, position.y, position.z)
+          //缩放定位，默认第一个
+          const camera = that.viewer.camera
+          const location = Cesium.Cartographic.fromDegrees(
+            features[0].geometry.points[0].x,
+            features[0].geometry.points[0].y,
+            features[0].geometry.points[0].z + 5000
+          )
+          const cartesian3 = Cesium.Cartographic.toCartesian(location)
+          camera.flyTo({
+            destination: cartesian3,
+            orientation: {
+              heading: camera.heading,
+              pitch: Cesium.Math.toRadians(-90),
+              roll: 0
+            }
+          })
+          scanProj.displayType = 'gcss'
+          that.addUnitBillboard({
+            id: scanProj.code,
+            name: scanProj.code,
+            text: labelText,
+            position: position,
+            scanProj: scanProj,
+            imgSrc: imgSrc
+          })
+        })
+      }
+      queryMapByAttribute({
+        url: geourl,
+        filterParameters: filters,
+        completed: onComplete.bind(this),
+        failed: function (err) {
+          that.loading.close()
+          that.$message.error('查询失败')
+          console.log(err)
+        }
+      })
+    })
+  }
+  /**
+   * 该方法用于生成部件定位指示牌
+   * @param options entity信息
+   * @param options.id entity ID
+   * @param options.text 站点信息
+   * @param options.name 站点信息
+   * @param options.position 位置
+   */
+  addUnitBillboard(options) {
+    var that = this
+    var bottomPosition = Cesium.Cartographic.fromCartesian(options.position)
+    var topPosition = Cesium.Cartographic.fromRadians(
+      bottomPosition.longitude,
+      bottomPosition.latitude,
+      bottomPosition.height + 40
+    )
+    var bPosition = Cesium.Cartographic.toCartesian(bottomPosition)
+    var tPosition = Cesium.Cartographic.toCartesian(topPosition)
+    const percent = isNaN(options.scanProj.percent) ? 0 : parseFloat(options.scanProj.percent)
+    options.text = options.scanProj.roadName + '（' + percent + '%）'
+    var color = 'rgb(56, 136, 205)'
+    var canvas = document.createElement('canvas')
+    const ratio = 2.0
+    let height = 50
+    const realHeight = 48
+    //临时数值
+    let width = 100
+    canvas.width = width * ratio
+    canvas.height = height * ratio
+    const fonttxt = '50px Arial'
+    var ctx = canvas.getContext('2d')
+    //ctx.scale(ratio, ratio)
+    var img = new Image()
+    img.src = options.imgSrc
+    img.onload = function () {
+      ctx.lineWidth = 10
+      ctx.strokeStyle = color
+      ctx.font = '24px Arial'
+      const realWidth = ctx.measureText(options.text).width
+      ctx.font = fonttxt
+      width = ctx.measureText(options.text).width + 100
+      canvas.width = width
+      ctx.fillStyle = 'rgba(0,0,0,0.7)'
+      ctx.fillRect(0, 0, canvas.width, canvas.height)
+      if (percent !== 0) {
+        ctx.drawImage(img, 0, 0, canvas.width * (percent / 100), canvas.height)
+      }
+      ctx.font = fonttxt
+      ctx.fillStyle = 'rgb(255,255,255)'
+      ctx.textBaseline = 'middle'
+      ctx.fillText(options.text, 50, height)
+      //ctx.fillText(options.text, (canvas.width - width) / 2, (canvas.height + 15) / 2);
+      var entity = new Cesium.Entity({
+        id: options.id,
+        name: options.name,
+        show: true,
+        position: Cesium.Cartographic.toCartesian(topPosition),
+        polyline: {
+          positions: [bPosition, tPosition],
+          material: Cesium.Color.fromBytes(56, 136, 205, 255),
+          width: 3
+        },
+        billboard: {
+          sizeInMeters: false,
+          image: canvas.toDataURL(),
+          //scale:0.2,
+          width: realWidth,
+          height: realHeight,
+          scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 10100, 0.5),
+          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
+          horizontalOrigin: Cesium.HorizontalOrigin.CENTER
+        }
+      })
+      entity.displayType = options.scanProj.displayType
+      entity.displayData = options.scanProj
+      _customDataSource.entities.add(entity)
+    }
+  }
+  //该方法用于清除entity label
+  removeLabels() {
+    if (Cesium.defined(_customDataSource)) {
+      _customDataSource.entities.removeAll()
+    }
+  }
 }
 </script>
 
@@ -124,11 +447,6 @@ export default class SearchBox extends Vue {
   margin-left: var(--left); //2.34375rem /* 450/192 */;
   position: absolute;
   left: 0;
-  //size
-  //background
-  background-color: rgba(20, 24, 47, 0.5);
-  color: #eee;
-  box-shadow: 0 0 20px rgba(1, 9, 20, 1);
   //font
   font-family: Source Han Sans CN;
   .search {
@@ -139,7 +457,6 @@ export default class SearchBox extends Vue {
     }
     /deep/ .el-input {
       $backgroundColor: rgba(7, 48, 80, 0.9);
-      width: 1.25rem /* 240/192 */;
       .el-select .el-input {
         width: 0.46875rem /* 90/192 */;
       }
@@ -147,6 +464,7 @@ export default class SearchBox extends Vue {
         color: #eee;
         background-color: $backgroundColor;
         border: none;
+        width: 0.78125rem /* 150/192 */;
       }
       .el-input-group__append,
       .el-input-group__prepend {

src/views/groupPage/districtPageModules/commonModules/config.json

@@ -0,0 +1,106 @@
+{
+    "pipe": [
+        {
+            "title": "雨污合流管线",
+            "name": "NETWORK_SJ_PSHS@sxgk#1",
+            "mapname": "TF_SJ_PSHS_PIPE_B@sxgk",
+            "datasource": "sxgk",
+            "dataset": "NETWORK_SJ_PSHS",
+            "smidmapname": "NETWORK_SJ_PSHS@sxgk",
+            "geometryType": "line",
+            "pipeType": "PS",
+            "lineColor": [
+                76,
+                57,
+                38
+            ],
+            "origindataset": "TF_SJ_PSHS_PIPE_B"
+        },
+        {
+            "title": "雨污合流管点",
+            "name": "NETWORK_SJ_PSHS_Node@sxgk#1",
+            "mapname": "TF_SJ_PSHS_NODE_B@sxgk",
+            "datasource": "sxgk",
+            "dataset": "TF_SJ_PSHS_NODE_B_3D",
+            "smidmapname": "TF_SJ_PSHS_JG_B_3D@sxgk",
+            "smidmapnameNT": "TF_SJ_PSHS_NODE_B_3D@sxgk",
+            "tubewelldataset": "TF_SJ_PSHS_JG_B_3D",
+            "geometryType": "point",
+            "pipeType": "PS",
+            "origindataset": "TF_SJ_PSHS_NODE_B",
+            "ADJUNCT": [],
+            "WELL": [
+                "TF_SJ_PSHS_JG_B_3D@sxgk#1",
+                "TF_SJ_PSHS_JG_B_3D@sxgk#2"
+            ]
+        },
+        {
+            "title": "雨水管线",
+            "name": "NETWORK_SJ_PSYS@sxgk#1",
+            "mapname": "TF_SJ_PSYS_PIPE_B@sxgk",
+            "datasource": "sxgk",
+            "dataset": "NETWORK_SJ_PSYS",
+            "smidmapname": "NETWORK_SJ_PSYS@sxgk",
+            "geometryType": "line",
+            "pipeType": "PS",
+            "lineColor": [
+                76,
+                57,
+                38
+            ],
+            "origindataset": "TF_SJ_PSYS_PIPE_B"
+        },
+        {
+            "title": "雨水管点",
+            "name": "NETWORK_SJ_PSYS_Node@sxgk#1",
+            "mapname": "TF_SJ_PSYS_NODE_B@sxgk",
+            "datasource": "sxgk",
+            "dataset": "TF_SJ_PSYS_NODE_B_3D",
+            "smidmapname": "TF_SJ_PSYS_JG_B_3D@sxgk",
+            "smidmapnameNT": "TF_SJ_PSYS_NODE_B_3D@sxgk",
+            "tubewelldataset": "TF_SJ_PSYS_JG_B_3D",
+            "geometryType": "point",
+            "pipeType": "PS",
+            "origindataset": "TF_SJ_PSYS_NODE_B",
+            "ADJUNCT": [],
+            "WELL": [
+                "TF_SJ_PSYS_JG_B_3D@sxgk#1",
+                "TF_SJ_PSYS_JG_B_3D@sxgk#2"
+            ]
+        },
+        {
+            "title": "污水管线",
+            "name": "NETWORK_SJ_PSWS@sxgk#1",
+            "mapname": "TF_SJ_PSWS_PIPE_B@sxgk",
+            "datasource": "sxgk",
+            "dataset": "NETWORK_SJ_PSWS",
+            "smidmapname": "NETWORK_SJ_PSWS@sxgk",
+            "geometryType": "line",
+            "pipeType": "PS",
+            "lineColor": [
+                76,
+                57,
+                38
+            ],
+            "origindataset": "TF_SJ_PSWS_PIPE_B"
+        },
+        {
+            "title": "污水管点",
+            "name": "NETWORK_SJ_PSWS_Node@sxgk#1",
+            "mapname": "TF_SJ_PSWS_NODE_B@sxgk",
+            "datasource": "sxgk",
+            "dataset": "TF_SJ_PSWS_NODE_B_3D",
+            "tubewelldataset": "TF_SJ_PSWS_JG_B_3D",
+            "smidmapname": "TF_SJ_PSWS_JG_B_3D@sxgk",
+            "smidmapnameNT": "TF_SJ_PSWS_NODE_B_3D@sxgk",
+            "geometryType": "point",
+            "pipeType": "PS",
+            "origindataset": "TF_SJ_PSWS_NODE_B",
+            "ADJUNCT": [],
+            "WELL": [
+                "TF_SJ_PSWS_JG_B_3D@sxgk#1",
+                "TF_SJ_PSWS_JG_B_3D@sxgk#2"
+            ]
+        }
+    ]
+}

src/views/groupPage/districtPageModules/customTools/infoComponents/pipeInfo.vue

@@ -1,32 +1,25 @@
 <template>
   <div class="widget-pipeInfo" ref="widget-pipeInfo" v-show="isShow">
     <div class="header">
-      <div class="name">{{ '春华嘉苑雨污分流改造工程' }}</div>
-      <div class="status">{{ '建设中' }}</div>
+      <div class="name">{{ displayData.name }}</div>
+      <!-- <div class="status">{{ '建设中' }}</div> -->
     </div>
     <div class="content">
       <div class="content-item">
-        <div class="name">工程进度：</div>
-        <div class="value">
-          <div class="progress-bg"></div>
-          <div class="progress-value">80%</div>
-        </div>
+        <div class="name">道路名称：</div>
+        <div class="value">{{ displayData.roadName }}</div>
       </div>
       <div class="content-item">
         <div class="name">设计单位：</div>
-        <div class="value">xxx</div>
+        <div class="value">{{ displayData.design.name }}</div>
       </div>
       <div class="content-item">
         <div class="name">施工单位：</div>
-        <div class="value">xxx</div>
+        <div class="value">{{ displayData.con.name }}</div>
       </div>
       <div class="content-item">
         <div class="name">监理单位：</div>
-        <div class="value">xxx</div>
-      </div>
-      <div class="content-item">
-        <div class="name">工程量：</div>
-        <div class="value">xxx</div>
+        <div class="value">{{ displayData.spv.name }}</div>
       </div>
     </div>
   </div>
@@ -43,6 +36,32 @@ export default class pipeInfo extends Vue {
   viewer
   isExist = null
   isShow = false
+  displayData = {
+    name: '',
+    roadName: '',
+    code: '',
+    design: {
+      name: '',
+      total: 0,
+      pipe: 0,
+      node: 0
+    },
+    spv: {
+      name: '',
+      pipeLen: 0,
+      times: 0,
+      part: 0,
+      pictures: 0
+    },
+    con: {
+      name: '',
+      pipeLen: 0,
+      times: 0,
+      part: 0,
+      pictures: 0,
+      totalLen: 0
+    }
+  }
   get boxTarget() {
     return this.$refs['widget-pipeInfo'] as any
   }

src/views/groupPage/districtPageModules/customTools/infoComponents/projectInfo.vue

@@ -3,32 +3,32 @@
     <ComCardBox @close="close()">
       <div class="widget-projectInfo">
         <div class="header">
-          <div class="name">{{ '春华嘉苑雨污分流改造工程' }}</div>
-          <div class="status">{{ '建设中' }}</div>
+          <div class="name">{{ info.originname }}</div>
+          <!-- <div class="status">{{ '建设中' }}</div> -->
         </div>
         <div class="content">
-          <div class="content-item">
+          <!-- <div class="content-item">
             <div class="name">工程进度：</div>
             <div class="value">
               <div class="progress-bg"></div>
               <div class="progress-value">80%</div>
             </div>
-          </div>
+          </div> -->
           <div class="content-item">
-            <div class="name">设计单位：</div>
-            <div class="value">xxx</div>
+            <div class="name">工程编码：</div>
+            <div class="value">{{ info.code }}</div>
           </div>
           <div class="content-item">
-            <div class="name">施工单位：</div>
-            <div class="value">xxx</div>
+            <div class="name">类型：</div>
+            <div class="value">{{ info.levelname }}</div>
           </div>
           <div class="content-item">
-            <div class="name">监理单位：</div>
-            <div class="value">xxx</div>
+            <div class="name">设计合同：</div>
+            <div class="value">{{ info.desContract }}</div>
           </div>
           <div class="content-item">
-            <div class="name">工程量：</div>
-            <div class="value">xxx</div>
+            <div class="name">施工合同：</div>
+            <div class="value">{{ info.conContract }}</div>
           </div>
         </div>
       </div>
@@ -41,19 +41,45 @@ import ComMapBox from '@/views/groupPage/components/ComMapBox.vue'
 import ComCardBox from '@/views/groupPage/components/ComCardBox.vue'
 import { Vue, Component, Prop, Watch } from 'vue-property-decorator'
 const Cesium = (window as any).Cesium
+let handler = null
 //属性查看
 @Component({ name: 'projectInfo', components: { ComMapBox, ComCardBox } })
 export default class projectInfo extends Vue {
+  info: object = null
   position: Array<any> = []
   viewer
   mounted() {
     this.viewer = (window as any).viewer
+    this.addEntity()
+    this.addMapEvent()
+  }
+  initInfoPop() {
+    ;(this.$refs['ComMapBox'] as any).initBox()
     ;(this.$refs['ComMapBox'] as any).setPosition(Cesium.Cartesian3.fromDegrees(this.position[0], this.position[1]))
+  }
+  addMapEvent() {
+    const that = this
+    handler = new Cesium.ScreenSpaceEventHandler(this.viewer.canvas)
+    handler.setInputAction(
+      function (movement) {
+        var pickedObject = this.viewer.scene.pick(movement.position)
+        // 使用时，最好利用pickPositionSupported判断一下浏览器是否支持模型高度拾取
+        if (this.viewer.scene.pickPositionSupported && Cesium.defined(pickedObject)) {
+          if (pickedObject.id._id === 'projectInfo') {
+            that.initInfoPop()
+          }
+        } else {
+        }
+      }.bind(this),
+      Cesium.ScreenSpaceEventType.LEFT_CLICK
+    )
+  }
+  addEntity() {
     let viewer = this.viewer
     let imgSrc = require('@/views/groupPage/images/地图/工程-管网工程.png')
-    this.removeEntities()
+    this.removeEntity()
     viewer.entities.add({
-      id: 'located',
+      id: 'projectInfo',
       position: Cesium.Cartesian3.fromDegrees(this.position[0], this.position[1], 0),
       billboard: {
         image: imgSrc,
@@ -64,7 +90,7 @@ export default class projectInfo extends Vue {
         disableDepthTestDistance: 9999999
       }
     })
-    var entity = viewer.entities.getById('located')
+    var entity = viewer.entities.getById('projectInfo')
     viewer.flyTo(entity, {
       offset: {
         heading: Cesium.Math.toRadians(0.0),
@@ -73,11 +99,11 @@ export default class projectInfo extends Vue {
       }
     })
   }
-  removeEntities() {
+  removeEntity() {
     //清除定位实体
     let entitys = this.viewer.entities._entities._array
     for (let i = 0; i < entitys.length; i++) {
-      if (entitys[i].id === 'located') {
+      if (entitys[i].id === 'projectInfo') {
         this.viewer.entities.remove(entitys[i])
         i--
       }
@@ -85,7 +111,10 @@ export default class projectInfo extends Vue {
   }
   close() {
     ;(this.$refs['ComMapBox'] as any).remove()
-    this.removeEntities()
+  }
+  remove() {
+    ;(this.$refs['ComMapBox'] as any).remove()
+    this.removeEntity()
   }
   beforeDestroy() {
     this.close()
@@ -123,7 +152,8 @@ export default class projectInfo extends Vue {
     }
   }
   .content {
-    height: calc(100% - 20px);
+    overflow: auto;
+    height: calc(100% - 25px);
     width: 100%;
     display: flex;
     flex-flow: column;

src/views/groupPage/districtPageModules/customTools/pbsTree.vue

@@ -44,8 +44,10 @@
 </template>
 
 <script>
+import Vue from 'vue'
 import { pbsTreeList_api, pbsTreeSearch_api, pbsTreeMinimum_api, createPdfByType_api } from '@/api/APIs.ts'
 import { getListWithRange } from '@/views/groupPage/apis'
+import ProjectInfo from '@/views/groupPage/districtPageModules/customTools/infoComponents/projectInfo.vue'
 export default {
   name: 'widget-pbsTreeManagement',
   data() {
@@ -168,21 +170,40 @@ export default {
       if (data.pressureType == '1') {
         return <span>{node.label}</span>
       } else if (data.pressureType == '2') {
-        return <span style="color:#0076FF;">{node.label}</span>
+        return <span style="color:#F4C545;">{node.label}</span>
       } else if (data.pressureType == '3') {
-        return <span style="color:#009100;">{node.label}</span>
+        return <span style="color:#00B983;">{node.label}</span>
+      } else if (data.pressureType == '4') {
+        return <span style="color:#FF4343;">{node.label}</span>
       } else {
         return <span>{node.label}</span>
       }
+      //1未开工 2正在施工3已完工4停工
     },
     // 树结构子项点击调用
     handleNodeClick(data) {
       this.tipShow = false
       this.viewer = window.viewer
       if (!this.viewer || !data.range) return
+      if (!data.longitude || !data.latitude) return
       const range = JSON.parse(data.range)
-      addDataToGlobe(range.coordinates)
-      function addDataToGlobe(range) {
+      const position = [Number(data.longitude), Number(data.latitude)]
+      this.addSymbol(data, position)
+      this.addWall(range)
+    },
+    addSymbol(data, position) {
+      const projectInfoConstructor = Vue.extend(ProjectInfo)
+      this.prjInfo = new projectInfoConstructor({
+        data: {
+          info: data,
+          position
+        },
+        store: this.$store
+      }).$mount()
+    },
+    addWall(range) {
+      dataAssembly(range.coordinates)
+      function dataAssembly(range) {
         let resultArr = []
         for (let j = 0; j < range.length; j++) {
           //信息坐标获取
@@ -245,7 +266,7 @@ export default {
           }
         })
         //聚焦定位
-        viewer.flyTo(fenceEntity)
+        // viewer.flyTo(fenceEntity)
       }
     },
     //右键点击显示导出按钮
@@ -381,6 +402,7 @@ export default {
   beforeDestroy() {
     if (this.viewer) {
       if (this.viewer.entities.getById('dynamicWall')) this.viewer.entities.removeById('dynamicWall')
+      if (this.prjInfo) this.prjInfo.remove()
     }
   }
 }

src/views/groupPage/districtPageModules/customTools/viewManagement.vue

@@ -44,7 +44,8 @@ import CesiumViewTool from '@/utils/mapCommon/CesiumViewTool'
 const Cesium = (window as any).Cesium
 const getViewListApi = '/tofly-sxgk/views/get' //获取视图接口
 const addViewInfoApi = '/tofly-sxgk/views/save' //添加视图接口
-const deleteViewApi = '/tofly-sxgk/views/' //删除视图接口
+const deleteViewApi = '/tofly-sxgk/views/deleteByIds' //删除视图接口
+const getImg = '/base/file/loadImg'
 @Component({ name: 'viewManagement' })
 export default class viewManagement extends Vue {
   viewer
@@ -125,9 +126,24 @@ export default class viewManagement extends Vue {
   //获取漫游视点
   getRoamingView() {
     this.isRoaming = true
-    let params = {}
-    axios.request({ url: getViewListApi, method: 'get', params }).then((res) => {
-      // console.log(res)
+    this.roamViewImageList = []
+    axios.request({ url: getViewListApi, method: 'get', params: {} }).then((res) => {
+      const result = res.result.records
+      result.forEach((item) => {
+        this.roamViewImageList.unshift({
+          id: item.id,
+          name: item.markName,
+          src:
+            axios.defaults.baseURL +
+            getImg +
+            '?remotePath=' +
+            item.filePath +
+            '&access_token=' +
+            sessionStorage.getItem('token'),
+          checked: true,
+          camera: item.camera
+        })
+      })
     })
   }
   //添加
@@ -145,54 +161,60 @@ export default class viewManagement extends Vue {
   }
   //添加保存漫游视点
   submitRoamingView() {
-    this.roamViewImageList = [
-      ...this.roamViewImageList,
-      {
-        name: this.viewName,
-        src: this.roamingViewSrc,
-        checked: true,
-        camera: this.cameraTemp
-      }
-    ]
+    // this.roamViewImageList = [
+    //   ...this.roamViewImageList,
+    //   {
+    //     name: this.viewName,
+    //     src: this.roamingViewSrc,
+    //     checked: true,
+    //     camera: this.cameraTemp
+    //   }
+    // ]
     //视点图片
-    // let scanvas = this.viewer.scene.canvas
-    // let screenShot = Canvas2Image.convertToImage(scanvas, 400, (400 * scanvas.height) / scanvas.width, 'png')
-    // this.roamingViewSrc = screenShot.src
-    // //
-    // var canvas = document.createElement('CANVAS')
-    // var ctx = (<any>canvas).getContext('2d')
-    // var img = new Image()
-    // img.src = this.roamingViewSrc
-    // img.onload = function (e) {
-    //   ;(<any>canvas).width = img.width
-    //   ;(<any>canvas).height = img.height
-    //   ctx.drawImage(img, 0, 0)
-    //   ;(<any>canvas).toBlob(
-    //     function (blob) {
-    //       var extent = JSON.stringify(CesiumViewTool.GetViewExtent(this.viewer))
-    //       var cameraTemp = {
-    //         direction: this.viewer.camera.direction,
-    //         up: this.viewer.camera.up,
-    //         position: this.viewer.camera.position
-    //       }
-    //       var camera = JSON.stringify(cameraTemp)
-    //       var option = new FormData()
-    //       if (this.viewName == '') {
-    //         this.$message('请填写视点名称')
-    //         return
-    //       }
-    //       option.append('markName', this.viewName)
-    //       option.append('camera', camera)
-    //       option.append('extent', extent)
-    //       option.append('file', blob, this.viewName + '.png')
-    //       axios.request({ url: addViewInfoApi, method: 'post', data: option }).then((res) => {
-    //         console.log(res)
-    //       })
-    //     }.bind(this),
-    //     'image/png'
-    //   )
-    // }.bind(this)
-    this.tipVisible = false
+    let scanvas = this.viewer.scene.canvas
+    let screenShot = Canvas2Image.convertToImage(scanvas, 400, (400 * scanvas.height) / scanvas.width, 'png')
+    this.roamingViewSrc = screenShot.src
+    //
+    var canvas = document.createElement('CANVAS')
+    var ctx = (<any>canvas).getContext('2d')
+    var img = new Image()
+    img.src = this.roamingViewSrc
+    img.onload = function (e) {
+      ;(<any>canvas).width = img.width
+      ;(<any>canvas).height = img.height
+      ctx.drawImage(img, 0, 0)
+      ;(<any>canvas).toBlob(
+        function (blob) {
+          var extent = JSON.stringify(CesiumViewTool.GetViewExtent(this.viewer))
+          var cameraTemp = {
+            direction: this.viewer.camera.direction,
+            up: this.viewer.camera.up,
+            position: this.viewer.camera.position
+          }
+          var camera = JSON.stringify(cameraTemp)
+          var option = new FormData()
+          if (this.viewName == '') {
+            this.$message('请填写视点名称')
+            return
+          }
+          option.append('markName', this.viewName)
+          option.append('camera', camera)
+          option.append('extent', extent)
+          option.append('file', blob, this.viewName + '.png')
+          axios.request({ url: addViewInfoApi, method: 'post', data: option }).then((res) => {
+            if (res.code == 1) {
+              this.$message.success('添加视点成功')
+              this.getRoamingView()
+              this.tipVisible = false
+            } else {
+              this.$message.error('添加视点失败')
+              this.tipVisible = false
+            }
+          })
+        }.bind(this),
+        'image/png'
+      )
+    }.bind(this)
   }
   //取消添加漫游视点
   resetRoamingViewAdd() {
@@ -207,7 +229,14 @@ export default class viewManagement extends Vue {
       this.$message('请选择至少一个视点')
       return
     }
+    let ids = []
+    deleteList.map((item) => {
+      ids.push(item.id)
+    })
     this.roamViewImageList = this.roamViewImageList.filter((item) => !item.checked)
+    axios.request({ url: deleteViewApi, method: 'DELETE', params: { ids: ids.join(',') } }).then((res) => {
+      if (res.code == 1) this.$message.success('删除视点成功')
+    })
   }
   //播放视点
   playRoamingView() {

src/views/groupPage/districtPageModules/index.vue

@@ -39,17 +39,21 @@ export default class districtPageModules extends Vue {
   get isShowPipeSpeedInfoCheck() {
     return this.$store.state.bigScreen.isShowPipeSpeedInfoCheck
   }
-  get isShowDataPanel() {
-    return this.$store.state.bigScreen.currentActive
-  }
   //关闭数据面板时,工具栏位置改变
-  @Watch('isShowDataPanel')
+  @Watch('districtModuleName')
   onChangeVisibleMethod(val) {
+    if (
+      !this.$refs['PropertiesView'] ||
+      !this.$refs['SearchBox'] ||
+      !this.$refs['ToolBox'] ||
+      !this.$refs['CustomToolBox']
+    )
+      return
     if (!val) {
-      ;(this.$refs['PropertiesView'] as any).$refs['widget-PropertiesView'].style.setProperty('--right', '.052083rem')
-      ;(this.$refs['SearchBox'] as any).$refs['widget-SearchBox'].style.setProperty('--left', '.052083rem')
-      ;(this.$refs['ToolBox'] as any).$refs['widget-ToolBox'].style.setProperty('--right', '.052083rem')
-      ;(this.$refs['CustomToolBox'] as any).$refs['widget-CustomToolBox'].style.setProperty('--left', '.052083rem')
+      ;(this.$refs['PropertiesView'] as any).$refs['widget-PropertiesView'].style.setProperty('--right', '.10417rem')
+      ;(this.$refs['SearchBox'] as any).$refs['widget-SearchBox'].style.setProperty('--left', '.10417rem')
+      ;(this.$refs['ToolBox'] as any).$refs['widget-ToolBox'].style.setProperty('--right', '.10417rem')
+      ;(this.$refs['CustomToolBox'] as any).$refs['widget-CustomToolBox'].style.setProperty('--left', '.10417rem')
     } else {
       ;(this.$refs['PropertiesView'] as any).$refs['widget-PropertiesView'].style.setProperty('--right', '2.34375rem')
       ;(this.$refs['SearchBox'] as any).$refs['widget-SearchBox'].style.setProperty('--left', '2.34375rem')

src/views/groupPage/districtPageModules/pipeUnitInfo/BaseInfo.vue

@@ -33,6 +33,7 @@
 </template>
 <script lang="ts">
 import apis from '@/api/PipeUnitInfo'
+import axios from '@/utils/request'
 import { Vue, Component, Prop, Watch } from 'vue-property-decorator'
 import { setNullAndUndefined } from '@/views/groupPage/util'
 //部件查看---概述
@@ -77,9 +78,10 @@ export default class UnitBaseInfo extends Vue {
     const options = {
       pbs: this.currentUnit.code
     }
-    // this.qrUrl = this.$store.state.apiRoot + url + '?pbs=' + options.pbs
-    // this.qrUrlPreview = []
-    // this.qrUrlPreview.push(this.qrUrl)
+    this.qrUrl =
+      axios.defaults.baseURL + url + '?pbs=' + options.pbs + '&access_token=' + sessionStorage.getItem('token')
+    this.qrUrlPreview = []
+    this.qrUrlPreview.push(this.qrUrl)
   }
   /**
    * 获取计划开始事件和结束事件
@@ -135,6 +137,7 @@ export default class UnitBaseInfo extends Vue {
     float: left;
     width: 20%;
     left: 2.5%;
+    padding: 5px;
     .qrcodeItem {
       position: relative;
       float: left;

src/views/groupPage/districtPageModules/pipeUnitInfo/Contract.vue

@@ -90,7 +90,7 @@ export default {
       let options = { pbs: this.currentUnit.code }
       const res =
         this.currentUnit.geoType === 'LINE' ? await apis.getPipeContract(options) : await apis.getPointContract(options)
-      const { code, result } = res.data
+      const { code, result } = res
       if (code == 1) {
         if (result && result.length > 0) {
           let arr = result
@@ -150,7 +150,7 @@ export default {
     async getclInfo() {
       let options = { pbs: this.currentUnit.code }
       const res = await apis.getMaterialInfo(options)
-      const { code, result } = res.data
+      const { code, result } = res
       if (code == 1) {
         if (!result) return
         let dataFiled = result
@@ -194,9 +194,9 @@ export default {
   width: 100%;
   height: 430px;
   overflow: auto;
-  ::v-deep.el-input__inner {
-    background-color: #f8f8f8;
-  }
+  // ::v-deep.el-input__inner {
+  //   background-color: #f8f8f8;
+  // }
   .htInfo {
     width: 100%;
     display: flex;
@@ -242,7 +242,9 @@ export default {
     float: left;
     text-align: right;
     padding: 6px;
-    color: #888888;
+    font-size: 0.072917rem /* 14/192 */;
+    font-weight: 400;
+    color: #82bae2;
   }
 
   .info-content {
@@ -250,7 +252,7 @@ export default {
     float: left;
     width: calc((100% - 170px) / 2 - 20px);
     border: none;
-    background: #f8f8f8;
+    // background: #f8f8f8;
     margin-right: 10px;
   }
 
@@ -259,8 +261,8 @@ export default {
     float: left;
     width: calc((100% - 170px) / 2 - 20px);
     border: none;
-    background: #f8f8f8;
-    color: black;
+    // background: #f8f8f8;
+    // color: black;
     margin-right: 10px;
   }
 
@@ -305,8 +307,8 @@ export default {
     width: calc(100% - 130px);
     margin-left: 10px;
     border: none;
-    background: #f8f8f8;
-    color: black;
+    // background: #f8f8f8;
+    // color: black;
   }
 }
 </style>

src/views/groupPage/districtPageModules/pipeUnitInfo/Documents.vue

@@ -213,7 +213,7 @@ export default {
         size: 10000
       }
       const res = await this.$PortApi.getBaseCodePage_api(data)
-      const { code, result } = res.data
+      const { code, result } = res
       if (code == 1) {
         this.recordFileType = result.records
         this.getdaInfo(unitInfo)
@@ -225,7 +225,7 @@ export default {
     async gettzInfo(unitInfo) {
       this.tzList = []
       const res = await apis.getDesignInfo({ pbs: unitInfo.code })
-      const { code, result } = res.data
+      const { code, result } = res
       if (code == 1) {
         if (result.length > 0) {
           this.tzList = result.map((item) => {
@@ -313,7 +313,7 @@ export default {
       }
       this.daList = []
       const res = await apis.getPartsfile(option)
-      const { code, result } = res.data
+      const { code, result } = res
       if (code == 1) {
         if (result.records.length > 0) {
           this.daList = result.records.map((item) => {

src/views/groupPage/districtPageModules/pipeUnitInfo/SmInfo.vue

@@ -216,7 +216,7 @@ export default {
         'orders[0].asc': true
       }
       const res = await apis.getProcedureInfo(searchData)
-      const { code, result } = res.data
+      const { code, result } = res
       if (code === 1) {
         this.procedureInfo = result.records
         this.procedureStyle = 'width:' + 100 / result.records.length + '%'

src/views/groupPage/districtPageModules/pipeUnitInfo/index.vue

@@ -258,7 +258,8 @@ export default class pipeUnitInfo extends Vue {
     })
     if (primtCol.length === 1) {
       const primitive = primtCol.get(0)
-      this.showUnitInfoPanel('HN01CC01.22.01.01.002')
+      this.showUnitInfoPanel(primitive.geometryInstances.id)
+      // this.showUnitInfoPanel('HB06BB02.001.01.01.27')
     } else {
       this.addPrimitiveHandler()
     }
@@ -429,7 +430,7 @@ export default class pipeUnitInfo extends Vue {
         whereclause: "CODE='" + code + "'",
         completed: function (result) {
           if (result.result.featureCount > 0) {
-            this.clearAllPrimitives() //先清除已存在的高亮对象
+            // this.clearAllPrimitives() //先清除已存在的高亮对象
             //交互式部件查看不需高亮
             if (!gl.isInteractive) {
               this.entitiesHighLight(result, code, dataset.name)
@@ -606,6 +607,7 @@ export default class pipeUnitInfo extends Vue {
     this.clearDrawEvent()
     this.clearAllPrimitives()
     this.$store.state.bigScreen.propertiesViewValue = null
+    this.close()
   }
   //清除所有元素并清空属性选择
   reset() {