From 30c3c06760f6412cbdb2a3a8418e1f0d43e66d30 Mon Sep 17 00:00:00 2001
From: chenyabin <Chenab123!>
Date: 星期一, 19 四月 2021 18:15:34 +0800
Subject: [PATCH] 完成附属设施功能。1

---
 src/components/panel/topicSearch/SewersSearch.vue |  138 +++++++++++++++++++++++++--------------------
 1 files changed, 76 insertions(+), 62 deletions(-)

diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue
index 5d18286..ba6c05b 100644
--- a/src/components/panel/topicSearch/SewersSearch.vue
+++ b/src/components/panel/topicSearch/SewersSearch.vue
@@ -9,40 +9,37 @@
               <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType"
                          :popper-class="'select-down'">
                 <el-option
-                    v-for="item in pipelineTypeOptions"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
+                    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" value-key="code" :popper-class="'select-down'" @change="handleDataType" >
                 <el-option
-                    v-for="item in dataTypeOptions"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value">
-                </el-option>
+                      v-for="item in subItems"
+                      :key="item.code"
+                      :label="item.name"
+                      :value="item">
+              </el-option>
               </el-select>
             </el-form-item>
             <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:380.44px;">
-          <div class="environmental-risk-list" v-for="(item,index) in list" :key="index">
-            <div @click="handleLocation(item)">
-              <h3 class="B-TMD-table-list-title-y"
-                  :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]">
-                {{ item.properties.pipename }}</h3>
-              <p v-for="itm in labelList" :key="itm.label">
-                <span>{{ itm.label }}锛�</span>
-                <span :title="item.properties[itm.key] ">{{ item.properties[itm.key] }}</span>
+          <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" :class="activeNum==index?'hover':''">
+            <img class="state" :src="getImgSrc()" style="background: none"/>
+            <div>
+              <h3 @click="handleLocation(item,index)">{{ item.properties.pipename }}</h3>
+              <p>鎵�灞炰紒涓氾細<span>{{ item.properties.orgcode }}</span>
+              <p>璁炬柦绫诲瀷锛�<span>{{ item.properties.teetype }}</span>
+              <!--  <el-button v-if="fuShuSheShiShow" class="rt" size="mini" style="margin-right: 0.04rem" @click="btnAffiliatedFacilities(item)" >闄勫睘璁炬柦</el-button> -->
               </p>
             </div>
           </div>
@@ -63,92 +60,109 @@
       <el-tab-pane label="鍒嗘瀽" name="second">
         <SewersAnalysis></SewersAnalysis>
       </el-tab-pane>
-      <el-tab-pane label="鍘嗗彶" name="third">鍘嗗彶</el-tab-pane>
+      <el-tab-pane label="鍘嗗彶" name="third">
+        <SewersHistory></SewersHistory>
+      </el-tab-pane>
     </el-tabs>
+    <!-- 闄勫睘璁炬柦闈㈡澘 -->
+    <affiliated-facilities :facilitiesParameter="facilitiesParameter"  v-if="fuShuSheShiShow" ></affiliated-facilities>
   </div>
 </template>
 
 <script>
-import { PipelineTypeOptions } from '@/conf/layers/LayerSewers'
+import { LayerPipeLines } from '@src/conf/layers/LayerPipeLines'
+import { LayerFsss } from '@src/conf/layers/LayerFsss'
+import { LayerHbss } from '@src/conf/layers/LayerHbss'
+import { LayerPk } from '@src/conf/layers/LayerPk'
+import { LayerArea } from '@src/conf/layers/LayerArea'
 
 import WfsHelper from '@components/helpers/WfsHelper'
 import AjaxUtils from '@utils/AjaxUtils'
 
+import AffiliatedFacilities from '@components/BaseNav/pipeline/AffiliatedFacilities'
+
+// 寮曞叆缁勪欢鍐呭
 import SewersAnalysis from '@components/panel/topicSearch/SewersSelect/SewersAnalysis'
+import SewersHistory from '@components/panel/topicSearch/SewersSelect/SewersHistory'
 
 export default {
   name: 'SewersSearch',
   components: {
-    SewersAnalysis
+    SewersAnalysis,
+    SewersHistory,
+    AffiliatedFacilities
   },
   data () {
     return {
       activeName: 'first',
       gdVisible: true,
       list: [],
-      labelList: PipelineTypeOptions[0].labelList,
+      items: [LayerPipeLines, LayerFsss, LayerHbss, LayerPk, LayerArea],
+      subItems: LayerPipeLines.layers,
       total: 0,
-      pipelineTypeOptions: PipelineTypeOptions,
-      dataTypeOptions: PipelineTypeOptions[0].options,
       form: {
-        pipelineType: PipelineTypeOptions[0].label,
-        dataType: PipelineTypeOptions[0].options[0].label,
-        query: PipelineTypeOptions[0].options[0],
-        keyword: '鐮旂┒闄�01璺痀S000001'
-        // ,
-        // size: 10,
-        // current: 1
+        pipelineType: '绠$嚎',
+        dataType: '',
+        keyword: ''
       },
       // pageSize: 10,
       // current: 1,
       isWaybillHover: true,
-      isRouteHover: false
+      isRouteHover: false,
+      facilitiesParameter: null,
+      fuShuSheShiShow: true,
+      activeNum: -1
     }
   },
   props: ['title'],
   methods: {
+    getImgSrc () {
+      const icon = this.form.dataType.icon
+      return icon ? 'assets/images/map/' + icon : ''
+    },
     handleClick (tab, event) {
       console.log(tab, event)
     },
+    // 璁炬柦绫诲瀷绛涢��
     handlePipelineType (val) {
-      this.pipelineTypeOptions.forEach((itm) => {
-        if (val === itm.value) {
-          this.dataTypeOptions = itm.options
-          this.form.pipelineType = itm.label
-          this.form.labelList = itm.labelList
+      this.list = []
+      // debugger
+      for (let i = 0; i < this.items.length; i++) {
+        const item = this.items[i]
+        if (val === item.name) {
+          this.subItems = item.layers
+          return
         }
-      })
-      this.form.dataType = this.dataTypeOptions[0].label
-      this.form.key = this.dataTypeOptions[0].key
+      }
     },
-    handleDataType (val) {
-      this.dataTypeOptions.forEach((itm) => {
-        if (val === itm.value) {
-          this.form.query = itm
-        }
-      })
+    handleDataType () {
+      this.list = []
     },
     async handleSearch () {
-      const param = {
-        pipelineType: this.form.pipelineType,
-        dataType: this.form.dataType
-      }
-      console.log(param)
+      // console.log(this.form.dataType.sname, this.form.keyword)
+      this.list = []
       var wfsHelper = new WfsHelper()
-      wfsHelper.addTypeName(this.form.query.layerName)
-      wfsHelper.addLike(this.form.query.key, this.form.keyword)
+      // todo 鐜板湪绠$綉杩樻病鍖哄垎寮�绫诲瀷锛屽悗闈㈡敼
+      wfsHelper.addTypeName(this.form.dataType.sname)
+      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.serviceLayerHelper.getByLayerId(val.id)
-      layer && layer.openPopup()
-      this.$store.state.map.map.flyToBounds(bound)
+    handleLocation (val, index) {
+      this.activeNum = index
+      this.facilitiesParameter = val
+      // layer && layer.openPopup()
+      // 鍒ゆ柇閫夋嫨鏄惁鏄绾匡紝濡傛灉鏄垯鏄剧ず銆婇檮灞炶鏂姐�嬪脊妗�
+      if (this.form.pipelineType === '绠$嚎') {
+        this.fuShuSheShiShow = true
+      } else {
+        this.fuShuSheShiShow = false
+      }
+      window.layerFactory.flyByFeature(val, this.form.dataType.code)
     }
   }
 }

--
Gitblit v1.8.0