Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetw...

zhangshuaibao

2021-04-14 d721c212821d8095b033cb40662ef745c396669a

Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop

 src/components/BaseNav/PublicBounced/PublicBounced.vue

@@ -6,7 +6,7 @@
    </div>
    <div class="public-bounced-content">
      <div class="public-bounced-content-left">
        <public-tabs :displayContentTab="displayContentTab" :value="value"
        <public-tabs :setSolidWaste="displayContentTab" :value="value"
                     :setWasteGasdata="setWasteGasdata" :setWasteWaterdata="setWasteWaterdata"></public-tabs>
        <div class="public-bounced-content-left-bottom">
          <public-table v-if="value === 'gufei'"
@@ -46,13 +46,13 @@
  },
  data () {
    return {
      setWasteGasdata: '',
      setWasteWaterdata: '',
      displayContentTitle: '',
      displayContentTab: '',
      displayContentTable: '',
      flag: false,
      value: '',
      setWasteGasdata: '',
      setWasteWaterdata: '',
      getWasteGasDetails: [],
      getWasteWaterMonitoringDetails: [],
      getQueryOnlineMonData: [],
@@ -60,26 +60,17 @@
      // getGasQueryOnlineMonData: []
    }
  },
  mounted () {
    // this.$nextTick(() => {
    // console.log(this.$refs.publicBounced)
    console.log(this.$refs.PublicChart)
    // })
  },
  methods: {
    closePopup () {
      this.flag = false
    },
    setData (dataBasic, dataDetailed, value) {
    // 固废相关信息设置
    setData (title, dataBasic, dataDetailed, value) {
      this.flag = true
      this.value = value
      dataBasic.forEach(item => {
        this.displayContentTitle = item.StoragePlaceName
      })
      this.displayContentTab = dataBasic
      this.displayContentTable = dataDetailed
      this.flag = true
      this.value = value
      this.displayContentTitle = title
      this.displayContentTab = dataBasic[0]
      this.displayContentTable = dataDetailed[0]
    },
    setGasData (data, dataDetails, GasHourData, ManualData, value) {
      // console.log(this.$refs)

 src/components/BaseNav/PublicBounced/common/PublicTable.vue

@@ -1,17 +1,10 @@
<template>
  <div class="win">
    <!-- 四个角的边框效果 -->
    <div class="border_corner border_corner_left_top"></div>
    <div class="border_corner border_corner_right_top"></div>
    <div class="border_corner border_corner_left_bottom"></div>
    <div class="border_corner border_corner_right_bottom"></div>
    <div class="main">
      <div class="main-table">
        <el-table :data="listData" style="width: 100%" height="200px" :row-class-name="tableRowClassName">
          <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop"
                           :label="item.label"></el-table-column>
        </el-table>
      </div>
  <div class="react">
    <div class="main-table">
      <el-table :data="displayContentTable" style="width: 100%" height="200px" :row-class-name="tableRowClassName">
        <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop"
                         :label="item.label"></el-table-column>
      </el-table>
    </div>
  </div>
</template>
@@ -55,13 +48,6 @@
      ]
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.displayContentTable.forEach(item => {
        this.listData = item
      })
    })
  },
  methods: {
    tableRowClassName ({
      row,
@@ -79,52 +65,17 @@
</script>

<style lang="less" scoped>

.win {
.react {
  position: relative;
  background-color: rgba(33, 41, 69, 0.9);
}

.main {
  .main-table {
    width: 100%;
  }
}

.border_corner {
  z-index: 999;
  position: absolute;
  width: 14px;
  height: 14px;
  background: rgba(0, 0, 0, 0);
  border: 1px solid #47d5ea;
}

.border_corner_left_top {
  top: 0;
  left: 0;
  border-right: none;
  border-bottom: none;
}

.border_corner_right_top {
  top: 0;
  right: 0;
  border-left: none;
  border-bottom: none;
}

.border_corner_left_bottom {
  bottom: 0;
  left: 0;
  border-right: none;
  border-top: none;
}

.border_corner_right_bottom {
  bottom: 0;
  right: 0;
  border-left: none;
  border-top: none;
  background: linear-gradient(to left, #02a6b5, #02a6b5) left top no-repeat,
  linear-gradient(to bottom, #02a6b5, #02a6b5) left top no-repeat,
  linear-gradient(to left, #02a6b5, #02a6b5) right top no-repeat,
  linear-gradient(to bottom, #02a6b5, #02a6b5) right top no-repeat,
  linear-gradient(to left, #02a6b5, #02a6b5) left bottom no-repeat,
  linear-gradient(to bottom, #02a6b5, #02a6b5) left bottom no-repeat,
  linear-gradient(to left, #02a6b5, #02a6b5) right bottom no-repeat,
  linear-gradient(to left, #02a6b5, #02a6b5) right bottom no-repeat;
  background-size: 2px 20px, 20px 2px, 2px 20px, 20px 2px;
}
</style>

 src/components/BaseNav/PublicBounced/common/PublicTabs.vue

@@ -18,14 +18,14 @@
            <li>内/外排口:{{ setWasteGasdata.OrOutPortName }}</li>
          </ul>
        </div>
        <div v-else-if="value === 'gufei'">
        <div v-if="value === 'gufei'">
          <ul>
            <li>场所名称:{{ tabData.StoragePlaceName }}</li>
            <li>贮存能力:{{ tabData.StorageQty }}(吨)</li>
            <li>剩余贮存能力:{{ tabData.SurplusFloorArea }}(吨)</li>
            <li>占地面积(㎡):{{ tabData.DesignFloorArea }}(㎡)</li>
            <li>最近贮存日期:{{ tabData.StorageDate }}</li>
            <li></li>
            <li>场所名称:{{ setSolidWaste.StoragePlaceName }}</li>
            <li>贮存能力:{{ setSolidWaste.StorageQty }}(吨)</li>
            <li>剩余贮存能力:{{ setSolidWaste.SurplusFloorArea }}(吨)</li>
            <li>占地面积(㎡):{{ setSolidWaste.DesignFloorArea }}(㎡)</li>
            <li>最近贮存日期:{{ setSolidWaste.StorageDate }}</li>
            <li class="lastli"></li>
          </ul>
        </div>
        <div v-else-if="value === 'feishui'">
@@ -46,23 +46,7 @@
<script>
export default {
  name: 'GasTable',
  props: ['displayContentTab', 'value', 'setWasteGasdata', 'setWasteWaterdata'],
  data () {
    return {
      tabData: []
    }
  },
  mounted () {
    this.processingData()
  },
  methods: {
    processingData () {
      for (var i = 0; i < this.displayContentTab.length; i++) {
        // console.log(this.displayContentTab[i])
        this.tabData = this.displayContentTab[i]
      }
    }
  }
  props: ['setSolidWaste', 'value', 'setWasteGasdata', 'setWasteWaterdata']
}
</script>

@@ -85,6 +69,7 @@
    font-weight: normal;
    padding: 6px;
    border: 1px solid #396d83;

    ul {
      //width: 100%;
      //height: 100%;
@@ -93,6 +78,7 @@
      justify-content: space-around;
      flex-wrap: wrap;
      margin-bottom: -6px;

      li {
        margin-bottom: 6px;
        text-align: center;
@@ -103,7 +89,10 @@
        font-size: 0.08rem;
      }

      li:last-child {
      //li:last-child {
      //  visibility: hidden
      //}
      .lastli {
        visibility: hidden
      }
    }

 src/components/LayerController/logic/SolidWaste.js

@@ -75,6 +75,9 @@
    const dataValue = {
      StoragePlaceId: e.layer.options.totransferData.StoragePlaceId
    }
    // console.log(e.layer.options.totransferData.Name)
    // 弹框标题
    const title = e.layer.options.totransferData.Name
    // 基本信息 tabs
    const resultBasic = await mapApi.getSolidWasteBaseInfo(dataValue)
    // 详细信息展示 table
@@ -86,7 +89,7 @@
    document.body.appendChild(instance.$el)
    // document.body.removeChild(instance.$el)
    // 通过方法 向绑定弹框传递数据
    instance.setData(resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei')
    instance.setData(title, resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei')
    /* flyTo()弹出框平移事件 */
    this.setPanTo(e.latlng, 200)
  }

 src/components/panel/topicSearch/SewersSearch.vue

@@ -6,22 +6,24 @@
        <div class="search-panel ">
          <el-form ref="form" :model="form" label-width="90px" class="search-form">
            <el-form-item label="设施类型：" size="mini" class="search-panel-item">
              <el-select style="width: 100%"  v-model="form.pipelineType" @change="handlePipelineType"  :popper-class="'select-down'">
              <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType"
                         :popper-class="'select-down'">
                <el-option
                        v-for="item in items"
                        :key="item.code"
                        :label="item.name"
                        :value="item.name">
                    v-for="item in items"
                    :key="item.code"
                    :label="item.name"
                    :value="item.name">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item :label="form.pipelineType+'：'" size="mini">
              <el-select style="width: 100%"  v-model="form.dataType"  @change="handleDataType" :popper-class="'select-down'">
              <el-select style="width: 100%" v-model="form.dataType" :popper-class="'select-down'">
                <!--  @change="handleDataType"-->
                <el-option
                        v-for="item in subItems"
                        :key="item.code"
                        :label="item.name"
                        :value="item.name">
                    v-for="item in subItems"
                    :key="item.code"
                    :label="item.name"
                    :value="item.name">
                </el-option>
              </el-select>
            </el-form-item>
@@ -78,7 +80,7 @@
import WfsHelper from '@components/helpers/WfsHelper'
import AjaxUtils from '@utils/AjaxUtils'

// 引入分析组件内容
// 引入组件内容
import SewersAnalysis from '@components/panel/topicSearch/SewersSelect/SewersAnalysis'
import SewersHistory from '@components/panel/topicSearch/SewersSelect/SewersHistory'

@@ -128,11 +130,13 @@
      wfsHelper.addLike('name', this.form.keyword)
      // const _this = this
      const res = await AjaxUtils.GetDataAsynByUrl(wfsHelper.getUrl(), {})
      console.log(res)
      if (res instanceof Object && Object.prototype.hasOwnProperty.call(res, 'features')) {
        this.list = res.features
      }
    },
    handleLocation (val) {
      console.log(val)
      const bound = this.L.geoJSON([val], {}).getBounds()
      // var layer = window.layerFactory.flyByLayerId(val.id, bound)
      window.map.flyToBounds(bound)

 src/components/panel/topicSearch/SolidWasteSearch.vue

@@ -1,6 +1,6 @@
<template>
  <div class="sewers-search" v-if="judgeVisible">
    <div class="panel-title">{{title}}</div>
    <div class="panel-title">{{ title }}</div>
    <div class="search-panel ">
      <el-form ref="form" :model="form" label-width="90px" class="search-form">
        <el-form-item v-for="(item,index) in solidWasteTypeOptions" :key="index" :label="item.label+'：'" size="mini"
@@ -15,27 +15,24 @@
            </el-option>
          </el-select>
        </el-form-item>
        <!--  <div class="search-radio">
          <el-radio v-model="radio" label="1">全部</el-radio>
          <el-radio v-model="radio" label="2">正常</el-radio>
          <el-radio v-model="radio" label="3">预警</el-radio>
        </div> -->
        <el-radio-group v-model="form.type" class="levelOfRisk">
          <el-radio  v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}</span></el-radio>
          <el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index">
            <span class="levelOfRisk-type">{{ item.name }}</span>
          </el-radio>
        </el-radio-group>

        <div class="rightButtonSearch">
          <el-input  v-model="form.keyword" size="mini"  placeholder="在此输入关键字搜索"></el-input>
          <el-input v-model="form.keyword" size="mini" placeholder="在此输入关键字搜索"></el-input>
          <el-button class="el-icon-search" @click="handleSearch"></el-button>
        </div>
      </el-form>
    </div>
    <el-scrollbar style="height:286.22px">
      <div class="environmental-risk-list" v-for="(item,index) in searchDataDisplay" :key="index" ><!-- v-for="(item,index) in list" :key="index" -->
      <div class="environmental-risk-list" v-for="(item,index) in searchDataDisplay" :key="index"
           @click="setBounced(item)">
        <i class="state"></i>
        <div>
          <h3>###炼化部</h3>
          <p>所属部门：<span>炼化部</span></p>
          <p>所属部门：<span>{{ item.Name }}</span></p>
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>
@@ -52,11 +49,6 @@
  props: ['title'],
  data () {
    return {
      levelOfRisk: [
        { name: '全部', value: '1' },
        { name: '正常', value: '2' },
        { name: '预警', value: '3' }
      ],
      judgeVisible: true,
      solidWasteTypeOptions: [{
        value: '1',
@@ -123,7 +115,20 @@
          key: 'length'
        }]
      }],
      radio: '1',
      levelOfRisk: [
        {
          name: '全部',
          value: '1'
        },
        {
          name: '正常',
          value: '2'
        },
        {
          name: '预警',
          value: '3'
        }
      ],
      form: {
        keyword: '固废面板数据查询',
        // 数据的传递
@@ -134,14 +139,13 @@
    }
  },
  methods: {
    setBounced (val) {
      const pos = [val.Latitude, val.Longitude]
      window.map.flyTo(pos, 11)
    },
    handlePipelineType (val) {
      // console.log(val)
      this.solidWasteTypeOptions.forEach(item => {
        // console.log(item.value)
        if (val === item.value) {
          // console.log('数据选择相同')
          // 接收数据 用于之后接口数据的调用
          // this.form.transferData = item.value
          this.handleSearch(item.value)
        }
      })
@@ -149,8 +153,8 @@
    // 点击搜索实现数据的搜索展示
    async handleSearch (data) {
      // console.log(this.form.keyword)
      const result = await mapApi.getSolidWasteSurveyDetail(data)
      // console.log(result)
      const result = await mapApi.getSolidWaste(data)
      console.log(result)
      this.searchDataDisplay = result.Result.DataInfo
    }
  }