[add] 添加企标级别映射模块和友情链接模块，完善内部工作组模块，修改封装的Search组件

2023-09-07 15:27:19 +08:00
parent f156b08ec2
commit d45ee8d81f
10 changed files with 732 additions and 134 deletions
@@ -0,0 +1,85 @@
+<template>
+  <a-card :bordered="false">
+    <div>
+      <j-table
+        :can-drag="true"
+        :scroll="{x: '100%'}"
+        ref="table"
+        size="middle"
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        @change="handleTableChange">
+
+        <div slot="action" slot-scope="{text, record}" class="action-span-cell">
+          <a v-if="record.level === 1 || record.level === 2" @click="handleEdit(record)" class="table-ope-btn">{{ $t('edit') }}</a>
+          <a v-else>{{ global.emptyLine }}</a>
+        </div>
+
+<!--        <template v-slot:action="{text, record}">-->
+<!--          <a @click="handleEdit(record)" >{{ $t('edit') }}</a>-->
+<!--          <a @click="handleDelete(record.id)" >{{ $t('delete') }}</a>-->
+<!--        </template>-->
+
+      </j-table>
+    </div>
+    <enterprise-map-modal ref="modalForm" @ok="modalFormOk"></enterprise-map-modal>
+  </a-card>
+</template>
+
+<script>
+import '@assets/less/common.less'
+import JTable from '@/components/jero/JTable'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+// 新增、编辑弹框
+import EnterpriseMapModal from './modules/EnterpriseMapModal'
+
+export default {
+  name: 'EnterpriseLevelMapList',
+  components: { EnterpriseMapModal, JTable },
+  mixins: [JeroListMixin],
+  data () {
+    return {
+      columns: [
+        {
+          title: this.$t('system.enterpriseLevelMap.levelCategory'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'level',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: this.$t('system.enterpriseLevelMap.canLookDepart'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'deptNames',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: this.$t('system.enterpriseLevelMap.remark'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'notes',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: this.$t('operation'),
+          scopedSlots: { customRender: 'action' },
+          align: 'center',
+          width: 100
+        }
+      ],
+      url: {
+        list: '/sys/lawsGrade/list'
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
@@ -0,0 +1,147 @@
+<template>
+  <a-modal
+    :title="title"
+    :maskClosable="true"
+    :width="800"
+    :closable="true"
+    @cancel="handleCancel"
+    @ok="handleOk"
+    :visible="visible">
+
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.enterpriseLevelMap.levelCategory')">
+          <a-select :placeholder="$t('pleaseEnter') + $t('system.enterpriseLevelMap.levelCategory')"
+                    allowClear
+                    v-decorator.trim="[ 'level', validatorRules.level]">
+            <a-select-option :value="null" :key="-1">请选择</a-select-option>
+            <a-select-option v-for="item in levelCategoryList" :value="item" :key="item">{{ item }}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.enterpriseLevelMap.canLookDepart')">
+          <j-select-depart
+            v-decorator.trim="[ 'deptIds', validatorRules.deptIds]"
+            :multi="true"
+            :backDepart="true"
+            :treeOpera="true">
+          </j-select-depart>
+        </a-form-item>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.enterpriseLevelMap.remark')">
+          <a-textarea
+            v-decorator.trim="[ 'notes', validatorRules.notes]"
+            :placeholder="$t('pleaseEnter')+$t('system.enterpriseLevelMap.remark')"
+            :maxLength="500"
+            :rows="4" />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+
+  </a-modal>
+</template>
+
+<script>
+import { getEnterpriseLevelMapList } from '@/api/api'
+import pick from 'lodash.pick'
+import { postAction } from '@/api/manage'
+
+export default {
+  name: 'EnterpriseMapModal',
+  data () {
+    return {
+      levelCategoryList: [],
+      title: '',
+      visible: false,
+      confirmLoading: false,
+      form: this.$form.createForm(this),
+      model: {},
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 6 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      validatorRules: {
+        level: {
+          rules: [
+            { required: false, message: this.$t('pleaseEnter') + this.$t('system.internalWorkGroup.levelCategory') }
+          ],
+          validateTrigger: 'blur'
+        },
+        deptIds: {
+          rules: [
+            { required: true, message: this.$t('pleaseEnter') + this.$t('system.internalWorkGroup.canLookDepart') }
+          ],
+          validateTrigger: 'blur'
+        },
+        notes: {
+          rules: [
+            { required: false, message: this.$t('pleaseEnter') + this.$t('system.internalWorkGroup.remark') }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        edit: '/sys/lawsGrade/edit'
+      }
+    }
+  },
+  created () {
+    this.getLevelCategoryList()
+  },
+  methods: {
+    edit (record) {
+      console.log(record)
+      this.visible = true
+      this.form.resetFields()
+      this.model = Object.assign({}, record)
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'level', 'deptIds', 'notes'))
+      })
+    },
+    getLevelCategoryList () {
+      getEnterpriseLevelMapList().then(res => {
+        if (res.success) {
+          this.levelCategoryList = res.result ? res.result.map(item => item.level) : []
+        } else {
+          this.levelCategoryList = []
+        }
+      })
+    },
+    handleCancel () {
+      this.close()
+    },
+    handleOk () {
+      if (this.confirmLoading) return
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.confirmLoading = true
+          const param = Object.assign({}, values)
+          param.id = this.model.id
+          const url = this.url.edit
+          postAction(url, param).then(res => {
+            if (res.success) {
+              this.$message.success(res.message)
+              this.$emit('ok')
+              this.close()
+            } else {
+              this.$message.warning(res.message)
+            }
+          }).finally(() => {
+            this.confirmLoading = false
+          })
+        }
+      })
+    },
+    close () {
+      this.visible = false
+      this.model = {}
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
@@ -0,0 +1,182 @@
+<template>
+  <a-card :bordered="false">
+
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+
+          <a-col :md="6" :sm="12">
+            <a-form-item :label="$t('system.friendshipLink.name')">
+              <j-input
+                :placeholder="$t('pleaseEnter') + $t('system.friendshipLink.name')"
+                v-model="queryParam.name"></j-input>
+            </a-form-item>
+          </a-col>
+
+          <a-col :md="6" :sm="8">
+            <a-form-item :label="$t('system.friendshipLink.shelfStatus')">
+              <j-dict-select-tag
+                :placeholder="$t('pleaseSelect') + $t('system.friendshipLink.shelfStatus')"
+                v-model="queryParam.grounding"
+                dict-code="yn"></j-dict-select-tag>
+            </a-form-item>
+          </a-col>
+
+          <div style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
+            <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">{{ $t('reset') }}</a-button>
+          </div>
+
+        </a-row>
+      </a-form>
+    </div>
+
+    <!-- table区域-begin -->
+    <div>
+      <j-table
+        :can-drag="true"
+        :scroll="{x: '100%'}"
+        ref="table"
+        size="middle"
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="false"
+        :loading="loading"
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+        @change="handleTableChange">
+
+        <template v-slot:link="{text, record}">
+          <a-tooltip overlay-class-name="tooltip-style">
+            <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
+            <a class="link-a" @click="handleLinkClick(record)">{{ text }}</a>
+          </a-tooltip>
+        </template>
+
+        <template v-slot:isShelf="{text, record}">
+          <a-switch v-model="record.grounding" @change="switchChange(record)" />
+        </template>
+
+        <template v-slot:action="{text, record}">
+          <a @click="handleEdit(record)" >{{ $t('edit') }}</a>
+        </template>
+
+      </j-table>
+    </div>
+    <!-- table区域-end -->
+    <friendship-link-modal ref="modalForm" @ok="modalFormOk"></friendship-link-modal>
+
+  </a-card>
+</template>
+
+<script>
+import JTable from '@/components/jero/JTable'
+import JDictSelectTag from '@/components/dict/JDictSelectTag'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import { postAction, getAction } from '@/api/manage'
+import FriendshipLinkModal from './modules/FriendshipLinkModal'
+
+export default {
+  name: 'FriendshipLinkList',
+  components: { FriendshipLinkModal, JTable, JDictSelectTag },
+  mixins: [JeroListMixin],
+  data () {
+    return {
+      columns: [
+        {
+          title: this.$t('serialNumber'),
+          dataIndex: '',
+          key: 'rowIndex',
+          align: 'center',
+          width: 50,
+          customRender: function (t, r, index) {
+            return parseInt(index) + 1
+          }
+        },
+        {
+          title: this.$t('system.friendshipLink.linkName'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'name',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: this.$t('system.friendshipLink.link'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'link',
+          scopedSlots: { customRender: 'link' }
+        },
+        {
+          title: this.$t('system.friendshipLink.isShelf'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'link',
+          scopedSlots: { customRender: 'isShelf' }
+        },
+        {
+          title: this.$t('system.friendshipLink.sort'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'sort',
+          scopedSlots: { customRender: 'text' }
+        },
+        {
+          title: this.$t('operation'),
+          scopedSlots: { customRender: 'action' },
+          align: 'center',
+          width: 170
+        }
+      ],
+      url: {
+        list: '/sys/lawsFriendlyLinks/list',
+        edit: '/sys/lawsFriendlyLinks/edit'
+      }
+    }
+  },
+  methods: {
+    loadData () {
+      const params = Object.assign({}, this.queryParam)
+      this.loading = true
+      getAction(this.url.list, params).then((res) => {
+        if (res.success) {
+          this.dataSource = res.result ? res.result.map(item => {
+            return {
+              ...item,
+              grounding: item.grounding === '0' ? false : true
+            }
+          }) : []
+        } else {
+          this.$message.warning(res.message)
+        }
+      }).finally(() => {
+        this.loading = false
+      })
+    },
+    handleLinkClick (record) {
+      const href = record.link
+      window.open(href)
+    },
+    // 是否上架状态改变
+    switchChange (record) {
+      record.grounding = record.grounding === true ? '1' : '0'
+      postAction(this.url.edit, record).then(res => {
+        if (res.success) {
+          this.loadData()
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.link-a {
+  display: inline-block;
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>
@@ -0,0 +1,116 @@
+<template>
+  <a-modal
+    :title="title"
+    :maskClosable="true"
+    :width="500"
+    :closable="true"
+    @cancel="handleCancel"
+    @ok="handleOk"
+    :visible="visible">
+
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.friendshipLink.linkName')">
+          <a-input
+            v-decorator.trim="[ 'name', validatorRules.name]"
+            :maxLength="50"
+            :placeholder="$t('pleaseEnter')+$t('system.friendshipLink.linkName')"
+          ></a-input>
+        </a-form-item>
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('system.friendshipLink.link')">
+          <a-input
+            v-decorator.trim="[ 'link', validatorRules.link]"
+            :maxLength="50"
+            :placeholder="$t('pleaseEnter')+$t('system.friendshipLink.link')"
+          ></a-input>
+        </a-form-item>
+      </a-form>
+    </a-spin>
+
+  </a-modal>
+</template>
+
+<script>
+import pick from 'lodash.pick'
+import { postAction } from '@/api/manage'
+
+export default {
+  name: 'FriendshipLinkModal',
+  data () {
+    return {
+      title: '',
+      visible: false,
+      confirmLoading: false,
+      form: this.$form.createForm(this),
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 6 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      validatorRules: {
+        name: {
+          rules: [
+            { required: true, message: this.$t('pleaseEnter') + this.$t('system.friendshipLink.linkName') }
+          ],
+          validateTrigger: 'blur'
+        },
+        link: {
+          rules: [
+            { required: false, message: this.$t('pleaseEnter') + this.$t('system.friendshipLink.link') }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        edit: '/sys/lawsFriendlyLinks/edit'
+      }
+    }
+  },
+  methods: {
+    edit (record) {
+      this.visible = true
+      this.form.resetFields()
+      this.model = Object.assign({}, record)
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'name', 'link'))
+      })
+    },
+    handleCancel () {
+      this.close()
+    },
+    handleOk () {
+      if (this.confirmLoading) return
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.confirmLoading = true
+          const param = Object.assign({}, values)
+          param.id = this.model.id
+          const url = this.url.edit
+          postAction(url, param).then(res => {
+            if (res.success) {
+              this.$message.success(res.message)
+              this.$emit('ok')
+              this.close()
+            } else {
+              this.$message.warning(res.message)
+            }
+          }).finally(() => {
+            this.confirmLoading = false
+          })
+        }
+      })
+    },
+    close () {
+      this.visible = false
+      this.model = {}
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
@@ -2,13 +2,16 @@
  <a-card :bordered="false" class="page-left-right-layout">
    <div class="page-left-box">
      <a-input-search v-model="treeInput" :placeholder="$t('system.internalWorkGroup.treeSearchPlaceholder')"
-                      @search="handleTreeSearch" />
+                      @change="handleTreeChange" />
      <a-tree
        :show-line="true"
        :show-icon="true"
        :tree-data="treeData"
        :selectedKeys="currentTreeNode"
        :replaceFields="{children: 'subset', title: 'name', key: 'id'}"
+        :expanded-keys="expandedKeys"
+        :auto-expand-parent="autoExpandParent"
+        @expand="treeExpand"
        @select="treeSelect">
 <!--        <template #iconCustom="{title}">-->
 <!--          <div class="tree-node">-->
@@ -29,7 +32,12 @@
              <template #title>
                {{ name }}
              </template>
-              <span class="tree-node-custom-title">{{ name }}</span>
+              <span v-if="name.indexOf(treeInput) > -1" class="tree-node-custom-title">
+                {{ name.substr(0, name.indexOf(treeInput)) }}
+                <span style="color: #f50">{{ treeInput }}</span>
+                {{ name.substr(name.indexOf(treeInput) + treeInput.length) }}
+              </span>
+              <span v-else class="tree-node-custom-title">{{ name }}</span>
            </a-tooltip>
            <template v-if="id === mouseInNodeKey">
              <!--              新增-->
@@ -48,7 +56,12 @@
              <template #title>
                {{ name }}
              </template>
-              <span class="tree-node-custom-title">{{ name }}</span>
+              <span v-if="name.indexOf(treeInput) > -1" class="tree-node-custom-title">
+                {{ name.substr(0, name.indexOf(treeInput)) }}
+                <span style="color: #f50">{{ treeInput }}</span>
+                {{ name.substr(name.indexOf(treeInput) + treeInput.length) }}
+              </span>
+              <span v-else class="tree-node-custom-title">{{ name }}</span>
            </a-tooltip>
            <template v-if="id === mouseInNodeKey">
              <!--              新增-->
@@ -70,37 +83,36 @@
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
-
-            <a-col :md="6" :sm="8">
+            <a-col :span="8">
              <a-form-item :label="$t('system.internalWorkGroup.name')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-input :placeholder="$t('pleaseEnter')+$t('system.internalWorkGroup.name')" v-model="queryParam.userName"></j-input>
              </a-form-item>
            </a-col>
-            <a-col :md="6" :sm="8">
+            <a-col :span="8">
              <a-form-item :label="$t('system.internalWorkGroup.workNo')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-input :placeholder="$t('pleaseEnter')+$t('system.internalWorkGroup.workNo')" v-model="queryParam.userWorkNo"></j-input>
              </a-form-item>
            </a-col>
-            <a-col :md="6" :sm="8">
-              <a-form-item :label="$t('system.internalWorkGroup.role')" :labelCol="labelCol" :wrapperCol="wrapperCol">
-                <j-input :placeholder="$t('pleaseEnter')+$t('system.internalWorkGroup.role')" v-model="queryParam.userRoleName"></j-input>
-              </a-form-item>
-            </a-col>
            <template v-if="toggleSearchStatus">
-              <a-col :md="6" :sm="8">
+              <a-col :span="8">
+                <a-form-item :label="$t('system.internalWorkGroup.role')" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                  <j-input :placeholder="$t('pleaseEnter')+$t('system.internalWorkGroup.role')" v-model="queryParam.userRoleName"></j-input>
+                </a-form-item>
+              </a-col>
+              <a-col :span="8">
                <a-form-item :label="$t('system.internalWorkGroup.post')" :labelCol="labelCol" :wrapperCol="wrapperCol">
                  <j-input :placeholder="$t('pleaseEnter')+$t('system.internalWorkGroup.post')" v-model="queryParam.userPostName"></j-input>
                </a-form-item>
              </a-col>
            </template>

-            <div style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
-              <a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
-              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">{{ $t('reset') }}</a-button>
-              <a @click="handleToggleSearch" style="margin-left: 8px">
+            <div style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
+              <a @click="handleToggleSearch">
                {{ toggleSearchStatus ? $t('putAway') : $t('open') }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a>
+              <a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 8px">{{ $t('query') }}</a-button>
+              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">{{ $t('reset') }}</a-button>
            </div>

          </a-row>
@@ -171,6 +183,9 @@ export default {
    return {
      treeInput: null, // 树查询绑定值
      treeData: [],
+      treeDataList: [], // 左侧树的数组结构，用于搜索
+      expandedKeys: [],
+      autoExpandParent: true,
      currentTreeNode: null, // 当前选中的树节点
      mouseInNodeKey: null, // 鼠标悬浮的节点key值
      columns: [
@@ -178,25 +193,29 @@ export default {
          title: this.$t('system.internalWorkGroup.name'),
          align: 'center',
          width: 180,
-          dataIndex: 'userName'
+          dataIndex: 'userName',
+          scopedSlots: { customRender: 'text' }
        },
        {
          title: this.$t('system.internalWorkGroup.workNo'),
          align: 'center',
          width: 180,
-          dataIndex: 'userWorkNo'
+          dataIndex: 'userWorkNo',
+          scopedSlots: { customRender: 'text' }
        },
        {
          title: this.$t('system.internalWorkGroup.role'),
          align: 'center',
          width: 180,
-          dataIndex: 'userRoleName'
+          dataIndex: 'userRoleName',
+          scopedSlots: { customRender: 'text' }
        },
        {
          title: this.$t('system.internalWorkGroup.post'),
          align: 'center',
          width: 180,
-          dataIndex: 'userPostName'
+          dataIndex: 'userPostName',
+          scopedSlots: { customRender: 'text' }
        },
        {
          title: this.$t('operation'),
@@ -206,12 +225,10 @@ export default {
        }
      ],
      labelCol: {
-        xs: { span: 24 },
-        sm: { span: 6 }
+        span: 4
      },
      wrapperCol: {
-        xs: { span: 24 },
-        sm: { span: 16 }
+        span: 18
      },
      url: {
        treeNodeDelete: '/sys/lawsWorkingGroup/delete',
@@ -228,12 +245,13 @@ export default {
  },
  methods: {
    // 获取左侧树数据
-    initTreeData () {
-      getWorkGroupTreeList().then(res => {
+    initTreeData (params) {
+      getWorkGroupTreeList(params).then(res => {
        if (res.success) {
          this.treeData = this.dealTreeData(res.result)
          // this.treeData = res.result
          this.treeData[0].scopedSlots = { title: 'customNoDelete' }
+          this.generateList(this.treeData)
        } else {
          this.treeData = []
        }
@@ -248,33 +266,36 @@ export default {
        }
        return item
      })
-      // return treeData.map(item => {
-      //   if (item.child && item.child.length > 0) {
-      //     item.scopedSlots = { title: 'iconCustom' }
-      //     item.children = this.dealTreeData(item.child)
-      //   } else {
-      //     item.scopedSlots = { title: 'custom' }
-      //   }
-      //   return item
-      // })
    },
-    // 根据key去树结构中找到节点
-    // getNodeByKey (key, treeData) {
-    //   for (const item of treeData) {
-    //     if (item.key === key) {
-    //       return item
-    //     } else {
-    //       if (item.child && item.child.length > 0) {
-    //         const res = this.getNodeByKey(key, item.child)
-    //         return res
-    //       }
-    //     }
-    //   }
-    // },
-    // 左侧树搜索
-    handleTreeSearch () {
-      console.log(this.treeInput)
-      this.initTreeData()
+    // 获取左侧树的数组结构（非树结构）
+    generateList (data) {
+      for (let i = 0; i < data.length; i++) {
+        const node = data[i]
+        const id = node.id
+        this.treeDataList.push({ id, name: node.name, pid: node.pid })
+        if (node.subset) {
+          this.generateList(node.subset)
+        }
+      }
+    },
+    // 左侧树搜索框改变
+    handleTreeChange (e) {
+      const value = e.target.value
+      const expandedKeys = this.treeDataList
+        .map(item => {
+          if (item.name.indexOf(value) > -1) {
+            return item.pid
+          }
+          return null
+        })
+        .filter((item, i, self) => item && self.indexOf(item) === i)
+      this.expandedKeys = expandedKeys
+      this.autoExpandParent = true
+    },
+    // 左侧树点击展开
+    treeExpand (expandedKeys) {
+      this.expandedKeys = expandedKeys
+      this.autoExpandParent = false
    },
    // 左侧树鼠标移入
    handleTreeMouseover (key) {
@@ -322,15 +343,25 @@ export default {
    // 左侧树点击选中
    treeSelect (selectedKeys) {
      this.currentTreeNode = selectedKeys
+      this.queryParam.workingGroupId = selectedKeys[0]
+      this.loadData()
    },
+    // 右侧新增
    handleAdd () {
      console.log(this.currentTreeNode)
      if (!this.currentTreeNode || this.currentTreeNode.length <= 0) {
-        this.$message.warning(this.$t('pleaseSelectASystem'))
+        this.$message.warning(this.$t('system.internalWorkGroup.pleaseSelectASystem'))
        return
      }
      this.$refs.modalForm.add(this.currentTreeNode[0])
      this.$refs.modalForm.title = this.$t('newlyAdded')
+    },
+    // 清空
+    searchReset () {
+      this.queryParam = {}
+      this.currentTreeNode = null
+      this.initTreeData()
+      this.loadData(1)
    }
  }

@@ -338,11 +369,6 @@ export default {
 </script>

 <style scoped lang="less">
-///deeo/ .ant-tree li span.ant-tree-iconEle {
-//  display: flex;
-//  justify-content: center;
-//  align-items: center;
-//}

 .tree-icon {
  line-height: 24px;