From cf5ab6da9ff676fab8a10d4299bd5a04a07bf50f Mon Sep 17 00:00:00 2001
From: 徐旺旺 <11530253@qq.com>
Date: 星期一, 17 五月 2021 10:05:53 +0800
Subject: [PATCH] 修复默认选中图层时出现的BUG

---
 src/views/popup/Popup.vue |   82 +++++++++++++++--------------------------
 1 files changed, 30 insertions(+), 52 deletions(-)

diff --git a/src/views/popup/Popup.vue b/src/views/popup/Popup.vue
index eece635..a3c7836 100644
--- a/src/views/popup/Popup.vue
+++ b/src/views/popup/Popup.vue
@@ -1,15 +1,15 @@
 <template>
-  <div id="popup" v-if="isShow" class="s-map-popup-panel">
-    <el-tabs v-model="tabsValue" type="card">
+  <div id="popup" class="s-map-popup-panel" style="min-width: 280px;max-width: 280px;padding: 0 10px">
+    <el-tabs value="0" type="card">
       <el-tab-pane
               :key="item.name"
-              v-for="(item) in tabs"
+              v-for="(item,index) in datas"
               :label="item.title"
-              :name="item.name"
+              :name="index"
       >
-        <el-row v-for="(v,k) in filter" :key="k">
-          <el-col :span="10"><B>{{k}}锛�</B></el-col>
-          <el-col :span="14">{{v}}</el-col>
+        <el-row v-for="(v,k) in filter(item.content)" :key="k">
+          <el-col :span="12"><B>{{k}}锛�</B></el-col>
+          <el-col :span="12">{{v}}</el-col>
         </el-row>
       </el-tab-pane>
     </el-tabs>
@@ -22,10 +22,10 @@
 
 export default {
   name: 'Popup',
+  props: ['datas'],
   data () {
     return {
-      tabsValue: '1',
-      tabs: [],
+      tabsValue: '',
       tabIndex: 2,
       isShow: false,
       properties: {},
@@ -33,60 +33,38 @@
     }
   },
   computed: {
-    filter () {
-      var obj = {}
-      for (const key in this.properties) {
-        if (this.props[key]) {
-          obj[this.props[key]] = this.properties[key]
-        }
-      }
-      return obj
-    }
   },
   methods: {
-    handleTabsEdit (targetName, action) {
-      if (action === 'add') {
-        const newTabName = ++this.tabIndex + ''
-        this.editableTabs.push({
-          title: 'New Tab',
-          name: newTabName,
-          content: 'New Tab content'
-        })
-        this.editableTabsValue = newTabName
-      }
-      if (action === 'remove') {
-        const tabs = this.editableTabs
-        let activeName = this.editableTabsValue
-        if (activeName === targetName) {
-          tabs.forEach((tab, index) => {
-            if (tab.name === targetName) {
-              const nextTab = tabs[index + 1] || tabs[index - 1]
-              if (nextTab) {
-                activeName = nextTab.name
-              }
-            }
-          })
+    filter (content) {
+      var obj = {}
+      for (const key in content) {
+        if (this.props[key]) {
+          obj[this.props[key]] = content[key]
         }
-
-        this.editableTabsValue = activeName
-        this.editableTabs = tabs.filter(tab => tab.name !== targetName)
       }
+      // console.log(obj)
+      return obj
     },
     setDatas (layer) {
-      this.tabs = [{
-        title: layer.feature.id,
-        name: '1'
-      }]
-      this.properties = layer.feature.properties
+      console.log(layer)
+      this.datas = layer
+      this.tabsValue = layer[0].name
     },
     setShow () {
       // this.style.display='auto'
-      this.data = 'adsfadfsadfsdafsdfsdfdsafsdafsdafa'
       this.isShow = true
     },
     onClick () {
       const param = 1111
       this.$emit('callPopup', param)
+    }
+  },
+  watch: {
+    datas (newVal) {
+      console.log(newVal)
+      if (newVal != null) {
+        this.tabsValue = newVal[0].name
+      }
     }
   }
 }
@@ -95,9 +73,9 @@
 <style lang="less" >
 @import '../../assets/css/map/map-popup.less';
 #popup{
-  .el-tabs__content{
-    max-height: 300px;
-    overflow: auto;
+ .el-tabs__content{
+    max-height: 240px;
+    overflow-y: scroll;
   }
 }
 </style>

--
Gitblit v1.8.0