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

src/api/api.js

@@ -124,6 +124,9 @@ const getStandardList = (params) => getAction('', params)
 // 内部工作组，左侧树查询
 const getWorkGroupTreeList = (params) => getAction('/sys/lawsWorkingGroup/list', params)
 
+// 企业级别映射管理，获取列表
+const getEnterpriseLevelMapList = (params) => getAction('/sys/lawsGrade/list', params)
+
 export {
   addRole,
   editRole,
@@ -194,5 +197,7 @@ export {
 
   getStandardList,
 
-  getWorkGroupTreeList
+  getWorkGroupTreeList,
+
+  getEnterpriseLevelMapList
 }

src/assets/less/common.less

@@ -103,6 +103,15 @@
   }
 }
 
+/*表格操作栏只有两个按钮时的按钮间距*/
+.action-span-cell > a {
+  margin-left: 8px;
+}
+
+.action-span-cell > a:first-child {
+  margin-left: 0;
+}
+
 /*列表页面弹出modal*/
 .ant-modal-cust-warp {
   height: 100%

src/common/lang/system/en.js

@@ -50,15 +50,30 @@ module.exports = {
   },
   // 内部工作组
   internalWorkGroup: {
-    treeSearchPlaceholder: '输入树状图体系',
+    treeSearchPlaceholder: 'Please enter the tree system',
-    name: '姓名',
+    name: 'Name',
-    workNo: '工号',
+    workNo: 'Job Number',
-    role: '角色',
+    role: 'Role',
-    post: '职位',
+    post: 'Position',
-    templateName: '内部工作组表模板',
+    templateName: 'Internal workgroup table template',
-    exportName: '内部工作组表',
+    exportName: 'Internal workgroup table',
-    nodeName: '节点名称',
+    nodeName: 'Node Name',
-    user: '用户',
+    user: 'User',
-    pleaseSelectASystem: '请选择左侧体系'
+    pleaseSelectASystem: 'Please select the left system'
+  },
+  // 企标级别映射
+  enterpriseLevelMap: {
+    levelCategory: 'Grade classification of enterprise standard',
+    canLookDepart: 'Viewable department',
+    remark: 'Remarks'
+  },
+  // 友情练级管理
+  friendshipLink: {
+    name: 'Link Name',
+    shelfStatus: 'Shelf Status',
+    linkName: 'Link Name',
+    link: 'Link',
+    isShelf: 'Shelf Or Not',
+    sort: 'Sort'
   }
 }

src/common/lang/system/zh.js

@@ -63,5 +63,20 @@ module.exports = {
     nodeName: '节点名称',
     user: '用户',
     pleaseSelectASystem: '请选择左侧体系'
+  },
+  // 企标级别映射
+  enterpriseLevelMap: {
+    levelCategory: '企标等级分类',
+    canLookDepart: '可查看部门',
+    remark: '备注'
+  },
+  // 友情练级管理
+  friendshipLink: {
+    name: '链接名称',
+    shelfStatus: '上架状态',
+    linkName: '链接名称',
+    link: '链接',
+    isShelf: '是否上架',
+    sort: '排序'
   }
 }

src/components/customField/Search.vue

@@ -1,7 +1,7 @@
 <template>
   <a-form layout="inline" @keyup.enter.native="searchQuery">
     <a-row :gutter="24">
-      <a-col :md="(24 / (minLength + 1))" :sm="(24 / minLength)" v-for="(item,index) in searchList.slice(0, 3)" :key="index" style="line-height: 48px">
+      <a-col :md="(24 / (minLength + 1))" :sm="(24 / minLength)" v-for="(item,index) in searchList.slice(0, minLength)" :key="index" style="line-height: 48px">
         <!-- 树形选择器 -->
         <!--          <template v-if="item.fieldShowType === FieldType.TREE.value">-->
         <!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
@@ -60,76 +60,74 @@
           </a-form-item>
         </template>
     </a-col>
+      <template v-if="searchList.length > minLength && toggleSearchStatus">
+        <a-col :md="(24 / (minLength + 1))" :sm="(24 / minLength)" v-for="(item,index) in searchList.slice(minLength)" :key="index" style="line-height: 48px">
+        <!--   树形选择器   -->
+        <!--          <template v-if="item.fieldShowType === FieldType.TREE.value">-->
+        <!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
+        <!--              <a-tree-select-->
+        <!--                tree-node-filter-prop="title"-->
+        <!--                v-model="queryParam[item.dbFieldName]"-->
+        <!--                :maxTagCount="1"-->
+        <!--                :getPopupContainer="triggerNode=> triggerNode.parentNode"-->
+        <!--                :tree-data="item.tree"-->
+        <!--                tree-checkable-->
+        <!--                :placeholder="$t('pleaseSelect')+item.dbFieldTxt"-->
+        <!--              />-->
+        <!--            </a-form-item>-->
+        <!--          </template>-->
+        <!--   输入框  -->
+        <template v-if="[FieldType.TEXT_BOX.value, FieldType.TEXTAREA.value,FieldType.USER_SINGLE.value,
+              FieldType.ORGAN_SINGLE.value, FieldType.STANDARD_MORE.value, FieldType.ORGAN_MORE.value]
+              .includes(item.fieldShowType)">
+          <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-input :placeholder="$t('pleaseEnter')+item.dbFieldTxt"
+                     v-model="queryParam[item.dbFieldName]"></a-input>
+          </a-form-item>
+        </template>
+        <!--   数字输入框   -->
+        <!--          <template v-else-if="item.fieldShowType === FieldType.TEXT_NUMBER.value">-->
+        <!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
+        <!--              <a-input-number :placeholder="$t('pleaseEnter')+item.dbFieldTxt"-->
+        <!--                              v-model="queryParam[item.dbFieldName]" :min="1" :max="99999999"/>-->
+        <!--            </a-form-item>-->
+        <!--          </template>-->
+        <!--   字典多选框  -->
+        <!--          <template v-else-if="item.fieldShowType === FieldType.OPTION_MORE.value">-->
+        <!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
+        <!--              <j-multi-select-tag v-model="queryParam[item.dbFieldName]"-->
+        <!--                                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt" :type="'select'"-->
+        <!--                                  :triggerChange="false" :dictCode="item.dict_field"/>-->
+        <!--            </a-form-item>-->
+        <!--          </template>-->
+        <!--   日期区间选择器  -->
+        <template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.fieldShowType)">
+          <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <a-range-picker v-model="queryParam[item.dbFieldName]"
+                            format="YYYY-MM-DD" value-format="YYYY-MM-DD"
+                            @change="onChange(item.dbFieldName)"></a-range-picker>
+          </a-form-item>
+        </template>
+        <!--   字典选择器  -->
+        <template v-else-if="item.fieldShowType === FieldType.OPTION_SINGLE.value || item.fieldShowType === FieldType.OPTION_MORE.value">
+          <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">
+            <j-dict-select-tag v-model="queryParam[item.dbFieldName]"
+                               :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
+                               :type="'select'"
+                               :triggerChange="false" :dictCode="item.dict_field" />
+          </a-form-item>
+        </template>
+      </a-col>
+      </template>
       <div style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
-        <a-button type="primary" @click="searchQuery">{{$t('query')}}</a-button>
+        <a @click="handleToggleSearch" v-if="searchList.length > minLength">
-        <a-button style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
-        <a style="margin-left: 8px" @click="handleToggleSearch" v-if="searchList.length > minLength">
           {{ !toggleSearchStatus ? $t('open') : $t('putAway') }}
           <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
         </a>
+        <a-button type="primary" @click="searchQuery" style="margin-left: 8px">{{$t('query')}}</a-button>
+        <a-button style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
       </div>
     </a-row>
-    <a-row :gutter="24">
-      <a-col :md="(24 / (minLength + 1))" :sm="(24 / minLength)" v-for="(item,index) in searchList.slice(3)" :key="index" style="line-height: 48px">
-        <template v-if="index > minLength && toggleSearchStatus">
-          <!--   树形选择器   -->
-<!--          <template v-if="item.fieldShowType === FieldType.TREE.value">-->
-<!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-<!--              <a-tree-select-->
-<!--                tree-node-filter-prop="title"-->
-<!--                v-model="queryParam[item.dbFieldName]"-->
-<!--                :maxTagCount="1"-->
-<!--                :getPopupContainer="triggerNode=> triggerNode.parentNode"-->
-<!--                :tree-data="item.tree"-->
-<!--                tree-checkable-->
-<!--                :placeholder="$t('pleaseSelect')+item.dbFieldTxt"-->
-<!--              />-->
-<!--            </a-form-item>-->
-<!--          </template>-->
-          <!--   输入框  -->
-          <template v-if="[FieldType.TEXT_BOX.value, FieldType.TEXTAREA.value,FieldType.USER_SINGLE.value,
-                FieldType.ORGAN_SINGLE.value, FieldType.STANDARD_MORE.value, FieldType.ORGAN_MORE.value]
-                .includes(item.fieldShowType)">
-            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-input :placeholder="$t('pleaseEnter')+item.dbFieldTxt"
-                       v-model="queryParam[item.dbFieldName]"></a-input>
-            </a-form-item>
-          </template>
-          <!--   数字输入框   -->
-<!--          <template v-else-if="item.fieldShowType === FieldType.TEXT_NUMBER.value">-->
-<!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-<!--              <a-input-number :placeholder="$t('pleaseEnter')+item.dbFieldTxt"-->
-<!--                              v-model="queryParam[item.dbFieldName]" :min="1" :max="99999999"/>-->
-<!--            </a-form-item>-->
-<!--          </template>-->
-          <!--   字典多选框  -->
-<!--          <template v-else-if="item.fieldShowType === FieldType.OPTION_MORE.value">-->
-<!--            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">-->
-<!--              <j-multi-select-tag v-model="queryParam[item.dbFieldName]"-->
-<!--                                  :placeholder="$t('pleaseSelect')+item.dbFieldTxt" :type="'select'"-->
-<!--                                  :triggerChange="false" :dictCode="item.dict_field"/>-->
-<!--            </a-form-item>-->
-<!--          </template>-->
-          <!--   日期区间选择器  -->
-          <template v-else-if="[FieldType.DATE_SINGLE.value, FieldType.DATE_MORE.value].includes(item.fieldShowType)">
-            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-range-picker v-model="queryParam[item.dbFieldName]"
-                              format="YYYY-MM-DD" value-format="YYYY-MM-DD"
-                              @change="onChange(item.dbFieldName)"></a-range-picker>
-            </a-form-item>
-          </template>
-          <!--   字典选择器  -->
-          <template v-else-if="item.fieldShowType === FieldType.OPTION_SINGLE.value || item.fieldShowType === FieldType.OPTION_MORE.value">
-            <a-form-item :label="item.dbFieldTxt" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <j-dict-select-tag v-model="queryParam[item.dbFieldName]"
-                                 :placeholder="$t('pleaseSelect')+item.dbFieldTxt"
-                                 :type="'select'"
-                                 :triggerChange="false" :dictCode="item.dict_field" />
-            </a-form-item>
-          </template>
-        </template>
-      </a-col>
-    </a-row>
   </a-form>
 </template>
 

src/views/system/enterpriseLevelMapManage/EnterpriseLevelMapList.vue

@@ -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>

src/views/system/enterpriseLevelMapManage/modules/EnterpriseMapModal.vue

@@ -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>

src/views/system/firendshipLinkManage/FriendshipLinkList.vue

@@ -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>

src/views/system/firendshipLinkManage/modules/FriendshipLinkModal.vue

@@ -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>

src/views/system/internalWorkGroup/WorkingGroupList.vue

@@ -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 :span="8">
-            <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-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">
+            <div style="float: right;overflow: hidden;" class="table-page-search-submitButtons">
-              <a-button type="primary" @click="searchQuery" icon="search">{{ $t('query') }}</a-button>
+              <a @click="handleToggleSearch">
-              <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>
+              <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 },
+        span: 4
-        sm: { span: 6 }
       },
       wrapperCol: {
-        xs: { span: 24 },
+        span: 18
-        sm: { span: 16 }
       },
       url: {
         treeNodeDelete: '/sys/lawsWorkingGroup/delete',
@@ -228,12 +245,13 @@ export default {
   },
   methods: {
     // 获取左侧树数据
-    initTreeData () {
+    initTreeData (params) {
-      getWorkGroupTreeList().then(res => {
+      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) {
+    generateList (data) {
-    //   for (const item of treeData) {
+      for (let i = 0; i < data.length; i++) {
-    //     if (item.key === key) {
+        const node = data[i]
-    //       return item
+        const id = node.id
-    //     } else {
+        this.treeDataList.push({ id, name: node.name, pid: node.pid })
-    //       if (item.child && item.child.length > 0) {
+        if (node.subset) {
-    //         const res = this.getNodeByKey(key, item.child)
+          this.generateList(node.subset)
-    //         return res
+        }
-    //       }
+      }
-    //     }
+    },
-    //   }
+    // 左侧树搜索框改变
-    // },
+    handleTreeChange (e) {
-    // 左侧树搜索
+      const value = e.target.value
-    handleTreeSearch () {
+      const expandedKeys = this.treeDataList
-      console.log(this.treeInput)
+        .map(item => {
-      this.initTreeData()
+          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;