src/views/mdc/common/BaseTree.vue
@@ -1,28 +1,28 @@
<template>
  <a-card class="tree_con" :loading="cardLoading" :bordered="false" >
  <a-card class="tree_con" :loading="cardLoading" :bordered="false">
    <a-spin :spinning="loading">
      <div style="display: flex;flex-direction: column;height: 100%">
          <div>
            <a-alert type="info" :showIcon="false" style="margin-right: 54px;padding-left: 5px">
              <div slot="message">
                <span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span>
                <a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">取消</a>
                <span v-else>无</span>
              </div>
            </a-alert>
            <div class="drawer-bottom-button">
              <a-dropdown :trigger="['click']" placement="bottomCenter">
                <a-menu slot="overlay">
                  <a-menu-item key="1" @click="expandAll">展开所有</a-menu-item>
                  <a-menu-item key="2" @click="closeAll">合并所有</a-menu-item>
                  <a-menu-item key="3" @click="refreshTree">刷新</a-menu-item>
                </a-menu>
                <a-button>
                  <a-icon type="bars"/>
                </a-button>
              </a-dropdown>
        <div>
          <a-alert type="info" :showIcon="false" style="margin-right: 54px;padding-left: 5px">
            <div slot="message">
              <span v-if="this.currSelected.title">{{ getCurrSelectedTitle() }}</span>
              <a v-if="this.currSelected.title" style="margin-left: 10px" @click="onClearSelected">取消</a>
              <span v-else>无</span>
            </div>
          </a-alert>
          <div class="drawer-bottom-button">
            <a-dropdown :trigger="['click']" placement="bottomCenter">
              <a-menu slot="overlay">
                <a-menu-item key="1" @click="expandAll">展开所有</a-menu-item>
                <a-menu-item key="2" @click="closeAll">合并所有</a-menu-item>
                <a-menu-item key="3" @click="refreshTree">刷新</a-menu-item>
              </a-menu>
              <a-button>
                <a-icon type="bars"/>
              </a-button>
            </a-dropdown>
          </div>
        </div>
        <a-input-search @search="handleSearch" style="width:100%;margin-top: 10px" placeholder="检索 类别编码/名称" allowClear
                        v-model="searchInput" @change="handleChange"/>
        <!-- showLine -->
@@ -58,7 +58,7 @@
        </div>
      </div>
    </a-spin>
    <tier-model ref="tierModalForm"  @ok="modalFormOk"></tier-model>
    <tier-model ref="tierModalForm" @ok="modalFormOk"></tier-model>
  </a-card>
</template>
@@ -70,7 +70,7 @@
  } from '@/api/manage'
  import Tooltip from 'ant-design-vue/es/tooltip'
  import TierModel from './modules/baseTree/TierModel'
  import {mapActions} from 'vuex'
  import { mapActions } from 'vuex'
  export default {
    name: 'BaseTree',
@@ -80,6 +80,10 @@
        default() {
          return true
        }
      },
      filterAbnormalDeviceKey: {
        type: String,
        default: ''
      }
    },
    components: {
@@ -105,7 +109,7 @@
        allTreeKeys: [],
        currSelected: {},
        hiding: false,
        mathChange:''
        mathChange: ''
      }
    }
    ,
@@ -149,17 +153,17 @@
      queryTreeData() {
        this.loading = true
        this.cardLoading = true
        this.QueryProduction().then(res => {
        this.QueryProduction(this.filterAbnormalDeviceKey).then(res => {
          if (res.success) {
            this.dataList = []
            this.allTreeKeys = []
            this.treeDataSource = res.result
            this.generateList(res.result)
            this.expandedKeys=this.allTreeKeys
            this.expandedKeys = this.allTreeKeys
          } else {
            this.$message.warn(res.message)
          }
        }).finally(() =>{
        }).finally(() => {
          this.loading = false
          this.cardLoading = false
        })
@@ -181,7 +185,7 @@
        let search = this.searchInput
        let expandedKeys = this.dataList
          .map(item => {
            if(item.title !=null){
            if (item.title != null) {
              if (item.title.indexOf(search) > -1) {
                return this.getParentKey(item.key, this.treeDataSource)
              }
@@ -200,7 +204,7 @@
        let expandedKeys = this.dataList
          .map(item => {
            if(item.title !=null){
            if (item.title != null) {
              if (item.title.indexOf(search) > -1) {
                return this.getParentKey(item.key, this.treeDataSource)
              }
@@ -262,9 +266,9 @@
        if (!ids) {
          // this.$message.warning('请选择一条记录!')
          this.$notification.warning({
            message:'消息',
            description:"请选择一条记录"
          });
            message: '消息',
            description: '请选择一条记录'
          })
          return
        } else {
          var that = this
@@ -276,7 +280,7 @@
              deleteAction(that.url.deleteBatch, { ids: ids }).then((res) => {
                if (res.success) {
                  that.$message.success(res.message)
                  that.queryTreeData();
                  that.queryTreeData()
                } else {
                  that.$message.warning(res.message)
                }
@@ -288,7 +292,7 @@
        }
      },
      modalFormOk(val) {
        console.log("mmm")
        console.log('mmm')
        // 新增/修改 成功时,重载列表
        this.queryTreeData()
        // 新增/修改 成功时,重载列表
@@ -298,7 +302,7 @@
    watch: {
      currSelected(val) { //监听currSelected 变化,将变化后的数值传递给 getCurrSelected 事件
        this.$emit('getCurrSelected', val)
      },
      }
    }
  }
</script>
@@ -368,37 +372,41 @@
    border-radius: 0 0 2px 2px;
  }
  .tree_con{
  .tree_con {
    overflow: hidden;
  }
  @media screen and (min-width: 1920px){
    .tree_con{
      height: 748px!important;
    }
  }
  @media screen and (min-width: 1680px) and (max-width: 1920px){
    .tree_con{
      height: 748px!important;
    }
  }
  @media screen and (min-width: 1400px) and (max-width: 1680px){
    .tree_con{
      height: 600px!important;
    }
  }
  @media screen and (min-width: 1280px) and (max-width: 1400px){
    .tree_con{
      height: 501px!important;
    }
  }
  @media screen and (max-width: 1280px){
    .tree_con{
      height: 501px!important;
  @media screen and (min-width: 1920px) {
    .tree_con {
      height: 748px !important;
    }
  }
  /deep/ .ant-card-body,/deep/ .ant-spin-nested-loading,/deep/ .ant-spin-container{
  @media screen and (min-width: 1680px) and (max-width: 1920px) {
    .tree_con {
      height: 748px !important;
    }
  }
  @media screen and (min-width: 1400px) and (max-width: 1680px) {
    .tree_con {
      height: 600px !important;
    }
  }
  @media screen and (min-width: 1280px) and (max-width: 1400px) {
    .tree_con {
      height: 501px !important;
    }
  }
  @media screen and (max-width: 1280px) {
    .tree_con {
      height: 501px !important;
    }
  }
  /deep/ .ant-card-body, /deep/ .ant-spin-nested-loading, /deep/ .ant-spin-container {
    height: 100%;
  }
</style>