From cb4ce544a38a4720b88946949b3258705d5ae2da Mon Sep 17 00:00:00 2001
From: chenzeping <ChenZeping02609@163.com>
Date: 星期五, 02 四月 2021 17:07:37 +0800
Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop

---
 src/components/panel/topicSearch/SolidWasteSearch.vue |  218 ++++++++++++++++++++++++++++++------------------------
 1 files changed, 120 insertions(+), 98 deletions(-)

diff --git a/src/components/panel/topicSearch/SolidWasteSearch.vue b/src/components/panel/topicSearch/SolidWasteSearch.vue
index c672fb9..b283cb1 100644
--- a/src/components/panel/topicSearch/SolidWasteSearch.vue
+++ b/src/components/panel/topicSearch/SolidWasteSearch.vue
@@ -18,52 +18,83 @@
             </el-option>
           </el-select>
         </el-form-item>
-        <div class="search-radio">
+        <!--  <div class="search-radio">
           <el-radio v-model="radio" label="1">鍏ㄩ儴</el-radio>
           <el-radio v-model="radio" label="2">姝e父</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-group>
+
+        <div class="rightButtonSearch">
+          <el-input  v-model="form.keyword" size="mini"  placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
+          <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
         </div>
         <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
           <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i>
         </el-input>
       </el-form>
-      <div>
-        <el-card class="box-card" v-for="(item,index) in searchDataDisplay" :key="index">
-          <div v-if="total > 3">
-            {{ item.CompanyName }}
+      <el-scrollbar style="height:500px">
+        <div class="environmental-risk-list">
+          <i class="state"></i>
+          <div>
+            <h3>###鐐煎寲閮�</h3>
+            <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p>
+            <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p>
           </div>
-        </el-card>
-        <el-pagination
-            small
-            layout="prev, pager, next"
-            :total=total
-            :current-page=1
-            class="warnPagination"
-        >
-        </el-pagination>
-      </div>
-      <!--      <el-scrollbar style="height:100%">-->
-      <!--      <el-card class="footer-page">-->
-      <!--        <ul>-->
-      <!--          {{ searchDataDisplay }}-->
-      <!--          <li v-for="(item,index) in searchDataDisplay" :key="index">-->
-      <!--            {{ item.CompanyName }}-->
-      <!--          </li>-->
-      <!--        </ul>-->
+        </div>
+        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
+          <i class="state"></i>
+          <div>
+            <h3>###鐐煎寲閮�</h3>
+            <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p>
+            <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p>
+          </div>
+        </div>
+        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
+          <i class="state"></i>
+          <div>
+            <h3>###鐐煎寲閮�</h3>
+            <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p>
+            <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p>
+          </div>
+        </div>
+        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
+          <i class="state"></i>
+          <div>
+            <h3>###鐐煎寲閮�</h3>
+            <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p>
+            <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p>
+          </div>
+        </div>
+        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
+          <i class="state"></i>
+          <div>
+            <h3>###鐐煎寲閮�</h3>
+            <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p>
+            <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p>
+          </div>
+        </div>
+        <div class="environmental-risk-list"><!-- v-for="(item,index) in list" :key="index" -->
+          <i class="state"></i>
+          <div>
+            <h3>###鐐煎寲閮�</h3>
+            <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p>
+            <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p>
+          </div>
+        </div>
+      </el-scrollbar>
+      <!--      <el-card class="box-card"-->
+      <!--               v-for="(item,index) in searchDataDisplay"-->
+      <!--               :key="index">-->
+      <!--        <div>-->
+      <!--          {{ item.CompanyName }}-->
+      <!--        </div>-->
       <!--      </el-card>-->
-      <!--          <el-pagination-->
-      <!--              small-->
-      <!--              @current-change="handlePage"-->
-      <!--              :page-size=pageSize-->
-      <!--              layout="prev, pager, next"-->
-      <!--              :total=total-->
-      <!--              :current-page=current-->
-      <!--              class="warnPagination"-->
-      <!--          >-->
-      <!--          </el-pagination>-->
-      <!--      </el-card>-->
-      <!--      </el-scrollbar>-->
     </div>
+    <!--      <el-scrollbar style="height:100%">-->
+    <!--      </el-scrollbar>-->
   </div>
 </template>
 
@@ -76,6 +107,11 @@
   props: ['title'],
   data () {
     return {
+      levelOfRisk: [
+        { name: '鍏ㄩ儴', value: '1' },
+        { name: '姝e父', value: '2' },
+        { name: '棰勮', value: '3' }
+      ],
       judgeVisible: true,
       solidWasteTypeOptions: [{
         value: '1',
@@ -144,89 +180,75 @@
       }],
       radio: '1',
       form: {
-        keyword: '鍥哄簾闈㈡澘鏁版嵁鏌ヨ'
+        keyword: '鍥哄簾闈㈡澘鏁版嵁鏌ヨ',
+        // 鏁版嵁鐨勪紶閫�
+        transferData: ''
       },
-      searchDataDisplay: [],
-      total: 0
+      searchDataDisplay: []
     }
   },
   methods: {
     handlePipelineType (val) {
-      this.solidWasteTypeOptions.forEach((itm) => {
-        if (val === itm.value) {
-          this.dataTypeOptions = itm.options
-          this.form.pipelineType = itm.label
-          this.form.labelList = itm.labelList
+      // 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)
         }
       })
-      this.form.dataType = this.dataTypeOptions[0].label
-      this.form.key = this.dataTypeOptions[0].key
     },
     // 鐐瑰嚮鎼滅储瀹炵幇鏁版嵁鐨勬悳绱㈠睍绀�
-    async handleSearch () {
+    async handleSearch (data) {
       // console.log(this.form.keyword)
-      const result = await mapApi.getSolidWasteSurveyDetail()
-      console.log(result)
+      const result = await mapApi.getSolidWasteSurveyDetail(data)
+      // console.log(result)
       this.searchDataDisplay = result.Result.DataInfo
-      this.total = result.Result.DataInfo.length
-    },
-    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)
     }
   }
 }
 </script>
 
 <style lang="less" scoped>
+.el-radio.is-checked .levelOfRisk-type {
+  color: #409EFF
+}
 
-.solidwaste-search {
+.levelOfRisk {
+  padding-left: 20px
+}
+
+.levelOfRisk .el-radio {
+  padding-bottom: 6px
+}
+
+.environmental-risk-list {
+  border: 1px solid @color;
+  margin-right: 10px;
+  margin-bottom: 15px;
   position: relative;
-  overflow: hidden;
+  padding-left: 50px;
+  padding-top: 3px;
+  padding-bottom: 3px;
+  color: #f5f5f5;
 
-  .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 {
-
-  }
-
-  .search-radio {
-    margin: 15px auto;
-    display: flex;
-    align-items: center;
-    justify-content: space-around;
-  }
-
-  .location-btn:hover, .el-input__icon:hover {
-    color: @color;
-    cursor: pointer;
-  }
-
-  .box-card {
-    margin: 15px auto;
+  .state {
+    width: 30px;
+    height: 30px;
+    position: absolute;
+    top: 50%;
+    left: 10px;
+    margin-top: -15px;
+    border-radius: 50%;
+    box-shadow: 0 0 3px #000;
+    background: #0B3B6D;
   }
 }
+
+.el-input {
+  margin: 15px auto;
+}
+
 </style>

--
Gitblit v1.8.0