From b8b5fda251204264fc44f0c22db7dac741a4da22 Mon Sep 17 00:00:00 2001
From: YANGDL <114714267@qq.com>
Date: 星期一, 15 三月 2021 20:14:18 +0800
Subject: [PATCH] 修改地图样式

---
 src/components/panel/topicSearch/SewersSearch.vue |  141 ++++++++++++++++++++++++++--------------------
 1 files changed, 80 insertions(+), 61 deletions(-)

diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue
index a3987bf..f6ff0f2 100644
--- a/src/components/panel/topicSearch/SewersSearch.vue
+++ b/src/components/panel/topicSearch/SewersSearch.vue
@@ -1,16 +1,9 @@
 <template>
-  <div class="sewers-search">
-    <div class="el-message-box__header panel_header">
-      <div class="el-message-box__title panel_title"><!----><span>{{ title }}</span>
-      </div>
-    </div>
-    <div class="el-message-box__content" style="padding:6px;font-size: 13px;">
-      <div class="box__content" v-if="gdVisible">
-        <div>
-          <el-card class="search-panel">
+        <div class="sewers-search" v-if="gdVisible">
+          <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 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 pipelineTypeOptions"
                       :key="item.value"
@@ -20,7 +13,7 @@
                 </el-select>
               </el-form-item>
               <el-form-item :label="form.pipelineType+'锛�'" size="mini">
-                <el-select v-model="form.dataType"  @change="handleDataType" popper-class="select-down">
+                <el-select style="width: 100%"  v-model="form.dataType"  @change="handleDataType" :popper-class="'select-down'">
                   <el-option
                       v-for="item in dataTypeOptions"
                       :key="item.value"
@@ -29,46 +22,46 @@
                   </el-option>
                 </el-select>
               </el-form-item>
-<!--              <el-form-item >-->
-                <el-input v-model="form.keyword" size="mini"
-                          placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
-<!--                  <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
-<!--                  <i slot="prefix" class="el-input__icon el-icon-search"></i>-->
-                  <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i>
-                </el-input>
-<!--              </el-form-item>-->
-<!--              <el-form-item>-->
-<!--                <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">-->
-<!--                <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">-->
-<!--              </el-form-item>-->
+              <!--              <el-form-item >-->
+              <el-input v-model="form.keyword" size="mini"
+                        placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
+                <!--                  <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
+                <!--                  <i slot="prefix" class="el-input__icon el-icon-search"></i>-->
+                <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i>
+              </el-input>
+              <!--              </el-form-item>-->
+              <!--              <el-form-item>-->
+              <!--                <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">-->
+              <!--                <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">-->
+              <!--              </el-form-item>-->
             </el-form>
-          </el-card>
-          <el-card class="search-result" >
+          </div>
+          <el-scrollbar style="height:100%">
             <div class="B-TMD-table-list" v-for="(item,index) in list" :key="index">
               <div class="B-TMD-table-list-title">
                 <div class="B-TMD-table-list-head">
                   <div class="B-TMD-table-list-title-y"
                        :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]">
-<!--                    <span>杩愬崟鍙凤細</span>-->
+                    <!--                    <span>杩愬崟鍙凤細</span>-->
                     <span id="waybillNumber" class=""
                           :title="item.properties.pipename">
                                                 <span class="location-btn" @click="handleLocation(item)">{{ item.properties.pipename }}</span>
                                             </span>
                   </div>
-<!--                  <div class="B-TMD-table-list-title-c">-->
-<!--                    {{ labelList[0] }}锛�-->
-<!--                    <span id="plateNumber_p">-->
-<!--                                                <span id="plateNumber_n"><a href="#">{{ item.properties.item.p1 }}</a></span>-->
-<!--                                            </span>-->
-<!--                  </div>-->
+                  <!--                  <div class="B-TMD-table-list-title-c">-->
+                  <!--                    {{ labelList[0] }}锛�-->
+                  <!--                    <span id="plateNumber_p">-->
+                  <!--                                                <span id="plateNumber_n"><a href="#">{{ item.properties.item.p1 }}</a></span>-->
+                  <!--                                            </span>-->
+                  <!--                  </div>-->
                 </div>
-<!--                <div class="B-TMD-table-icons" style="float:right">-->
-<!--                  <ul>-->
-<!--                    <li class="B-TMD-table-list-title-y-adress"-->
-<!--                        @click="handleLocation(item)"></li>-->
-<!--                    <li :class="[{'B-TMD-table-list-title-y-car': item.vehicleStatus ==='910002', 'B-TMD-table-list-title-y-car-offline': item.vehicleStatus ==='910001','B-TMD-table-list-title-y-car-warning': item.vehicleStatus==='910003' }]"></li>-->
-<!--                  </ul>-->
-<!--                </div>-->
+                <!--                <div class="B-TMD-table-icons" style="float:right">-->
+                <!--                  <ul>-->
+                <!--                    <li class="B-TMD-table-list-title-y-adress"-->
+                <!--                        @click="handleLocation(item)"></li>-->
+                <!--                    <li :class="[{'B-TMD-table-list-title-y-car': item.vehicleStatus ==='910002', 'B-TMD-table-list-title-y-car-offline': item.vehicleStatus ==='910001','B-TMD-table-list-title-y-car-warning': item.vehicleStatus==='910003' }]"></li>-->
+                <!--                  </ul>-->
+                <!--                </div>-->
               </div>
               <div class="B-TMD-table-list-content">
 
@@ -76,17 +69,16 @@
                   <span>{{ itm.label }}锛�</span>
                   <span id="b_twe_loan" :title="item.properties[itm.key] ">{{ item.properties[itm.key] }}</span>
                 </div>
-<!--                <div><span>鏀惰揣浼佷笟锛�</span> <span-->
-<!--                    id="b_twe_loan1" :title="item.recvWarehouseName">{{ item.recvWarehouseName }}</span>-->
-<!--                </div>-->
+                <!--                <div><span>鏀惰揣浼佷笟锛�</span> <span-->
+                <!--                    id="b_twe_loan1" :title="item.recvWarehouseName">{{ item.recvWarehouseName }}</span>-->
+                <!--                </div>-->
               </div>
-<!--              <div class="B-TMD-table-list-bottom">-->
-<!--                <div class="B-TMD-table-list-bottom-name">-->
-<!--                  璐х墿鍚嶇О锛�<span :title="item.materialName">{{ item.materialName }}</span></div>-->
-<!--              </div>-->
+              <!--              <div class="B-TMD-table-list-bottom">-->
+              <!--                <div class="B-TMD-table-list-bottom-name">-->
+              <!--                  璐х墿鍚嶇О锛�<span :title="item.materialName">{{ item.materialName }}</span></div>-->
+              <!--              </div>-->
             </div>
-          </el-card>
-
+          </el-scrollbar>
           <el-card class="footer-page" v-if="total > 10">
             <el-pagination
                 small
@@ -100,16 +92,12 @@
             </el-pagination>
           </el-card>
         </div>
-      </div>
       <!--        <div class="monitor2" v-if="hbVisible">-->
       <!--          <env-protect-search></env-protect-search>-->
       <!--        </div>-->
       <!--        <div class="monitor2" v-if="pkVisible">-->
       <!--          <discharge-search></discharge-search>-->
       <!--        </div>-->
-    </div>
-  </div>
-
 </template>
 
 <script>
@@ -162,7 +150,7 @@
         }
       })
     },
-    handleSearch () {
+    async handleSearch () {
       const param = {
         pipelineType: this.form.pipelineType,
         dataType: this.form.dataType
@@ -172,17 +160,15 @@
       wfsHelper.addTypeName(this.form.query.layerName)
       wfsHelper.addLike(this.form.query.key, this.form.keyword)
       // const _this = this
-      AjaxUtils.GetDataAsynByUrl(wfsHelper.getUrl(), {}, (res) => {
-        console.log(res)
-        this.list = res.features
-      })
+      const res = await AjaxUtils.GetDataAsynByUrl(wfsHelper.getUrl(), {})
+      if (res.data instanceof Object && Object.prototype.hasOwnProperty.call(res.data, 'features')) {
+        this.list = res.data.features
+      }
     },
     handleLocation (val) {
       console.log(val)
       const bound = this.L.geoJSON([val], {}).getBounds()
-      console.log(bound)
       var layer = window.serviceLayerHelper.getByLayerId(val.id)
-      console.log(layer)
       layer && layer.openPopup()
       this.$store.state.map.map.flyToBounds(bound)
     }
@@ -190,6 +176,39 @@
 }
 </script>
 
-<style lang="less">
-@import '@assets/css/map/map-elem-ui';
+<style lang="less" scoped>
+
+.sewers-search{
+  position: relative;
+  overflow: hidden;
+  .search-panel{
+   background-color: transparent;
+    border: 1px solid @background-color-split;
+    padding: 10px;
+
+    /deep/ input {
+      border-radius: 0;
+      background-color: @background-color-split ;
+      border: solid 1px @color ;
+      color: @color-gray;
+      font-size: 0.01rem;
+      .el-select .el-input.is-focus .el-input__inner{
+        border-color: @color;
+      }
+    }
+    /deep/ input:focus{
+      border-color: @color;
+    }
+  }
+  .search-btn{
+
+  }
+  //location-btn{
+  //
+  //}
+  .location-btn:hover,.el-input__icon:hover{
+    color: @color;
+    cursor: pointer;
+  }
+}
 </style>

--
Gitblit v1.8.0