[add] 内部工作组模块
This commit is contained in:
lideqin
+6
-1
@@ -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
|
||||
}
|
||||
|
||||
@@ -47,5 +47,18 @@ module.exports = {
|
||||
parentName: '父级名称',
|
||||
select: '下拉选择',
|
||||
tree: '树形结构'
|
||||
},
|
||||
// 内部工作组
|
||||
internalWorkGroup: {
|
||||
treeSearchPlaceholder: '输入树状图体系',
|
||||
name: '姓名',
|
||||
workNo: '工号',
|
||||
role: '角色',
|
||||
post: '职位',
|
||||
templateName: '内部工作组表模板',
|
||||
exportName: '内部工作组表',
|
||||
nodeName: '节点名称',
|
||||
user: '用户',
|
||||
pleaseSelectASystem: '请选择左侧体系'
|
||||
}
|
||||
}
|
||||
|
||||
@@ -50,5 +50,18 @@ module.exports = {
|
||||
parentName: '父级名称',
|
||||
select: '下拉选择',
|
||||
tree: '树形结构'
|
||||
},
|
||||
// 内部工作组
|
||||
internalWorkGroup: {
|
||||
treeSearchPlaceholder: '输入树状图体系',
|
||||
name: '姓名',
|
||||
workNo: '工号',
|
||||
role: '角色',
|
||||
post: '职位',
|
||||
templateName: '内部工作组表模板',
|
||||
exportName: '内部工作组表',
|
||||
nodeName: '节点名称',
|
||||
user: '用户',
|
||||
pleaseSelectASystem: '请选择左侧体系'
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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: {
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
@@ -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>
|
||||
@@ -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>
|
||||
Reference in New Issue
Block a user