djz8236
2 years ago
29 changed files with 5306 additions and 1398 deletions
@ -0,0 +1,84 @@ |
|||
import request from '@/utils/request' |
|||
import qs from 'qs' |
|||
//let tokens = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyTm8iOiI2IiwiaXNzIjoiV0JLIiwiZXhwIjoxNjMwMDI3MDA3fQ.9bEgBzFW2g1CUT7s5VXxhNCa10cyU_WTCFeqpQje0iY'
|
|||
let tokens = window.sessionStorage.getItem('token'); |
|||
//获取菜单 分页列表
|
|||
export function pageList(data) { |
|||
return request({ |
|||
url: '/cyf/sysfunction/listAllVoForSource', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
//新增
|
|||
export function savePost(data) { |
|||
return request({ |
|||
url: '/cyf/sysfunction/save', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
//模块名称
|
|||
export function sourceList(data) { |
|||
return request({ |
|||
url: '/cyf/syssource/listAll', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 删除
|
|||
export function delOrgroles(data) { |
|||
return request({ |
|||
url: '/cyf/sysfunction/delBySids/'+ data.sid, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 修改
|
|||
export function getSingleData(data){ |
|||
return request({ |
|||
url: '/cyf/sysfunction/fetchBySid/'+data.id, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
export function putOrgroles(data){ |
|||
return request({ |
|||
url: '/cyf/sysfunction/update/' +data.sid, |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 功能是否可用状态
|
|||
export function IsEnable(data){ |
|||
return request({ |
|||
url: '/cyf/sysfunction/updateIsEnable/' +data.sid+'/'+data.isEnable, |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
@ -0,0 +1,123 @@ |
|||
import request from '@/utils/request' |
|||
import qs from 'qs' |
|||
//let tokens = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyTm8iOiI2IiwiaXNzIjoiV0JLIiwiZXhwIjoxNjMwMDI3MDA3fQ.9bEgBzFW2g1CUT7s5VXxhNCa10cyU_WTCFeqpQje0iY'
|
|||
|
|||
let tokens = window.sessionStorage.getItem('token'); |
|||
|
|||
// //获取菜单 分页列表
|
|||
// export function pageList(data) {
|
|||
// return request({
|
|||
// url: '/cyf/sysmenu/listAllVoForSource',
|
|||
// method: 'POST',
|
|||
// data: data,
|
|||
// headers: {
|
|||
// 'Content-Type': 'application/json',
|
|||
// 'token': tokens
|
|||
// }
|
|||
// })
|
|||
// }
|
|||
|
|||
//获取菜单 分页列表
|
|||
export function pageList(data) { |
|||
return request({ |
|||
url: '/cyf/sysmenu/listAllVoFor', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json', |
|||
'token': tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
|
|||
// 新增保存 菜单信息
|
|||
export function saveMenusInfo(data) { |
|||
return request({ |
|||
url: '/cyf/sysmenu/save', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json'} |
|||
}) |
|||
} |
|||
|
|||
// 修改保存 菜单信息
|
|||
export function putMenusInfo(data) { |
|||
return request({ |
|||
url: '/cyf/sysmenu/update/' + data.sid, |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json'} |
|||
}) |
|||
} |
|||
|
|||
//根据sid 删除单个 资源信息
|
|||
export function delMenus(data) { |
|||
return request({ |
|||
url: '/cyf/sysmenu/delBySids/' + data.sid, |
|||
method: 'get', |
|||
data: qs.stringify(data), |
|||
headers: { |
|||
'Content-Type': 'application/json', |
|||
'token': tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 修改状态
|
|||
export function IsEnable(data) { |
|||
return request({ |
|||
url: '/cyf/sysmenu/updateIsEnable/' + data.sid + '/' + data.isEnable, |
|||
method: 'POST', |
|||
/* data: qs.stringify(data),*/ |
|||
headers: { |
|||
'Content-Type': 'application/json', |
|||
'token': tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
|
|||
// 获取菜单 不分页列表
|
|||
export function roleList(data) { |
|||
return request({ |
|||
url: '/system/v1/menus/list', |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json'} |
|||
}) |
|||
} |
|||
|
|||
//获取菜单 分页列表
|
|||
export function menusPageList(data) { |
|||
return request({ |
|||
url: '/system/v1/menus/pagelist', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json'} |
|||
}) |
|||
} |
|||
|
|||
//获取菜单 树形分页列表
|
|||
export function menusTreelist(data) { |
|||
return request({ |
|||
url: '/system/v1/menus/treelist', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json'} |
|||
}) |
|||
} |
|||
|
|||
|
|||
//根据sid 获取单个菜单 信息
|
|||
export function getRoleInfo(data) { |
|||
return request({ |
|||
url: '/system/v1/menus/' + data.sid, |
|||
method: 'GET', |
|||
data: qs.stringify(data) |
|||
}) |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
@ -0,0 +1,78 @@ |
|||
import request from '@/utils/request' |
|||
import qs from 'qs' |
|||
//let tokens = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyTm8iOiI2IiwiaXNzIjoiV0JLIiwiZXhwIjoxNjMwMTE1MjUwfQ.gtn_mVsbwH6ztl835rWmIY4DxeNmRe_TOt-Q0TdldIE'
|
|||
let tokens = window.sessionStorage.getItem('token'); |
|||
//获取菜单 分页列表
|
|||
export function pageList(data) { |
|||
return request({ |
|||
url: '/cyf/syspost/listPage', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 查询部门列表
|
|||
export function orgList(data){ |
|||
return request({ |
|||
url: '/cyf/sysorganization/list', |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 新增
|
|||
export function savePost(data){ |
|||
return request({ |
|||
url: '/cyf/syspost/save', |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 修改
|
|||
export function putOrgroles(data){ |
|||
return request({ |
|||
url: '/cyf/syspost/update/' +data.sid, |
|||
method: 'POST', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 删除
|
|||
export function delOrgroles(data){ |
|||
return request({ |
|||
url: '/cyf/syspost/delBySids/' + data.sids, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
export function pullDown(data){ |
|||
return request({ |
|||
url: '/cyf/dictcommon/typeValues', |
|||
method: 'get', |
|||
params: data |
|||
}) |
|||
} |
|||
|
|||
// 查询岗位列表
|
|||
export function selectList(data){ |
|||
return request({ |
|||
url: '/cyf/syspost/selectList', |
|||
method: 'get', |
|||
params: data |
|||
}) |
|||
} |
|||
@ -0,0 +1,150 @@ |
|||
import request from '@/utils/request' |
|||
import qs from 'qs' |
|||
// 用户列表
|
|||
//let tokens = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyTm8iOiI2IiwiaXNzIjoiV0JLIiwiZXhwIjoxNjI5OTQxNjI1fQ.aOFOz0h7c8YQs-ti2GLpqeWu4AE9mifx_043hLJQf8g'
|
|||
let tokens = window.sessionStorage.getItem('token'); |
|||
export function userList(data){ |
|||
return request({ |
|||
url: '/cyf/sys/listPage', |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 新增
|
|||
export function userAdd(data){ |
|||
return request({ |
|||
url: '/cyf/sys/save', |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 更新
|
|||
export function userUpdata(data){ |
|||
return request({ |
|||
url: '/cyf/sys/update/' +data.sid, |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 删除
|
|||
export function delUser(data){ |
|||
return request({ |
|||
url: '/cyf/sys/delBySid/' +data.sid, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 初始化密码
|
|||
export function initPwd(data){ |
|||
return request({ |
|||
url: '/cyf/sys/initPwd/' +data.sid, |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 根据sid查询一条信息
|
|||
export function userSingle(data){ |
|||
return request({ |
|||
url: '/cyf/sys/fetchBySid/' +data.sid, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 单条用户的角色列表
|
|||
export function setRole(data){ |
|||
return request({ |
|||
url: '/cyf/sysrole/listAllByUserSid/' +data.sid, |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 角色列表
|
|||
export function saveOrgRole(data){ |
|||
return request({ |
|||
url: '/cyf/sysuserrole/update', |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 查询角色列表
|
|||
export function roleList(data){ |
|||
return request({ |
|||
url: '/cyf/sysrole/listAll', |
|||
method: 'post', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 查询部门列表
|
|||
export function orgList(data){ |
|||
return request({ |
|||
url: '/cyf/sysorganization/list', |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
// 查询岗位列表
|
|||
export function postList(data){ |
|||
return request({ |
|||
url: '/cyf/syspost/fetchByOrgSid/'+data.sid, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 获取验证码
|
|||
export function getCode(data){ |
|||
return request({ |
|||
url: '/cyf/sys/sendMessageCode/'+data.phone, |
|||
method: 'get', |
|||
data: data, |
|||
headers: {'Content-Type': 'application/json', |
|||
'token':tokens |
|||
} |
|||
}) |
|||
} |
|||
|
|||
// 设置是否可用：isEnable：1可用，0不可用
|
|||
export function setRoleEnable(data) { |
|||
return request({ |
|||
url: '/cyf/sys/setIsEnable/' + data.sid + '/' + data.isEnable, |
|||
method: 'post', |
|||
data: data, |
|||
headers: { |
|||
'Content-Type': 'application/json' |
|||
} |
|||
}) |
|||
} |
|||
File diff suppressed because it is too large
@ -1,660 +0,0 @@ |
|||
<template> |
|||
<div class="container" style="display: flex;"> |
|||
<div class="org-tree"> |
|||
<el-tree :data="treedata" node-key="sid" :props="props" :default-expanded-keys="['fd6435f2-0005-11ec-a033-48452053aa33']" @node-click="handleNodeClick"> |
|||
<span class="custom-tree-node" slot-scope="{ node, data }" @mouseenter="mouseenter(data)" @mouseleave="mouseleave(data)" @click.stop.native> |
|||
<span>{{ node.label || $store.getters.userInfo.Orgname }}</span> |
|||
<span v-show="data.del" class="handle"> |
|||
<el-tooltip class="item" effect="dark" content="新增" placement="top-start"> |
|||
<el-button type="text" size="mini" @click.stop="() => append(data)" icon="el-icon-circle-plus-outline"> |
|||
</el-button> |
|||
</el-tooltip> |
|||
<!-- <el-tooltip v-show="data.sid" class="item" effect="dark" content="修改" placement="top-start">--> |
|||
<!-- <el-button type="text" size="mini" @click.stop="() => deit(data)" icon="el-icon-edit">--> |
|||
<!-- </el-button>--> |
|||
<!-- </el-tooltip>--> |
|||
<!-- <el-tooltip v-show="data.sid" class="item" effect="dark" content="删除" placement="top-start">--> |
|||
<!-- <el-button type="text" size="mini" @click.stop="() => remove(data)" icon="el-icon-delete">--> |
|||
<!-- </el-button>--> |
|||
<!-- </el-tooltip>--> |
|||
</span> |
|||
</span> |
|||
</el-tree> |
|||
</div> |
|||
<el-dialog title="编辑节点" :visible.sync="dialogVisible" width="50%" class="edit"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>组织名称</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织编码</td> |
|||
<td> |
|||
<el-input v-model="form.orgCode" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>主管人员</td> |
|||
<td> |
|||
<el-select v-model="form.zgStaffSid" style="width:300px" filterable> |
|||
<el-option v-for="item in staffdata" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
</td> |
|||
<td>分管人员</td> |
|||
<td> |
|||
<el-select v-model="fgStaffSid" style="width:300px" filterable multiple> |
|||
<el-option v-for="item in staffdata2" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织简称</td> |
|||
<td :colspan="3"> |
|||
<el-input v-model="form.orgAbbre" style="width: 30%"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>管理层级</td> |
|||
<td> |
|||
<el-select v-model="form.orgLevelValue" style="width:300px" placeholder="请选择" filterable @change="changeOrgLevel"> |
|||
<el-option v-for="item in orgLevel_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
<td>其他编码</td> |
|||
<td> |
|||
<el-input v-model="form.otherCode" style="width:300px" placeholder="与财务中客户编码相同"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织地址</td> |
|||
<td> |
|||
<el-input v-model="form.addrs" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织属性</td> |
|||
<td> |
|||
<el-select v-model="form.orgAttributeValue" placeholder="请选择" filterable @change="changeOrgAttribute"> |
|||
<el-option v-for="item in orgAttribute_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织联系人</td> |
|||
<td> |
|||
<el-input v-model="form.linkPerson" style="width:300px"></el-input> |
|||
</td> |
|||
|
|||
<td>联系电话</td> |
|||
<td> |
|||
<el-input v-model="form.linkPhone" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>是否独立法人</td> |
|||
<td> |
|||
<el-radio v-model="form.isDept" :label="0">是</el-radio> |
|||
<el-radio v-model="form.isDept" :label="1">否</el-radio> |
|||
</td> |
|||
<td>排序号</td> |
|||
<td> |
|||
<el-input v-model="form.sort" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div slot="footer" class="text-center"> |
|||
<el-button type="primary" @click="nodeSave()">保 存</el-button> |
|||
<el-button @click="dialogVisible = false">返 回</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<div class="org-table" v-show="isshow == 'table'"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="form" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="24"> |
|||
<el-form-item label="组织名称"> |
|||
<el-input v-model="page.params.name" clearable></el-input> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="onSearch()">查询</el-button> |
|||
<el-button @click="resetSearch()">重置</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- table --> |
|||
<el-table :data="tableData" default-expand-all border style="width: 100%;"> |
|||
<el-table-column label="操作" align="center" width="160px"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="primary" size="mini" @click="editRow(scope.row)"> |
|||
编辑 |
|||
</el-button> |
|||
<el-button type="danger" size="mini" @click.native.prevent="remove(scope.row)"> |
|||
删除 |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="name" label="组织名称" align="center"></el-table-column> |
|||
<el-table-column prop="orgCode" label="组织编码" align="center"></el-table-column> |
|||
<!-- <el-table-column prop="zgNames" label="主管" align="center"></el-table-column>--> |
|||
<el-table-column prop="fgNames" label="分管" align="center"></el-table-column> |
|||
<!--<el-table-column prop="contactMan" label="联系人" align="center" width="100px"></el-table-column>--> |
|||
<el-table-column prop="linkPhone" label="联系人手机号" width="110" align="center"> |
|||
</el-table-column> |
|||
<el-table-column prop="addrs" label="地址" align="center"> |
|||
</el-table-column> |
|||
<el-table-column prop="sort" label="排序" align="center" width="50px"> |
|||
</el-table-column> |
|||
<el-table-column prop="qrText" label="二维码" align="center" width="80px"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click.native.prevent="lookRow(scope.row)" type="text" size="small">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/> |
|||
</div> |
|||
|
|||
<div class="org-table" v-show="isshow == 'ewm'"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="form" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="16"> |
|||
<h4 style="margin: 0;line-height: 32px;">组织二维码</h4> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item style="float: right;"> |
|||
<el-button type="primary" @click="Printewm">打 印</el-button> |
|||
<el-button @click="isshow = 'table'">返 回</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- center --> |
|||
<div class="ewm" style="display: flex;justify-content: center; align-items: center;" ref="print"> |
|||
<img style="width: 200px; height: 200px;" :src="ewmForm.qrFilePath" alt=""> |
|||
<ul style="list-style:none; line-height: 32px; font-size: 16px;"> |
|||
<li><label>组织名称: </label><span>{{ ewmForm.departmentName }}</span></li> |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
<!-- 新增、编辑页面 --> |
|||
<div class="org-table" v-show="isshow == 'edit'"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="form" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="16"> |
|||
<h4 style="margin: 0;line-height: 32px;"> {{ dialogTitle }}组织信息</h4> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item style="float: right;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<el-button @click="isshow = 'table'">返 回</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- center --> |
|||
<div class="ediut"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>组织名称</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织编码</td> |
|||
<td> |
|||
<el-input v-model="form.orgCode" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>主管人员</td> |
|||
<td> |
|||
<el-select v-model="form.zgStaffSid" style="width:300px" filterable> |
|||
<el-option v-for="item in staffdata" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
</td> |
|||
<td>分管人员</td> |
|||
<td> |
|||
<el-select v-model="fgStaffSid" style="width:300px" filterable multiple> |
|||
<el-option v-for="item in staffdata2" :key="item.sid" :label="item.name" :value="item.sid"/> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织简称</td> |
|||
<td :colspan="3"> |
|||
<el-input v-model="form.orgAbbre" style="width: 300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>管理层级</td> |
|||
<td> |
|||
<el-select v-model="form.orgLevelValue" style="width:300px" placeholder="请选择" filterable @change="changeOrgLevel"> |
|||
<el-option v-for="item in orgLevel_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
<td>其他编码</td> |
|||
<td> |
|||
<el-input v-model="form.otherCode" style="width:300px" placeholder="与财务中客户编码相同"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织地址</td> |
|||
<td> |
|||
<el-input v-model="form.addrs" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织属性</td> |
|||
<td> |
|||
<el-select v-model="form.orgAttributeValue" placeholder="请选择" filterable @change="changeOrgAttribute"> |
|||
<el-option v-for="item in orgAttribute_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织联系人</td> |
|||
<td> |
|||
<el-input v-model="form.linkPerson" style="width:300px"></el-input> |
|||
</td> |
|||
<td>联系电话</td> |
|||
<td> |
|||
<el-input v-model="form.linkPhone" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>是否独立法人</td> |
|||
<td> |
|||
<el-radio v-model="form.isDept" :label="0">是</el-radio> |
|||
<el-radio v-model="form.isDept" :label="1">否</el-radio> |
|||
</td> |
|||
<td>排序号</td> |
|||
<td> |
|||
<el-input v-model="form.sort" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
</div> |
|||
</div> |
|||
<!-- <Position v-if="mapDialog" :address.sync="form.addrs" :maker-position.sync="form.jwd" |
|||
:dialog-visible.sync="mapDialog"/>--> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
addOrgTree, |
|||
delOrgtree, |
|||
getQrCode, getStaff, |
|||
getStaffName, |
|||
orgList, |
|||
pageList, |
|||
postOrgtree, |
|||
putOrgtree, |
|||
selectBySid |
|||
} from '@/api/system/departments/departments.js' |
|||
import { typeValues } from '@/api/system/roleAdminister/index' |
|||
import Position from '@/components/amap/amap.vue' |
|||
|
|||
export default { |
|||
components: { Position }, |
|||
data() { |
|||
return { |
|||
dialogVisible: false, |
|||
mapDialog: false, |
|||
dialogTitle: '', |
|||
props: { |
|||
label: 'name', |
|||
children: 'children' |
|||
}, |
|||
nodeForm: { |
|||
sid: '', |
|||
name: '', |
|||
sortNo: '' |
|||
}, |
|||
ewmForm: { |
|||
qrFilePath: '', |
|||
organizationName: '', |
|||
departmentName: '', |
|||
address: '' |
|||
}, |
|||
orgAttribute_list: [], |
|||
orgLevel_list: [], |
|||
form: { |
|||
sid: '', |
|||
name: '', |
|||
orgCode: '', |
|||
/* jwd: '',*/ |
|||
addrs: '', |
|||
zgStaffSid: '', |
|||
zgStaffName: '', |
|||
fgStaffSid: '', |
|||
fgStaffName: '', |
|||
linkPerson: '', |
|||
linkPhone: '', |
|||
sort: '', |
|||
isDept: '', |
|||
orgAbbre: '', |
|||
orgAttributeValue: '', |
|||
orgAttributeKey: '', |
|||
orgLevelValue: '', |
|||
orgLevelKey: '', |
|||
otherCode: '' |
|||
}, |
|||
fgStaffSid: [], |
|||
formBackup: Object.assign({}, this.form), |
|||
isshow: 'table', |
|||
page: { |
|||
total: 0, // 默认数据总数 |
|||
current: 1, // 默认开始页面 |
|||
size: 10, // 每页的数据条数 |
|||
params: { |
|||
name: '', |
|||
organizationSid: '', |
|||
psid: '' |
|||
} |
|||
}, |
|||
tableData: [], |
|||
treedata: [], |
|||
staffdata: [], |
|||
staffdata2: [], |
|||
rules: {} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.getOrgTree() |
|||
this.init() |
|||
}, |
|||
methods: { |
|||
init() { |
|||
typeValues({ type: 'orgAttribute' }).then((res) => { |
|||
if (res.success) { |
|||
this.orgAttribute_list = res.data |
|||
} |
|||
}) |
|||
typeValues({ type: 'orgLevel' }).then((res) => { |
|||
if (res.success) { |
|||
this.orgLevel_list = res.data |
|||
} |
|||
}) |
|||
}, |
|||
changeOrgLevel(value) { |
|||
let bb = null |
|||
this.orgLevel_list.forEach((e) => { |
|||
if (e.dictValue === value) { |
|||
bb = { |
|||
value: e.dictValue, |
|||
key: e.dictKey |
|||
} |
|||
} |
|||
}) |
|||
this.form.orgLevelValue = bb.value |
|||
this.form.orgLevelKey = bb.key |
|||
}, |
|||
changeOrgAttribute(value) { |
|||
let bb = null |
|||
this.orgAttribute_list.forEach((e) => { |
|||
if (e.dictValue === value) { |
|||
bb = { |
|||
key: e.dictKey, |
|||
value: e.dictValue |
|||
} |
|||
} |
|||
}) |
|||
this.form.orgAttributeKey = bb.key |
|||
}, |
|||
pagination(val) { // 分页 |
|||
this.page.current = val.pageNum |
|||
this.page.size = val.pageSize |
|||
this.getPageList(this.page) |
|||
}, |
|||
handleNodeClick(data) { |
|||
this.isshow = 'table' |
|||
this.page.params.organizationSid = this.$store.getters.userInfo.orgSid |
|||
this.page.params.psid = data.sid || 0 |
|||
|
|||
this.getPageList(this.page) |
|||
}, |
|||
getPageList(data) { // 获取树形列表 |
|||
pageList(data).then(res => { |
|||
console.log('返回子级:',res) |
|||
this.tableData = res.data.records |
|||
this.page.total = res.data.total |
|||
}) |
|||
}, |
|||
getOrgTree() { // 获取树形列表 |
|||
orgList({}).then(res => { |
|||
this.treedata = res.data |
|||
}) |
|||
}, |
|||
save() { |
|||
if (this.fgStaffSid.length > 0) { |
|||
this.form.fgStaffSid = this.fgStaffSid.join() |
|||
} else { |
|||
this.form.fgStaffName = '' |
|||
this.form.fgStaffSid = '' |
|||
} |
|||
this.form.organizationSid = this.$store.getters.userInfo.orgSid |
|||
// this.form.dlxx = typeof(this.form.dlxx) == 'string' ? this.form.dlxx : this.form.dlxx.join() |
|||
if (this.form.sid) { |
|||
// console.log(this.form) |
|||
putOrgtree(this.form).then(res => { |
|||
if (res.success) { |
|||
this.isshow = 'table' |
|||
this.getOrgTree() |
|||
this.handleNodeClick({ sid: this.form.psid }) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} else { |
|||
addOrgTree(this.form).then(res => { |
|||
if (res.success) { |
|||
this.isshow = 'table' |
|||
this.getOrgTree() |
|||
this.handleNodeClick({ sid: this.form.psid }) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
append(data) { |
|||
console.log(123456789, data) |
|||
this.dialogTitle = '新增' |
|||
this.isshow = 'edit' |
|||
this.fgStaffSid = [] |
|||
this.form = Object.assign({}, this.formBackup) |
|||
this.form.psid = data.sid || 0 |
|||
this.form.organizationSid = this.$store.getters.userInfo.orgSid |
|||
this.form.address = data.orgAddress || data.address |
|||
this.form.dlxx = data.gisInfo || data.dlxx |
|||
this.getStaff(data.sid) |
|||
this.getStaff2(data.sid) |
|||
}, |
|||
editRow(row) { |
|||
this.getStaff(row.sid) |
|||
this.getStaff2(row.sid) |
|||
this.dialogTitle = '编辑' |
|||
this.isshow = 'edit' |
|||
this.fgStaffSid = [] |
|||
selectBySid(row.sid).then((response) => { |
|||
if (response.success) { |
|||
this.form = response.data |
|||
this.form.fgStaffName = response.data.fgNames |
|||
this.form.fgStaffSid = response.data.fgStaffSid |
|||
if (this.form.fgStaffSid) { |
|||
this.fgStaffSid = response.data.fgStaffSid.split(',') |
|||
} |
|||
this.form.zgStaffName = response.data.zgNames |
|||
this.form.zgStaffSid = response.data.zgStaffSid |
|||
console.log('编辑回显的数据', this.form) |
|||
} |
|||
}) |
|||
}, |
|||
deit(data) { // 节点编辑保存 |
|||
this.getStaff(data.sid) |
|||
this.getStaff2(data.sid) |
|||
console.log(data, 8888) |
|||
this.dialogVisible = true |
|||
this.form.sid = data.sid |
|||
// this.form.psid = null |
|||
this.form.name = data.name |
|||
this.form.orgCode = data.orgCode |
|||
/* this.form.jwd = data.jwd*/ |
|||
this.form.addrs = data.addrs |
|||
this.form.linkPerson = data.linkPerson |
|||
this.form.linkPhone = data.linkPhone |
|||
this.form.sort = data.sort |
|||
this.form.zgStaffSid = data.zgSids |
|||
this.form.fgStaffSid = data.fgSids.split(',') |
|||
}, |
|||
nodeSave() { // 节点编辑保存 |
|||
console.log('这是保存nodeSave(0') |
|||
this.form.fgStaffSid = this.form.fgStaffSid.join() |
|||
postOrgtree(this.form).then(res => { |
|||
this.getOrgTree() |
|||
this.dialogVisible = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}, |
|||
remove(data) { |
|||
this.$confirm('确定要删除该组织吗, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
delOrgtree({ sid: data.sid }).then(res => { |
|||
this.getOrgTree() |
|||
this.handleNodeClick({ sid: data.psid }) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}) |
|||
}, |
|||
lookRow(row) { // 查看二维码 |
|||
this.isshow = 'ewm' |
|||
getQrCode({ sid: row.sid }).then(res => { |
|||
this.ewmForm = res.data |
|||
}) |
|||
}, |
|||
Printewm() { |
|||
this.$print(this.$refs.print) // 使用 |
|||
}, |
|||
mouseenter(data) { |
|||
this.$set(data, 'del', true) |
|||
}, |
|||
mouseleave(data) { |
|||
this.$set(data, 'del', false) |
|||
}, |
|||
onSearch() { |
|||
this.getPageList(this.page) |
|||
}, |
|||
resetSearch() { |
|||
this.page.params.name = '' |
|||
this.getPageList(this.page) |
|||
}, |
|||
// 主管人员 |
|||
getStaff(orgSid) { |
|||
getStaff({ deptSid: orgSid }).then((res) => { |
|||
if (res.success) { |
|||
this.staffdata = res.data |
|||
} |
|||
}) |
|||
}, |
|||
// 分管人员 |
|||
getStaff2(orgSid) { |
|||
getStaffName({ deptSid: orgSid }).then(res => { |
|||
this.staffdata2 = res.data |
|||
console.log('分管人员', this.staffdata2) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.el-icon-arrow-right:before { |
|||
content: '\e6e0'; |
|||
color: #727272; |
|||
} |
|||
</style> |
|||
|
|||
<style scoped="scoped" lang="scss"> |
|||
.org-tree { |
|||
width: 240px; |
|||
min-height: 100%; |
|||
box-sizing: border-box; |
|||
/*padding-right: 10px;*/ |
|||
border: 1px solid #edf1f7; |
|||
overflow: scroll; |
|||
} |
|||
|
|||
.org-table { |
|||
flex: 1; |
|||
// padding-left: 10px; |
|||
margin: 0 10px; |
|||
border: 1px solid #edf1f7; |
|||
min-height: 100%; |
|||
overflow-y: scroll; |
|||
|
|||
.ewm { |
|||
margin: 30px auto 0; |
|||
width: 560px; |
|||
} |
|||
|
|||
.ediut { |
|||
margin: 30px auto 0; |
|||
/*width:750px;*/ |
|||
} |
|||
} |
|||
|
|||
.custom-tree-node { |
|||
position: relative; |
|||
overflow: hidden; |
|||
width: 100%; |
|||
flex: 1; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
font-size: 14px; |
|||
padding-right: 8px; |
|||
} |
|||
|
|||
.handle { |
|||
position: absolute; |
|||
right: 0; |
|||
|
|||
.el-button--text { |
|||
font-size: 15px; |
|||
background-color: #FFFFFF; |
|||
} |
|||
} |
|||
|
|||
.my-tabs { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.edit { |
|||
.el-form-item__label { |
|||
width: 100px !important; |
|||
display: inline-block !important; |
|||
} |
|||
|
|||
.el-input { |
|||
width: 70%; |
|||
} |
|||
} |
|||
|
|||
.td_left { |
|||
border-left: 0 solid #e6e9f0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,853 @@ |
|||
<template xmlns=""> |
|||
<div> |
|||
<el-tabs class="my-tabs" v-model="activeName" type="card" @tab-click="handleClick"> |
|||
<el-tab-pane label="角色列表" name="roleList"> |
|||
<div class="container"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="search" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="16"> |
|||
<el-form-item label="角色名称"> |
|||
<el-input v-model="search.name" clearable></el-input> |
|||
</el-form-item> |
|||
<el-button @click="getroleOrgList(1)">查询</el-button> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- table --> |
|||
<el-table :data="roleTable" border style="width: 100%;"> |
|||
<el-table-column label="序号" width="80px" type="index" align="center"> |
|||
</el-table-column> |
|||
<el-table-column label="操作" align="center"> |
|||
<template slot-scope="scope"> |
|||
<!-- <el-button @click="sourceMenus(scope.row)" type="primary" size="mini">资源授权</el-button> --> |
|||
<!-- <el-button @click="funMenus(scope.row)" type="primary" size="mini">功能授权</el-button> --> |
|||
<el-button @click="roleMenus(scope.row)" type="primary" size="mini">菜单授权</el-button> |
|||
<!-- <el-button @click="mobileMenus(scope.row)" type="primary" size="mini">移动端授权</el-button> --> |
|||
<el-button @click="editRow(scope.row)" type="primary" size="mini">修改</el-button> |
|||
<el-button @click="delRow(scope.row)" type="danger" size="mini">删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="name" label="角色名称" width="220px" align="center"> |
|||
</el-table-column> |
|||
<!-- <el-table-column prop="postName" label="角色岗位" width="220px" align="center"> |
|||
</el-table-column> |
|||
<el-table-column prop="roleTypeValue" label="组织层级" width="200px" align="center"> |
|||
</el-table-column> --> |
|||
<el-table-column prop="code" label="编码" align="center"/> |
|||
<el-table-column prop="remarks" label="备注" align="center"> |
|||
</el-table-column> |
|||
<!-- <el-table-column prop="isEnableName" label="是否可用" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-switch |
|||
v-model="scope.row.isEnable" |
|||
active-value='1' |
|||
inactive-value='0' |
|||
active-color="#13ce66" |
|||
inactive-color="#ff4949" |
|||
@change="enabledChange($event,scope.row)"> |
|||
</el-switch> |
|||
</template> |
|||
</el-table-column> --> |
|||
</el-table> |
|||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/> |
|||
|
|||
<!-- 编辑角色信息 --> |
|||
<el-dialog :title="dialogTitle + '角色信息'" :visible.sync="editDialog" width="40%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<!-- <tr> |
|||
<td>岗位</td> |
|||
<td> |
|||
<el-select v-model="roleForm.postSid" filterable style="width:300px" @change="changePost"> |
|||
<el-option |
|||
v-for="(item, i) in postSidData" |
|||
:key="i" |
|||
:label="item.name" |
|||
:value="item.sid"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>角色名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>编码</td> |
|||
<td> |
|||
<el-input v-model="roleForm.code" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<!-- <tr> |
|||
<td>组织层级</td> |
|||
<td> |
|||
<el-select v-model="roleForm.roleTypeValue" style="width:300px" @change="changeOrgName"> |
|||
<el-option |
|||
v-for="(item, i) in roleTypeValue_list" |
|||
:key="i" |
|||
:label="item.dictValue" |
|||
:value="item.dictValue"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>排序</td> |
|||
<td> |
|||
<el-input v-model="roleForm.sort" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>备注</td> |
|||
<td> |
|||
<el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" v-model="roleForm.remarks"></el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<el-button @click="editDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<!-- 资源授权 --> |
|||
<el-dialog title="资源授权" :visible.sync="sourceDialog" width="50%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>角色名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" readonly></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>可操作资源列表</td> |
|||
<td> |
|||
<el-tree v-loading="loading" :data="treedata" ref="sourceTree" show-checkbox accordion node-key="sid" |
|||
:default-expand-all='true' |
|||
:default-checked-keys="checkedId" :props="sourcedefaultProps" @check-change="checkchange"> |
|||
</el-tree> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div slot="footer" class="text-center"> |
|||
<el-button type="primary" @click="sourceSave">保 存</el-button> |
|||
<el-button @click="sourceDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<!-- 功能授权 --> |
|||
<el-dialog title="功能授权" :visible.sync="funDialog" width="50%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>角色名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" readonly></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>可操作功能列表</td> |
|||
<td> |
|||
<el-tree v-loading="loading" :data="treedata" ref="funTree" show-checkbox accordion node-key="sid" |
|||
:default-expand-all='true' |
|||
:default-checked-keys="checkedId" :props="defaultProps" @check-change="checkchange"> |
|||
</el-tree> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div slot="footer" class="text-center"> |
|||
<el-button type="primary" @click="funSave">保 存</el-button> |
|||
<el-button @click="funDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<!-- 菜单授权 --> |
|||
<el-dialog title="菜单授权" :visible.sync="roleDialog" width="50%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>角色名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" readonly></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>可操作菜单列表</td> |
|||
<td> |
|||
<div style="height:230px;line-height:120px;overflow:auto;overflow-x:hidden;"> |
|||
<el-tree v-loading="loading" :data="treedata" ref="Tree" show-checkbox accordion node-key="sid" |
|||
:default-expand-all='true' |
|||
:default-checked-keys="checkedId" |
|||
:props="defaultProps" |
|||
@check-change="checkchange"> |
|||
</el-tree> |
|||
</div> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div slot="footer" class="text-center"> |
|||
<el-button type="primary" @click="getCheckedKeys">保 存</el-button> |
|||
<el-button @click="roleDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<el-dialog title="移动端授权" :visible.sync="mobileDialog" width="50%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>角色名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" readonly></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>可操作菜单列表</td> |
|||
<td> |
|||
<div style="height:230px;line-height:120px;overflow:auto;overflow-x:hidden;"> |
|||
<el-tree v-loading="loading" :data="treedata" ref="mobileTree" show-checkbox accordion node-key="sid" |
|||
:default-expand-all="true" |
|||
:default-checked-keys="checkedId" |
|||
:props="defaultProps" |
|||
@check-change="checkchange"> |
|||
</el-tree> |
|||
</div> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div slot="footer" class="text-center"> |
|||
<el-button type="primary" @click="getCheckedMobile">保 存</el-button> |
|||
<el-button @click="mobileDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</el-tab-pane> |
|||
<!-- 新增角色 --> |
|||
<el-tab-pane label="新增角色" name="addrole"> |
|||
<el-card class="box-card"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<!-- <tr> |
|||
<td>岗位</td> |
|||
<td> |
|||
<el-select v-model="roleForm.postSid" filterable style="width:300px" @change="changePost"> |
|||
<el-option v-for="(item, i) in postSidData" :key="i" :label="item.name" :value="item.sid"></el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>角色名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>编码</td> |
|||
<td> |
|||
<el-input v-model="roleForm.code" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<!-- <tr> |
|||
<td>组织层级</td> |
|||
<td> |
|||
<el-select v-model="roleForm.roleTypeValue" style="width:300px" @change="changeOrgName"> |
|||
<el-option v-for="(item, i) in roleTypeValue_list" :key="i" :label="item.dictValue" |
|||
:value="item.dictValue"></el-option> |
|||
</el-select> |
|||
<el-input v-model="roleForm.roleTypeValue" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>排序</td> |
|||
<td> |
|||
<el-input v-model="roleForm.sort" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>备注</td> |
|||
<td> |
|||
<el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" v-model="roleForm.remarks"></el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
</div> |
|||
</el-card> |
|||
</el-tab-pane> |
|||
</el-tabs> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
delOrgroles, |
|||
funMenuTree, |
|||
postList, |
|||
putOrgroles, |
|||
roleMenuTree, |
|||
roleOrgList, |
|||
getRoleMenuList, |
|||
saveRoleMenuList, |
|||
savefunMenu, |
|||
saveorgrolemenus, |
|||
saveOrgroles, |
|||
saveSource, |
|||
setRoleEnable, |
|||
sourceMenuTree, |
|||
typeValues |
|||
} from '@/api/system/roleAdminister/index.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
dialogTitle: '', |
|||
activeName: 'roleList', |
|||
roleForm: { |
|||
name: '', |
|||
code: '', |
|||
sort: '', |
|||
type: '2', |
|||
postSid: '', |
|||
remarks: '', |
|||
roleType:'', |
|||
roleTypeValue:'' |
|||
}, |
|||
formBackup: {}, |
|||
search: { |
|||
name: '' |
|||
}, |
|||
page: { |
|||
total: 0, // 默认数据总数 |
|||
current: 1, // 默认开始页面 |
|||
size: 10 // 每页的数据条数 |
|||
}, |
|||
roleTable: [], |
|||
postSidData: [], |
|||
roleTypeValue_list: [], // 组织层级 |
|||
editDialog: false, |
|||
// 树形 |
|||
loading: false, |
|||
defaultProps: { |
|||
children: 'children', |
|||
label: 'name' |
|||
}, |
|||
checkedId: [], // 菜单授权 已选中 |
|||
treedata: [], // 菜单授权 |
|||
chace: [], |
|||
roleDialog: false, |
|||
Thisrow: {}, |
|||
// 资源授权 |
|||
sourceDialog: false, |
|||
sourcetreedata: [], |
|||
sourcedefaultProps: { |
|||
children: 'children', |
|||
label: 'sourceName' |
|||
}, |
|||
// 功能授权 |
|||
funDialog: false, |
|||
// 移动端授权 |
|||
mobileDialog: false |
|||
}; |
|||
}, |
|||
mounted() { |
|||
this.formBackup = Object.assign({}, this.roleForm) |
|||
this.getroleOrgList() |
|||
this.getPostList() |
|||
this.getType() |
|||
}, |
|||
methods: { |
|||
pagination(val) { // 分页函数 |
|||
this.page.current = val.pageNum |
|||
this.page.size = val.pageSize |
|||
this.getroleOrgList() |
|||
}, |
|||
getPostList() { |
|||
postList().then((res) => { |
|||
if (res.code === '200') { |
|||
this.postSidData = res.data |
|||
} |
|||
}) |
|||
}, |
|||
getType() { |
|||
typeValues({ |
|||
type: 'roleType' |
|||
}).then((res) => { |
|||
if (res.code === '200') { |
|||
this.roleTypeValue_list = res.data |
|||
console.log('下拉框请求组织层级', res.data) |
|||
} |
|||
}) |
|||
}, |
|||
// 分页列表 |
|||
getroleOrgList(flag) { |
|||
if (flag == '1') { |
|||
this.page.current = 1 |
|||
} |
|||
let params = this.page |
|||
params.params = this.search |
|||
roleOrgList(params).then(res => { |
|||
this.page.total = res.data.total |
|||
this.roleTable = res.data.records |
|||
for (let i = 0; i < this.roleTable.length; i++) { |
|||
if (this.roleTable[i].isEnable == '1') { |
|||
this.roleTable[i].isEnableName = '是' |
|||
} else { |
|||
this.roleTable[i].isEnableName = '否' |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
changeOrgName(value) { |
|||
const choosetItem = this.roleTypeValue_list.filter((item) => item.dictValue === value) |
|||
this.roleForm.roleType = choosetItem[0].dictKey |
|||
console.log('组织层级',this.roleForm.roleType,this.roleForm.roleTypeValue) |
|||
}, |
|||
changePost(value) { |
|||
const choosetItem = this.postSidData.filter((item) => item.sid === value) |
|||
this.roleForm.name = choosetItem[0].name |
|||
}, |
|||
handleClick(tab, event) { |
|||
if (tab.name == 'addrole') { |
|||
this.dialogTitle = '新增' |
|||
this.roleForm = Object.assign({}, this.formBackup) |
|||
} else { |
|||
this.getroleOrgList() |
|||
} |
|||
}, |
|||
editRow(row) { |
|||
this.dialogTitle = '编辑' |
|||
this.editDialog = true |
|||
this.roleForm = Object.assign({}, row) |
|||
}, |
|||
delRow(row) { |
|||
this.$confirm('确定要删除该角色吗, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
delOrgroles({ |
|||
sid: row.sid |
|||
}).then(res => { |
|||
this.getroleOrgList() |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '删除成功!' |
|||
}); |
|||
}) |
|||
}) |
|||
}, |
|||
// 保存角色 |
|||
save() { |
|||
if (this.roleForm.sid) { |
|||
putOrgroles(this.roleForm).then(res => { |
|||
if (res.code == '200') { |
|||
this.getroleOrgList() |
|||
this.editDialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} else { |
|||
saveOrgroles(this.roleForm).then(res => { |
|||
if (res.code == '200') { |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
this.activeName = "roleList" |
|||
this.getroleOrgList() |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
// 是否可用 按钮 |
|||
enabledChange(value, row) { |
|||
setRoleEnable({ |
|||
sid: row.sid, |
|||
isEnable: value |
|||
}).then(res => { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: res.msg |
|||
}); |
|||
}) |
|||
}, |
|||
sourceMenus(row) { |
|||
this.sourceDialog = true |
|||
this.checkedId = [] |
|||
this.roleForm.name = row.name |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
let params = { |
|||
roleSid: row.sid |
|||
} |
|||
sourceMenuTree(params).then(res => { |
|||
let data1 = res.data |
|||
for (let i = 0; i < data1.length; i++) { |
|||
if (data1[i].checked == 0) { |
|||
this.checkedId.push(data1[i].sid) |
|||
} |
|||
} |
|||
this.treedata = res.data |
|||
this.loading = false |
|||
}) |
|||
}, |
|||
funMenus(row) { |
|||
this.funDialog = true |
|||
this.checkedId = [] |
|||
this.roleForm.name = row.name |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
let params = { |
|||
roleSid: row.sid |
|||
} |
|||
funMenuTree(params).then(res => { |
|||
let data1 = res.data |
|||
for (let i = 0; i < data1.length; i++) { |
|||
if (data1[i].checked == 0) { |
|||
this.checkedId.push(data1[i].sid) |
|||
} |
|||
for (let j = 0; j < data1[i].children.length; j++) { |
|||
let data2 = data1[i].children |
|||
if (data2[j].checked == 0) { |
|||
this.checkedId.push(data2[j].sid) |
|||
} |
|||
for (let k = 0; k < data2[j].children.length; k++) { |
|||
let data3 = data2[j].children |
|||
if (data3[k].checked == 0) { |
|||
this.checkedId.push(data3[k].sid) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
this.treedata = res.data |
|||
this.loading = false |
|||
}) |
|||
}, |
|||
// 获取授权菜单树形 |
|||
roleMenus(row) { |
|||
this.roleDialog = true |
|||
this.checkedId = [] |
|||
this.roleForm.name = row.name |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
let params = { |
|||
roleSid: row.sid |
|||
} |
|||
roleMenuTree(params).then(res => { |
|||
let data1 = res.data |
|||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态 |
|||
for (let i = 0; i < data1.length; i++) { |
|||
if (data1[i].children) { |
|||
// data2各模块中的一级菜单 |
|||
let data2 = data1[i].children |
|||
for (let j = 0; j < data2.length; j++) { |
|||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单 |
|||
if (data2[j].children) { |
|||
// data3各模块中的二级菜单 |
|||
const data3 = data2[j].children |
|||
for (let k = 0; k < data3.length; k++) { |
|||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单 |
|||
if (data3[k].children) { |
|||
const data4 = data3[k].children |
|||
for (let l = 0; l < data4.length; l++) { |
|||
if (data4[l].checked == 0) { |
|||
this.checkedId.push(data4[l].sid) |
|||
} |
|||
} |
|||
} |
|||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态 |
|||
if (data3[k].children.length == 0 && data3[k].checked == 0) { |
|||
this.checkedId.push(data3[k].sid) |
|||
} |
|||
} |
|||
} |
|||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态 |
|||
if (data2[j].children.length == 0 && data2[j].checked == 0) { |
|||
this.checkedId.push(data2[j].sid) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
// for (let i = 0; i < data1.length; i++) { |
|||
// if (data1[i].checked == 0) { |
|||
// this.checkedId.push(data1[i].sid) |
|||
// } |
|||
// for (let j = 0; j < data1[i].children.length; j++) { |
|||
// let data2 = data1[i].children |
|||
// if (data2[j].checked == 0) { |
|||
// this.checkedId.push(data2[j].sid) |
|||
// } |
|||
// for (let k = 0; k < data2[j].children.length; k++) { |
|||
// let data3 = data2[j].children |
|||
// if (data3[k].checked == 0) { |
|||
// this.checkedId.push(data3[k].sid) |
|||
// } |
|||
// } |
|||
// } |
|||
// } |
|||
console.log('112233', this.checkedId) |
|||
this.treedata = res.data |
|||
this.getTreeParentNode(res.data, this.checkedId) |
|||
this.getTreeParentid(res.data) |
|||
this.loading = false |
|||
}) |
|||
}, |
|||
mobileMenus(row) { |
|||
this.mobileDialog = true |
|||
this.checkedId = [] |
|||
this.roleForm.name = row.name |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
getRoleMenuList(row.sid).then(res => { |
|||
let data1 = res.data |
|||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态 |
|||
for (let i = 0; i < data1.length; i++) { |
|||
if (data1[i].children) { |
|||
// data2各模块中的一级菜单 |
|||
let data2 = data1[i].children |
|||
for (let j = 0; j < data2.length; j++) { |
|||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单 |
|||
if (data2[j].children) { |
|||
// data3各模块中的二级菜单 |
|||
const data3 = data2[j].children |
|||
for (let k = 0; k < data3.length; k++) { |
|||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单 |
|||
if (data3[k].children) { |
|||
const data4 = data3[k].children |
|||
for (let l = 0; l < data4.length; l++) { |
|||
if (data4[l].checked == 0) { |
|||
this.checkedId.push(data4[l].sid) |
|||
} |
|||
} |
|||
} |
|||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态 |
|||
if (data3[k].children.length == 0 && data3[k].checked == 0) { |
|||
this.checkedId.push(data3[k].sid) |
|||
} |
|||
} |
|||
} |
|||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态 |
|||
if (data2[j].children.length == 0 && data2[j].checked == 0) { |
|||
this.checkedId.push(data2[j].sid) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
// for (let i = 0; i < data1.length; i++) { |
|||
// if (data1[i].checked == 0) { |
|||
// this.checkedId.push(data1[i].sid) |
|||
// } |
|||
// for (let j = 0; j < data1[i].children.length; j++) { |
|||
// let data2 = data1[i].children |
|||
// if (data2[j].checked == 0) { |
|||
// this.checkedId.push(data2[j].sid) |
|||
// } |
|||
// for (let k = 0; k < data2[j].children.length; k++) { |
|||
// let data3 = data2[j].children |
|||
// if (data3[k].checked == 0) { |
|||
// this.checkedId.push(data3[k].sid) |
|||
// } |
|||
// } |
|||
// } |
|||
// } |
|||
console.log('112233', this.checkedId) |
|||
this.treedata = res.data |
|||
this.getTreeParentNode(res.data, this.checkedId) |
|||
// this.getTreeParentid(res.data) |
|||
this.loading = false |
|||
}) |
|||
}, |
|||
mobileMenus(row) { |
|||
this.mobileDialog = true |
|||
this.checkedId = [] |
|||
this.roleForm.name = row.name |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
getRoleMenuList(row.sid).then(res => { |
|||
let data1 = res.data |
|||
// 如果菜单有子级菜单，说明是父级菜单，父级菜单不可以直接赋值已选中状态 |
|||
for (let i = 0; i < data1.length; i++) { |
|||
if (data1[i].children) { |
|||
// data2各模块中的一级菜单 |
|||
let data2 = data1[i].children |
|||
for (let j = 0; j < data2.length; j++) { |
|||
// 如果一级菜单有子级菜单（二级菜单），就循环查看二级菜单有无子级菜单 |
|||
if (data2[j].children) { |
|||
// data3各模块中的二级菜单 |
|||
const data3 = data2[j].children |
|||
for (let k = 0; k < data3.length; k++) { |
|||
// 如果二级菜单有子级菜单（三级菜单），就循环查看三级菜单有无子级菜单 |
|||
if (data3[k].children) { |
|||
const data4 = data3[k].children |
|||
for (let l = 0; l < data4.length; l++) { |
|||
if (data4[l].checked == 0) { |
|||
this.checkedId.push(data4[l].sid) |
|||
} |
|||
} |
|||
} |
|||
// 如果二级菜单没有子级菜单（三级菜单），查看是否是选中状态 |
|||
if (data3[k].children.length == 0 && data3[k].checked == 0) { |
|||
this.checkedId.push(data3[k].sid) |
|||
} |
|||
} |
|||
} |
|||
// 如果一级菜单没有子级菜单（二级菜单），查看是否是选中状态 |
|||
if (data2[j].children.length == 0 && data2[j].checked == 0) { |
|||
this.checkedId.push(data2[j].sid) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
// for (let i = 0; i < data1.length; i++) { |
|||
// if (data1[i].checked == 0) { |
|||
// this.checkedId.push(data1[i].sid) |
|||
// } |
|||
// for (let j = 0; j < data1[i].children.length; j++) { |
|||
// let data2 = data1[i].children |
|||
// if (data2[j].checked == 0) { |
|||
// this.checkedId.push(data2[j].sid) |
|||
// } |
|||
// for (let k = 0; k < data2[j].children.length; k++) { |
|||
// let data3 = data2[j].children |
|||
// if (data3[k].checked == 0) { |
|||
// this.checkedId.push(data3[k].sid) |
|||
// } |
|||
// } |
|||
// } |
|||
// } |
|||
console.log('112233', this.checkedId) |
|||
this.treedata = res.data |
|||
this.getTreeParentNode(res.data, this.checkedId) |
|||
// this.getTreeParentid(res.data) |
|||
this.loading = false |
|||
}) |
|||
}, |
|||
// 递归查询所有上级数据 |
|||
getTreeParentNode(menus, ids) { |
|||
for (var i = 0; i < menus.length; i++) { |
|||
if (menus[i].children && menus[i].children.length !== 0) { |
|||
this.getTreeParentNode(menus[i].children, ids) |
|||
} else if (menus[i].isCheck) { |
|||
ids.push(menus[i].sid) |
|||
} |
|||
} |
|||
}, |
|||
// 所有一级菜单ID |
|||
getTreeParentid(menus) { |
|||
for (var i = 0; i < menus.length; i++) { |
|||
this.chace.push(menus[i].sid) |
|||
} |
|||
}, |
|||
// 设置半选状态 |
|||
setHalfCheckedNodes(sid) { |
|||
const node = this.$refs['Tree'].getNode(sid) |
|||
console.log('11111', sid) |
|||
console.log('11111', node) |
|||
if (node) { // 此处应判断当前节点的checked属性是否为true，是则不必半选 |
|||
node.indeterminate = true |
|||
} |
|||
}, |
|||
// 资源授权保存 |
|||
sourceSave() { |
|||
let _this = this |
|||
let sourceMenus = this.$refs.sourceTree.getCheckedKeys() |
|||
let params = { |
|||
sorceSid: sourceMenus.toString(), |
|||
roleSid: _this.Thisrow.sid |
|||
} |
|||
saveSource(params).then(res => { |
|||
this.sourceDialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}, |
|||
// 功能授权保存 |
|||
funSave() { |
|||
let _this = this |
|||
let funMenus = this.$refs.funTree.getCheckedKeys() |
|||
let params = { |
|||
functionSid: funMenus.toString(), |
|||
roleSid: _this.Thisrow.sid |
|||
} |
|||
savefunMenu(params).then(res => { |
|||
this.funDialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}, |
|||
// 菜单授权 |
|||
getCheckedKeys() { |
|||
let _this = this |
|||
let roleMenus = [] |
|||
roleMenus = this.$refs.Tree.getCheckedNodes(false, true) |
|||
// roleMenus = this.$refs.Tree.getCheckedKeys() |
|||
console.log('已选节点、半选节点node', roleMenus) |
|||
const roleMenus_sid = [] |
|||
for (var i = 0; i < roleMenus.length; i++) { |
|||
roleMenus_sid.push(roleMenus[i].sid) |
|||
} |
|||
console.log('已选节点、半选节点sid', roleMenus_sid) |
|||
// let parentTrue = this.$refs.Tree.getHalfCheckedKeys() |
|||
// for (let i = 0; i < parentTrue.length; i++) { |
|||
// for (let j = 0; j < this.chace.length; j++) { |
|||
// if (parentTrue[i] == this.chace[j]) { |
|||
// parentTrue.splice(i, 1); |
|||
// } |
|||
// } |
|||
// } |
|||
let params = { |
|||
menuSid: roleMenus_sid.toString(), |
|||
roleSid: _this.Thisrow.sid |
|||
} |
|||
saveorgrolemenus(params).then(res => { |
|||
this.roleDialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}, |
|||
getCheckedMobile() { |
|||
let _this = this |
|||
let roleMenus = [] |
|||
roleMenus = this.$refs.mobileTree.getCheckedNodes(false, true) |
|||
// roleMenus = this.$refs.Tree.getCheckedKeys() |
|||
console.log('已选节点、半选节点node', roleMenus) |
|||
const roleMenus_sid = [] |
|||
for (var i = 0; i < roleMenus.length; i++) { |
|||
roleMenus_sid.push(roleMenus[i].sid) |
|||
} |
|||
console.log('已选节点、半选节点sid', roleMenus_sid) |
|||
// let parentTrue = this.$refs.Tree.getHalfCheckedKeys() |
|||
// for (let i = 0; i < parentTrue.length; i++) { |
|||
// for (let j = 0; j < this.chace.length; j++) { |
|||
// if (parentTrue[i] == this.chace[j]) { |
|||
// parentTrue.splice(i, 1); |
|||
// } |
|||
// } |
|||
// } |
|||
let params = { |
|||
menuSid: roleMenus_sid.toString(), |
|||
roleSid: _this.Thisrow.sid |
|||
} |
|||
saveRoleMenuList(params).then((res) => { |
|||
if (res.success) { |
|||
this.mobileDialog = false |
|||
this.$message({ showClose: true, message: res.msg, type: 'success' }) |
|||
} |
|||
}) |
|||
}, |
|||
checkchange() { |
|||
|
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped="scoped"> |
|||
.my-tabs { |
|||
margin-top: 10px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,604 @@ |
|||
<template> |
|||
|
|||
<el-tabs v-model="activeName" class="my-tabs" type="card" @tab-click="handleClick"> |
|||
<el-tab-pane label="菜单列表" name="roleList"> |
|||
<div class="content"> |
|||
<!--<div class="tab-header">--> |
|||
<!-- <el-form :inline="true" :model="form" class="demo-form-inline"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="18"> |
|||
<el-form-item label="菜单名称"> |
|||
<el-input v-model="page.params.name" placeholder="菜单名称" clearable/> |
|||
</el-form-item> |
|||
<el-form-item label="资源名称"> |
|||
<!–<el-select v-model="page.sourceSid" @change="$forceUpdate()" :disabled="isadd"> |
|||
<el-option |
|||
v-for="(item, i) in sourceNameData" |
|||
:key="i" |
|||
:label="item.sourceName" |
|||
:value="item.sid"> |
|||
</el-option> |
|||
</el-select>–> |
|||
<el-input v-model="page.params.sourceName" placeholder="资源名称" clearable/> |
|||
</el-form-item> |
|||
<el-button type="primary" @click="getPageList">查询</el-button> |
|||
</el-col>--> |
|||
<!-- <el-col :span="6"> |
|||
<el-form-item style="float: right;"> |
|||
<el-button type="primary" @click="getSorting">保存排序</el-button> |
|||
</el-form-item> |
|||
</el-col>--> |
|||
<!--</el-row> |
|||
</el-form>--> |
|||
<!-- </div>--> |
|||
|
|||
<!-- table --> |
|||
<div class="table-describe clearfix"> |
|||
<h4 style="color:#000;">菜单列表</h4> |
|||
</div> |
|||
<div class="listconadd"> |
|||
<el-table ref="multipleTable" :data="tableData" border style="width: 100%; margin-bottom: 100px;" row-key="sid" |
|||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"> |
|||
<el-table-column prop="name" label="菜单名称" width="220" /> |
|||
<el-table-column label="操作" width="260" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="primary" size="mini" @click="add(scope.row)"> |
|||
添加子菜单 |
|||
</el-button> |
|||
<el-button v-if="scope.row.isSource == '0'" type="primary" size="mini" @click="editRow(scope.row)"> |
|||
修改 |
|||
</el-button> |
|||
<el-button v-if="scope.row.isSource == '0'" type="danger" size="mini" |
|||
@click.native.prevent="deleteRow(scope.row)"> |
|||
删除 |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
<!--<el-table-column prop="sourceName" label="资源名称" align="center"></el-table-column>--> |
|||
<!-- <el-table-column prop="sortNo" sortable label="排序" align="center" width="100"> |
|||
<template slot-scope="scope"> |
|||
<el-input v-model="scope.row.sortNo" size="mini"/> |
|||
</template> |
|||
</el-table-column>--> |
|||
<el-table-column prop="menuUrl" label="菜单路由" align="center" /> |
|||
<el-table-column prop="pageUrl" label="前端页面路径" align="center" /> |
|||
<el-table-column prop="pageName" label="前端页面名称" align="center" /> |
|||
<!-- <el-table-column prop="isEnable" label="可见性" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-switch |
|||
v-model="scope.row.isEnable" |
|||
active-color="#13ce66" |
|||
inactive-color="#ff4949" |
|||
active-value="1" |
|||
inactive-value="0" |
|||
@change="enabledChange(scope.row.isEnable,scope.row)" |
|||
/> |
|||
</template> |
|||
</el-table-column> --> |
|||
</el-table> |
|||
</div> |
|||
</div> |
|||
<!-- <pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/> --> |
|||
<!-- 编辑功能信息 --> |
|||
<el-dialog :title="dialogTitle + '菜单信息'" :visible.sync="editDialog" width="40%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>上级菜单</td> |
|||
<td> |
|||
<el-input v-model="form.pname" :disabled="true" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<!-- <tr> |
|||
<td>资源名称</td> |
|||
<td> |
|||
<el-select v-model="form.sourceSid" :disabled="isadd" @change="$forceUpdate()"> |
|||
<el-option |
|||
v-for="(item, i) in sourceNameData" |
|||
:key="i" |
|||
:label="item.sourceName" |
|||
:value="item.sid" |
|||
/> |
|||
</el-select> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>菜单名称</td> |
|||
<td> |
|||
<el-input v-model="form.name" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>菜单路由</td> |
|||
<td> |
|||
<el-input v-model="form.menuUrl" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>菜单图片路径</td> |
|||
<td> |
|||
<el-input v-model="form.iconUrl" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>前端页面名称</td> |
|||
<td> |
|||
<el-input v-model="form.pageName" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>前端页面路径</td> |
|||
<td> |
|||
<el-input v-model="form.pageUrl" /> |
|||
</td> |
|||
</tr> |
|||
<!-- <tr> |
|||
<td>是否可见</td> |
|||
<td> |
|||
<el-radio-group v-model="form.isShow"> |
|||
<el-radio :label="0">否</el-radio> |
|||
<el-radio :label="1">是</el-radio> |
|||
</el-radio-group> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>排序号</td> |
|||
<td> |
|||
<el-input v-model="form.sortNo"/> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>备注</td> |
|||
<td> |
|||
<el-input v-model="form.remarks" /> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<el-button @click="editDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
|
|||
</el-tab-pane> |
|||
<el-tab-pane label="新增菜单" name="addrole"> |
|||
<!-- 添加 --> |
|||
<!--<el-dialog :title="dialogTitle + '菜单管理'" :visible.sync="editDialog" width="40%">--> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>上级菜单</td> |
|||
<td> |
|||
<el-input v-model="form.pname" :disabled="true" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<!-- <tr> |
|||
<td>资源名称</td> |
|||
<td> |
|||
<el-select v-model="form.sourceSid" :disabled="isadd" @change="$forceUpdate()" style="width:300px"> |
|||
<el-option |
|||
v-for="(item, i) in sourceNameData" |
|||
:key="i" |
|||
:label="item.sourceName" |
|||
:value="item.sid" |
|||
/> |
|||
</el-select> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>菜单名称</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>菜单路由</td> |
|||
<td> |
|||
<el-input v-model="form.menuUrl" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>菜单图片路径</td> |
|||
<td> |
|||
<el-input v-model="form.iconUrl" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>前端页面名称</td> |
|||
<td> |
|||
<el-input v-model="form.pageName" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>前端页面路径</td> |
|||
<td> |
|||
<el-input v-model="form.pageUrl" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
<!-- <tr> |
|||
<td>是否可见</td> |
|||
<td> |
|||
<el-radio-group v-model="form.isShow"> |
|||
<el-radio :label="0">否</el-radio> |
|||
<el-radio :label="1">是</el-radio> |
|||
</el-radio-group> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>排序号</td> |
|||
<td> |
|||
<el-input v-model="form.sortNo" style="width:300px"/> |
|||
</td> |
|||
</tr> --> |
|||
<tr> |
|||
<td>备注</td> |
|||
<td> |
|||
<el-input v-model="form.remarks" style="width:300px" /> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保存</el-button> |
|||
</div> |
|||
|
|||
</el-tab-pane> |
|||
</el-tabs> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
pageList, |
|||
menusTreelist, |
|||
saveMenusInfo, |
|||
putMenusInfo, |
|||
delMenus, |
|||
IsEnable |
|||
} from '@/api/system/menu/index.js' |
|||
import { |
|||
sourceList |
|||
} from '@/api/system/functional/functional.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
activeName: 'roleList', |
|||
editDialog: false, |
|||
dialogTitle: '', |
|||
checked: '', |
|||
form: { |
|||
psid: '', |
|||
pname: '顶级菜单', |
|||
name: "", |
|||
iconUrl: '', |
|||
menuUrl: '', |
|||
pageName: '', |
|||
pageUrl: '', |
|||
remarks: '', |
|||
}, |
|||
formBackup: Object.assign({}, this.form), |
|||
tableData: [], |
|||
page: { |
|||
current: 1, |
|||
size: 10, |
|||
total: 0, |
|||
params: { |
|||
name: '', |
|||
psid: '', |
|||
sourceName: '', |
|||
sourceSid: '' |
|||
} |
|||
}, |
|||
rank: '1', |
|||
sourceNameData: [], // 资源 |
|||
isadd: false |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.getPageList() |
|||
this.getsourceList() |
|||
|
|||
// getsourceList().then(res => { |
|||
// this.sourceNameData = res.data |
|||
// }) |
|||
}, |
|||
methods: { |
|||
pagination(val) { // 分页 |
|||
this.page.current = val.pageNum |
|||
this.page.size = val.pageSize |
|||
this.getPageList() |
|||
}, |
|||
resetSearch() { // 重置 |
|||
this.page.params = this.pageBackup |
|||
}, |
|||
getPageList() { // 获取列表 |
|||
pageList(this.page).then((res) => { |
|||
console.log('这里是条件查询', this.page) |
|||
const treedata = res.data |
|||
console.log('菜单列表', res) |
|||
this.tableData = treedata |
|||
this.page.total = res.data.total |
|||
}) |
|||
}, |
|||
// 资源名称 |
|||
getsourceList() { |
|||
const params = {} |
|||
sourceList(params).then(res => { |
|||
this.sourceNameData = res.data |
|||
this.loading = false |
|||
}) |
|||
}, |
|||
handleClick(tab, event) { |
|||
if (tab.name == 'addrole') { |
|||
this.form = { |
|||
psid: '', |
|||
pname: '顶级菜单', |
|||
name: "", |
|||
iconUrl: '', |
|||
menuUrl: '', |
|||
pageName: '', |
|||
pageUrl: '', |
|||
remarks: '', |
|||
} |
|||
this.dialogTitle = '新增' |
|||
this.roleForm = Object.assign({}, this.formBackup) |
|||
|
|||
} else { |
|||
this.getPageList() |
|||
} |
|||
}, |
|||
add(row) { |
|||
this.activeName = 'addrole' |
|||
// if(row == 0){ |
|||
// this.isadd = false |
|||
// }else{ |
|||
// this.isadd = true |
|||
// } |
|||
// this.dialogTitle = '新增' |
|||
// this.editDialog = true |
|||
this.form = Object.assign({}, this.formBackup) |
|||
this.form.isShow = 1 |
|||
// this.form.psid = row.sid || 0 |
|||
this.form.pname = row.name || '顶级菜单' |
|||
this.form.sourceSid = row.sourceSid || '' |
|||
if (row.isSource == '1') { |
|||
this.form.psid = 0 |
|||
} else { |
|||
this.form.psid = row.sid |
|||
} |
|||
}, |
|||
editRow(row) { |
|||
this.dialogTitle = '编辑' |
|||
this.editDialog = true |
|||
this.form = Object.assign({}, row) |
|||
this.form.isShow = 1 |
|||
this.form.pname = row.psid == '0' ? '顶级菜单' : row.pname |
|||
}, |
|||
save() { |
|||
console.log('菜单列表', this.form) |
|||
|
|||
if (this.form.sid) { |
|||
putMenusInfo(this.form).then(res => { |
|||
this.editDialog = false |
|||
this.getPageList(this.page) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
} else { |
|||
// 新增 |
|||
saveMenusInfo(this.form).then(res => { |
|||
this.activeName = 'roleList' |
|||
this.getPageList() |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
} |
|||
this.form = { |
|||
psid: '', |
|||
pname: '顶级菜单', |
|||
name: "", |
|||
iconUrl: '', |
|||
menuUrl: '', |
|||
pageName: '', |
|||
pageUrl: '', |
|||
remarks: '', |
|||
} |
|||
}, |
|||
|
|||
deleteRow(row) { |
|||
this.$confirm('确定要删除该菜单吗, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
delMenus({ |
|||
sid: row.sid |
|||
}).then(res => { |
|||
this.getPageList(this.page) |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '删除成功!' |
|||
}) |
|||
}) |
|||
}) |
|||
}, |
|||
// 是否可用 按钮 |
|||
enabledChange(value, row) { |
|||
IsEnable({ |
|||
sid: row.sid, |
|||
isEnable: value |
|||
}).then(res => { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: res.msg |
|||
}) |
|||
}) |
|||
}, |
|||
//保存排序 |
|||
getSorting() { |
|||
|
|||
}, |
|||
retname(sid) { |
|||
obj = this.sourceNameData.find((item) => { |
|||
return item.sid == sid // 筛选出匹配数据 |
|||
}) |
|||
return obj.name |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.el-input__inner { |
|||
line-height: 32px; |
|||
height: 32px; |
|||
} |
|||
</style> |
|||
|
|||
<style scoped="scoped" lang="scss"> |
|||
.el-pagination.is-background .btn-next, |
|||
.el-pagination.is-background .btn-prev { |
|||
padding: 0 20px; |
|||
border: 1px solid #ccc; |
|||
border-radius: 2px; |
|||
background-color: #FFFFFF; |
|||
} |
|||
|
|||
.el-icon-arrow-left:before, |
|||
.el-icon-arrow-right:before { |
|||
content: '下一页'; |
|||
color: #727272; |
|||
} |
|||
|
|||
.el-icon-arrow-left:before { |
|||
content: '上一页'; |
|||
} |
|||
|
|||
.content { |
|||
width: 100%; |
|||
padding-top: 10px; |
|||
font-size: 16px; |
|||
color: #fff; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.shouye { |
|||
position: absolute; |
|||
top: -3px; |
|||
left: 100px; |
|||
font-size: 16px; |
|||
color: #0395d8; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.placename { |
|||
position: absolute; |
|||
top: -3px; |
|||
left: 210px; |
|||
font-size: 16px; |
|||
color: #fff; |
|||
font-weight: bold; |
|||
} |
|||
|
|||
.right_cont { |
|||
width: 100%; |
|||
height: 645px; |
|||
background-color: #fff; |
|||
margin: 0; |
|||
padding: 15px; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.cont_head { |
|||
height: 40px; |
|||
width: 97%; |
|||
margin-left: 1.5%; |
|||
background-color: #f7f9fc; |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.cont_head p { |
|||
float: left; |
|||
color: #000; |
|||
line-height: 40px; |
|||
margin-left: 50px; |
|||
} |
|||
|
|||
.cont_head input { |
|||
float: left; |
|||
height: 24px; |
|||
width: 147px; |
|||
margin-top: 6px; |
|||
border: 1px solid #e6e9f0; |
|||
border-radius: 5px; |
|||
-webkit-appearance: none; |
|||
outline: none; |
|||
} |
|||
|
|||
.cont_head select { |
|||
float: left; |
|||
height: 28px; |
|||
width: 147px; |
|||
margin-top: 6px; |
|||
border: 1px solid #e6e9f0; |
|||
border-radius: 5px; |
|||
outline: none; |
|||
} |
|||
|
|||
.chaxun { |
|||
height: 28px; |
|||
width: 85px; |
|||
line-height: 0px; |
|||
background-color: #018ad2; |
|||
margin-top: 6px; |
|||
text-align: center; |
|||
padding: 0; |
|||
float: right; |
|||
margin-right: 6px; |
|||
} |
|||
|
|||
.tishi { |
|||
width: 80%; |
|||
|
|||
margin: auto; |
|||
|
|||
tr { |
|||
height: 50px; |
|||
} |
|||
|
|||
td { |
|||
border: 1px solid #e6e9f0; |
|||
text-align: center; |
|||
} |
|||
|
|||
td:first-child { |
|||
background-color: #f7f9fc; |
|||
} |
|||
|
|||
input { |
|||
width: 80%; |
|||
height: 30px; |
|||
border: 1px solid #e6e9f0; |
|||
} |
|||
|
|||
textarea { |
|||
width: 80%; |
|||
height: 100px; |
|||
border: 1px solid #e6e9f0; |
|||
margin-top: 10px; |
|||
margin-bottom: 6px; |
|||
} |
|||
|
|||
select { |
|||
width: 80%; |
|||
height: 30px; |
|||
border: 1px solid #e6e9f0; |
|||
} |
|||
} |
|||
|
|||
.my-tabs { |
|||
margin-top: 10px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,694 @@ |
|||
<template> |
|||
<div class="container" style="display: flex;"> |
|||
<div class="org-tree"> |
|||
<el-tree :data="treedata" node-key="sid" :props="props" |
|||
:default-expanded-keys="['fd6435f2-0005-11ec-a033-48452053aa33']" @node-click="handleNodeClick"> |
|||
<span class="custom-tree-node" slot-scope="{ node, data }" @mouseenter="mouseenter(data)" |
|||
@mouseleave="mouseleave(data)" @click.stop.native> |
|||
<span>{{ node.label || $store.getters.userInfo.Orgname }}</span> |
|||
<span v-show="data.del" class="handle"> |
|||
<el-tooltip class="item" effect="dark" content="新增" placement="top-start"> |
|||
<el-button type="text" size="mini" @click.stop="() => append(data)" icon="el-icon-circle-plus-outline"> |
|||
</el-button> |
|||
</el-tooltip> |
|||
<el-tooltip v-show="data.sid" class="item" effect="dark" content="修改" placement="top-start"> |
|||
<el-button type="text" size="mini" @click.stop="() => deit(data)" icon="el-icon-edit"> |
|||
</el-button> |
|||
</el-tooltip> |
|||
<el-tooltip v-show="data.sid" class="item" effect="dark" content="删除" placement="top-start"> |
|||
<el-button type="text" size="mini" @click.stop="() => remove(data)" icon="el-icon-delete"> |
|||
</el-button> |
|||
</el-tooltip> |
|||
</span> |
|||
</span> |
|||
</el-tree> |
|||
</div> |
|||
<el-dialog title="编辑节点" :visible.sync="dialogVisible" width="50%" class="edit"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>组织名称</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织编码</td> |
|||
<td> |
|||
<el-input v-model="form.orgCode" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>主管人员</td> |
|||
<td> |
|||
<el-select v-model="form.zgStaffSid" style="width:300px" filterable> |
|||
<el-option v-for="item in staffdata" :key="item.sid" :label="item.name" :value="item.sid" /> |
|||
</el-select> |
|||
</td> |
|||
<td>分管人员</td> |
|||
<td> |
|||
<el-select v-model="fgStaffSid" style="width:300px" filterable multiple> |
|||
<el-option v-for="item in staffdata2" :key="item.sid" :label="item.name" :value="item.sid" /> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织简称</td> |
|||
<td :colspan="3"> |
|||
<el-input v-model="form.orgAbbre" style="width: 30%"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>管理层级</td> |
|||
<td> |
|||
<el-select v-model="form.orgLevelValue" style="width:300px" placeholder="请选择" filterable |
|||
@change="changeOrgLevel"> |
|||
<el-option v-for="item in orgLevel_list" :key="item.dictKey" :label="item.dictValue" |
|||
:value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
<td>其他编码</td> |
|||
<td> |
|||
<el-input v-model="form.otherCode" style="width:300px" placeholder="与财务中客户编码相同"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织地址</td> |
|||
<td> |
|||
<el-input v-model="form.addrs" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织属性</td> |
|||
<td> |
|||
<el-select v-model="form.orgAttributeValue" placeholder="请选择" filterable @change="changeOrgAttribute"> |
|||
<el-option v-for="item in orgAttribute_list" :key="item.dictKey" :label="item.dictValue" |
|||
:value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织联系人</td> |
|||
<td> |
|||
<el-input v-model="form.linkPerson" style="width:300px"></el-input> |
|||
</td> |
|||
|
|||
<td>联系电话</td> |
|||
<td> |
|||
<el-input v-model="form.linkPhone" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>是否独立法人</td> |
|||
<td> |
|||
<el-radio v-model="form.isDept" :label="0">是</el-radio> |
|||
<el-radio v-model="form.isDept" :label="1">否</el-radio> |
|||
</td> |
|||
<td>排序号</td> |
|||
<td> |
|||
<el-input v-model="form.sort" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div slot="footer" class="text-center"> |
|||
<el-button type="primary" @click="nodeSave()">保 存</el-button> |
|||
<el-button @click="dialogVisible = false">返 回</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<div class="org-table" v-show="isshow == 'table'"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="form" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="24"> |
|||
<el-form-item label="组织名称"> |
|||
<el-input v-model="page.params.name" clearable></el-input> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="onSearch()">查询</el-button> |
|||
<el-button @click="resetSearch()">重置</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- table --> |
|||
<el-table :data="tableData" default-expand-all border style="width: 100%;"> |
|||
<el-table-column label="操作" align="center" width="160px"> |
|||
<template slot-scope="scope"> |
|||
<el-button type="primary" size="mini" @click="editRow(scope.row)"> |
|||
编辑 |
|||
</el-button> |
|||
<el-button type="danger" size="mini" @click.native.prevent="remove(scope.row)"> |
|||
删除 |
|||
</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="name" label="组织名称" align="center"></el-table-column> |
|||
<el-table-column prop="orgCode" label="组织编码" align="center"></el-table-column> |
|||
<!-- <el-table-column prop="zgNames" label="主管" align="center"></el-table-column>--> |
|||
<el-table-column prop="fgNames" label="分管" align="center"></el-table-column> |
|||
<!--<el-table-column prop="contactMan" label="联系人" align="center" width="100px"></el-table-column>--> |
|||
<el-table-column prop="linkPhone" label="联系人手机号" width="110" align="center"> |
|||
</el-table-column> |
|||
<el-table-column prop="addrs" label="地址" align="center"> |
|||
</el-table-column> |
|||
<el-table-column prop="sort" label="排序" align="center" width="50px"> |
|||
</el-table-column> |
|||
<el-table-column prop="qrText" label="二维码" align="center" width="80px"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click.native.prevent="lookRow(scope.row)" type="text" size="small">查看</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination" /> |
|||
</div> |
|||
|
|||
<div class="org-table" v-show="isshow == 'ewm'"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="form" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="16"> |
|||
<h4 style="margin: 0;line-height: 32px;">组织二维码</h4> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item style="float: right;"> |
|||
<el-button type="primary" @click="Printewm">打 印</el-button> |
|||
<el-button @click="isshow = 'table'">返 回</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- center --> |
|||
<div class="ewm" style="display: flex;justify-content: center; align-items: center;" ref="print"> |
|||
<img style="width: 200px; height: 200px;" :src="ewmForm.qrFilePath" alt=""> |
|||
<ul style="list-style:none; line-height: 32px; font-size: 16px;"> |
|||
<li><label>组织名称: </label><span>{{ ewmForm.departmentName }}</span></li> |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
<!-- 新增、编辑页面 --> |
|||
<div class="org-table" v-show="isshow == 'edit'"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="form" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="16"> |
|||
<h4 style="margin: 0;line-height: 32px;"> {{ dialogTitle }}组织信息</h4> |
|||
</el-col> |
|||
<el-col :span="8"> |
|||
<el-form-item style="float: right;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<el-button @click="isshow = 'table'">返 回</el-button> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- center --> |
|||
<div class="ediut"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>组织名称</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织编码</td> |
|||
<td> |
|||
<el-input v-model="form.orgCode" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>主管人员</td> |
|||
<td> |
|||
<el-select v-model="form.zgStaffSid" style="width:300px" filterable> |
|||
<el-option v-for="item in staffdata" :key="item.sid" :label="item.name" :value="item.sid" /> |
|||
</el-select> |
|||
</td> |
|||
<td>分管人员</td> |
|||
<td> |
|||
<el-select v-model="fgStaffSid" style="width:300px" filterable multiple> |
|||
<el-option v-for="item in staffdata2" :key="item.sid" :label="item.name" :value="item.sid" /> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织简称</td> |
|||
<td :colspan="3"> |
|||
<el-input v-model="form.orgAbbre" style="width: 300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>管理层级</td> |
|||
<td> |
|||
<el-select v-model="form.orgLevelValue" style="width:300px" placeholder="请选择" filterable |
|||
@change="changeOrgLevel"> |
|||
<el-option v-for="item in orgLevel_list" :key="item.dictKey" :label="item.dictValue" |
|||
:value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
<td>其他编码</td> |
|||
<td> |
|||
<el-input v-model="form.otherCode" style="width:300px" placeholder="与财务中客户编码相同"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织地址</td> |
|||
<td> |
|||
<el-input v-model="form.addrs" style="width:300px"></el-input> |
|||
</td> |
|||
<td>组织属性</td> |
|||
<td> |
|||
<el-select v-model="form.orgAttributeValue" placeholder="请选择" filterable @change="changeOrgAttribute"> |
|||
<el-option v-for="item in orgAttribute_list" :key="item.dictKey" :label="item.dictValue" |
|||
:value="item.dictValue"></el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>组织联系人</td> |
|||
<td> |
|||
<el-input v-model="form.linkPerson" style="width:300px"></el-input> |
|||
</td> |
|||
<td>联系电话</td> |
|||
<td> |
|||
<el-input v-model="form.linkPhone" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>是否独立法人</td> |
|||
<td> |
|||
<el-radio v-model="form.isDept" :label="0">是</el-radio> |
|||
<el-radio v-model="form.isDept" :label="1">否</el-radio> |
|||
</td> |
|||
<td>排序号</td> |
|||
<td> |
|||
<el-input v-model="form.sort" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
</div> |
|||
</div> |
|||
<!-- <Position v-if="mapDialog" :address.sync="form.addrs" :maker-position.sync="form.jwd" |
|||
:dialog-visible.sync="mapDialog"/>--> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
addOrgTree, |
|||
delOrgtree, |
|||
getQrCode, |
|||
getStaff, |
|||
getStaffName, |
|||
orgList, |
|||
pageList, |
|||
postOrgtree, |
|||
putOrgtree, |
|||
selectBySid |
|||
} from '@/api/system/departments/departments.js' |
|||
import { |
|||
typeValues |
|||
} from '@/api/system/roleAdminister/index' |
|||
import Position from '@/components/amap/amap.vue' |
|||
|
|||
export default { |
|||
components: { |
|||
Position |
|||
}, |
|||
data() { |
|||
return { |
|||
dialogVisible: false, |
|||
mapDialog: false, |
|||
dialogTitle: '', |
|||
props: { |
|||
label: 'name', |
|||
children: 'children' |
|||
}, |
|||
nodeForm: { |
|||
sid: '', |
|||
name: '', |
|||
sortNo: '' |
|||
}, |
|||
ewmForm: { |
|||
qrFilePath: '', |
|||
organizationName: '', |
|||
departmentName: '', |
|||
address: '' |
|||
}, |
|||
orgAttribute_list: [], |
|||
orgLevel_list: [], |
|||
form: { |
|||
sid: '', |
|||
name: '', |
|||
orgCode: '', |
|||
/* jwd: '',*/ |
|||
addrs: '', |
|||
zgStaffSid: '', |
|||
zgStaffName: '', |
|||
fgStaffSid: '', |
|||
fgStaffName: '', |
|||
linkPerson: '', |
|||
linkPhone: '', |
|||
sort: '', |
|||
isDept: '', |
|||
orgAbbre: '', |
|||
orgAttributeValue: '', |
|||
orgAttributeKey: '', |
|||
orgLevelValue: '', |
|||
orgLevelKey: '', |
|||
otherCode: '' |
|||
}, |
|||
fgStaffSid: [], |
|||
formBackup: Object.assign({}, this.form), |
|||
isshow: 'table', |
|||
page: { |
|||
total: 0, // 默认数据总数 |
|||
current: 1, // 默认开始页面 |
|||
size: 10, // 每页的数据条数 |
|||
params: { |
|||
name: '', |
|||
organizationSid: '', |
|||
psid: '' |
|||
} |
|||
}, |
|||
tableData: [], |
|||
treedata: [], |
|||
staffdata: [], |
|||
staffdata2: [], |
|||
rules: {} |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.getOrgTree() |
|||
this.init() |
|||
}, |
|||
methods: { |
|||
init() { |
|||
typeValues({ |
|||
type: 'orgAttribute' |
|||
}).then((res) => { |
|||
if (res.success) { |
|||
this.orgAttribute_list = res.data |
|||
} |
|||
}) |
|||
typeValues({ |
|||
type: 'orgLevel' |
|||
}).then((res) => { |
|||
if (res.success) { |
|||
this.orgLevel_list = res.data |
|||
} |
|||
}) |
|||
}, |
|||
changeOrgLevel(value) { |
|||
let bb = null |
|||
this.orgLevel_list.forEach((e) => { |
|||
if (e.dictValue === value) { |
|||
bb = { |
|||
value: e.dictValue, |
|||
key: e.dictKey |
|||
} |
|||
} |
|||
}) |
|||
this.form.orgLevelValue = bb.value |
|||
this.form.orgLevelKey = bb.key |
|||
}, |
|||
changeOrgAttribute(value) { |
|||
let bb = null |
|||
this.orgAttribute_list.forEach((e) => { |
|||
if (e.dictValue === value) { |
|||
bb = { |
|||
key: e.dictKey, |
|||
value: e.dictValue |
|||
} |
|||
} |
|||
}) |
|||
this.form.orgAttributeKey = bb.key |
|||
}, |
|||
pagination(val) { // 分页 |
|||
this.page.current = val.pageNum |
|||
this.page.size = val.pageSize |
|||
this.getPageList(this.page) |
|||
}, |
|||
handleNodeClick(data) { |
|||
this.isshow = 'table' |
|||
this.page.params.organizationSid = window.sessionStorage.getItem('orgSid') |
|||
this.page.params.psid = data.sid || 0 |
|||
|
|||
this.getPageList(this.page) |
|||
}, |
|||
getPageList(data) { // 获取树形列表 |
|||
pageList(data).then(res => { |
|||
console.log('返回子级:', res) |
|||
this.tableData = res.data.records |
|||
this.page.total = res.data.total |
|||
}) |
|||
}, |
|||
getOrgTree() { // 获取树形列表 |
|||
orgList({}).then(res => { |
|||
console.log('getOrgTree>>>:', res.data) |
|||
this.treedata = res.data |
|||
}) |
|||
}, |
|||
save() { |
|||
if (this.fgStaffSid.length > 0) { |
|||
this.form.fgStaffSid = this.fgStaffSid.join() |
|||
} else { |
|||
this.form.fgStaffName = '' |
|||
this.form.fgStaffSid = '' |
|||
} |
|||
this.form.organizationSid = window.sessionStorage.getItem('orgSid') |
|||
// this.form.dlxx = typeof(this.form.dlxx) == 'string' ? this.form.dlxx : this.form.dlxx.join() |
|||
if (this.form.sid) { |
|||
// console.log(this.form) |
|||
putOrgtree(this.form).then(res => { |
|||
if (res.success) { |
|||
this.isshow = 'table' |
|||
this.getOrgTree() |
|||
this.handleNodeClick({ |
|||
sid: this.form.psid |
|||
}) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} else { |
|||
addOrgTree(this.form).then(res => { |
|||
if (res.success) { |
|||
this.isshow = 'table' |
|||
this.getOrgTree() |
|||
this.handleNodeClick({ |
|||
sid: this.form.psid |
|||
}) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} |
|||
}, |
|||
append(data) { |
|||
console.log(123456789, data) |
|||
this.dialogTitle = '新增' |
|||
this.isshow = 'edit' |
|||
this.fgStaffSid = [] |
|||
this.form = Object.assign({}, this.formBackup) |
|||
this.form.psid = data.sid || 0 |
|||
this.form.organizationSid = window.sessionStorage.getItem('orgSid') |
|||
this.form.address = data.orgAddress || data.address |
|||
this.form.dlxx = data.gisInfo || data.dlxx |
|||
this.getStaff(data.sid) |
|||
this.getStaff2(data.sid) |
|||
}, |
|||
editRow(row) { |
|||
this.getStaff(row.sid) |
|||
this.getStaff2(row.sid) |
|||
this.dialogTitle = '编辑' |
|||
this.isshow = 'edit' |
|||
this.fgStaffSid = [] |
|||
selectBySid(row.sid).then((response) => { |
|||
if (response.success) { |
|||
this.form = response.data |
|||
this.form.fgStaffName = response.data.fgNames |
|||
this.form.fgStaffSid = response.data.fgStaffSid |
|||
if (this.form.fgStaffSid) { |
|||
this.fgStaffSid = response.data.fgStaffSid.split(',') |
|||
} |
|||
this.form.zgStaffName = response.data.zgNames |
|||
this.form.zgStaffSid = response.data.zgStaffSid |
|||
console.log('编辑回显的数据', this.form) |
|||
} |
|||
}) |
|||
}, |
|||
deit(data) { // 节点编辑保存 |
|||
this.getStaff(data.sid) |
|||
this.getStaff2(data.sid) |
|||
console.log(data, 8888) |
|||
this.dialogVisible = true |
|||
this.form.sid = data.sid |
|||
// this.form.psid = null |
|||
this.form.name = data.name |
|||
this.form.orgCode = data.orgCode |
|||
/* this.form.jwd = data.jwd*/ |
|||
this.form.addrs = data.addrs |
|||
this.form.linkPerson = data.linkPerson |
|||
this.form.linkPhone = data.linkPhone |
|||
this.form.sort = data.sort |
|||
// this.form.zgStaffSid = data.zgSids |
|||
// this.form.fgStaffSid = data.fgSids.split(',') |
|||
}, |
|||
nodeSave() { // 节点编辑保存 |
|||
console.log('这是保存nodeSave(0') |
|||
// this.form.fgStaffSid = this.form.fgStaffSid.join() |
|||
postOrgtree(this.form).then(res => { |
|||
this.getOrgTree() |
|||
this.dialogVisible = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}, |
|||
remove(data) { |
|||
console.log('remove>>>', data) |
|||
|
|||
this.$confirm('确定要删除该组织吗, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
delOrgtree({ |
|||
sid: data.sid |
|||
}).then(res => { |
|||
this.getOrgTree() |
|||
this.handleNodeClick({ |
|||
sid: data.psid |
|||
}) |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
}) |
|||
}) |
|||
}, |
|||
lookRow(row) { // 查看二维码 |
|||
this.isshow = 'ewm' |
|||
getQrCode({ |
|||
sid: row.sid |
|||
}).then(res => { |
|||
this.ewmForm = res.data |
|||
}) |
|||
}, |
|||
Printewm() { |
|||
this.$print(this.$refs.print) // 使用 |
|||
}, |
|||
mouseenter(data) { |
|||
this.$set(data, 'del', true) |
|||
}, |
|||
mouseleave(data) { |
|||
this.$set(data, 'del', false) |
|||
}, |
|||
onSearch() { |
|||
this.getPageList(this.page) |
|||
}, |
|||
resetSearch() { |
|||
this.page.params.name = '' |
|||
this.getPageList(this.page) |
|||
}, |
|||
// 主管人员 |
|||
getStaff(orgSid) { |
|||
getStaff({ |
|||
deptSid: orgSid |
|||
}).then((res) => { |
|||
if (res.success) { |
|||
this.staffdata = res.data |
|||
} |
|||
}) |
|||
}, |
|||
// 分管人员 |
|||
getStaff2(orgSid) { |
|||
getStaffName({ |
|||
deptSid: orgSid |
|||
}).then(res => { |
|||
this.staffdata2 = res.data |
|||
console.log('分管人员', this.staffdata2) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.el-icon-arrow-right:before { |
|||
content: '\e6e0'; |
|||
color: #727272; |
|||
} |
|||
</style> |
|||
|
|||
<style scoped="scoped" lang="scss"> |
|||
.org-tree { |
|||
width: 240px; |
|||
min-height: 100%; |
|||
box-sizing: border-box; |
|||
/*padding-right: 10px;*/ |
|||
border: 1px solid #edf1f7; |
|||
overflow: scroll; |
|||
} |
|||
|
|||
.org-table { |
|||
flex: 1; |
|||
// padding-left: 10px; |
|||
margin: 0 10px; |
|||
border: 1px solid #edf1f7; |
|||
min-height: 100%; |
|||
overflow-y: scroll; |
|||
|
|||
.ewm { |
|||
margin: 30px auto 0; |
|||
width: 560px; |
|||
} |
|||
|
|||
.ediut { |
|||
margin: 30px auto 0; |
|||
/*width:750px;*/ |
|||
} |
|||
} |
|||
|
|||
.custom-tree-node { |
|||
position: relative; |
|||
overflow: hidden; |
|||
width: 100%; |
|||
flex: 1; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
font-size: 14px; |
|||
padding-right: 8px; |
|||
} |
|||
|
|||
.handle { |
|||
position: absolute; |
|||
right: 0; |
|||
|
|||
.el-button--text { |
|||
font-size: 15px; |
|||
background-color: #FFFFFF; |
|||
} |
|||
} |
|||
|
|||
.my-tabs { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.edit { |
|||
.el-form-item__label { |
|||
width: 100px !important; |
|||
display: inline-block !important; |
|||
} |
|||
|
|||
.el-input { |
|||
width: 70%; |
|||
} |
|||
} |
|||
|
|||
.td_left { |
|||
border-left: 0 solid #e6e9f0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,505 @@ |
|||
<template> |
|||
<el-tabs class="my-tabs" v-model="activeName" type="card" @tab-click="handleClick"> |
|||
<el-tab-pane label="岗位列表" name="roleList"> |
|||
|
|||
<div class="container"> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="search" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="24"> |
|||
<el-form-item label="岗位名称"> |
|||
<el-input v-model="search.name" clearable></el-input> |
|||
</el-form-item> |
|||
<!-- <el-form-item label="所属部门"> |
|||
<el-select v-model="search.orgSid" placeholder="请选择" clearable @clear="handleClear"> |
|||
<el-option hidden :key="search.orgSid" :label="orgName" :value="search.orgSid"></el-option> |
|||
<el-tree v-loading="loading" :data="treedata" ref="Tree" show-checkbox accordion node-key="sid" |
|||
:default-checked-keys="checkedId" |
|||
:default-expand-all='true' :check-strictly='true' :props="defaultProps" |
|||
@check-change="checkchange" |
|||
> |
|||
</el-tree> |
|||
</el-select> |
|||
</el-form-item> --> |
|||
<el-button @click="getList(1)">查询</el-button> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- table --> |
|||
<el-table :data="roleTable" border style="width: 100%;"> |
|||
<el-table-column label="序号" width="50px" type="index" align="center"> |
|||
</el-table-column> |
|||
<el-table-column label="操作" width="220px" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="editRow(scope.row)" type="primary" size="mini"> 修改</el-button> |
|||
<el-button @click="delRow(scope.row)" type="danger" size="mini"> 删除</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="name" label="岗位名称" align="center"></el-table-column> |
|||
<el-table-column prop="parentName" label="上级岗位名称" align="center"></el-table-column> |
|||
<el-table-column prop="postCode" label="岗位编码" align="center"></el-table-column> |
|||
<el-table-column prop="postLevel" label="职级" align="center"></el-table-column> |
|||
<!-- <el-table-column prop="orgName" label="所属部门" align="center"></el-table-column> --> |
|||
</el-table> |
|||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/> |
|||
|
|||
<!-- 编辑岗位信息 --> |
|||
<el-dialog :title="dialogTitle + '岗位信息'" :visible.sync="editDialog" width="40%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>上级岗位</td> |
|||
<td> <!-- @change="changeParentSid" --> |
|||
<el-select v-model="roleForm.parentSid" filterable clearable placeholder="请选择" |
|||
style="width:300px"> |
|||
<el-option v-for="item in parentSidList" :key="item.sid" :label="item.name" |
|||
:value="item.sid"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位职级</td> |
|||
<td> |
|||
<el-select v-model="roleForm.postLevel" @change="changeUPpostLevel" filterable placeholder="请选择" style="width:300px"> |
|||
<el-option v-for="item in postLevelList" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位编码</td> |
|||
<td> |
|||
<el-input v-model="roleForm.postCode" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<!--<tr> |
|||
<td>备注</td> |
|||
<td> |
|||
<el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" v-model="roleForm.remarks"></el-input> |
|||
</td> |
|||
</tr>--> |
|||
<!-- <tr> |
|||
<td>选择部门(单选)</td> |
|||
<td> |
|||
<el-tree |
|||
:data="treedata1" |
|||
show-checkbox |
|||
node-key="sid" |
|||
ref="Tree1" |
|||
:default-expand-all='true' |
|||
:check-strictly='true' |
|||
:default-checked-keys="checkedId1" |
|||
:props="defaultProps" |
|||
@check-change="checkchange1" |
|||
> |
|||
</el-tree> |
|||
</td> |
|||
</tr> --> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<el-button @click="editDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</el-tab-pane> |
|||
<!-- 新增岗位信息 --> |
|||
<el-tab-pane label="新增岗位" name="addrole"> |
|||
<el-card class="box-card"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>上级岗位</td> |
|||
<td> <!-- @change="changeParentSid" --> |
|||
<el-select v-model="roleForm.parentSid" filterable clearable placeholder="请选择" |
|||
style="width:300px"> |
|||
<el-option v-for="item in parentSidList" :key="item.sid" :label="item.name" |
|||
:value="item.sid"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位名称</td> |
|||
<td> |
|||
<el-input v-model="roleForm.name" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位职级</td> |
|||
<td> |
|||
<el-select v-model="roleForm.postLevel" @change="changePostLevel" filterable placeholder="请选择" |
|||
style="width:300px"> |
|||
<el-option v-for="item in postLevelList" :key="item.dictKey" :label="item.dictValue" |
|||
:value="item.dictKey"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位编码</td> |
|||
<td> |
|||
<el-input v-model="roleForm.postCode" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<!--<tr> |
|||
<td>备注</td> |
|||
<td> <el-input type="textarea" :autosize="{ minRows: 4, maxRows: 6}" v-model="roleForm.remarks"></el-input></td> |
|||
</tr>--> |
|||
<!-- <tr> |
|||
<td>选择部门(单选)</td> |
|||
<td> |
|||
<el-tree |
|||
:data="treedata2" |
|||
show-checkbox |
|||
node-key="sid" |
|||
ref="Tree2" |
|||
:default-expand-all='true' |
|||
:check-strictly='true' |
|||
:default-checked-keys="checkedId2" |
|||
:props="defaultProps" |
|||
@check-change="checkchange2" |
|||
> |
|||
</el-tree> |
|||
</td> |
|||
</tr> --> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
</div> |
|||
</el-card> |
|||
</el-tab-pane> |
|||
</el-tabs> |
|||
</template> |
|||
|
|||
<script> |
|||
import {delOrgroles, orgList, pageList, pullDown, putOrgroles, savePost,selectList} from '@/api/system/postManage/index.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
dialogTitle: '', |
|||
activeName: 'roleList', |
|||
roleForm: { |
|||
remarks: "", |
|||
roleName: "", |
|||
postCode: '', |
|||
orgSid: '', |
|||
postLevel: '', |
|||
postLevelKey: '', |
|||
parentSid:'' |
|||
}, |
|||
formBackup: {}, |
|||
search: { |
|||
name: '', |
|||
orgSid: '' |
|||
}, |
|||
orgName: '', |
|||
page: { |
|||
total: 0, // 默认数据总数 |
|||
current: 1, // 默认开始页面 |
|||
size: 10, // 每页的数据条数 |
|||
}, |
|||
roleTable: [], |
|||
editDialog: false, |
|||
// 树形 |
|||
loading: false, |
|||
defaultProps: { |
|||
children: 'children', |
|||
label: 'name' |
|||
}, |
|||
// orgdata:[], // 部门 |
|||
checkedId: [], |
|||
checkedId1: [], |
|||
checkedId2: [], |
|||
treedata: [], |
|||
treedata1: [], |
|||
treedata2: [], |
|||
postLevelList: [], |
|||
parentSidList: [], |
|||
// chace: [], |
|||
// roleDialog: false, |
|||
// Thisrow: {}, |
|||
// orgListAll:[] |
|||
}; |
|||
}, |
|||
mounted() { |
|||
this.formBackup = Object.assign({}, this.roleForm), |
|||
this.getList() |
|||
this.getOrgList() |
|||
this.postLevel() |
|||
this.getParent() |
|||
}, |
|||
methods: { |
|||
pagination(val) { // 分页函数 |
|||
this.page.current = val.pageNum |
|||
this.page.size = val.pageSize |
|||
this.getList() |
|||
}, |
|||
// 分页列表 |
|||
getList(flag) { |
|||
if (flag == '1') { |
|||
this.page.current = 1 |
|||
} |
|||
let params = this.page |
|||
params.params = this.search |
|||
pageList(params).then(res => { |
|||
this.page.total = res.data.total |
|||
this.roleTable = res.data.records |
|||
}) |
|||
}, |
|||
postLevel(){ |
|||
pullDown({ psid: 0, type: 'postLevel' }).then((res)=>{ |
|||
if(res.code==='200'){ |
|||
this.postLevelList=res.data |
|||
} |
|||
}) |
|||
}, |
|||
getParent(){ |
|||
selectList().then((res)=>{ |
|||
if(res.code==='200'){ |
|||
this.parentSidList=res.data |
|||
} |
|||
}) |
|||
}, |
|||
changePostLevel(value){ |
|||
let bb = null |
|||
this.postLevelList.forEach((e) => { |
|||
if (e.dictKey == value) { |
|||
bb = { |
|||
name: e.dictValue, |
|||
value: e.dictKey |
|||
} |
|||
} |
|||
}) |
|||
this.roleForm.postLevel=bb.name |
|||
this.roleForm.postLevelKey=bb.value |
|||
}, |
|||
changeUPpostLevel(value){ |
|||
let bb = null |
|||
this.postLevelList.forEach((e) => { |
|||
if (e.dictKey == value) { |
|||
bb = { |
|||
name: e.dictValue, |
|||
value: e.dictKey |
|||
} |
|||
} |
|||
}) |
|||
this.roleForm.postLevel=bb.name |
|||
this.roleForm.postLevelKey=bb.value |
|||
}, |
|||
handleClick(tab, event) { |
|||
if (tab.name == 'addrole') { |
|||
this.dialogTitle = '新增' |
|||
this.roleForm = Object.assign({}, this.formBackup) |
|||
} else { |
|||
this.getList() |
|||
} |
|||
}, |
|||
editRow(row) { |
|||
this.dialogTitle = '编辑' |
|||
this.editDialog = true |
|||
console.log(row) |
|||
this.roleForm = Object.assign({}, row) |
|||
this.checkedId1 = [this.roleForm.orgSid] |
|||
}, |
|||
delRow(row) { |
|||
this.$confirm('确定要删除该岗位吗, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
let params = { |
|||
sids: row.sid |
|||
} |
|||
delOrgroles(params).then(res => { |
|||
this.getList() |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '删除成功!' |
|||
}); |
|||
}) |
|||
}) |
|||
}, |
|||
// 保存角色 |
|||
save() { |
|||
if (this.roleForm.sid) { |
|||
// let orgSid = this.$refs.Tree1.getCheckedKeys() |
|||
// this.roleForm.orgSid = orgSid.toString() |
|||
putOrgroles(this.roleForm).then(res => { |
|||
if (res.code == '200') { |
|||
this.getList() |
|||
this.editDialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} else { |
|||
// let orgSid = this.$refs.Tree2.getCheckedKeys() |
|||
// this.roleForm.orgSid = orgSid.toString() |
|||
savePost(this.roleForm).then(res => { |
|||
if (res.code == '200') { |
|||
this.getList() |
|||
this.activeName = "roleList" |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
let arr = [] |
|||
// this.$refs.Tree2.setCheckedKeys(arr); |
|||
} |
|||
}) |
|||
} |
|||
this.reset() |
|||
}, |
|||
reset() { |
|||
this.roleForm = { |
|||
remarks: "", |
|||
roleName: "", |
|||
orgSid: '' |
|||
}; |
|||
this.search = { |
|||
name: '', |
|||
orgSid: '' |
|||
} |
|||
}, |
|||
|
|||
// 获取部门树形 |
|||
getOrgList(row) { |
|||
this.roleDialog = true |
|||
this.checkedId = [] |
|||
// this.roleForm.roleName = row.roleName |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
let params = { |
|||
// roleSid: row.sid, |
|||
// userType: '2' |
|||
} |
|||
|
|||
orgList(params).then(res => { |
|||
this.treedata = res.data |
|||
this.treedata1 = res.data |
|||
this.treedata2 = res.data |
|||
// this.getTreeParentNode(res.data, this.checkedId) |
|||
// this.getTreeParentid(res.data) |
|||
this.loading = false |
|||
}) |
|||
|
|||
}, |
|||
// // 递归查询所有上级数据 |
|||
// getTreeParentNode(menus, ids) { |
|||
// for (var i = 0; i < menus.length; i++) { |
|||
// if (menus[i].children && menus[i].children.length != 0) { |
|||
// this.getTreeParentNode(menus[i].children, ids) |
|||
// } else if (menus[i].isCheck) { |
|||
// ids.push(menus[i].sid) |
|||
// } |
|||
// } |
|||
// }, |
|||
// // 所有一级菜单ID |
|||
// getTreeParentid(menus) { |
|||
// for (var i = 0; i < menus.length; i++) { |
|||
// this.chace.push(menus[i].sid) |
|||
// } |
|||
// }, |
|||
// getCheckedKeys() { |
|||
// let _this = this |
|||
// let roleMenus = [] |
|||
// this.$refs.Tree.getCheckedKeys().forEach(val => { |
|||
// roleMenus.push({ |
|||
// menuSid: val, |
|||
// orgSid: _this.$store.getters.userInfo.orgSid, |
|||
// roleSid: _this.Thisrow.sid |
|||
// }) |
|||
// }) |
|||
// let parentTrue = this.$refs.Tree.getHalfCheckedKeys() |
|||
// for (let i = 0; i < parentTrue.length; i++) { |
|||
// for (let j = 0; j < this.chace.length; j++) { |
|||
// if (parentTrue[i] == this.chace[j]) { |
|||
// parentTrue.splice(i, 1); |
|||
// } |
|||
// } |
|||
// } |
|||
// parentTrue.forEach(val => { |
|||
// roleMenus.push({ |
|||
// menuSid: val, |
|||
// orgSid: _this.$store.getters.userInfo.orgSid, |
|||
// roleSid: _this.Thisrow.sid |
|||
// }) |
|||
// }) |
|||
// saveorgrolemenus({ |
|||
// roleSid: _this.Thisrow.sid, |
|||
// roleMenus: roleMenus |
|||
// }).then(res => { |
|||
// this.roleDialog = false |
|||
// this.$message({ |
|||
// message: res.msg, |
|||
// type: 'success' |
|||
// }) |
|||
// }) |
|||
// }, |
|||
checkchange(data, checked, indeterminate) { |
|||
if (checked) { |
|||
|
|||
this.search.orgSid = data.sid |
|||
this.orgName = data.name |
|||
|
|||
let arr = [] |
|||
arr = [data.sid]; |
|||
this.$refs.Tree.setCheckedKeys(arr); |
|||
return; |
|||
} |
|||
}, |
|||
checkchange1(data, checked, indeterminate) { |
|||
if (checked) { |
|||
this.roleForm.orgSid = data.sid |
|||
// this.orgName = data.name |
|||
let arr = [] |
|||
arr = [data.sid]; |
|||
this.$refs.Tree1.setCheckedKeys(arr); |
|||
return; |
|||
} |
|||
}, |
|||
checkchange2(data, checked, indeterminate) { |
|||
if (checked) { |
|||
this.roleForm.orgSid = data.sid |
|||
// this.orgName = data.name |
|||
let arr = [] |
|||
arr = [data.sid]; |
|||
this.$refs.Tree2.setCheckedKeys(arr); |
|||
return; |
|||
} |
|||
}, |
|||
handleClear() { |
|||
// 将选择器的值置空 |
|||
this.orgName = '' |
|||
this.search.orgSid = '' |
|||
let arr = [] |
|||
this.$refs.Tree.setCheckedKeys(arr); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.el-select > .el-input { |
|||
display: block; |
|||
width: 300px; |
|||
} |
|||
|
|||
/deep/ .tab-header .el-select { |
|||
width: 180px; |
|||
} |
|||
|
|||
.my-tabs { |
|||
margin-top: 10px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,65 @@ |
|||
<template> |
|||
<div> |
|||
<el-tabs class="my-tabs" v-model="activeName" type="card" @tab-click="handleClick"> |
|||
<el-tab-pane label="用户列表" name="roleList"> |
|||
<user-manage-list :dataObj='dataObj' @status='isShow' @item='listObj'></user-manage-list> |
|||
</el-tab-pane> |
|||
<!-- <el-tab-pane label="新增用户" name="addrole"> |
|||
<user-manage-add @status='isShow' :dataObj='childObj'></user-manage-add> |
|||
</el-tab-pane>--> |
|||
</el-tabs> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import userManageList from './userManageList.vue' |
|||
import userManageAdd from './userManageAdd.vue' |
|||
|
|||
export default { |
|||
components: { |
|||
userManageList: userManageList, |
|||
userManageAdd: userManageAdd, |
|||
}, |
|||
data() { |
|||
return { |
|||
activeName: 'roleList', |
|||
editDialog: false, |
|||
dataObj: { |
|||
isShow: '' |
|||
}, |
|||
childObj: {} |
|||
}; |
|||
}, |
|||
mounted() { |
|||
|
|||
}, |
|||
methods: { |
|||
handleClick(tab, event) { |
|||
if (tab.name == 'addrole') { |
|||
this.dialogTitle = '新增' |
|||
// this.roleForm = Object.assign({}, this.formBackup) |
|||
} else { |
|||
// this.getroleOrgList() |
|||
} |
|||
}, |
|||
isShow(val) { |
|||
if (!val) { |
|||
this.activeName = 'roleList' |
|||
this.dataObj.isShow = false |
|||
this.dataObj.isShow = true |
|||
} else { |
|||
this.activeName = 'addrole' |
|||
} |
|||
}, |
|||
listObj(val) { |
|||
this.childObj = val |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped="scoped"> |
|||
.my-tabs { |
|||
margin-top: 10px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,267 @@ |
|||
<template> |
|||
<div> |
|||
<el-card class="box-card"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>姓名</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>用户类型</td> |
|||
<td> |
|||
<el-select v-model="form.userType" @change="$forceUpdate()" style="width:300px"> |
|||
<el-option |
|||
v-for="(item, i) in userTypeData" |
|||
:key="i" |
|||
:label="item.name" |
|||
:value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>部门</td> |
|||
<td> |
|||
<el-select v-model="form.deptSid" placeholder="请选择" style="width:300px"> |
|||
<el-option hidden :key="form.deptSid" :label="orgName" :value="form.deptSid"></el-option> |
|||
<el-tree :data="treedata" ref="Tree" show-checkbox accordion node-key="sid" |
|||
:default-checked-keys="checkedId" |
|||
:default-expand-all='true' :check-strictly='true' :props="defaultProps" |
|||
@check-change="checkchange" |
|||
> |
|||
</el-tree> |
|||
</el-select> |
|||
<!--<el-select v-model="form.deptSid" @change="$forceUpdate()"> |
|||
<el-option |
|||
v-for="(item, i) in treedata" |
|||
:key="i" |
|||
:label="item.name" |
|||
:value="item.sid"> |
|||
</el-option> |
|||
</el-select>--> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位</td> |
|||
<td> |
|||
<el-select v-model="form.postSid" @change="$forceUpdate()" style="width:300px"> |
|||
<el-option |
|||
v-for="(item, i) in postSidData" |
|||
:key="i" |
|||
:label="item.name" |
|||
:value="item.sid"> |
|||
</el-option> |
|||
</el-select> |
|||
<!--<el-input v-model="form.postSid"></el-input>--> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>手机号码</td> |
|||
<td> |
|||
<el-input v-model="form.mobile" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>手机验证码</td> |
|||
<td> |
|||
<el-input v-model="form.verificationCode" placeholder="请输入验证码" style="width:300px"> |
|||
<el-button v-show="showCode" slot="append" @click.native="getIdentifying">获取验证码</el-button> |
|||
<el-button v-show="!showCode" slot="append">{{phoneCodeCount}} s</el-button> |
|||
</el-input> |
|||
<!--<el-input v-model="form.verificationCode"></el-input>--> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<!--<el-button type="warning" @click="cancel()">取 消</el-button>--> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import {userAdd, userUpdata, userSingle, orgList, postList, getCode} from '@/api/system/userManage/index.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
form: { |
|||
sid: '', |
|||
name: '', |
|||
userType: '', |
|||
deptSid: '', |
|||
postSid: '', |
|||
mobile: '', |
|||
verificationCode: '' |
|||
}, |
|||
form1: { |
|||
sid: '', |
|||
}, |
|||
userTypeData: [{ |
|||
value: '1', |
|||
name: '员工' |
|||
}, { |
|||
value: '2', |
|||
name: '客户' |
|||
}, { |
|||
value: '3', |
|||
name: '供应商' |
|||
}], |
|||
treedata: [], |
|||
checkedId: [], |
|||
orgName: '', |
|||
defaultProps: { |
|||
children: 'children', |
|||
label: 'name' |
|||
}, |
|||
postSidData: [], |
|||
showCode: true, |
|||
phoneCodeCount: '', |
|||
timer: null, |
|||
}; |
|||
}, |
|||
props: ['dataObj'], |
|||
watch: { |
|||
dataObj: { |
|||
handler(val) { |
|||
this.form1.sid = val.sid |
|||
this.getUserSingle() |
|||
this.getOrgList() |
|||
}, |
|||
deep: true, |
|||
}, |
|||
}, |
|||
mounted() { |
|||
this.getOrgList() |
|||
}, |
|||
methods: { |
|||
getUserSingle() { |
|||
userSingle(this.form1).then(res => { |
|||
if (res.code == '200') { |
|||
this.form.sid = res.data.sid |
|||
this.form.name = res.data.name |
|||
this.form.userType = res.data.userType |
|||
this.form.deptSid = res.data.deptSid |
|||
this.orgName = res.data.departmentName |
|||
this.form.postSid = res.data.postSid |
|||
this.form.mobile = res.data.mobile |
|||
} |
|||
}) |
|||
}, |
|||
// 获取部门树形 |
|||
getOrgList(row) { |
|||
// this.roleDialog = true |
|||
this.checkedId = [] |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
let params = {} |
|||
orgList(params).then(res => { |
|||
this.treedata = res.data |
|||
}) |
|||
|
|||
}, |
|||
checkchange(data, checked, indeterminate) { |
|||
if (checked) { |
|||
|
|||
this.form.deptSid = data.sid |
|||
this.orgName = data.name |
|||
let arr = [] |
|||
arr = [data.sid]; |
|||
this.$refs.Tree.setCheckedKeys(arr); |
|||
this.form.postSid = '' |
|||
this.getPost(data.sid) |
|||
return; |
|||
} |
|||
}, |
|||
getPost(orgSid) { |
|||
let params = { |
|||
sid: orgSid |
|||
} |
|||
postList(params).then(res => { |
|||
this.postSidData = res.data |
|||
}) |
|||
}, |
|||
save() { |
|||
if (this.form.sid) { |
|||
userUpdata(this.form).then(res => { |
|||
if (res.code == '200') { |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
this.$emit('status', false) |
|||
} |
|||
}) |
|||
} else { |
|||
let orgSid = this.$refs.Tree.getCheckedKeys() |
|||
this.form.deptSid = orgSid.toString() |
|||
userAdd(this.form).then(res => { |
|||
if (res.code == '200') { |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
this.$emit('status', false) |
|||
} |
|||
}) |
|||
let arr = [] |
|||
this.$refs.Tree.setCheckedKeys(arr); |
|||
} |
|||
this.reset() |
|||
}, |
|||
reset() { |
|||
this.form = { |
|||
sid: '', |
|||
name: '', |
|||
userType: '', |
|||
deptSid: '', |
|||
postSid: '', |
|||
mobile: '', |
|||
verificationCode: '' |
|||
} |
|||
}, |
|||
//获取验证码 |
|||
getIdentifying() { |
|||
if (this.form.mobile == "") { |
|||
this.$alert('请填写手机号码', '', { |
|||
confirmButtonText: '确定' |
|||
}) |
|||
return; |
|||
} |
|||
//验证码倒计时 |
|||
const TIME_COUNT = 60; |
|||
if (!this.timer) { |
|||
this.phoneCodeCount = TIME_COUNT; |
|||
this.showCode = false; |
|||
this.timer = setInterval(() => { |
|||
if (this.phoneCodeCount > 0 && this.phoneCodeCount <= TIME_COUNT) { |
|||
this.phoneCodeCount--; |
|||
} else { |
|||
this.showCode = true; |
|||
clearInterval(this.timer); |
|||
this.timer = null; |
|||
} |
|||
}, 1000) |
|||
} |
|||
|
|||
let obj = { |
|||
phone: this.form.mobile, |
|||
} |
|||
getCode(obj).then(res => { |
|||
if (res.code == '200') { |
|||
this.orginTranceNo = res.data.tranceNo; |
|||
} |
|||
}) |
|||
}, |
|||
cancel() { |
|||
this.$emit('status', false) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,483 @@ |
|||
<template> |
|||
<div> |
|||
<div class="tab-header"> |
|||
<el-form ref="form" :inline="true" :model="search" label-width="80px"> |
|||
<el-row :gutter="20"> |
|||
<el-col :span="24"> |
|||
<el-form-item label="用户名"> |
|||
<el-input v-model="search.userName" clearable></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="姓名"> |
|||
<el-input v-model="search.name" clearable></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="角色"> |
|||
<el-select v-model="search.roleSid" filterable clearable placeholder="请选择"> |
|||
<el-option v-for="item in roleListAll" :key="item.sid" :label="item.name" :value="item.sid"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="部门"> |
|||
<el-input v-model="search.orgName" clearable></el-input> |
|||
<!-- <el-select v-model="search.roleSid" clearable placeholder="请选择">--> |
|||
<!-- <el-option v-for="(item,i) in roleListAll" :key="i" :label="item.name" :value="item.sid"></el-option>--> |
|||
<!-- </el-select>--> |
|||
</el-form-item> |
|||
<el-button @click="getOrgUserList(1)">查询</el-button> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<!-- table --> |
|||
<el-table :data="userTable" border style="width: 100%;"> |
|||
<el-table-column label="序号" width="80px" type="index" align="center"> |
|||
</el-table-column> |
|||
<el-table-column label="操作" width="300px" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="setRole(scope.row)" type="primary" size="mini"> |
|||
设置角色 |
|||
</el-button> |
|||
<el-button @click="initPwd(scope.row)" type="danger" size="mini"> |
|||
初始化密码 |
|||
</el-button> |
|||
<!-- <el-button @click="del(scope.row)" type="danger" size="mini"> |
|||
删除 |
|||
</el-button>--> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="userName" label="用户名" align="center"> |
|||
<template slot-scope="scope"> |
|||
<!-- <span class="tablerow-click" @click="userinfoChange(scope.row)">-->{{ scope.row.userName }}<!--</span>--> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="roleName" label="用户类型" align="center"></el-table-column> |
|||
<el-table-column prop="name" label="姓名" width="120px" align="center"></el-table-column> |
|||
<el-table-column prop="departmentName" label="部门" align="center"></el-table-column> |
|||
<el-table-column prop="postName" label="岗位" align="center"></el-table-column> |
|||
<!-- <el-table-column prop="isEnable" label="是否可用" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-switch |
|||
v-model="scope.row.isEnable" |
|||
active-value='1' |
|||
inactive-value='0' |
|||
active-color="#13ce66" |
|||
inactive-color="#ff4949" |
|||
@change="enabledChange($event,scope.row)"> |
|||
</el-switch> |
|||
</template> |
|||
</el-table-column> --> |
|||
</el-table> |
|||
<pagination :total="page.total" :page.sync="page.current" :limit.sync="page.size" @pagination="pagination"/> |
|||
<!-- 角色设置 --> |
|||
<el-dialog title="设置角色" :visible.sync="roleDialog" width="30%"> |
|||
<el-form :model="roleForm" :rules="rules" ref="roleForm"> |
|||
<el-form-item label="角色名称" :label-width="formLabelWidth" prop="roleSid"> |
|||
<el-select v-model="roleForm.roleSid" placeholder="请选择" filterable multiple> |
|||
<el-option v-for="(item,i) in roleList" :key="i" :label="item.name" :value="item.sid"></el-option> |
|||
</el-select> |
|||
<!--<el-button type="primary" size='mini' @click="toNav('RoleAdminister')" style="margin-left: 10px;" circle icon="el-icon-plus"></el-button>--> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="primary" @click="saveRole('roleForm')">保 存</el-button> |
|||
<el-button @click="roleDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<!-- 部门设置 --> |
|||
<el-dialog title="部门设置" :visible.sync="bm_Dialog" width="30%"> |
|||
<el-form :model="bm_Form" :rules="rules" ref="bm_Form"> |
|||
<el-form-item label="部门名称" :label-width="formLabelWidth" prop="departmentSid"> |
|||
<!-- <el-select v-model="bm_Form.departmentSid" placeholder="请选择"> |
|||
<el-option v-for="item in bm_List" |
|||
:key="item.departmentSid" |
|||
:label="item.departmentName" |
|||
:value="item.departmentSid" |
|||
></el-option> |
|||
</el-select> --> |
|||
<el-cascader |
|||
v-model="bm_Form.departmentSid" |
|||
:options="treedata" |
|||
:props="props"></el-cascader> |
|||
<el-button type="primary" size='mini' @click="toNav('deptManage')" style="margin-left: 10px;" circle |
|||
icon="el-icon-plus"></el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="primary" @click="saveOrg('bm_Form')">保 存</el-button> |
|||
<el-button @click="bm_Dialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
<!-- 编辑信息 --> |
|||
<el-dialog title="编辑用户信息" :visible.sync="editDialog" width="40%"> |
|||
<table class="e-table" cellspacing="0"> |
|||
<tr> |
|||
<td>姓名</td> |
|||
<td> |
|||
<el-input v-model="form.name" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>用户类型</td> |
|||
<td> |
|||
<el-select v-model="form.userTypeKey" @change="$forceUpdate()" style="width:300px"> |
|||
<el-option v-for="(item, i) in userTypeData" :key="i" :label="item.name" :value="item.value"> |
|||
</el-option> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>部门</td> |
|||
<td> |
|||
<el-select v-model="form.deptSid" placeholder="请选择" @change="$forceUpdate()" style="width:300px"> |
|||
<el-option hidden :key="form.deptSid" :label="orgName" :value="form.deptSid"></el-option> |
|||
<el-tree :data="treedata" ref="Tree" show-checkbox accordion node-key="sid" :default-checked-keys="checkedId" :default-expand-all='true' :check-strictly='true' :props="defaultProps" @check-change="checkchange"> |
|||
</el-tree> |
|||
</el-select> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>岗位</td> |
|||
<td> |
|||
<el-select v-model="form.postSid" @change="$forceUpdate()" style="width:300px"> |
|||
<el-option v-for="(item, i) in postSidData" :key="i" :label="item.name" :value="item.sid"></el-option> |
|||
</el-select> |
|||
<!--<el-input v-model="form.postSid"></el-input>--> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>手机号码</td> |
|||
<td> |
|||
<el-input v-model="form.userName" style="width:300px"></el-input> |
|||
</td> |
|||
</tr> |
|||
<tr> |
|||
<td>手机验证码</td> |
|||
<td> |
|||
<el-input v-model="form.verificationCode" placeholder="请输入验证码" style="width:300px"> |
|||
<el-button v-show="showCode" slot="append" @click.native="getIdentifying">获取验证码</el-button> |
|||
<el-button v-show="!showCode" slot="append">{{ phoneCodeCount }} s</el-button> |
|||
</el-input> |
|||
</td> |
|||
</tr> |
|||
</table> |
|||
<div style="margin-top: 20px; text-align: center;"> |
|||
<el-button type="primary" @click="save()">保 存</el-button> |
|||
<el-button @click="editDialog = false">关 闭</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
userList, |
|||
delUser, |
|||
initPwd, |
|||
setRole, |
|||
orgList, |
|||
postList, |
|||
saveOrgRole, |
|||
roleList, |
|||
setRoleEnable, |
|||
userUpdata |
|||
} from '@/api/system/userManage/index.js' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
editDialog: false, |
|||
form: {}, |
|||
userTypeData: [{ |
|||
value: '1', |
|||
name: '员工' |
|||
}, { |
|||
value: '2', |
|||
name: '客户' |
|||
}, { |
|||
value: '3', |
|||
name: '供应商' |
|||
}], |
|||
checkedId: [], |
|||
orgName: '', |
|||
defaultProps: { |
|||
children: 'children', |
|||
label: 'name' |
|||
}, |
|||
showCode: true, |
|||
postSidData: [], |
|||
phoneCodeCount: '', |
|||
timer: null, |
|||
roleListAll: [], |
|||
search: { |
|||
name: '', |
|||
userName: '', |
|||
roleSid: '' |
|||
}, |
|||
props: { |
|||
value: 'sid', |
|||
label: 'name', |
|||
children: 'orgDepartmentVoList' |
|||
}, |
|||
treedata: null, |
|||
page: { |
|||
total: 0, // 默认数据总数 |
|||
current: 1, // 默认开始页面 |
|||
size: 10 // 每页的数据条数 |
|||
}, |
|||
userTable: [], |
|||
clientTable: [], |
|||
// 设置角色 |
|||
formLabelWidth: '100', |
|||
roleDialog: false, |
|||
roleList: [], |
|||
roleForm: { |
|||
roleSid: '', |
|||
userSid: '' |
|||
}, |
|||
// 部门 |
|||
bm_Dialog: false, |
|||
postSid: '', |
|||
bm_Form: { departmentSid: '' }, |
|||
bm_List: [], |
|||
rules: { |
|||
roleSid: [{ required: true, message: '请选择角色名称', trigger: 'blur' }], |
|||
departmentSid: [{ required: true, message: '请选择部门名称', trigger: 'blur' }] |
|||
} |
|||
} |
|||
}, |
|||
props: ['dataObj'], |
|||
watch: { |
|||
dataObj: { |
|||
handler(val) { |
|||
this.getOrgUserList() |
|||
}, |
|||
deep: true |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.getOrgUserList() |
|||
this.getRoleList() |
|||
this.getOrgTree() |
|||
this.getOrgList() |
|||
}, |
|||
methods: { |
|||
// 列表 + 初始化 |
|||
getOrgUserList(flag) { |
|||
if (flag === '1') { |
|||
this.page.current = 1 |
|||
} |
|||
let params = this.page |
|||
params.params = this.search |
|||
userList(params).then(res => { |
|||
this.page.total = res.data.total |
|||
this.userTable = res.data.records |
|||
}) |
|||
}, |
|||
getRoleList() { |
|||
var param = {} |
|||
roleList(param).then(res => { |
|||
if (res.code === '200') { |
|||
this.roleListAll = res.data |
|||
} |
|||
}) |
|||
}, |
|||
// 分页 |
|||
pagination(val) { |
|||
this.page.current = val.pageNum |
|||
this.page.size = val.pageSize |
|||
this.getOrgUserList() |
|||
}, |
|||
getOrgTree() { // 获取部门树形列表 |
|||
function treeArr(data) { |
|||
if (data.length > 0) { |
|||
for (var i = 0; i < data.length; i++) { |
|||
if (data[i].orgDepartmentVoList.length > 0) { |
|||
treeArr(data[i].orgDepartmentVoList) |
|||
} else { |
|||
delete data[i].orgDepartmentVoList |
|||
} |
|||
} |
|||
} |
|||
} |
|||
// getOrgTree({organizationSid: this.$store.getters.userInfo.orgSid}).then(res => { |
|||
// let tree = res.data[0].orgDepartmentVoList |
|||
// treeArr(tree) |
|||
// this.treedata = tree |
|||
// }) |
|||
}, |
|||
// 设置角色 设置 用户ID |
|||
setRole(row) { |
|||
this.roleForm.roleSid = [] |
|||
this.roleDialog = true |
|||
this.roleForm.sid = row.sid |
|||
this.roleForm.userSid = row.sid |
|||
setRole(this.roleForm).then(res => { |
|||
this.roleList = res.data |
|||
for (let i = 0; i < res.data.length; i++) { |
|||
if (res.data[i].checked === '0') { |
|||
this.roleForm.roleSid.push(res.data[i].sid) |
|||
} |
|||
} |
|||
// this.roleForm.roleSid = res.data.filter(item=> item.checked =='0') |
|||
}) |
|||
}, |
|||
// 设置角色 提交 |
|||
saveRole(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
this.roleForm.roleSid = this.roleForm.roleSid.toString() |
|||
saveOrgRole(this.roleForm).then(res => { |
|||
if (res.code === '200') { |
|||
this.roleDialog = false |
|||
this.getOrgUserList() |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} else { |
|||
return false |
|||
} |
|||
}) |
|||
}, |
|||
// 设置部门 提交 |
|||
saveOrg(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
let params = { // 请求的参数 |
|||
departmentSid: this.bm_Form.departmentSid[this.bm_Form.departmentSid.length - 1], |
|||
staffSid: this.bm_Form.staffSid |
|||
} |
|||
saveDepartment(params).then(res => { |
|||
if (res.code === '200') { |
|||
this.getOrgUserList() |
|||
this.bm_Dialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
} |
|||
}) |
|||
} else { |
|||
return false |
|||
} |
|||
}); |
|||
}, |
|||
// 设置部门 提交 |
|||
save(formName) { |
|||
this.form.userType = this.form.userTypeKey; |
|||
userUpdata(this.form).then(res => { |
|||
if (res.code === '200') { |
|||
this.getOrgUserList() |
|||
this.bm_Dialog = false |
|||
this.$message({ |
|||
message: res.msg, |
|||
type: 'success' |
|||
}) |
|||
this.editDialog = false |
|||
} |
|||
this.reset() |
|||
}) |
|||
}, |
|||
initPwd(row) { |
|||
this.$confirm('此操作将初始化该用户密码, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
initPwd({sid: row.sid}).then(res => { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: res.msg |
|||
}) |
|||
}) |
|||
}) |
|||
}, |
|||
// 修改用户信息 |
|||
userinfoChange(row) { |
|||
var postSid = row.postSid |
|||
this.editDialog = true |
|||
this.form = Object.assign({}, row) |
|||
this.postSid = postSid |
|||
this.$nextTick(() => { |
|||
this.$refs.Tree.setChecked(this.form.departmentSid, true, true) |
|||
}) |
|||
// this.$emit('status',true) |
|||
// this.$emit('item',row) |
|||
}, |
|||
// 删除 |
|||
del(row) { |
|||
this.$confirm('此操作将删除该用户, 是否继续?', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}).then(() => { |
|||
delUser({ sid: row.sid }).then(res => { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: res.msg |
|||
}); |
|||
this.getOrgUserList() |
|||
}) |
|||
}) |
|||
}, |
|||
toNav(src) { |
|||
this.$router.push('/' + src) |
|||
}, |
|||
// 获取部门树形 |
|||
getOrgList(row) { |
|||
// this.roleDialog = true |
|||
this.checkedId = [] |
|||
this.Thisrow = row |
|||
this.loading = true |
|||
let params = {} |
|||
orgList(params).then(res => { |
|||
this.treedata = res.data |
|||
}) |
|||
|
|||
}, |
|||
checkchange(data, checked, indeterminate) { |
|||
if (checked) { |
|||
this.form.deptSid = data.sid |
|||
this.orgName = data.name |
|||
let arr = [] |
|||
arr = [data.sid] |
|||
this.$refs.Tree.setCheckedKeys(arr) |
|||
this.form.postSid = '' |
|||
this.getPost(data.sid) |
|||
return |
|||
} |
|||
}, |
|||
getPost(orgSid) { |
|||
let params = { |
|||
sid: orgSid |
|||
} |
|||
postList(params).then(res => { |
|||
this.postSidData = res.data |
|||
}) |
|||
this.form.postSid = this.postSid |
|||
}, |
|||
reset() { |
|||
this.form = {} |
|||
}, |
|||
enabledChange(value, row) { |
|||
setRoleEnable({ |
|||
sid: row.sid, |
|||
isEnable: value |
|||
}).then(res => { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: res.msg |
|||
}); |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped="scoped"> |
|||
.el-select > .el-input { |
|||
display: block; |
|||
width: 300px; |
|||
} |
|||
</style> |
|||
|
|||
Loading…
Reference in new issue