派生自 wuyushui/SewerAndRainNetwork

徐旺旺
2021-04-29 150a37f948214be4bd183b30f3f2865a6f1c519f
src/views/popup/Popup.vue
@@ -7,9 +7,9 @@
              :label="item.title"
              :name="item.name"
      >
        <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>
@@ -24,7 +24,7 @@
  name: 'Popup',
  data () {
    return {
      tabsValue: '1',
      tabsValue: '',
      tabs: [],
      tabIndex: 2,
      isShow: false,
@@ -33,52 +33,21 @@
    }
  },
  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) {
      console.log(layer)
      this.tabs = [{
        title: layer.feature.properties.name || layer.feature.id,
        name: '1'
      }]
      this.properties = layer.feature.properties
      this.tabs = layer
      this.tabsValue = layer[0].name
    },
    setShow () {
      // this.style.display='auto'
@@ -96,9 +65,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>