[add] 内部工作组模块

src/api/api.js

@@ -121,6 +121,9 @@ const getFileInfo = (params) => getAction('/sys/oss/file/queryById', params)
 // 标准选择框，分页查询标准数据
 const getStandardList = (params) => getAction('', params)
 
+// 内部工作组，左侧树查询
+const getWorkGroupTreeList = (params) => getAction('/sys/lawsWorkingGroup/list', params)
+
 export {
   addRole,
   editRole,
@@ -189,5 +192,7 @@ export {
   addCategoryItem,
   editCategoryItem,
 
-  getStandardList
+  getStandardList,
+
+  getWorkGroupTreeList
 }

src/common/lang/system/en.js

@@ -47,5 +47,18 @@ module.exports = {
     parentName: '父级名称',
     select: '下拉选择',
     tree: '树形结构'
+  },
+  // 内部工作组
+  internalWorkGroup: {
+    treeSearchPlaceholder: '输入树状图体系',
+    name: '姓名',
+    workNo: '工号',
+    role: '角色',
+    post: '职位',
+    templateName: '内部工作组表模板',
+    exportName: '内部工作组表',
+    nodeName: '节点名称',
+    user: '用户',
+    pleaseSelectASystem: '请选择左侧体系'
   }
 }

src/common/lang/system/zh.js

@@ -50,5 +50,18 @@ module.exports = {
     parentName: '父级名称',
     select: '下拉选择',
     tree: '树形结构'
+  },
+  // 内部工作组
+  internalWorkGroup: {
+    treeSearchPlaceholder: '输入树状图体系',
+    name: '姓名',
+    workNo: '工号',
+    role: '角色',
+    post: '职位',
+    templateName: '内部工作组表模板',
+    exportName: '内部工作组表',
+    nodeName: '节点名称',
+    user: '用户',
+    pleaseSelectASystem: '请选择左侧体系'
   }
 }

src/mixins/JeroListMixin.js

@@ -54,7 +54,7 @@ export const JeroListMixin = {
       /** 高级查询拼接方式 */
       superQueryMatchType: 'and',
       operateMaxNum: 1, // 表格操作列最多显示的按钮，其他显示在更多中
-      needFilterTableBtn: true // 是否需要过滤表格操作列没有权限的按钮
+      needFilterTableBtn: false // 是否需要过滤表格操作列没有权限的按钮
     }
   },
   created () {
@@ -79,6 +79,9 @@ export const JeroListMixin = {
         head['tenant-id'] = tenantid
       }
       return head
+    },
+    importExcelUrl: function () {
+      return `${window._CONFIG.domianURL}/${this.url.importExcelUrl}`
     }
   },
   methods: {

src/views/dashboard/Analysis.vue

@@ -1,21 +1,266 @@
 <template>
   <div>
-    <!--    <user-or-organ-selection></user-or-organ-selection>-->
+    <a-button @click="toSearchWindow">跳转一般检索</a-button>
+    <i class="iconfont icon-chexiao" style="color: #D52C26"></i>
+    <i class="iconfont icon-star" style="color: #D52C26"></i>
+    <i class="iconfont icon-water-drop-slash" style="color: #D52C26"></i>
+    <i class="iconfont icon-star1" style="color: #D52C26"></i>
+    <i class="iconfont icon-jiedian" style="color: #D52C26"></i>
+    <i class="iconfont icon-user" style="color: #D52C26"></i>
+    <i class="iconfont icon-bianji" style="color: #D52C26"></i>
+    <i class="iconfont icon-shanchu_" style="color: #D52C26"></i>
+    <i class="iconfont icon-chat" style="color: #D52C26"></i>
+    <i class="iconfont icon-edit-1" style="color: #D52C26"></i>
+    <i class="iconfont icon-fangxingfenxiang" style="color: #D52C26"></i>
+    <i class="iconfont icon-chart-pie" style="color: #D52C26"></i>
+    <i class="iconfont icon-root-list" style="color: #D52C26"></i>
+    <i class="iconfont icon-save" style="color: #D52C26"></i>
+<!--    <j-expand-table-->
+<!--      :columns="columns"-->
+<!--      :dataSource="dataSource"-->
+<!--      :extraForm="extraForm"-->
+<!--      formIsDepend="feedback"-->
+<!--      ref="jExpandTable">-->
+<!--      <template slot="feedback" slot-scope="{text, record}">-->
+<!--        <j-dict-select-tag style="width: 100%" dict-code="field_show_type" v-model="record.feedback"></j-dict-select-tag>-->
+<!--      </template>-->
+<!--    </j-expand-table>-->
+    <j-expand-table
+      :columns="columns"
+      :dataSource="dataSource"
+      :extraForm="extraForm"
+      :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+      :formIsDepend="false"
+      :pagination="ipagination"
+      ref="jExpandTable">
+      <template slot="feedback" slot-scope="{text, record}">
+        <j-dict-select-tag style="width: 100%" dict-code="field_show_type" v-model="record.feedback"></j-dict-select-tag>
+      </template>
+    </j-expand-table>
+    <a-button @click="submit">提交</a-button>
   </div>
 </template>
 
 <script>
-// import UserOrOrganSelection from '../../components/selection/UserOrOrganSelection'
+import JExpandTable from '../../components/JExpandTable'
-
+import JDictSelectTag from '../../components/dict/JDictSelectTag'
 export default {
   name: 'Analysis',
-  // components: { UserOrOrganSelection },
+  components: { JExpandTable, JDictSelectTag },
   data () {
-    return {}
+    return {
+      ipagination: {
+        current: 1,
+        pageSize: 50,
+        pageSizeOptions: ['10', '50', '100', '150', '200'],
+        showTotal: (total, range) => {
+          return range[0] + '-' + range[1] + ' ' + this.$t('total') + ' ' + total + ' ' + this.$t('strip')
+        },
+        showQuickJumper: true,
+        showSizeChanger: true,
+        total: 0
+      },
+      selectedRowKeys: [],
+      columns: [
+        {
+          title: '标准号/条款号',
+          dataIndex: 'number',
+          key: 'number',
+          scopedSlots: {
+            customRender: 'text'
+          }
+        },
+        {
+          title: '标准名称/条款名称',
+          dataIndex: 'name',
+          key: 'name',
+          scopedSlots: {
+            customRender: 'text'
+          }
+        },
+        {
+          title: '条款内容',
+          dataIndex: 'content',
+          key: 'content',
+          scopedSlots: {
+            customRender: 'text'
+          }
+        },
+        {
+          title: '历史评估结果',
+          dataIndex: 'result',
+          key: 'result',
+          scopedSlots: {
+            customRender: 'text'
+          }
+        },
+        {
+          title: '上一节点处理人',
+          dataIndex: 'resulter',
+          key: 'resulter',
+          scopedSlots: {
+            customRender: 'text'
+          }
+        },
+        {
+          title: '评估反馈',
+          dataIndex: 'feedback',
+          key: 'feedback',
+          scopedSlots: {
+            customRender: 'feedback'
+          }
+        }
+      ],
+      dataSource: [
+        {
+          key: 1,
+          name: 'John Brown',
+          number: 32,
+          content: 'New York No. 1 Lake Park',
+          result: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',
+          feedback: '1'
+        },
+        {
+          key: 2,
+          name: 'John Brown',
+          number: 32,
+          content: 'New York No. 1 Lake Park',
+          result: 'My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park.',
+          feedback: '1'
+        }
+      ],
+      // extraForm: {
+      //   1: {
+      //     rules: {
+      //       desc: { required: true, message: '请输入依据描述', trigger: 'blur' },
+      //       file: { required: false, message: '请上传佐证材料', trigger: 'change' }
+      //     },
+      //     formArr: [
+      //       {
+      //         fieldShowType: 1,
+      //         dbFieldTxt: '依据描述',
+      //         dbFieldName: 'desc'
+      //       },
+      //       {
+      //         fieldShowType: 2,
+      //         dbFieldTxt: '佐证材料',
+      //         dbFieldName: 'file'
+      //       }
+      //     ]
+      //   },
+      //   2: {
+      //     rules: {
+      //       desc: { required: true, message: '请输入依据描述', trigger: 'blur' },
+      //       finishDate: { required: true, message: '请选择预计整改完成时间', trigger: 'change' }
+      //     },
+      //     formArr: [
+      //       {
+      //         fieldShowType: 1,
+      //         dbFieldTxt: '依据描述',
+      //         fieldMustInput: true,
+      //         dbFieldName: 'desc'
+      //       },
+      //       {
+      //         fieldShowType: 3,
+      //         dbFieldTxt: '预计整改完成时间',
+      //         fieldMustInput: true,
+      //         dbFieldName: 'finishDate'
+      //       }
+      //     ]
+      //   },
+      //   3: {
+      //     rules: {
+      //       desc: { required: true, message: '请输入依据描述', trigger: 'blur' },
+      //       finishDate: { required: true, message: '请选择预计整改完成时间', trigger: 'change' }
+      //     },
+      //     formArr: [
+      //       {
+      //         fieldShowType: 1,
+      //         dbFieldTxt: '依据描述',
+      //         fieldMustInput: true,
+      //         dbFieldName: 'desc'
+      //       },
+      //       {
+      //         fieldShowType: 3,
+      //         dbFieldTxt: '预计整改完成时间',
+      //         fieldMustInput: true,
+      //         dbFieldName: 'finishDate'
+      //       }
+      //     ]
+      //   },
+      //   4: {
+      //     rules: {
+      //       desc: { required: true, message: '请输入依据描述', trigger: 'blur' }
+      //     },
+      //     formArr: [
+      //       {
+      //         fieldShowType: 1,
+      //         dbFieldTxt: '依据描述',
+      //         fieldMustInput: true,
+      //         dbFieldName: 'desc'
+      //       }
+      //     ]
+      //   }
+      // },
+      extraForm: {
+        rules: {
+          desc: { required: false, message: '请输入依据描述', trigger: 'blur' },
+          file: { required: false, message: '请上传佐证材料', trigger: 'change' },
+          tokenNum: { required: true, message: '请输入工作令编号', trigger: 'blur' },
+          itemName: { required: true, message: '请输入项目名称', trigger: 'blur' }
+        },
+        formArr: [
+          {
+            fieldShowType: 1,
+            dbFieldTxt: '依据描述',
+            dbFieldName: 'desc',
+            isDisabled: true
+          },
+          {
+            fieldShowType: 2,
+            dbFieldTxt: '佐证材料',
+            dbFieldName: 'file',
+            isDisabled: true
+          },
+          {
+            fieldShowType: 4,
+            dbFieldTxt: '工作令编号',
+            dbFieldName: 'tokenNum'
+          },
+          {
+            fieldShowType: 4,
+            dbFieldTxt: '项目名称',
+            dbFieldName: 'itemName'
+          }
+        ]
+      }
+    }
   },
   created () {
 
   },
-  methods: {}
+  methods: {
+    // 点击跳转到检索页
+    toSearchWindow () {
+      const { href } = this.$router.resolve({
+        path: '/generalSearch'
+      })
+      window.open(href, '_blank')
+    },
+    onSelectChange (selectRowKeys) {
+      this.selectedRowKeys = selectRowKeys
+    },
+    submit () {
+      // 获取表格扩展部分的校验结果
+      const result = this.$refs.jExpandTable.submit()
+      if (result) {
+        // 每个表单校验都通过了
+        console.log('通过了', this.dataSource)
+      } else {
+        // 有表单没有通过
+        this.$message.warning('请输入必填项')
+      }
+    }
+  }
 }
 </script>

src/views/system/internalWorkGroup/WorkingGroupList.vue

@@ -0,0 +1,382 @@
+<template>
+  <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" />
+      <a-tree
+        :show-line="true"
+        :show-icon="true"
+        :tree-data="treeData"
+        :selectedKeys="currentTreeNode"
+        :replaceFields="{children: 'subset', title: 'name', key: 'id'}"
+        @select="treeSelect">
+<!--        <template #iconCustom="{title}">-->
+<!--          <div class="tree-node">-->
+<!--            <img src="@/assets/image/common/iconTreeFolder.png" class="tree-node-icon" alt="" />-->
+<!--            <a-tooltip>-->
+<!--              <template #title>-->
+<!--                {{ title }}-->
+<!--              </template>-->
+<!--              <span class="tree-node-title">{{ title }}</span>-->
+<!--            </a-tooltip>-->
+<!--          </div>-->
+<!--        </template>-->
+
+        <!--   没有删除  -->
+        <template #customNoDelete="{name, id}">
+          <div class="tree-operate-node" @mouseenter="handleTreeMouseover(id)" @mouseleave="handleTreeMouseout(id)">
+            <a-tooltip>
+              <template #title>
+                {{ name }}
+              </template>
+              <span class="tree-node-custom-title">{{ name }}</span>
+            </a-tooltip>
+            <template v-if="id === mouseInNodeKey">
+              <!--              新增-->
+              <a-button icon="plus" class="tree-operate-node-btn" @click="handleTreeAdd"></a-button>
+              <!--              编辑-->
+              <a-button class="tree-operate-node-btn" @click="handleTreeEdit">
+                <i class="iconfont icon-bianji" style="color: #D52C26"></i>
+              </a-button>
+            </template>
+          </div>
+        </template>
+
+        <template #custom="{name, id}">
+          <div class="tree-operate-node" @mouseenter="handleTreeMouseover(id)" @mouseleave="handleTreeMouseout(id)">
+            <a-tooltip>
+              <template #title>
+                {{ name }}
+              </template>
+              <span class="tree-node-custom-title">{{ name }}</span>
+            </a-tooltip>
+            <template v-if="id === mouseInNodeKey">
+              <!--              新增-->
+              <a-button icon="plus" class="tree-operate-node-btn" @click="handleTreeAdd"></a-button>
+              <!--              编辑-->
+              <a-button class="tree-operate-node-btn" @click="handleTreeEdit(name)">
+                <i class="iconfont icon-bianji" style="color: #D52C26"></i>
+              </a-button>
+              <!--              删除-->
+              <a-button class="tree-operate-node-btn" @click="handleTreeDelete">
+                <i class="iconfont icon-shanchu_" style="color: #D52C26"></i>
+              </a-button>
+            </template>
+          </div>
+        </template>
+      </a-tree>
+    </div>
+    <div class="page-right-box">
+      <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-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-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-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">
+                {{ toggleSearchStatus ? $t('putAway') : $t('open') }}
+                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
+              </a>
+            </div>
+
+          </a-row>
+        </a-form>
+      </div>
+
+      <div class="table-operator">
+        <!--        新增-->
+        <a-button icon="plus" type="primary" @click="handleAdd">{{ $t('newlyAdded') }}</a-button>
+        <!--        导入-->
+        <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
+          <a-button type="primary" icon="download" ghost>{{ $t('import') }}</a-button>
+        </a-upload>
+        <!--        导出-->
+        <a-button icon="upload" type="primary" ghost @click="handleExportXls($t('system.internalWorkGroup.exportName'))">
+          {{ $t('export') }}
+        </a-button>
+        <!--        模板下载-->
+        <a-button type="primary" icon="download" ghost @click="downTemplate('system.internalWorkGroup.templateName')">
+          {{ $t('templateDownload') }}
+        </a-button>
+        <!--        批量删除-->
+<!--        <a-button type="primary" icon="delete" ghost @click="batchDel">{{ $t('batchDelete') }}</a-button>-->
+      </div>
+      <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">
+
+          <template v-slot:action="{text, record}">
+            <a @click="handleDelete(record.id)" >{{ $t('delete') }}</a>
+          </template>
+
+        </j-table>
+      </div>
+    </div>
+
+    <!--    新增、编辑左侧树节点  -->
+    <tree-node-modal ref="treeNodeModal" @ok="treeNodeModalOk"></tree-node-modal>
+    <!--  新增弹框 -->
+    <working-group-modal ref="modalForm" @ok="modalFormOk"></working-group-modal>
+  </a-card>
+</template>
+
+<script>
+import '@assets/less/common.less'
+import JTable from '@/components/jero/JTable'
+import { JeroListMixin } from '@/mixins/JeroListMixin'
+import TreeNodeModal from './modules/TreeNodeModal'
+import { postAction } from '@/api/manage'
+import WorkingGroupModal from './modules/WorkingGroupModal'
+import { getWorkGroupTreeList } from '@/api/api'
+
+export default {
+  name: 'WorkingGroupList',
+  components: { WorkingGroupModal, TreeNodeModal, JTable },
+  mixins: [JeroListMixin],
+  data () {
+    return {
+      treeInput: null, // 树查询绑定值
+      treeData: [],
+      currentTreeNode: null, // 当前选中的树节点
+      mouseInNodeKey: null, // 鼠标悬浮的节点key值
+      columns: [
+        {
+          title: this.$t('system.internalWorkGroup.name'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'userName'
+        },
+        {
+          title: this.$t('system.internalWorkGroup.workNo'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'userWorkNo'
+        },
+        {
+          title: this.$t('system.internalWorkGroup.role'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'userRoleName'
+        },
+        {
+          title: this.$t('system.internalWorkGroup.post'),
+          align: 'center',
+          width: 180,
+          dataIndex: 'userPostName'
+        },
+        {
+          title: this.$t('operation'),
+          scopedSlots: { customRender: 'action' },
+          align: 'center',
+          width: 170
+        }
+      ],
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 6 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 }
+      },
+      url: {
+        treeNodeDelete: '/sys/lawsWorkingGroup/delete',
+        list: '/sys/lawsWorkingGroupUser/page',
+        importExcelUrl: '',
+        exportXlsUrl: '',
+        delete: '/sys/lawsWorkingGroupUser/delete',
+        deleteBatch: '' // 批量删除
+      }
+    }
+  },
+  mounted () {
+    this.initTreeData()
+  },
+  methods: {
+    // 获取左侧树数据
+    initTreeData () {
+      getWorkGroupTreeList().then(res => {
+        if (res.success) {
+          this.treeData = this.dealTreeData(res.result)
+          // this.treeData = res.result
+          this.treeData[0].scopedSlots = { title: 'customNoDelete' }
+        } else {
+          this.treeData = []
+        }
+      })
+    },
+    // 处理左侧树数据结构
+    dealTreeData (treeData) {
+      return treeData.map(item => {
+        item.scopedSlots = { title: 'custom' }
+        if (item.subset && item.subset.length > 0) {
+          item.subset = this.dealTreeData(item.subset)
+        }
+        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()
+    },
+    // 左侧树鼠标移入
+    handleTreeMouseover (key) {
+      this.mouseInNodeKey = key
+    },
+    // 左侧树鼠标移出
+    handleTreeMouseout (key) {
+      if (this.mouseInNodeKey === key) {
+        this.mouseInNodeKey = null
+      }
+    },
+    // 左侧树点击新增
+    handleTreeAdd () {
+      this.$refs.treeNodeModal.title = this.$t('newlyAdded')
+      this.$refs.treeNodeModal.add(this.mouseInNodeKey)
+    },
+    // 左侧树点击编辑
+    handleTreeEdit (name) {
+      this.$refs.treeNodeModal.title = this.$t('edit')
+      this.$refs.treeNodeModal.edit(this.mouseInNodeKey, name)
+    },
+    // 左侧树点击删除
+    handleTreeDelete () {
+      const param = {}
+      param.id = this.mouseInNodeKey
+      this.$confirm({
+        title: this.$t('confirmDeletion'),
+        content: this.$t('confirmDeleteNodes'),
+        onOk: () => {
+          postAction(this.url.treeNodeDelete, param).then(res => {
+            if (res.success) {
+              this.$message.success(res.message)
+              this.initTreeData()
+            } else {
+              this.$message.warning(res.message)
+            }
+          })
+        }
+      })
+    },
+    // 左侧树节点新增或编辑完成
+    treeNodeModalOk () {
+      this.initTreeData()
+    },
+    // 左侧树点击选中
+    treeSelect (selectedKeys) {
+      this.currentTreeNode = selectedKeys
+    },
+    handleAdd () {
+      console.log(this.currentTreeNode)
+      if (!this.currentTreeNode || this.currentTreeNode.length <= 0) {
+        this.$message.warning(this.$t('pleaseSelectASystem'))
+        return
+      }
+      this.$refs.modalForm.add(this.currentTreeNode[0])
+      this.$refs.modalForm.title = this.$t('newlyAdded')
+    }
+  }
+
+}
+</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;
+}
+
+.tree-operate-node {
+  display: flex;
+  width: 100%;
+  align-items: center;
+
+  &-btn {
+    width: 20px;
+    height: 20px;
+    background: rgba(213, 44, 38, 0.08);
+    border-radius: 2px 2px 2px 2px;
+    border: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: 4px;
+    padding: 0;
+
+    /deep/ .anticon {
+      margin-top: 2px;
+      color: #D52C26;
+    }
+
+    img {
+      width: 13px;
+      height: 13px;
+    }
+  }
+}
+///deep/ .ant-tooltip-open {
+//  background: transparent;
+//}
+</style>

src/views/system/internalWorkGroup/modules/TreeNodeModal.vue

@@ -0,0 +1,114 @@
+<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.internalWorkGroup.nodeName')">
+          <a-input :placeholder="$t('pleaseEnter') + $t('system.internalWorkGroup.nodeName')"
+                   :maxLength="50"
+                   v-decorator.trim="[ 'name', validatorRules.name ]" />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+
+  </a-modal>
+</template>
+
+<script>
+import pick from 'lodash.pick'
+import { postAction } from '@/api/manage'
+
+export default {
+  name: 'TreeNodeModal',
+  data () {
+    return {
+      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: {
+        name: {
+          rules: [
+            { required: true, message: this.$t('pleaseEnter') + this.$t('system.internalWorkGroup.title') }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        add: '/sys/lawsWorkingGroup/add',
+        edit: '/sys/lawsWorkingGroup/edit'
+      }
+    }
+  },
+  methods: {
+    add (parentNodeKey) {
+      this.visible = true
+      this.form.resetFields()
+      this.model.pid = parentNodeKey
+    },
+    edit (nodeKey, name) {
+      this.visible = true
+      this.form.resetFields()
+      this.model.id = nodeKey
+      this.model.name = name
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.model, 'name'))
+      })
+    },
+    close () {
+      this.visible = false
+      this.model = {}
+    },
+    handleCancel () {
+      this.close()
+    },
+    handleOk () {
+      if (this.confirmLoading) return
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.confirmLoading = true
+          const param = Object.assign({}, this.model)
+          param.name = values.name
+          let url = ''
+          if (this.model.id) {
+            url = this.url.edit
+          } else {
+            url = this.url.add
+          }
+          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
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/system/internalWorkGroup/modules/WorkingGroupModal.vue

@@ -0,0 +1,110 @@
+<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.internalWorkGroup.user')">
+          <user-selection
+            v-decorator.trim="[ 'userId', validatorRules.userId ]"
+            @nameChange="userSelectNameChange"
+            :nameStr="nameStr"
+            type="checkbox"
+          >
+          </user-selection>
+        </a-form-item>
+      </a-form>
+    </a-spin>
+
+  </a-modal>
+</template>
+
+<script>
+import UserSelection from '../../../../components/selection/UserSelection'
+import { postAction } from '@/api/manage'
+
+export default {
+  name: 'WorkingGroupModal',
+  components: { UserSelection },
+  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: {
+        userId: {
+          rules: [
+            { required: true, message: this.$t('pleaseEnter') + this.$t('system.internalWorkGroup.user') }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      url: {
+        add: '/sys/lawsWorkingGroupUser/add'
+      },
+      nameStr: '',
+      treeNodeKey: '' // 传入的树节点key值
+    }
+  },
+  methods: {
+    add (treeNodeKey) {
+      this.visible = true
+      this.form.resetFields()
+      this.treeNodeKey = treeNodeKey
+    },
+    userSelectNameChange (value) {
+      this.nameStr = value
+    },
+    close () {
+      this.visible = false
+      this.nameStr = ''
+    },
+    handleCancel () {
+      this.close()
+    },
+    handleOk () {
+      if (this.confirmLoading) return
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.confirmLoading = true
+          const param = Object.assign({}, values)
+          param.workingGroupId = this.treeNodeKey
+          console.log(param)
+          let url = ''
+          url = this.url.add
+          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
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>