全局定义树方法和全新弹窗组件，以及设备树搜索修改

src/components/module_ems/UModal/ModalDragMixins.js

@@ -0,0 +1,152 @@
+import {getRefPromise} from '@/utils/util'
+
+/** JModal 的拖拽混入 */
+export default {
+  data() {
+    return {
+      // 拖动配置
+      dragSettings: {
+        // 上次拖动top记录
+        top: null,
+        // 上次拖动left记录
+        left: null,
+        wrapEl: null,
+        dragEl: null,
+        headerEl: null,
+      },
+    }
+  },
+  watch: {
+    visible() {
+      if (!this.visible || !this.draggable) {
+        return
+      }
+      this.handleDrag()
+    },
+    draggable() {
+      if (!this.visible || !this.draggable) {
+        return
+      }
+      this.handleDrag()
+    },
+  },
+  methods: {
+    async handleDrag() {
+      let modalRef = await getRefPromise(this, 'modal')
+      const dragWraps = modalRef.$el.querySelectorAll('.ant-modal-wrap')
+      let wrapEl = dragWraps[0]
+      if (!wrapEl) return
+      this.dragSettings.wrapEl = wrapEl
+      this.dragSettings.dragEl = wrapEl.querySelector('.ant-modal')
+      this.dragSettings.headerEl = wrapEl.querySelector('.ant-modal-header')
+      const display = getStyle(wrapEl, 'display')
+      const draggable = wrapEl.getAttribute('data-drag')
+      if (display !== 'none') {
+        // 拖拽位置
+        if (draggable === null || this.destroyOnClose) {
+          this.enableDrag(wrapEl)
+        }
+      }
+    },
+    /** 启用拖拽 */
+    enableDrag() {
+      let {wrapEl, dragEl, headerEl} = this.dragSettings
+      if (!wrapEl) return
+      wrapEl.setAttribute('data-drag', this.draggable)
+      if (!headerEl || !dragEl || !this.draggable) return
+
+      // 还原上一次移动的位置
+      this.resetModalPosition()
+
+      headerEl.style.cursor = 'move'
+      headerEl.onmousedown = (e) => {
+        if (!e) return
+        // 鼠标按下，计算当前元素距离可视区的距离
+        const disX = e.clientX
+        const disY = e.clientY
+        const screenWidth = document.body.clientWidth // body当前宽度
+        const screenHeight = document.documentElement.clientHeight // 可见区域高度(应为body高度，可某些环境下无法获取)
+
+        const dragElWidth = dragEl.offsetWidth // 对话框宽度
+        const dragElHeight = dragEl.offsetHeight // 对话框高度
+
+        const minDragElLeft = dragEl.offsetLeft
+
+        const maxDragElLeft = screenWidth - dragEl.offsetLeft - dragElWidth
+        const minDragElTop = dragEl.offsetTop
+        const maxDragElTop = screenHeight - dragEl.offsetTop - dragElHeight
+        // 获取到的值带px 正则匹配替换
+        const domLeft = getStyle(dragEl, 'left')
+        const domTop = getStyle(dragEl, 'top')
+        let styL = +domLeft
+        let styT = +domTop
+
+        // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
+        if (domLeft.includes('%')) {
+          styL = +document.body.clientWidth * (+domLeft.replace(/%/g, '') / 100)
+          styT = +document.body.clientHeight * (+domTop.replace(/%/g, '') / 100)
+        } else {
+          styL = +domLeft.replace(/px/g, '')
+          styT = +domTop.replace(/px/g, '')
+        }
+
+        document.onmousemove = (e) => {
+          // 全屏时不触发移动方法
+          if (this.innerFullscreen) {
+            return
+          }
+          // 通过事件委托，计算移动的距离
+          let left = e.clientX - disX
+          let top = e.clientY - disY
+
+          // 边界处理
+          if (-left > minDragElLeft) {
+            left = -minDragElLeft
+          } else if (left > maxDragElLeft) {
+            left = maxDragElLeft
+          }
+
+          if (-top > minDragElTop) {
+            top = -minDragElTop
+          } else if (top > maxDragElTop) {
+            top = maxDragElTop
+          }
+
+          this.setModalPosition(top + styT, left + styL)
+        }
+
+        document.onmouseup = () => {
+          document.onmousemove = null
+          document.onmouseup = null
+        }
+      }
+    },
+
+    /**
+     * 移动弹窗位置
+     * @param top 顶部位置
+     * @param left 左侧位置
+     * @param remember 是否记录位置，默认 true
+     */
+    setModalPosition(top, left, remember = true) {
+      // 记录移动位置
+      if (remember) {
+        this.dragSettings.top = top
+        this.dragSettings.left = left
+      }
+      // 移动当前元素
+      this.dragSettings.dragEl.style.cssText += `;left:${left}px;top:${top}px;`
+    },
+    /**
+     * 将弹窗移动到上次记录的位置
+     */
+    resetModalPosition() {
+      this.setModalPosition(this.dragSettings.top, this.dragSettings.left, false)
+    },
+
+  },
+}
+
+function getStyle(dom, attr) {
+  return getComputedStyle(dom)[attr]
+}

src/components/module_ems/UModal/UModal.vue

@@ -0,0 +1,265 @@
+<template>
+  <a-modal
+    ref="modal"
+    :class="getClass(modalClass)"
+    :style="getStyle(modalStyle)"
+    :visible="visible"
+    v-bind="_attrs"
+    v-on="$listeners"
+    :destroyOnClose="destroyOnClose"
+    :footer="null"
+    >
+    <!-- @ok="handleOk"
+    @cancel="handleCancel" -->
+
+    <slot></slot>
+    <!--有设置标题-->
+    <template v-if="!isNoTitle" slot="title">
+      <a-row class="u-modal-title-row" type="flex">
+        <a-col class="left">
+          <slot name="title">{{ title }}</slot>
+        </a-col>
+        <a-col v-if="switchFullscreen" class="right" @click="toggleFullscreen">
+          <a-button class="ant-modal-close ant-modal-close-x" ghost type="link" :icon="fullscreenButtonIcon"/>
+        </a-col>
+      </a-row>
+    </template>
+    <!--没有设置标题-->
+    <template v-else slot="title">
+      <a-row class="u-modal-title-row" type="flex">
+        <a-col v-if="switchFullscreen" class="right" @click="toggleFullscreen">
+          <a-button class="ant-modal-close ant-modal-close-x" ghost type="link" :icon="fullscreenButtonIcon"/>
+        </a-col>
+      </a-row>
+    </template>
+
+    <!-- 处理 scopedSlots -->
+    <template v-for="slotName of scopedSlotsKeys" :slot="slotName">
+      <slot :name="slotName"></slot>
+    </template>
+
+    <!-- 处理 slots -->
+    <template v-for="slotName of slotsKeys" v-slot:[slotName]>
+      <slot :name="slotName"></slot>
+    </template>
+
+  </a-modal>
+</template>
+
+<script>
+
+import { getClass, getStyle } from '@/utils/props-util'
+import { triggerWindowResizeEvent } from '@/utils/util'
+import ModalDragMixins from './ModalDragMixins'
+
+export default {
+    name: 'UModal',
+    mixins: [ModalDragMixins],
+    props: {
+      title: String,
+      // 可使用 .sync 修饰符
+      visible: Boolean,
+      // 是否开启拖拽
+      draggable: Boolean,
+      // 是否全屏弹窗，当全屏时无论如何都会禁止 body 滚动。可使用 .sync 修饰符
+      fullscreen: {
+        type: Boolean,
+        default: false
+      },
+      // 是否允许切换全屏（允许后右上角会出现一个按钮）
+      switchFullscreen: {
+        type: Boolean,
+        default: false
+      },
+      // 点击确定按钮的时候是否关闭弹窗
+      okClose: {
+        type: Boolean,
+        default: true
+      },
+      // 关闭时销毁弹窗内容
+      destroyOnClose: {
+        type: Boolean,
+        default: true
+      },
+    },
+    data() {
+      return {
+        // 内部使用的 slots ，不再处理
+        usedSlots: ['title'],
+        // 实际控制是否全屏的参数
+        innerFullscreen: this.fullscreen,
+      }
+    },
+    computed: {
+      // 一些未处理的参数或特殊处理的参数绑定到 a-modal 上
+      _attrs() {
+        let attrs = { ...this.$attrs }
+        // 如果全屏就将宽度设为 100%
+        if (this.innerFullscreen) {
+          attrs['width'] = '100%'
+        }
+        return attrs
+      },
+      modalClass() {
+        return {
+          'u-modal-box': true,
+          'fullscreen': this.innerFullscreen,
+          'no-title': this.isNoTitle,
+          'no-footer': this.isNoFooter,
+        }
+      },
+      modalStyle() {
+        let style = {}
+        // 如果全屏就将top设为 0
+        if (this.innerFullscreen) {
+          style['top'] = '0'
+        }
+        return style
+      },
+      isNoTitle() {
+        return !this.title && !this.allSlotsKeys.includes('title')
+      },
+      isNoFooter() {
+        return this._attrs['footer'] === null
+      },
+      slotsKeys() {
+        return Object.keys(this.$slots).filter(key => !this.usedSlots.includes(key))
+      },
+      scopedSlotsKeys() {
+        return Object.keys(this.$scopedSlots).filter(key => !this.usedSlots.includes(key))
+      },
+      allSlotsKeys() {
+        return Object.keys(this.$slots).concat(Object.keys(this.$scopedSlots))
+      },
+      // 切换全屏的按钮图标
+      fullscreenButtonIcon() {
+        return this.innerFullscreen ? 'fullscreen-exit' : 'fullscreen'
+      },
+    },
+    watch: {
+      visible() {
+        if (this.visible) {
+          this.innerFullscreen = this.fullscreen
+        }
+      },
+      innerFullscreen(val) {
+        this.$emit('update:fullscreen', val)
+      },
+    },
+    methods: {
+
+      getClass(clazz) {
+        return { ...getClass(this), ...clazz }
+      },
+      getStyle(style) {
+        return { ...getStyle(this), ...style }
+      },
+
+      close() {
+        this.$emit('update:visible', false)
+      },
+
+      handleOk() {
+        if (this.okClose) {
+          this.close()
+        }
+      },
+      handleCancel() {
+        this.close()
+      },
+
+      /** 切换全屏 */
+      toggleFullscreen() {
+        this.innerFullscreen = !this.innerFullscreen
+        triggerWindowResizeEvent()
+        // 开启拖拽后的特殊处理
+        if (this.draggable) {
+          // 全屏的时候禁止拖动
+          if (this.innerFullscreen) {
+            // 还原弹窗的位置为0,0
+            this.setModalPosition(0, 0, false)
+            this.dragSettings.headerEl.style.cursor = null
+          } else {
+            // 取消全屏的时候，将弹窗移动到上次记录的位置
+            this.resetModalPosition()
+            this.dragSettings.headerEl.style.cursor = 'move'
+          }
+        }
+      },
+
+    }
+  }
+</script>
+
+<style lang="less">
+  
+  // .u-modal-box {
+  //   &.fullscreen {
+  //     top: 0;
+  //     left: 0;
+  //     padding: 0;
+
+  //     // 兼容1.6.2版本的antdv
+  //     & .ant-modal {
+  //       top: 0;
+  //       padding: 0;
+  //       height: 100vh;
+  //     }
+
+  //     & .ant-modal-content {
+  //       height: 100vh;
+  //       border-radius: 0;
+
+  //       & .ant-modal-body {
+  //         /* title 和 footer 各占 55px */
+  //         height: calc(100% - 55px - 55px);
+  //         overflow: auto;
+  //       }
+  //     }
+
+  //     &.no-title, &.no-footer {
+  //       .ant-modal-body {
+  //         height: calc(100% - 55px);
+  //       }
+  //     }
+  //     &.no-title.no-footer {
+  //       .ant-modal-body {
+  //         height: 100%;
+  //       }
+  //     }
+  //   }
+
+  //   .u-modal-title-row {
+  //     .left {
+  //       width: calc(100% - 56px - 56px);
+  //     }
+
+  //     .right {
+  //       width: 56px;
+  //       position: inherit;
+
+  //       .ant-modal-close {
+  //         right: 56px;
+  //         color: rgba(0, 0, 0, 0.45);
+
+  //         &:hover {
+  //           color: rgba(0, 0, 0, 0.75);
+  //         }
+  //       }
+  //     }
+  //   }
+  //   &.no-title{
+  //     .ant-modal-header {
+  //       padding: 0px 24px;
+  //       border-bottom: 0px !important;
+  //     }
+  //   }
+  // }
+
+  @media (max-width: 767px) {
+    .u-modal-box.fullscreen {
+      margin: 0;
+      max-width: 100vw;
+    }
+  }
+</style>

src/components/module_ems/UModal/UPrompt.vue

@@ -0,0 +1,124 @@
+<template>
+  <u-modal :visible="visible" :confirmLoading="loading" :after-close="afterClose" v-bind="modalProps" @ok="onOk" @cancel="onCancel">
+    <a-spin :spinning="loading">
+      <div v-html="content"></div>
+      <a-form-model ref="form" :model="model" :rules="rules">
+        <a-form-model-item prop="input">
+          <a-input ref="input" v-model="model.input" v-bind="inputProps" @pressEnter="onInputPressEnter"/>
+        </a-form-model-item>
+      </a-form-model>
+    </a-spin>
+  </u-modal>
+</template>
+
+<script>
+import pick from 'lodash.pick'
+
+export default {
+  name: 'UPrompt',
+  data() {
+    return {
+      visible: false,
+      loading: false,
+      content: '',
+      // 弹窗参数
+      modalProps: {
+        title: '',
+      },
+      inputProps: {
+        placeholder: '',
+      },
+      // form model
+      model: {
+        input: '',
+      },
+      // 校验
+      rule: [],
+      // 回调函数
+      callback: {},
+    }
+  },
+  computed: {
+    rules() {
+      return {
+        input: this.rule
+      }
+    },
+  },
+  methods: {
+    show(options) {
+      this.content = options.content
+      if (Array.isArray(options.rule)) {
+        this.rule = options.rule
+      }
+      if (options.defaultValue != null) {
+        this.model.input = options.defaultValue
+      }
+      // 取出常用的弹窗参数
+      let pickModalProps = pick(options, 'title', 'centered', 'cancelText', 'closable', 'mask', 'maskClosable', 'okText', 'okType', 'okButtonProps', 'cancelButtonProps', 'width', 'wrapClassName', 'zIndex', 'dialogStyle', 'dialogClass')
+      this.modalProps = Object.assign({}, pickModalProps, options.modalProps)
+      // 取出常用的input参数
+      let pickInputProps = pick(options, 'placeholder', 'allowClear')
+      this.inputProps = Object.assign({}, pickInputProps, options.inputProps)
+      // 回调函数
+      this.callback = pick(options, 'onOk', 'onOkAsync', 'onCancel')
+      this.visible = true
+      this.$nextTick(() => this.$refs.input.focus())
+    },
+
+    onOk() {
+      this.$refs.form.validate((ok, err) => {
+        if (ok) {
+          let event = {value: this.model.input, target: this}
+          // 异步方法优先级高于同步方法
+          if (typeof this.callback.onOkAsync === 'function') {
+            this.callback.onOkAsync(event)
+          } else if (typeof this.callback.onOk === 'function') {
+            this.callback.onOk(event)
+            this.close()
+          } else {
+            this.close()
+          }
+        }
+      })
+    },
+    onCancel() {
+      if (typeof this.callback.onCancel === 'function') {
+        this.callback.onCancel(this.model.input)
+      }
+      this.close()
+    },
+
+    onInputPressEnter() {
+      this.onOk()
+    },
+
+    close() {
+      this.visible = this.loading ? this.visible : false
+    },
+
+    forceClose() {
+      this.visible = false
+    },
+
+    showLoading() {
+      this.loading = true
+    },
+    hideLoading() {
+      this.loading = false
+    },
+
+    afterClose(e) {
+      if (typeof this.modalProps.afterClose === 'function') {
+        this.modalProps.afterClose(e)
+      }
+      this.$emit('after-close', e)
+    },
+
+  },
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/module_ems/UModal/index.js

@@ -0,0 +1,18 @@
+import UModal from './UModal'
+import UPrompt from './UPrompt'
+
+export default {
+  install(Vue) {
+    Vue.component(UModal.name, UModal)
+
+    const JPromptExtend = Vue.extend(UPrompt)
+    Vue.prototype.$JPrompt = function (options = {}) {
+      // 创建prompt实例
+      const vm = new JPromptExtend().$mount()
+      vm.show(options)
+      // 关闭后销毁
+      vm.$on('after-close', () => vm.$destroy())
+      return vm
+    }
+  },
+}

src/components/module_ems/index.js

@@ -0,0 +1,10 @@
+import UModal from './UModal'
+
+export default {
+  install(Vue) {
+    Vue.use(UModal)
+
+    //注册全局js函数和变量
+    Vue.prototype.$UModal = UModal
+  }
+}

src/main.js

@@ -43,6 +43,10 @@ import JDictSelectTag from './components/dict/index.js'
 import hasPermission from '@/utils/hasPermission'
 import vueBus from '@/utils/vueBus';
 import JeecgComponents from '@/components/jeecg/index'
+// 修改框架：新增递归树全局方法
+import { handleTree } from "@/utils/ems";
+// 修改框架：新增全新弹窗全局组件
+import UComponents from '@/components/module_ems/index'
 import '@/assets/less/JAreaLinkage.less'
 import VueAreaLinkage from 'vue-area-linkage'
 import '@/components/jeecg/JVxeTable/install'
@@ -51,6 +55,8 @@ import '@/components/JVxeCells/install'
 import { rules } from '@/utils/rules'
 Vue.prototype.rules = rules
 Vue.config.productionTip = false
+// 修改框架：全局挂载方法递归树
+Vue.prototype.handleTree = handleTree
 Vue.use(Storage, config.storageOptions)
 Vue.use(Antd)
 Vue.use(VueAxios, router)
@@ -61,6 +67,8 @@ Vue.use(Print)
 Vue.use(preview)
 Vue.use(vueBus);
 Vue.use(JeecgComponents);
+// 修改框架：新增全新弹窗全局组件
+Vue.use(UComponents);
 Vue.use(VueAreaLinkage);
 
 SSO.init(() => {

src/utils/ems.js

@@ -0,0 +1,50 @@
+/**
+ * 构造树型结构数据
+ * @param {*} data 数据源
+ * @param {*} id id字段 默认 'id'
+ * @param {*} parentId 父节点字段 默认 'parentId'
+ * @param {*} children 孩子节点字段 默认 'children'
+ */
+export function handleTree(data, id, parentId, children) {
+  let config = {
+    id: id || 'id',
+    parentId: parentId || 'parentId',
+    childrenList: children || 'children'
+  };
+
+  var childrenListMap = {};
+  var nodeIds = {};
+  var tree = [];
+
+  for (let d of data) {
+    let parentId = d[config.parentId];
+    if (childrenListMap[parentId] == null) {
+      childrenListMap[parentId] = [];
+    }
+    nodeIds[d[config.id]] = d;
+    childrenListMap[parentId].push(d);
+  }
+
+  for (let d of data) {
+    let parentId = d[config.parentId];
+    if (nodeIds[parentId] == null) {
+      tree.push(d);
+    }
+  }
+
+  for (let t of tree) {
+    adaptToChildrenList(t);
+  }
+
+  function adaptToChildrenList(o) {
+    if (childrenListMap[o[config.id]] !== null) {
+      o[config.childrenList] = childrenListMap[o[config.id]];
+    }
+    if (o[config.childrenList]) {
+      for (let c of o[config.childrenList]) {
+        adaptToChildrenList(c);
+      }
+    }
+  }
+  return tree;
+}

src/views/module_ems/tpmTag/TpmDeviceList.vue

@@ -1,123 +1,139 @@
 <template>
-    <a-card :bordered="false">
-        <!-- <div class="tree">
-        </div> -->
-        <div>
-            <a-input-search style="margin-bottom: 8px" placeholder="Search" @change="onChange" />
-            <a-tree
-            :expanded-keys="expandedKeys"
-            :auto-expand-parent="autoExpandParent"
-            :tree-data="gData"
-            @expand="onExpand"
-            >
-                <template slot="title" slot-scope="{ title }">
-                    <span v-if="title.indexOf(searchValue) > -1">
-                    {{ title.substr(0, title.indexOf(searchValue)) }}
-                    <span style="color: #f50">{{ searchValue }}</span>
-                    {{ title.substr(title.indexOf(searchValue) + searchValue.length) }}
-                    </span>
-                    <span v-else>{{ title }}</span>
-                </template>
-            </a-tree>
-        </div>
-    </a-card>
+  <a-card :bordered="false">
+    <!-- <div class="tree">
+    </div> -->
+    <div>
+      <a-input-search style="margin-bottom: 8px" placeholder="Search" @change="onChange" />
+      <a-tree
+        :expanded-keys="expandedKeys"
+        auto-expand-parent
+        :tree-data="tpmTreeData"
+        @expand="onExpand"
+        :replace-fields="replaceFields"
+        :filter-tree-node="filterTreeNode"
+        >
+        <!-- <template slot="title" slot-scope="{ title }">
+          <span v-if="name.indexOf(searchValue) > -1">
+          {{ name.substr(0, name.indexOf(searchValue)) }}
+          <span style="color: #f50">{{ searchValue }}</span>
+          {{ name.substr(name.indexOf(searchValue) + searchValue.length) }}
+          </span>
+          <span v-else>{{ title }}</span>
+        </template> -->
+      </a-tree>
+    </div>
+  </a-card>
 </template>
 
 <script>
-const x = 3;
-const y = 2;
-const z = 1;
-const gData = [];
+  import { getAction } from '@api/manage'
+  export default({
+    components: {
+    },
+    data () {
+      return {
+        expandedKeys: [],
+        searchValue: '',
+        autoExpandParent: true,
+        tpmListData: [], // 原始数据
+        tpmTreeData: [], // 树形列表使用数据
+        replaceFields: {
+          children: 'children',
+          title: 'name',
+        },
+      }
+    },
+    created() {
+      this.getTpmTreeData()
+    },
+    methods: {
+      getTpmTreeData(){
+        getAction(`/tpmEquipmentTree/tpmEquipmentTree/listtreeandequip`).then(res=>{
+          if (res.success) {
+            // 防止res.result对tpmListData造成地址赋值的问题
+            this.tpmListData = JSON.parse(JSON.stringify(res.result))
+            this.tpmTreeData = this.handleTree(res.result, "id", "parentid")
+            console.log(this.tpmTreeData)
+          } else {
+            
+          }
+        })
+      },
+      filterTreeNode(node) {
+        console.log(node)
+        // if (!inputValue) return true;
+        return node.title.indexOf('设备') !== -1;
+      },
+      onExpand(expandedKeys) {
+        this.expandedKeys = expandedKeys;
+        this.autoExpandParent = false;
+      },
+      onChange(e) {
+        const value = e.target.value;
+        // 筛选后数据
+        var filterData = []
+        // 筛选符合条件的数据：包含当前搜索的项
+        console.log(this.tpmListData)
+        filterData = this.tpmListData.filter(item => (item.name.indexOf(value) !== -1))
+        // var data = []
+        // filterData.forEach(item => {
+        //   var arr = this.tpmListData.filter(data => item.parentid === data.id)
+        //   console.log('父级', arr)
+        //   // filterData = [...filterData, ...arr]
+        // })
+        // 循环寻找父级
+        // console.log(this.findParents(this.tpmTreeData, '287813167808513'))
 
-const generateData = (_level, _preKey, _tns) => {
-  const preKey = _preKey || '0';
-  const tns = _tns || gData;
+        
 
-  const children = [];
-  for (let i = 0; i < x; i++) {
-    const key = `${preKey}-${i}`;
-    tns.push({ title: key, key, scopedSlots: { title: 'title' } });
-    if (i < y) {
-      children.push(key);
-    }
-  }
-  if (_level < 0) {
-    return tns;
-  }
-  const level = _level - 1;
-  children.forEach((key, index) => {
-    tns[index].children = [];
-    return generateData(level, key, tns[index].children);
-  });
-};
-generateData(z);
+        
+        this.tpmTreeData = this.handleTree(filterData, "id", "parentid")
+        // const expandedKeys = dataList.map(item => {
+        //   if (item.name.indexOf(value) > -1) {
+        //       // return getParentKey(item.key, gData);
+        //       return this.filterNode(item.key, gData);
+        //   }
+        //   return null;
+        // }).filter((item, i, self) => item && self.indexOf(item) === i);
+        // Object.assign(this, {
+        //   expandedKeys,
+        //   searchValue: value,
+        //   autoExpandParent: true,
+        // });
+      },
+      // findParents(treeData,id){
+      //   let allparents = []
+      //   if(treeData.length==0){
+      //     return 
+      //   }
 
-const dataList = [];
-const generateList = data => {
-  for (let i = 0; i < data.length; i++) {
-    const node = data[i];
-    const key = node.key;
-    dataList.push({ key, title: key });
-    if (node.children) {
-      generateList(node.children);
-    }
-  }
-};
-generateList(gData);
+      //   let findele = (data,id) => {
+      //     if(!id) return
+      //     data.forEach((item,index) => {
+      //       if(item.id == id){
+      //         allparents.unshift(item.id)
+      //         findele(treeData,item.parentid)
 
-const getParentKey = (key, tree) => {
-  let parentKey;
-  for (let i = 0; i < tree.length; i++) {
-    const node = tree[i];
-    if (node.children) {
-      if (node.children.some(item => item.key === key)) {
-        parentKey = node.key;
-      } else if (getParentKey(key, node.children)) {
-        parentKey = getParentKey(key, node.children);
-      }
-    }
-  }
-  return parentKey;
-};
+      //       }else{
+      //         if(!!item.children){
+      //             findele(item.children,id)
+      //         }
+              
+      //       }
+      //     })
+      //   }
 
-    export default({
-        components: {
-        },
-        data () {
-            return {
-                expandedKeys: [],
-                searchValue: '',
-                autoExpandParent: true,
-                gData,
-            }
-        },
-        methods: {
-            onExpand(expandedKeys) {
-                this.expandedKeys = expandedKeys;
-                this.autoExpandParent = false;
-            },
-            onChange(e) {
-                const value = e.target.value;
-                console.log(dataList)
-                const expandedKeys = dataList.map(item => {
-                if (item.title.indexOf(value) > -1) {
-                    return getParentKey(item.key, gData);
-                }
-                return null;
-                }).filter((item, i, self) => item && self.indexOf(item) === i);
-                Object.assign(this, {
-                    expandedKeys,
-                    searchValue: value,
-                    autoExpandParent: true,
-                });
-            },
-        },
-    })
+      //   findele(treeData,id)
+      //   return allparents
+
+      // },
+    },
+  })
 </script>
 
 <style scoped>
 .tree{
-    height: calc(100vh - 185px);
-    width: 100%;
+  height: calc(100vh - 185px);
+  width: 100%;
 }
 </style>