master
commit
87f6b81e37
|
@ -9,9 +9,9 @@ var BASE = {
|
||||||
manager: "https://admin-api.pickmall.cn"
|
manager: "https://admin-api.pickmall.cn"
|
||||||
},
|
},
|
||||||
API_PROD: {
|
API_PROD: {
|
||||||
common: "https://common-api.pickmall.cn",
|
common: "http://192.168.2.110:8890",
|
||||||
buyer: "https://buyer-api.pickmall.cn",
|
buyer: "http://192.168.2.110:8888",
|
||||||
seller: "https://store-api.pickmall.cn",
|
seller: "http://192.168.2.110:8889",
|
||||||
manager: "https://admin-api.pickmall.cn"
|
manager: "http://192.168.2.110:8887"
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
16677
buyer/yarn.lock
16677
buyer/yarn.lock
File diff suppressed because it is too large
Load Diff
|
@ -12,7 +12,7 @@
|
||||||
/>
|
/>
|
||||||
</Form-item>
|
</Form-item>
|
||||||
<Form-item label="联系方式">
|
<Form-item label="联系方式">
|
||||||
<Input
|
<Inputuser-manage
|
||||||
type="text"
|
type="text"
|
||||||
v-model="searchForm.mobile"
|
v-model="searchForm.mobile"
|
||||||
placeholder="请输入联系方式"
|
placeholder="请输入联系方式"
|
||||||
|
|
|
@ -3,10 +3,21 @@ var BASE = {
|
||||||
* @description api请求基础路径
|
* @description api请求基础路径
|
||||||
*/
|
*/
|
||||||
API_DEV: {
|
API_DEV: {
|
||||||
|
<<<<<<< HEAD
|
||||||
common: "http://192.168.0.102:8890",
|
common: "http://192.168.0.102:8890",
|
||||||
buyer: "https://buyer-api.pickmall.cn",
|
buyer: "https://buyer-api.pickmall.cn",
|
||||||
seller: "http://192.168.0.102:8889",
|
seller: "http://192.168.0.102:8889",
|
||||||
manager: "https://admin-api.pickmall.cn"
|
manager: "https://admin-api.pickmall.cn"
|
||||||
|
=======
|
||||||
|
// common: "http://localhost:8890",
|
||||||
|
// buyer: "http://localhost:8888",
|
||||||
|
// seller: "http://localhost:8889",
|
||||||
|
// manager: "http://localhost:8887"
|
||||||
|
common:"http://192.168.0.113:8890",
|
||||||
|
buyer:"http://192.168.0.113:8888",
|
||||||
|
manager:"http://192.168.0.113:8887",
|
||||||
|
seller:"http://192.168.0.113:8889"
|
||||||
|
>>>>>>> 32336decc6e9e0ae8a0e67033f8ca66a89bbd372
|
||||||
},
|
},
|
||||||
API_PROD: {
|
API_PROD: {
|
||||||
common: "https://common-api.pickmall.cn",
|
common: "https://common-api.pickmall.cn",
|
||||||
|
|
|
@ -6,6 +6,9 @@ import {
|
||||||
deleteRequest,
|
deleteRequest,
|
||||||
getRequestWithNoToken,
|
getRequestWithNoToken,
|
||||||
postRequestWithNoTokenData,
|
postRequestWithNoTokenData,
|
||||||
|
putRequestWithNoForm,
|
||||||
|
postRequestWithNoToken,
|
||||||
|
postRequestWithNoForm,
|
||||||
commonUrl,
|
commonUrl,
|
||||||
} from "@/libs/axios";
|
} from "@/libs/axios";
|
||||||
|
|
||||||
|
@ -14,13 +17,16 @@ export const getAllCity = (params) => {
|
||||||
return getRequest(commonUrl+'/common/common/region/allCity', params)
|
return getRequest(commonUrl+'/common/common/region/allCity', params)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取全部权限数据
|
||||||
|
export const getCurrentPermissionList = (params) => {
|
||||||
|
return getRequest("/menu/memberMenu", params);
|
||||||
|
};
|
||||||
|
|
||||||
// 登陆
|
// 登陆
|
||||||
export const getHomeNotice = params => {
|
export const getHomeNotice = params => {
|
||||||
return getRequest("/other/article/getByPage?type=STORE_ARTICLE&pageSize=15");
|
return getRequest("/other/article/getByPage?type=STORE_ARTICLE&pageSize=15");
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 登陆
|
// 登陆
|
||||||
export const getSellerHomeData = params => {
|
export const getSellerHomeData = params => {
|
||||||
return getRequest("/statistics/index", params);
|
return getRequest("/statistics/index", params);
|
||||||
|
@ -128,7 +134,7 @@ export const getRelatedListData = params => {
|
||||||
|
|
||||||
// 获取用户数据 多条件
|
// 获取用户数据 多条件
|
||||||
export const getUserListData = params => {
|
export const getUserListData = params => {
|
||||||
return getRequest("/user/getByCondition", params);
|
return getRequest("/clerk", params);
|
||||||
};
|
};
|
||||||
// 通过用户名搜索
|
// 通过用户名搜索
|
||||||
export const searchUserByName = (username, params) => {
|
export const searchUserByName = (username, params) => {
|
||||||
|
@ -141,7 +147,7 @@ export const getAllUserData = params => {
|
||||||
|
|
||||||
// 添加用户
|
// 添加用户
|
||||||
export const addUser = params => {
|
export const addUser = params => {
|
||||||
return postRequest("/user/admin/add", params);
|
return postRequest("/clerk", params);
|
||||||
};
|
};
|
||||||
// 编辑用户
|
// 编辑用户
|
||||||
export const editUser = params => {
|
export const editUser = params => {
|
||||||
|
@ -268,4 +274,100 @@ export const handleRefreshToken = (token) => {
|
||||||
return getRequestWithNoToken(`/login/refresh/${token}`);
|
return getRequestWithNoToken(`/login/refresh/${token}`);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 获取一级部门
|
||||||
|
export const initDepartment = (params) => {
|
||||||
|
return getRequest("/department", params);
|
||||||
|
};
|
||||||
|
// 添加部门
|
||||||
|
export const addDepartment = (params) => {
|
||||||
|
return postRequest("/department", params);
|
||||||
|
};
|
||||||
|
// 删除部门
|
||||||
|
export const deleteDepartment = (ids, params) => {
|
||||||
|
return deleteRequest(`/department/${ids}`, params);
|
||||||
|
};
|
||||||
|
// 编辑部门
|
||||||
|
export const editDepartment = (ids, params) => {
|
||||||
|
return putRequest(`/department/${ids} `, params);
|
||||||
|
};
|
||||||
|
// 加载部门子级数据
|
||||||
|
export const loadDepartment = (id) => {
|
||||||
|
return getRequest(`/department/${id}`);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 通过部门获取全部角色数据
|
||||||
|
export const getUserByDepartmentId = (id, params) => {
|
||||||
|
return getRequest(`/departmentRole/${id}`, params);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 分页获取角色数据
|
||||||
|
export const getRoleList = (params) => {
|
||||||
|
return getRequest("/role", params);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 通过部门修改绑定角色
|
||||||
|
export const updateDepartmentRole = (id, params) => {
|
||||||
|
return putRequestWithNoForm(`/departmentRole/${id}`, params);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 获取全部权限数据
|
||||||
|
export const getAllPermissionList = (params) => {
|
||||||
|
return getRequest("/menu/tree", params);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 添加角色
|
||||||
|
export const addRole = (params) => {
|
||||||
|
return postRequest("/role", params);
|
||||||
|
};
|
||||||
|
// 删除角色
|
||||||
|
export const deleteRole = (ids, params) => {
|
||||||
|
return deleteRequest(`/role/${ids}`, params);
|
||||||
|
};
|
||||||
|
// 编辑角色
|
||||||
|
export const editRole = (params) => {
|
||||||
|
return putRequest(`/role/${params.roleId}`, params);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 分配角色权限
|
||||||
|
export const editRolePerm = (params) => {
|
||||||
|
return postRequest("/role/editRolePerm", params);
|
||||||
|
};
|
||||||
|
// 查看某角色拥有的菜单
|
||||||
|
export const selectRoleMenu = (params) => {
|
||||||
|
return getRequest(`/roleMenu/${params}`);
|
||||||
|
};
|
||||||
|
// 保存角色菜单
|
||||||
|
export const saveRoleMenu = (id, params) => {
|
||||||
|
return postRequestWithNoForm(`/roleMenu/${id}`, params);
|
||||||
|
};
|
||||||
|
// 获取全部角色数据
|
||||||
|
export const getAllRoleList = (params) => {
|
||||||
|
return getRequest("/role", params);
|
||||||
|
};
|
||||||
|
export const checkClerk = (mobile) => {
|
||||||
|
return postRequest(`/clerk/${mobile}/check`);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 重置用户密码
|
||||||
|
export const resetPassword = (params) => {
|
||||||
|
return postRequest(`/clerk/resetPassword/${params}`);
|
||||||
|
};
|
||||||
|
// 删除用户
|
||||||
|
export const deleteClerk = (ids) => {
|
||||||
|
return deleteRequest(`/clerk/delByIds/${ids}`);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 禁 启用用户
|
||||||
|
export const enableClerk = (id, params) => {
|
||||||
|
return putRequest(`/clerk/enable/${id}`, params);
|
||||||
|
};
|
||||||
|
// 获取店员详细
|
||||||
|
export const getClerk = (id) => {
|
||||||
|
return getRequest(`/clerk/${id}`);
|
||||||
|
};
|
||||||
|
|
||||||
|
export const editOtherUser = (id, params) => {
|
||||||
|
return putRequest(`/clerk/${id}`,params);
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -26,11 +26,11 @@ export const result = [{
|
||||||
children: null,
|
children: null,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "goods",
|
name: "goods1",
|
||||||
level: 2,
|
level: 2,
|
||||||
type: 0,
|
type: 0,
|
||||||
title: "商品列表",
|
title: "商品列表",
|
||||||
path: "goods",
|
path: "goods12",
|
||||||
component: "goods/goods-seller/goods",
|
component: "goods/goods-seller/goods",
|
||||||
children: null,
|
children: null,
|
||||||
},
|
},
|
||||||
|
@ -388,6 +388,42 @@ export const result = [{
|
||||||
component: "sys/user-manage/userManage",
|
component: "sys/user-manage/userManage",
|
||||||
children: []
|
children: []
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: "clerk",
|
||||||
|
level: 1,
|
||||||
|
type: 0,
|
||||||
|
title: "店员设置",
|
||||||
|
path: "",
|
||||||
|
component: "Main",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: "clerkManage",
|
||||||
|
level: 2,
|
||||||
|
type: 0,
|
||||||
|
title: "店员管理",
|
||||||
|
path: "clerkManage",
|
||||||
|
component: "shop/system/clerk/clerkManage",
|
||||||
|
children: null
|
||||||
|
},{
|
||||||
|
name: "storeDepartmentManage",
|
||||||
|
level: 2,
|
||||||
|
type: 0,
|
||||||
|
title: "部门管理",
|
||||||
|
path: "storeDepartmentManage",
|
||||||
|
component: "shop/system/department/storeDepartmentManage",
|
||||||
|
children: null
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "storeRole",
|
||||||
|
level: 2,
|
||||||
|
type: 0,
|
||||||
|
title: "角色权限",
|
||||||
|
path: "storeRole",
|
||||||
|
component: "shop/system/role/storeRoleManage",
|
||||||
|
children: null
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
{
|
{
|
||||||
name: "ship",
|
name: "ship",
|
||||||
level: 1,
|
level: 1,
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import lazyLoading from './lazyLoading.js';
|
import lazyLoading from './lazyLoading.js';
|
||||||
import Cookies from "js-cookie";
|
import Cookies from "js-cookie";
|
||||||
import { result } from './routerJson.js';
|
import { result } from './routerJson.js';
|
||||||
|
import { getCurrentPermissionList } from "@/api/index";
|
||||||
|
|
||||||
const config = require('@/config/index')
|
const config = require('@/config/index')
|
||||||
|
|
||||||
|
@ -326,21 +327,27 @@ util.initRouter = function (vm) { // 初始化路由
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!vm.$store.state.app.added) {
|
|
||||||
// 加载菜单
|
// 加载菜单
|
||||||
let menuData = result;
|
|
||||||
|
getCurrentPermissionList().then(res => {
|
||||||
|
if (!res.success) return false;
|
||||||
|
let menuData = res.result;
|
||||||
// 格式化数据,设置 空children 为 null
|
// 格式化数据,设置 空children 为 null
|
||||||
for(let i =0;i<menuData.length;i++){
|
for (let i = 0; i < menuData.length; i++) {
|
||||||
let t = menuData[i].children
|
let t = menuData[i].children
|
||||||
for(let k = 0;k<t.length;k++){
|
for (let k = 0; k < t.length; k++) {
|
||||||
let tt = t[k].children;
|
let tt = t[k].children;
|
||||||
for(let z = 0;z<tt.length;z++){
|
for (let z = 0; z < tt.length; z++) {
|
||||||
tt[z].children = null
|
tt[z].children = null
|
||||||
// 给所有三级路由添加字段,显示一级菜单name,方便点击页签时的选中筛选
|
// 给所有三级路由添加字段,显示一级菜单name,方便点击页签时的选中筛选
|
||||||
tt[z].firstRouterName = menuData[i].name
|
tt[z].firstRouterName = menuData[i].name
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
if (!menuData) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
util.initAllMenuData(constRoutes, menuData);
|
util.initAllMenuData(constRoutes, menuData);
|
||||||
util.initRouterNode(otherRoutes, otherRouter);
|
util.initRouterNode(otherRoutes, otherRouter);
|
||||||
// 添加所有主界面路由
|
// 添加所有主界面路由
|
||||||
|
@ -352,17 +359,8 @@ util.initRouter = function (vm) { // 初始化路由
|
||||||
// 缓存数据 修改加载标识
|
// 缓存数据 修改加载标识
|
||||||
window.localStorage.setItem('menuData', JSON.stringify(menuData));
|
window.localStorage.setItem('menuData', JSON.stringify(menuData));
|
||||||
vm.$store.commit('setAdded', true);
|
vm.$store.commit('setAdded', true);
|
||||||
} else {
|
})
|
||||||
// 读取缓存数据
|
|
||||||
let data = window.localStorage.getItem('menuData');
|
|
||||||
if (!data) {
|
|
||||||
vm.$store.commit('setAdded', false);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let menuData = JSON.parse(data);
|
|
||||||
// 添加菜单路由
|
|
||||||
util.initMenuData(vm, menuData);
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// 添加所有顶部导航栏下的菜单路由
|
// 添加所有顶部导航栏下的菜单路由
|
||||||
|
@ -370,7 +368,7 @@ util.initAllMenuData = function (constRoutes, data) {
|
||||||
|
|
||||||
let allMenuData = [];
|
let allMenuData = [];
|
||||||
data.forEach(e => {
|
data.forEach(e => {
|
||||||
if (e.type == -1) {
|
if (e.level == 0) {
|
||||||
e.children.forEach(item => {
|
e.children.forEach(item => {
|
||||||
allMenuData.push(item);
|
allMenuData.push(item);
|
||||||
})
|
})
|
||||||
|
@ -439,16 +437,15 @@ util.initRouterNode = function (routers, data) { // data为所有子菜单数
|
||||||
|
|
||||||
for (var item of data) {
|
for (var item of data) {
|
||||||
let menu = Object.assign({}, item);
|
let menu = Object.assign({}, item);
|
||||||
menu.component = lazyLoading(menu.component);
|
menu.component = lazyLoading(menu.frontRoute);
|
||||||
|
|
||||||
if (item.children && item.children.length > 0) {
|
if (item.children && item.children.length > 0) {
|
||||||
menu.children = [];
|
menu.children = [];
|
||||||
util.initRouterNode(menu.children, item.children);
|
util.initRouterNode(menu.children, item.children);
|
||||||
}
|
}
|
||||||
let meta = {};
|
let meta = {};
|
||||||
// 给页面添加标题
|
// 给页面添加标题
|
||||||
meta.title = menu.title ? menu.title + " - "+config.title+"商家后台" : null;
|
meta.title = menu.title ? menu.title + " - " + config.title + "商家后台" : null;
|
||||||
meta.firstRouterName = menu.firstRouterName
|
meta.firstRouterName = item.firstRouterName
|
||||||
meta.keepAlive = menu.keepAlive ? true : false
|
meta.keepAlive = menu.keepAlive ? true : false
|
||||||
menu.meta = meta;
|
menu.meta = meta;
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="search">
|
<div class="search">
|
||||||
<Card>
|
<Card>
|
||||||
|
|
||||||
<Row @keydown.enter.native="handleSearch">
|
<Row @keydown.enter.native="handleSearch">
|
||||||
<Form
|
<Form
|
||||||
ref="searchForm"
|
ref="searchForm"
|
||||||
|
|
|
@ -3,37 +3,65 @@
|
||||||
<Row type="flex" @keydown.enter.native="submitLogin">
|
<Row type="flex" @keydown.enter.native="submitLogin">
|
||||||
<Col style="width: 368px">
|
<Col style="width: 368px">
|
||||||
<Header />
|
<Header />
|
||||||
<Row style="flex-direction: column;">
|
<Row style="flex-direction: column">
|
||||||
<Form ref="usernameLoginForm" :model="form" :rules="rules" class="form">
|
<Form
|
||||||
|
ref="usernameLoginForm"
|
||||||
|
:model="form"
|
||||||
|
:rules="rules"
|
||||||
|
class="form"
|
||||||
|
>
|
||||||
<FormItem prop="username">
|
<FormItem prop="username">
|
||||||
<Input v-model="form.username" prefix="ios-contact" size="large" clearable placeholder="请输入用户名"
|
<Input
|
||||||
autocomplete="off" />
|
v-model="form.username"
|
||||||
|
prefix="ios-contact"
|
||||||
|
size="large"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入用户名"
|
||||||
|
autocomplete="off"
|
||||||
|
/>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem prop="password">
|
<FormItem prop="password">
|
||||||
<Input type="password" v-model="form.password" prefix="ios-lock" size="large" password placeholder="请输入密码"
|
<Input
|
||||||
autocomplete="off" />
|
type="password"
|
||||||
|
v-model="form.password"
|
||||||
|
prefix="ios-lock"
|
||||||
|
size="large"
|
||||||
|
password
|
||||||
|
placeholder="请输入密码"
|
||||||
|
autocomplete="off"
|
||||||
|
/>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
</Form>
|
</Form>
|
||||||
|
|
||||||
<Row>
|
<Row>
|
||||||
<div class="login-btn" type="primary" size="large" :loading="loading" @click="submitLogin" long>
|
<div
|
||||||
|
class="login-btn"
|
||||||
|
type="primary"
|
||||||
|
size="large"
|
||||||
|
:loading="loading"
|
||||||
|
@click="submitLogin"
|
||||||
|
long
|
||||||
|
>
|
||||||
<span v-if="!loading">登录</span>
|
<span v-if="!loading">登录</span>
|
||||||
<span v-else>登录中</span>
|
<span v-else>登录中</span>
|
||||||
</div>
|
</div>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
</Row>
|
</Row>
|
||||||
<Footer />
|
<Footer />
|
||||||
<!-- 拼图验证码 -->
|
<!-- 拼图验证码 -->
|
||||||
<verify ref="verify" class="verify-con" verifyType="LOGIN" @change="verifyChange"></verify>
|
<verify
|
||||||
|
ref="verify"
|
||||||
|
class="verify-con"
|
||||||
|
verifyType="LOGIN"
|
||||||
|
@change="verifyChange"
|
||||||
|
></verify>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { getCurrentPermissionList } from "@/api/index";
|
||||||
import { login, userMsg } from "@/api/index";
|
import { login, userMsg } from "@/api/index";
|
||||||
import { validateMobile } from "@/libs/validate";
|
import { validateMobile } from "@/libs/validate";
|
||||||
import Cookies from "js-cookie";
|
import Cookies from "js-cookie";
|
||||||
|
@ -95,6 +123,10 @@ export default {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
created() {
|
||||||
|
window.localStorage.setItem("menuData", "");
|
||||||
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
afterLogin(res) {
|
afterLogin(res) {
|
||||||
let accessToken = res.result.accessToken;
|
let accessToken = res.result.accessToken;
|
||||||
|
@ -104,6 +136,10 @@ export default {
|
||||||
// 获取用户信息
|
// 获取用户信息
|
||||||
userMsg().then((res) => {
|
userMsg().then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
|
// location.reload();
|
||||||
|
// this.$router.go(0);
|
||||||
|
|
||||||
|
console.log("Huoqu ");
|
||||||
this.setStore("saveLogin", this.saveLogin);
|
this.setStore("saveLogin", this.saveLogin);
|
||||||
if (this.saveLogin) {
|
if (this.saveLogin) {
|
||||||
// 保存7天
|
// 保存7天
|
||||||
|
@ -113,9 +149,10 @@ export default {
|
||||||
} else {
|
} else {
|
||||||
Cookies.set("userInfoSeller", JSON.stringify(res.result));
|
Cookies.set("userInfoSeller", JSON.stringify(res.result));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
util.initRouter(this);
|
||||||
this.$store.commit("setAvatarPath", res.result.storeLogo);
|
this.$store.commit("setAvatarPath", res.result.storeLogo);
|
||||||
// 加载菜单
|
// 加载菜单
|
||||||
util.initRouter(this);
|
|
||||||
this.$router.push({
|
this.$router.push({
|
||||||
name: "home_index",
|
name: "home_index",
|
||||||
});
|
});
|
||||||
|
@ -139,8 +176,8 @@ export default {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
|
|
||||||
let fd = new FormData();
|
let fd = new FormData();
|
||||||
fd.append('username',this.form.username)
|
fd.append("username", this.form.username);
|
||||||
fd.append('password',this.md5(this.form.password))
|
fd.append("password", this.md5(this.form.password));
|
||||||
login(fd)
|
login(fd)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
|
@ -157,7 +194,6 @@ export default {
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
.login {
|
.login {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
background: url("../assets/background.png") no-repeat;
|
background: url("../assets/background.png") no-repeat;
|
||||||
|
@ -168,7 +204,6 @@ export default {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
|
|
||||||
.verify-con {
|
.verify-con {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 126px;
|
top: 126px;
|
||||||
|
@ -194,9 +229,8 @@ export default {
|
||||||
transition: 0.35s;
|
transition: 0.35s;
|
||||||
}
|
}
|
||||||
.login-btn:hover {
|
.login-btn:hover {
|
||||||
opacity: .9;
|
opacity: 0.9;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -0,0 +1,72 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<Cascader
|
||||||
|
v-model="selectDep"
|
||||||
|
:data="department"
|
||||||
|
@on-change="handleChangeDep"
|
||||||
|
change-on-select
|
||||||
|
filterable
|
||||||
|
clearable
|
||||||
|
placeholder="请选择"
|
||||||
|
></Cascader>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { initDepartment } from "@/api/index";
|
||||||
|
export default {
|
||||||
|
name: "departmentChoose",
|
||||||
|
props: {
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
selectDep: [], // 已选数据
|
||||||
|
department: [] // 列表
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取部门数据
|
||||||
|
initDepartmentData() {
|
||||||
|
initDepartment().then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
const arr = res.result;
|
||||||
|
this.filterData(arr)
|
||||||
|
this.department = arr
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleChangeDep(value, selectedData) {
|
||||||
|
let departmentId = "";
|
||||||
|
// 获取最后一个值
|
||||||
|
if (value && value.length > 0) {
|
||||||
|
departmentId = value[value.length - 1];
|
||||||
|
}
|
||||||
|
this.$emit("on-change", departmentId);
|
||||||
|
},
|
||||||
|
// 清空已选列表
|
||||||
|
clearSelect() {
|
||||||
|
this.selectDep = [];
|
||||||
|
},
|
||||||
|
// 处理部门数据
|
||||||
|
filterData (data) {
|
||||||
|
data.forEach(e => {
|
||||||
|
e.value = e.id;
|
||||||
|
e.label = e.title;
|
||||||
|
if (e.children) {
|
||||||
|
this.filterData(e.children)
|
||||||
|
} else {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.initDepartmentData();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
</style>
|
||||||
|
|
|
@ -0,0 +1,159 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div style="display:flex;">
|
||||||
|
<Input
|
||||||
|
v-model="departmentTitle"
|
||||||
|
readonly
|
||||||
|
style="margin-right:10px;"
|
||||||
|
:placeholder="placeholder"
|
||||||
|
:clearable="clearable"
|
||||||
|
@on-clear="clearSelect"
|
||||||
|
/>
|
||||||
|
<Poptip transfer trigger="click" placement="right" title="选择部门" width="250">
|
||||||
|
<Button icon="md-list">选择部门</Button>
|
||||||
|
<div slot="content">
|
||||||
|
<Input
|
||||||
|
v-model="searchKey"
|
||||||
|
suffix="ios-search"
|
||||||
|
@on-change="searchDep"
|
||||||
|
placeholder="输入部门名搜索"
|
||||||
|
clearable
|
||||||
|
/>
|
||||||
|
<div class="dep-tree-bar">
|
||||||
|
<Tree
|
||||||
|
:data="dataDep"
|
||||||
|
@on-select-change="selectTree"
|
||||||
|
></Tree>
|
||||||
|
<Spin size="large" fix v-if="depLoading"></Spin>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Poptip>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {initDepartment, searchDepartment} from "@/api/index";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "departmentTreeChoose",
|
||||||
|
props: {
|
||||||
|
multiple: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
clearable: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
placeholder: {
|
||||||
|
type: String,
|
||||||
|
default: "点击选择部门"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
depLoading: false, // 加载状态
|
||||||
|
departmentTitle: "", // modal标题
|
||||||
|
searchKey: "", // 搜索关键词
|
||||||
|
dataDep: [], // 部门列表
|
||||||
|
selectDep: [], // 已选部门
|
||||||
|
departmentId: [] // 部门id
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取部门数据
|
||||||
|
initDepartmentData() {
|
||||||
|
initDepartment().then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.dataDep = res.result;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
searchDep() {
|
||||||
|
// 搜索部门
|
||||||
|
if (this.searchKey) {
|
||||||
|
this.depLoading = true;
|
||||||
|
searchDepartment({title: this.searchKey}).then(res => {
|
||||||
|
this.depLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
res.result.forEach(function (e) {
|
||||||
|
if (e.status == -1) {
|
||||||
|
e.title = "[已禁用] " + e.title;
|
||||||
|
e.disabled = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.dataDep = res.result;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.initDepartmentData();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 选择回调
|
||||||
|
selectTree(v) {
|
||||||
|
if (v.length === 0) {
|
||||||
|
this.$emit("on-change", null);
|
||||||
|
this.departmentId = "";
|
||||||
|
this.departmentTitle = "";
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.departmentId = v[0].id;
|
||||||
|
this.departmentTitle = v[0].title;
|
||||||
|
let department = {
|
||||||
|
departmentId: this.departmentId,
|
||||||
|
departmentTitle: this.departmentTitle
|
||||||
|
}
|
||||||
|
this.$emit("on-change", department);
|
||||||
|
},
|
||||||
|
// 清除选中方法
|
||||||
|
clearSelect() {
|
||||||
|
this.departmentId = [];
|
||||||
|
this.departmentTitle = "";
|
||||||
|
this.initDepartmentData();
|
||||||
|
if (this.multiple) {
|
||||||
|
this.$emit("on-change", []);
|
||||||
|
} else {
|
||||||
|
this.$emit("on-change", "");
|
||||||
|
}
|
||||||
|
this.$emit("on-clear");
|
||||||
|
},
|
||||||
|
// 设置数据 回显用
|
||||||
|
setData(ids, title) {
|
||||||
|
this.departmentTitle = title;
|
||||||
|
if (this.multiple) {
|
||||||
|
this.departmentId = ids;
|
||||||
|
} else {
|
||||||
|
this.departmentId = [];
|
||||||
|
this.departmentId.push(ids);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.initDepartmentData();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.dep-tree-bar {
|
||||||
|
position: relative;
|
||||||
|
min-height: 80px;
|
||||||
|
max-height: 500px;
|
||||||
|
overflow: auto;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dep-tree-bar::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
height: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dep-tree-bar::-webkit-scrollbar-thumb {
|
||||||
|
border-radius: 4px;
|
||||||
|
-webkit-box-shadow: inset 0 0 2px #d1d1d1;
|
||||||
|
background: #e4e4e4;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
|
@ -263,7 +263,6 @@
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.data = res.result.records;
|
this.data = res.result.records;
|
||||||
|
|
||||||
this.total = res.result.total;
|
this.total = res.result.total;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -0,0 +1,782 @@
|
||||||
|
<template>
|
||||||
|
<div class="search">
|
||||||
|
<Card>
|
||||||
|
<Form ref="searchForm" :model="searchForm" inline :label-width="70" class="search-form">
|
||||||
|
<Form-item label="店员名称">
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
v-model="searchForm.clerkName"
|
||||||
|
placeholder="请输入店员名称"
|
||||||
|
clearable
|
||||||
|
style="width: 200px"
|
||||||
|
/>
|
||||||
|
</Form-item>
|
||||||
|
<Form-item label="联系方式">
|
||||||
|
<Input
|
||||||
|
type="text"
|
||||||
|
v-model="searchForm.mobile"
|
||||||
|
placeholder="请输入联系方式"
|
||||||
|
clearable
|
||||||
|
style="width: 200px"
|
||||||
|
/>
|
||||||
|
</Form-item>
|
||||||
|
<Form-item label="部门">
|
||||||
|
<department-choose @on-change="handleSelectDep" style="width: 150px;" ref="dep"></department-choose>
|
||||||
|
</Form-item>
|
||||||
|
<Button @click="handleSearch" type="primary" icon="ios-search" class="search-btn">搜索</Button>
|
||||||
|
</Form>
|
||||||
|
<Row class="operation padding-row">
|
||||||
|
<Button @click="add" type="primary">添加</Button>
|
||||||
|
<Button @click="delAll">批量删除</Button>
|
||||||
|
<Button @click="resetPass">重置密码</Button>
|
||||||
|
</Row>
|
||||||
|
<br>
|
||||||
|
<Table
|
||||||
|
:loading="loading"
|
||||||
|
border
|
||||||
|
:columns="columns"
|
||||||
|
:data="data"
|
||||||
|
sortable="custom"
|
||||||
|
@on-sort-change="changeSort"
|
||||||
|
@on-selection-change="showSelect"
|
||||||
|
ref="table"
|
||||||
|
></Table>
|
||||||
|
<Row type="flex" justify="end" class="mt_10">
|
||||||
|
<Page
|
||||||
|
:current="searchForm.pageNumber"
|
||||||
|
:total="total"
|
||||||
|
:page-size="searchForm.pageSize"
|
||||||
|
@on-change="changePage"
|
||||||
|
@on-page-size-change="changePageSize"
|
||||||
|
:page-size-opts="[10,20,50]"
|
||||||
|
size="small"
|
||||||
|
show-total
|
||||||
|
show-elevator
|
||||||
|
show-sizer
|
||||||
|
></Page>
|
||||||
|
</Row>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Modal
|
||||||
|
:title="modalTitle"
|
||||||
|
v-model="userEditModalVisible"
|
||||||
|
:mask-closable="false"
|
||||||
|
:width="500"
|
||||||
|
:styles="{top: '30px'}"
|
||||||
|
>
|
||||||
|
<Form ref="form" :model="editForm" :label-width="80" :rules="formValidate">
|
||||||
|
<FormItem label="手机号">
|
||||||
|
<Input v-model="mobile" disabled/>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="店员名称">
|
||||||
|
<Input v-model="clerkName" disabled/>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="超级管理员" prop="isSuper">
|
||||||
|
<RadioGroup type="button" button-style="solid" v-model="editForm.isSuper">
|
||||||
|
<Radio :label="1">
|
||||||
|
<span>是</span>
|
||||||
|
</Radio>
|
||||||
|
<Radio :label="0">
|
||||||
|
<span>否</span>
|
||||||
|
</Radio>
|
||||||
|
</RadioGroup>
|
||||||
|
</FormItem>
|
||||||
|
|
||||||
|
<FormItem label="角色" prop="roles" v-if="editForm.isSuper == 0">
|
||||||
|
<Select v-model="editForm.roles" multiple>
|
||||||
|
<Option v-for="item in roleList" :value="item.id" :key="item.id" :label="item.name">
|
||||||
|
|
||||||
|
</Option>
|
||||||
|
</Select>
|
||||||
|
</FormItem>
|
||||||
|
<Form-item label="所属部门">
|
||||||
|
<department-tree-choose @on-change="handleEditSelectDepTree" ref="depTree"></department-tree-choose>
|
||||||
|
</Form-item>
|
||||||
|
|
||||||
|
</Form>
|
||||||
|
<div slot="footer">
|
||||||
|
<Button type="text" @click="userEditModalVisible = false">取消</Button>
|
||||||
|
<Button type="primary" :loading="submitLoading" @click="updateSubmit">提交</Button>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
|
||||||
|
<Modal
|
||||||
|
:title="modalTitle"
|
||||||
|
v-model="userModalVisible"
|
||||||
|
:mask-closable="false"
|
||||||
|
:width="500"
|
||||||
|
:styles="{top: '30px'}"
|
||||||
|
>
|
||||||
|
<Form ref="form" :model="form" :label-width="80" :rules="formValidate">
|
||||||
|
<FormItem label="手机号" prop="mobile">
|
||||||
|
<Input placeholder="请输入要添加的会员手机号码" maxlength="11" style="width: 75%" v-model="form.mobile"
|
||||||
|
autocomplete="off" @on-change="checkClerks"/>
|
||||||
|
<Button v-if="!memberCheck" @click="checkClerk">校验</Button>
|
||||||
|
<Button v-if="memberCheck" @click="checkAgainClerk">重新校验</Button>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem v-if="newMember" label="用户名" prop="username">
|
||||||
|
<Input v-model="form.username" autocomplete="off"/>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem v-if="oldMember" label="用户名" prop="username">
|
||||||
|
<Input v-model="form.username" autocomplete="off" disabled/>
|
||||||
|
</FormItem>
|
||||||
|
|
||||||
|
<FormItem label="密码" prop="password" v-if="newMember" :error="errorPass">
|
||||||
|
<Input type="password" password v-model="form.password" autocomplete="off"/>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="超级管理员" prop="isSuper" v-if="newMember || oldMember">
|
||||||
|
<RadioGroup type="button" button-style="solid" v-model="form.isSuper">
|
||||||
|
<Radio :label="1">
|
||||||
|
<span>是</span>
|
||||||
|
</Radio>
|
||||||
|
<Radio :label="0">
|
||||||
|
<span>否</span>
|
||||||
|
</Radio>
|
||||||
|
</RadioGroup>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="角色" prop="roles" v-if="(oldMember || newMember) && form.isSuper == 0">
|
||||||
|
<Select v-model="form.roles" multiple>
|
||||||
|
<Option v-for="item in roleList" :value="item.id" :key="item.id" :label="item.name">
|
||||||
|
|
||||||
|
</Option>
|
||||||
|
</Select>
|
||||||
|
</FormItem>
|
||||||
|
<Form-item label="所属部门" v-if="oldMember || newMember">
|
||||||
|
<department-tree-choose @on-change="handleSelectDepTree" ref="depTree"></department-tree-choose>
|
||||||
|
</Form-item>
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
<div slot="footer">
|
||||||
|
<Button type="text" @click="userModalVisible = false">取消</Button>
|
||||||
|
<Button type="primary" :loading="submitLoading" @click="submitUser">提交</Button>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
checkClerk,
|
||||||
|
getUserListData,
|
||||||
|
getAllRoleList,
|
||||||
|
addUser,
|
||||||
|
editOtherUser,
|
||||||
|
enableClerk,
|
||||||
|
deleteClerk,
|
||||||
|
resetPassword,
|
||||||
|
getClerk
|
||||||
|
} from "@/api/index";
|
||||||
|
import {validateMobile} from "@/libs/validate";
|
||||||
|
import departmentChoose from "@/views/my-components/lili/department-choose";
|
||||||
|
import departmentTreeChoose from "@/views/my-components/lili/department-tree-choose";
|
||||||
|
import uploadPicInput from "@/views/my-components/lili/upload-pic-input";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "clerk-manage",
|
||||||
|
components: {
|
||||||
|
departmentChoose,
|
||||||
|
departmentTreeChoose,
|
||||||
|
uploadPicInput,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
open:0,
|
||||||
|
loading: true, // 加载状态
|
||||||
|
selectCount: 0, // 已选数量
|
||||||
|
selectList: [], // 已选数据列表
|
||||||
|
searchForm: { // 请求参数
|
||||||
|
clerkName: "",
|
||||||
|
departmentId: "",
|
||||||
|
pageNumber: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
sort: "createTime",
|
||||||
|
order: "desc"
|
||||||
|
},
|
||||||
|
modalType: 0, // 新增编辑标识
|
||||||
|
userModalVisible: false, // 用户modal显隐
|
||||||
|
userEditModalVisible:false,
|
||||||
|
modalTitle: "", // modal标题
|
||||||
|
form: { // 表单
|
||||||
|
username: "",
|
||||||
|
mobile: 0,
|
||||||
|
sex: "",
|
||||||
|
isSuper: 0,
|
||||||
|
roles: [],
|
||||||
|
departmentId: "",
|
||||||
|
departmentTitle: ""
|
||||||
|
},
|
||||||
|
|
||||||
|
editForm: { // 表单
|
||||||
|
isSuper: 0,
|
||||||
|
roles: [],
|
||||||
|
departmentId: "",
|
||||||
|
departmentTitle: ""
|
||||||
|
},
|
||||||
|
mobile: "",
|
||||||
|
clerkName: "",
|
||||||
|
|
||||||
|
newMember: false,
|
||||||
|
oldMember: false,
|
||||||
|
memberCheck: false,
|
||||||
|
roleList: [], // 角色列表
|
||||||
|
errorPass: "", // 错误提示
|
||||||
|
formValidate: { // 验证规则
|
||||||
|
username: [
|
||||||
|
{required: true, message: "用户名不能为空", trigger: "blur"}
|
||||||
|
],
|
||||||
|
password: [
|
||||||
|
{required: true, message: "密码不能为空", trigger: "blur"}
|
||||||
|
],
|
||||||
|
mobile: [
|
||||||
|
{required: true, message: "手机号不能为空", trigger: "blur"},
|
||||||
|
{validator: validateMobile, trigger: "blur"}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
submitLoading: false, // 提交状态
|
||||||
|
columns: [ // 表头
|
||||||
|
{
|
||||||
|
type: "selection",
|
||||||
|
width: 60,
|
||||||
|
align: "center",
|
||||||
|
fixed: "left"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "店员名称",
|
||||||
|
key: "clerkName",
|
||||||
|
minWidth: 100,
|
||||||
|
sortable: true,
|
||||||
|
fixed: "left"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "手机号码",
|
||||||
|
key: "mobile",
|
||||||
|
minWidth: 100,
|
||||||
|
fixed: "left"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "店主",
|
||||||
|
key: "status",
|
||||||
|
align: "center",
|
||||||
|
width: 130,
|
||||||
|
render: (h, params) => {
|
||||||
|
if (params.row.shopkeeper == true) {
|
||||||
|
return h("div", [
|
||||||
|
h("Badge", {
|
||||||
|
props: {
|
||||||
|
status: "success",
|
||||||
|
text: "是"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
} else if (params.row.shopkeeper == false) {
|
||||||
|
return h("div", [
|
||||||
|
h("Badge", {
|
||||||
|
props: {
|
||||||
|
status: "error",
|
||||||
|
text: "否"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "超级管理员",
|
||||||
|
key: "status",
|
||||||
|
align: "center",
|
||||||
|
width: 130,
|
||||||
|
render: (h, params) => {
|
||||||
|
if (params.row.isSuper == true) {
|
||||||
|
return h("div", [
|
||||||
|
h("Badge", {
|
||||||
|
props: {
|
||||||
|
status: "success",
|
||||||
|
text: "是"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
} else if (params.row.isSuper == false) {
|
||||||
|
return h("div", [
|
||||||
|
h("Badge", {
|
||||||
|
props: {
|
||||||
|
status: "error",
|
||||||
|
text: "否"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "状态",
|
||||||
|
key: "status",
|
||||||
|
align: "center",
|
||||||
|
width: 130,
|
||||||
|
render: (h, params) => {
|
||||||
|
if (params.row.status == true) {
|
||||||
|
return h("div", [
|
||||||
|
h("Badge", {
|
||||||
|
props: {
|
||||||
|
status: "success",
|
||||||
|
text: "启用"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
} else if (params.row.status == false) {
|
||||||
|
return h("div", [
|
||||||
|
h("Badge", {
|
||||||
|
props: {
|
||||||
|
status: "error",
|
||||||
|
text: "禁用"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
filters: [
|
||||||
|
{
|
||||||
|
label: "启用",
|
||||||
|
value: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "禁用",
|
||||||
|
value: false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
filterMultiple: false,
|
||||||
|
filterMethod(value, row) {
|
||||||
|
return row.status == value;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "创建时间",
|
||||||
|
key: "createTime",
|
||||||
|
sortable: true,
|
||||||
|
sortType: "desc",
|
||||||
|
width: 180
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
key: "action",
|
||||||
|
width: 200,
|
||||||
|
align: "center",
|
||||||
|
fixed: "right",
|
||||||
|
render: (h, params) => {
|
||||||
|
let enableOrDisable = "";
|
||||||
|
if (params.row.status == true) {
|
||||||
|
enableOrDisable = h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
size: "small"
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
marginRight: "5px"
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.disable(params.row);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"禁用"
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
enableOrDisable = h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: "success",
|
||||||
|
size: "small"
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
marginRight: "5px"
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.enable(params.row);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"启用"
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return h("div", [
|
||||||
|
h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: "info",
|
||||||
|
size: "small"
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
marginRight: "5px"
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.edit(params.row);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"编辑"
|
||||||
|
),
|
||||||
|
enableOrDisable,
|
||||||
|
h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: "error",
|
||||||
|
size: "small"
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.remove(params.row);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"删除"
|
||||||
|
)
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
data: [], // 用户数据
|
||||||
|
total: 0, // 总数
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 初始化数据
|
||||||
|
init() {
|
||||||
|
this.getUserList();
|
||||||
|
},
|
||||||
|
checkClerks() {
|
||||||
|
this.open = this.form.mobile.length;
|
||||||
|
console.log(this.open)
|
||||||
|
if(this.open == 11 ){
|
||||||
|
this.checkClerk();
|
||||||
|
}
|
||||||
|
if(this.open < 11){
|
||||||
|
this.checkAgainClerk()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 选择部门回调
|
||||||
|
handleSelectDepTree(v) {
|
||||||
|
if (v) {
|
||||||
|
this.form.departmentId = v.departmentId;
|
||||||
|
this.form.departmentTitle = v.departmentTitle;
|
||||||
|
} else {
|
||||||
|
this.form.departmentId = "";
|
||||||
|
this.form.departmentTitle = "";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 选择部门回调
|
||||||
|
handleEditSelectDepTree(v) {
|
||||||
|
if (v) {
|
||||||
|
this.editForm.departmentId = v.departmentId;
|
||||||
|
this.editForm.departmentTitle = v.departmentTitle;
|
||||||
|
} else {
|
||||||
|
this.editForm.departmentId = "";
|
||||||
|
this.editForm.departmentTitle = "";
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//重新校验会员
|
||||||
|
checkAgainClerk() {
|
||||||
|
this.memberCheck = false
|
||||||
|
this.newMember = false
|
||||||
|
this.oldMember = false
|
||||||
|
},
|
||||||
|
//检测当前店员
|
||||||
|
checkClerk() {
|
||||||
|
if (this.form.mobile) {
|
||||||
|
this.newMember = false
|
||||||
|
this.oldMember = false
|
||||||
|
checkClerk(this.form.mobile).then(res => {
|
||||||
|
if (!res.result.id) {
|
||||||
|
this.newMember = true
|
||||||
|
} else {
|
||||||
|
this.oldMember = true
|
||||||
|
this.form.username = res.result.username
|
||||||
|
this.form.password = res.result.password
|
||||||
|
}
|
||||||
|
this.form.isSuper = 1
|
||||||
|
this.memberCheck = true;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
// 搜索项部门选择
|
||||||
|
handleSelectDep(v) {
|
||||||
|
this.searchForm.departmentId = v;
|
||||||
|
},
|
||||||
|
// 分页 修改页码
|
||||||
|
changePage(v) {
|
||||||
|
this.searchForm.pageNumber = v;
|
||||||
|
this.getUserList();
|
||||||
|
this.clearSelectAll();
|
||||||
|
},
|
||||||
|
// 分页 修改页数
|
||||||
|
changePageSize(v) {
|
||||||
|
this.searchForm.pageSize = v;
|
||||||
|
this.searchForm.pageNumber = 1;
|
||||||
|
this.getUserList();
|
||||||
|
},
|
||||||
|
getUserList() {
|
||||||
|
// 多条件搜索用户列表
|
||||||
|
this.loading = true;
|
||||||
|
getUserListData(this.searchForm).then(res => {
|
||||||
|
this.loading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.data = res.result.records;
|
||||||
|
this.total = res.result.total;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
handleSearch() {
|
||||||
|
this.searchForm.pageNumber = 1;
|
||||||
|
this.searchForm.pageSize = 10;
|
||||||
|
this.getUserList();
|
||||||
|
},
|
||||||
|
// 排序
|
||||||
|
changeSort(e) {
|
||||||
|
this.searchForm.sort = e.key;
|
||||||
|
this.searchForm.order = e.order;
|
||||||
|
if (e.order == "normal") {
|
||||||
|
this.searchForm.order = "";
|
||||||
|
}
|
||||||
|
this.getUserList();
|
||||||
|
},
|
||||||
|
// 获取角色列表
|
||||||
|
getRoleList() {
|
||||||
|
let params = {
|
||||||
|
pageSize: 100
|
||||||
|
}
|
||||||
|
getAllRoleList(params).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.roleList = res.result.records;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 重置密码
|
||||||
|
resetPass() {
|
||||||
|
if (this.selectCount == 0) {
|
||||||
|
this.$Message.warning('请选中数据后重试!');
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认重置",
|
||||||
|
content:
|
||||||
|
"您确认要重置所选的 " +
|
||||||
|
this.selectCount +
|
||||||
|
" 条用户数据密码为【123456】?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
let ids = "";
|
||||||
|
this.selectList.forEach(function (e) {
|
||||||
|
ids += e.id + ",";
|
||||||
|
});
|
||||||
|
ids = ids.substring(0, ids.length - 1);
|
||||||
|
console.warn(ids)
|
||||||
|
resetPassword(ids).then(res => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.clearSelectAll();
|
||||||
|
this.getUserList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
updateSubmit(){
|
||||||
|
this.submitLoading = true;
|
||||||
|
console.warn(this.editForm)
|
||||||
|
editOtherUser(this.editForm.id,this.editForm).then(res => {
|
||||||
|
this.submitLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.getUserList();
|
||||||
|
this.userEditModalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 确认提交
|
||||||
|
submitUser() {
|
||||||
|
this.$refs.form.validate(valid => {
|
||||||
|
if (valid) {
|
||||||
|
// 添加用户 避免编辑后传入id
|
||||||
|
const params = JSON.parse(JSON.stringify(this.form))
|
||||||
|
console.warn(params)
|
||||||
|
delete params.id;
|
||||||
|
delete params.status;
|
||||||
|
if (this.newMember) {
|
||||||
|
if (params.password == "" || params.password == undefined) {
|
||||||
|
this.errorPass = "密码不能为空";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (params.password.length < 6) {
|
||||||
|
this.errorPass = "密码长度不得少于6位";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
//todo
|
||||||
|
params.password = this.md5(params.password)
|
||||||
|
} else {
|
||||||
|
params.password = this.form.password
|
||||||
|
}
|
||||||
|
this.submitLoading = true;
|
||||||
|
addUser(params).then(res => {
|
||||||
|
this.submitLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.getUserList();
|
||||||
|
this.userModalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 添加用户
|
||||||
|
add() {
|
||||||
|
// this.checkClerks();
|
||||||
|
this.modalType = 0;
|
||||||
|
this.modalTitle = "添加店员";
|
||||||
|
this.$refs.form.resetFields();
|
||||||
|
this.form = { // 表单
|
||||||
|
username: "",
|
||||||
|
mobile: "",
|
||||||
|
isSuper: 0,
|
||||||
|
roles: [],
|
||||||
|
departmentId: "",
|
||||||
|
departmentTitle: ""
|
||||||
|
},
|
||||||
|
this.oldMember = false
|
||||||
|
this.newMember = false
|
||||||
|
this.userModalVisible = true;
|
||||||
|
},
|
||||||
|
// 编辑用户
|
||||||
|
edit(v) {
|
||||||
|
console.warn(v)
|
||||||
|
getClerk(v.id).then(res => {
|
||||||
|
console.warn(res)
|
||||||
|
this.mobile = res.result.mobile
|
||||||
|
this.clerkName = res.result.clerkName
|
||||||
|
this.editForm.isSuper = 0
|
||||||
|
this.editForm.id = res.result.id
|
||||||
|
if(res.result.isSuper){
|
||||||
|
this.editForm.isSuper = 1
|
||||||
|
}
|
||||||
|
this.editForm.departmentId = res.result.departmentId
|
||||||
|
this.$refs.depTree.setData(res.result.departmentId, res.result.departmentTitle);
|
||||||
|
let selectRolesId = [];
|
||||||
|
if (res.result.roles) {
|
||||||
|
res.result.roles.forEach(function (e) {
|
||||||
|
selectRolesId.push(e.id);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.editForm.roles = selectRolesId;
|
||||||
|
|
||||||
|
this.modalTitle = "修改店员";
|
||||||
|
this.userEditModalVisible = true;
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
// 启用
|
||||||
|
enable(v) {
|
||||||
|
let params = {
|
||||||
|
status: true
|
||||||
|
}
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认启用",
|
||||||
|
content: "您确认要启用用户 " + v.clerkName + " ?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
enableClerk(v.id, params).then(res => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.getUserList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 禁用
|
||||||
|
disable(v) {
|
||||||
|
let params = {
|
||||||
|
status: false
|
||||||
|
}
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认禁用",
|
||||||
|
content: "您确认要禁用用户 " + v.clerkName + " ?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
enableClerk(v.id, params).then(res => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.getUserList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 删除用户
|
||||||
|
remove(v) {
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认删除",
|
||||||
|
content: "您确认要删除用户 " + v.clerkName + " ?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
deleteClerk(v.id).then(res => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("删除成功");
|
||||||
|
this.getUserList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 选中状态
|
||||||
|
showSelect(e) {
|
||||||
|
this.selectList = e;
|
||||||
|
this.selectCount = e.length;
|
||||||
|
},
|
||||||
|
// 清除选中状态
|
||||||
|
clearSelectAll() {
|
||||||
|
this.$refs.table.selectAll(false);
|
||||||
|
},
|
||||||
|
// 批量删除
|
||||||
|
delAll() {
|
||||||
|
if (this.selectCount <= 0) {
|
||||||
|
this.$Message.warning("您还未选择要删除的数据");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认删除",
|
||||||
|
content: "您确认要删除所选的 " + this.selectCount + " 条店员?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
let ids = "";
|
||||||
|
this.selectList.forEach(function (e) {
|
||||||
|
ids += e.id + ",";
|
||||||
|
});
|
||||||
|
ids = ids.substring(0, ids.length - 1);
|
||||||
|
deleteClerk(ids).then(res => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("删除成功");
|
||||||
|
this.clearSelectAll();
|
||||||
|
this.getUserList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.init();
|
||||||
|
this.getRoleList();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -0,0 +1,408 @@
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="search">
|
||||||
|
<Card>
|
||||||
|
<Row class="operation">
|
||||||
|
<i-switch v-model="strict" size="large" style="margin-right: 5px">
|
||||||
|
<span slot="open">级联</span>
|
||||||
|
<span slot="close">单选</span>
|
||||||
|
</i-switch>
|
||||||
|
<Button @click="addRoot">添加部门</Button>
|
||||||
|
<Button @click="add" type="primary">添加子部门</Button>
|
||||||
|
<Button @click="delAll">批量删除</Button>
|
||||||
|
<Button @click="getParentList">刷新</Button>
|
||||||
|
</Row>
|
||||||
|
<Row type="flex" justify="start">
|
||||||
|
<Col :md="8" :lg="8" :xl="6">
|
||||||
|
<Alert show-icon>
|
||||||
|
当前选择编辑:
|
||||||
|
<span class="select-title">{{ editTitle }}</span>
|
||||||
|
<a class="select-clear" v-if="form.id" @click="cancelSelect"
|
||||||
|
>取消选择</a
|
||||||
|
>
|
||||||
|
</Alert>
|
||||||
|
<div class="tree-bar" :style="{ maxHeight: maxHeight }">
|
||||||
|
<Tree
|
||||||
|
ref="tree"
|
||||||
|
:data="data"
|
||||||
|
:load-data="loadData"
|
||||||
|
show-checkbox
|
||||||
|
@on-check-change="changeSelect"
|
||||||
|
@on-select-change="selectTree"
|
||||||
|
:check-strictly="!strict"
|
||||||
|
></Tree>
|
||||||
|
<Spin size="large" fix v-if="loading"></Spin>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
<Col :md="15" :lg="13" :xl="9" style="margin-left: 10px">
|
||||||
|
<Form
|
||||||
|
ref="form"
|
||||||
|
:model="form"
|
||||||
|
:label-width="100"
|
||||||
|
:rules="formValidate"
|
||||||
|
>
|
||||||
|
<FormItem label="部门名称" prop="title">
|
||||||
|
<Input v-model="form.title" />
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="选择角色">
|
||||||
|
<Select
|
||||||
|
:loading="userLoading"
|
||||||
|
not-found-text="暂无角色"
|
||||||
|
v-model="selectedRole"
|
||||||
|
multiple
|
||||||
|
>
|
||||||
|
<Option v-for="item in users" :value="item.id" :key="item.id">{{
|
||||||
|
item.name
|
||||||
|
}}</Option>
|
||||||
|
</Select>
|
||||||
|
</FormItem>
|
||||||
|
|
||||||
|
<FormItem label="排序值" prop="sortOrder">
|
||||||
|
<Tooltip
|
||||||
|
trigger="hover"
|
||||||
|
placement="right"
|
||||||
|
content="值越小越靠前,支持小数"
|
||||||
|
>
|
||||||
|
<InputNumber
|
||||||
|
:max="1000"
|
||||||
|
:min="0"
|
||||||
|
v-model="form.sortOrder"
|
||||||
|
></InputNumber>
|
||||||
|
</Tooltip>
|
||||||
|
</FormItem>
|
||||||
|
<Form-item>
|
||||||
|
<Button
|
||||||
|
style="margin-right: 5px"
|
||||||
|
@click="submitEdit"
|
||||||
|
:loading="submitLoading"
|
||||||
|
type="primary"
|
||||||
|
>修改并保存</Button
|
||||||
|
>
|
||||||
|
<Button @click="handleReset">重置</Button>
|
||||||
|
</Form-item>
|
||||||
|
</Form>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<Modal
|
||||||
|
:title="modalTitle"
|
||||||
|
v-model="modalVisible"
|
||||||
|
:mask-closable="false"
|
||||||
|
:width="500"
|
||||||
|
>
|
||||||
|
<Form
|
||||||
|
ref="formAdd"
|
||||||
|
:model="formAdd"
|
||||||
|
:label-width="85"
|
||||||
|
:rules="formValidate"
|
||||||
|
>
|
||||||
|
<div v-if="showParent">
|
||||||
|
<FormItem label="上级部门:">{{ form.title }}</FormItem>
|
||||||
|
</div>
|
||||||
|
<FormItem label="部门名称" prop="title">
|
||||||
|
<Input v-model="formAdd.title" />
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="排序值" prop="sortOrder">
|
||||||
|
<Tooltip
|
||||||
|
trigger="hover"
|
||||||
|
placement="right"
|
||||||
|
content="值越小越靠前,支持小数"
|
||||||
|
>
|
||||||
|
<InputNumber
|
||||||
|
:max="1000"
|
||||||
|
:min="0"
|
||||||
|
v-model="formAdd.sortOrder"
|
||||||
|
></InputNumber>
|
||||||
|
</Tooltip>
|
||||||
|
</FormItem>
|
||||||
|
</Form>
|
||||||
|
<div slot="footer">
|
||||||
|
<Button type="text" @click="cancelAdd">取消</Button>
|
||||||
|
<Button type="primary" :loading="submitLoading" @click="submitAdd"
|
||||||
|
>提交</Button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
initDepartment,
|
||||||
|
loadDepartment,
|
||||||
|
addDepartment,
|
||||||
|
editDepartment,
|
||||||
|
deleteDepartment,
|
||||||
|
getUserByDepartmentId,
|
||||||
|
getRoleList,
|
||||||
|
updateDepartmentRole,
|
||||||
|
} from "@/api/index";
|
||||||
|
export default {
|
||||||
|
name: "store-department-manage",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: true, // 加载状态
|
||||||
|
maxHeight: "500px", // 最大高度
|
||||||
|
strict: true, // 级联还是单选
|
||||||
|
userLoading: false, // 选择角色加载状态
|
||||||
|
loadingEdit: false, // 编辑加载状态
|
||||||
|
modalVisible: false, // modal显隐
|
||||||
|
selectList: [], // 已选列表
|
||||||
|
selectCount: 0, // 已选总数
|
||||||
|
showParent: false, // 展示父级
|
||||||
|
modalTitle: "", // modal标题
|
||||||
|
editTitle: "", // 编辑标题
|
||||||
|
selectedRole: [], //选择的角色
|
||||||
|
searchKey: "", // 搜索关键字
|
||||||
|
form: { // 提交表单
|
||||||
|
id: "",
|
||||||
|
title: "",
|
||||||
|
parentId: "",
|
||||||
|
parentTitle: "",
|
||||||
|
sortOrder: 0,
|
||||||
|
status: 0,
|
||||||
|
},
|
||||||
|
|
||||||
|
formAdd: {}, // 新增表单
|
||||||
|
formValidate: { // 验证规则
|
||||||
|
title: [{ required: true, message: "名称不能为空", trigger: "blur" }],
|
||||||
|
sortOrder: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
type: "number",
|
||||||
|
message: "排序值不能为空",
|
||||||
|
trigger: "blur",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
submitLoading: false, // 提交loading
|
||||||
|
data: [], // 部门数据
|
||||||
|
dataEdit: [], // 编辑时部门数据
|
||||||
|
users: [], // 用户
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
init() {
|
||||||
|
this.getParentList();
|
||||||
|
},
|
||||||
|
// 获取部门数据
|
||||||
|
getParentList() {
|
||||||
|
this.loading = true;
|
||||||
|
initDepartment().then((res) => {
|
||||||
|
this.loading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.data = res.result;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 动态加载二级数据
|
||||||
|
loadData(item, callback) {
|
||||||
|
loadDepartment(item.id).then((res) => {
|
||||||
|
this.loadingEdit = false;
|
||||||
|
if (res.success) {
|
||||||
|
console.log(res.result);
|
||||||
|
callback(res.result);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 点击树
|
||||||
|
selectTree(v) {
|
||||||
|
if (v.length > 0) {
|
||||||
|
// 转换null为""
|
||||||
|
for (let attr in v[0]) {
|
||||||
|
if (v[0][attr] == null) {
|
||||||
|
v[0][attr] = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let str = JSON.stringify(v[0]);
|
||||||
|
let data = JSON.parse(str);
|
||||||
|
|
||||||
|
this.editTitle = data.title;
|
||||||
|
// 加载部门用户数据
|
||||||
|
this.userLoading = true;
|
||||||
|
|
||||||
|
getUserByDepartmentId(data.id).then((res) => {
|
||||||
|
let way =[]
|
||||||
|
res.result && res.result.forEach((item) => {
|
||||||
|
way.push(item.roleId)
|
||||||
|
})
|
||||||
|
this.$set(this,'selectedRole',way)
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
getRoleList({
|
||||||
|
pageNumber: 1,
|
||||||
|
pageSize: 10000,
|
||||||
|
}).then((res) => {
|
||||||
|
this.userLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.users = res.result.records;
|
||||||
|
// 回显
|
||||||
|
this.form = data;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.cancelSelect();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 取消选择
|
||||||
|
cancelSelect() {
|
||||||
|
let data = this.$refs.tree.getSelectedNodes()[0];
|
||||||
|
if (data) {
|
||||||
|
data.selected = false;
|
||||||
|
}
|
||||||
|
this.$refs.form.resetFields();
|
||||||
|
delete this.form.id;
|
||||||
|
this.editTitle = "";
|
||||||
|
},
|
||||||
|
// 选择上级部门
|
||||||
|
selectTreeEdit(v) {
|
||||||
|
|
||||||
|
if (v.length > 0) {
|
||||||
|
// 转换null为""
|
||||||
|
for (let attr in v[0]) {
|
||||||
|
if (v[0][attr] == null) {
|
||||||
|
v[0][attr] = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let str = JSON.stringify(v[0]);
|
||||||
|
let data = JSON.parse(str);
|
||||||
|
this.form.parentId = data.id;
|
||||||
|
this.form.parentTitle = data.title;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 取消添加部门
|
||||||
|
cancelAdd() {
|
||||||
|
this.modalVisible = false;
|
||||||
|
},
|
||||||
|
// 重置表单
|
||||||
|
handleReset() {
|
||||||
|
this.$refs.form.resetFields();
|
||||||
|
this.form.status = 0;
|
||||||
|
},
|
||||||
|
// 提交表单
|
||||||
|
submitEdit() {
|
||||||
|
this.$refs.form.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
if (!this.form.id) {
|
||||||
|
this.$Message.warning("请先点击选择要修改的部门");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let roleWay = [];
|
||||||
|
this.selectedRole.forEach((item) => {
|
||||||
|
let role = {
|
||||||
|
departmentId: this.form.id,
|
||||||
|
roleId: item,
|
||||||
|
};
|
||||||
|
roleWay.push(role);
|
||||||
|
});
|
||||||
|
|
||||||
|
Promise.all([
|
||||||
|
editDepartment(this.form.id, this.form),
|
||||||
|
updateDepartmentRole(this.form.id, roleWay)
|
||||||
|
]).then((res) => {
|
||||||
|
console.warn(res)
|
||||||
|
this.submitLoading = false;
|
||||||
|
if (res[0].success) {
|
||||||
|
this.$Message.success("编辑成功");
|
||||||
|
this.init();
|
||||||
|
this.modalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 确认添加部门
|
||||||
|
submitAdd() {
|
||||||
|
this.$refs.formAdd.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
this.submitLoading = true;
|
||||||
|
addDepartment(this.formAdd).then((res) => {
|
||||||
|
this.submitLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("添加成功");
|
||||||
|
this.init();
|
||||||
|
this.modalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 添加子部门
|
||||||
|
add() {
|
||||||
|
if (this.form.id == "" || this.form.id == null) {
|
||||||
|
this.$Message.warning("请先点击选择一个部门");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.modalTitle = "添加子部门";
|
||||||
|
this.showParent = true;
|
||||||
|
|
||||||
|
this.formAdd = {
|
||||||
|
parentId: this.form.id,
|
||||||
|
sortOrder: 0,
|
||||||
|
status: 0,
|
||||||
|
};
|
||||||
|
this.modalVisible = true;
|
||||||
|
},
|
||||||
|
// 添加一级部门
|
||||||
|
addRoot() {
|
||||||
|
this.modalTitle = "添加一级部门";
|
||||||
|
this.showParent = false;
|
||||||
|
this.formAdd = {
|
||||||
|
parentId: 0,
|
||||||
|
sortOrder: 0,
|
||||||
|
status: 0,
|
||||||
|
};
|
||||||
|
this.modalVisible = true;
|
||||||
|
},
|
||||||
|
// 选中回调
|
||||||
|
changeSelect(v) {
|
||||||
|
console.log(v);
|
||||||
|
this.selectCount = v.length;
|
||||||
|
this.selectList = v;
|
||||||
|
},
|
||||||
|
// 批量删除部门
|
||||||
|
delAll() {
|
||||||
|
if (this.selectCount <= 0) {
|
||||||
|
this.$Message.warning("您还未勾选要删除的数据");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认删除",
|
||||||
|
content:
|
||||||
|
"您确认要删除所选的 " + this.selectCount + " 条数据及其下级所有数据?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
let ids = "";
|
||||||
|
this.selectList.forEach(function (e) {
|
||||||
|
ids += e.id + ",";
|
||||||
|
});
|
||||||
|
ids = ids.substring(0, ids.length - 1);
|
||||||
|
deleteDepartment(ids).then((res) => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("删除成功");
|
||||||
|
this.selectList = [];
|
||||||
|
this.selectCount = 0;
|
||||||
|
this.cancelSelect();
|
||||||
|
this.init();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// 计算高度
|
||||||
|
let height = document.documentElement.clientHeight;
|
||||||
|
this.maxHeight = Number(height - 287) + "px";
|
||||||
|
this.init();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/styles/tree-common.scss";
|
||||||
|
|
||||||
|
</style>
|
|
@ -0,0 +1,768 @@
|
||||||
|
<template>
|
||||||
|
<div class="search">
|
||||||
|
<Card>
|
||||||
|
<Row class="operation">
|
||||||
|
<Button @click="addRole" type="primary">添加角色</Button>
|
||||||
|
<Button @click="delAll">批量删除</Button>
|
||||||
|
</Row>
|
||||||
|
<br>
|
||||||
|
<Table :loading="loading" border :columns="columns" :data="data" ref="table" sortable="custom" @on-sort-change="changeSort" @on-selection-change="changeSelect"></Table>
|
||||||
|
<Row type="flex" justify="end" class="mt_10">
|
||||||
|
<Page :current="pageNumber" :total="total" :page-size="pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" size="small" show-total
|
||||||
|
show-elevator show-sizer></Page>
|
||||||
|
</Row>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
<!-- 编辑 -->
|
||||||
|
<Modal :title="modalTitle" v-model="roleModalVisible" :mask-closable="false" :width="500">
|
||||||
|
<Form ref="roleForm" :model="roleForm" :label-width="80" :rules="roleFormValidate">
|
||||||
|
<FormItem label="角色名称" prop="name">
|
||||||
|
<Input v-model="roleForm.name" />
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="备注" prop="description">
|
||||||
|
<Input v-model="roleForm.description" />
|
||||||
|
</FormItem>
|
||||||
|
</Form>
|
||||||
|
<div slot="footer">
|
||||||
|
<Button type="text" @click="roleModalVisible = false">取消</Button>
|
||||||
|
<Button type="primary" :loading="submitLoading" @click="submitRole">提交
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
<!-- 菜单权限 -->
|
||||||
|
<Modal :title="modalTitle" v-model="permModalVisible" :mask-closable="false" :width="500" :styles="{ top: '30px' }" class="permModal">
|
||||||
|
<div style="position: relative">
|
||||||
|
<Tree ref="tree" :data="permData" show-checkbox :render="renderContent">
|
||||||
|
</Tree>
|
||||||
|
<Spin size="large" fix v-if="treeLoading"></Spin>
|
||||||
|
</div>
|
||||||
|
<div slot="footer">
|
||||||
|
<Button type="text" @click="permModalVisible = false">取消</Button>
|
||||||
|
<Select v-model="openLevel" @on-change="changeOpen" style="width: 110px; text-align: left; margin-right: 10px">
|
||||||
|
<Option value="0">展开所有</Option>
|
||||||
|
<Option value="1">收合所有</Option>
|
||||||
|
<Option value="2">仅展开一级</Option>
|
||||||
|
<Option value="3">仅展开两级</Option>
|
||||||
|
</Select>
|
||||||
|
<Button type="primary" :loading="submitPermLoading" @click="submitPermEdit()">编辑
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 保存权限弹出选择权限 -->
|
||||||
|
<Modal width="800" v-model="selectIsSuperModel" title="选择菜单权限" :loading="superModelLoading" @on-ok="saveRole">
|
||||||
|
<div class="btns">
|
||||||
|
<Button type="primary" @click="setRole()" class="btn-item">一键选中·数据权限</Button>
|
||||||
|
<Button class="btn-item" @click="setRole('onlyView')">一键选中·查看权限</Button>
|
||||||
|
</div>
|
||||||
|
<div class="role-list">
|
||||||
|
<div class="role-item" v-for="(item, index) in saveRoleWay" :key="index">
|
||||||
|
<div class="title">{{ item.title }}</div>
|
||||||
|
<div class="content">
|
||||||
|
<RadioGroup type="button" button-style="solid" v-model="item.isSuper">
|
||||||
|
<Radio :label="1">
|
||||||
|
<span>操作数据权限</span>
|
||||||
|
</Radio>
|
||||||
|
<Radio :label="0">
|
||||||
|
<span>查看权限</span>
|
||||||
|
</Radio>
|
||||||
|
</RadioGroup>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
getRoleList,
|
||||||
|
getAllPermissionList,
|
||||||
|
addRole,
|
||||||
|
editRole,
|
||||||
|
deleteRole,
|
||||||
|
loadDepartment,
|
||||||
|
selectRoleMenu,
|
||||||
|
saveRoleMenu,
|
||||||
|
} from "@/api/index";
|
||||||
|
import util from "@/libs/util.js";
|
||||||
|
export default {
|
||||||
|
name: "role-manage",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
superModelLoading: false, //保存权限弹出选择权限保存
|
||||||
|
selectIsSuperModel: false, //保存权限弹出选择权限
|
||||||
|
rolePermsWay: [], //查询角色权限集合
|
||||||
|
openLevel: "0", // 展开的级别
|
||||||
|
loading: true, // 加载状态
|
||||||
|
treeLoading: true, // 树加载
|
||||||
|
depTreeLoading: true, // 部门树加载
|
||||||
|
submitPermLoading: false, // 权限提交加载
|
||||||
|
submitDepLoading: false, // 部门提交加载
|
||||||
|
sortColumn: "", // 排序
|
||||||
|
sortType: "desc", // 排序类型
|
||||||
|
modalType: 0, // 0 添加 1 编辑
|
||||||
|
roleModalVisible: false, // 角色modal
|
||||||
|
permModalVisible: false, // 菜单权限modal
|
||||||
|
depModalVisible: false, // 部门modal
|
||||||
|
modalTitle: "", // modal标题
|
||||||
|
roleForm: {
|
||||||
|
// 角色表单
|
||||||
|
name: "",
|
||||||
|
description: "",
|
||||||
|
},
|
||||||
|
roleFormValidate: {
|
||||||
|
// 验证规则
|
||||||
|
name: [
|
||||||
|
{ required: true, message: "角色名称不能为空", trigger: "blur" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
submitLoading: false, // 提交loading
|
||||||
|
selectList: [], // 已选列表
|
||||||
|
selectCount: 0, // 已选总数
|
||||||
|
columns: [
|
||||||
|
// 表头
|
||||||
|
{
|
||||||
|
type: "selection",
|
||||||
|
width: 60,
|
||||||
|
align: "center",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "角色名称",
|
||||||
|
key: "name",
|
||||||
|
minWidth: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "备注",
|
||||||
|
key: "description",
|
||||||
|
minWidth: 150,
|
||||||
|
tooltip: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "创建时间",
|
||||||
|
key: "createTime",
|
||||||
|
width: 170,
|
||||||
|
sortable: true,
|
||||||
|
sortType: "desc",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "更新时间",
|
||||||
|
key: "updateTime",
|
||||||
|
width: 170,
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "最后操作人",
|
||||||
|
key: "createBy",
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
key: "action",
|
||||||
|
align: "center",
|
||||||
|
fixed: "right",
|
||||||
|
width: 230,
|
||||||
|
render: (h, params) => {
|
||||||
|
return h("div", [
|
||||||
|
h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: "warning",
|
||||||
|
size: "small",
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
marginRight: "5px",
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.editPerm(params.row);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"菜单权限"
|
||||||
|
),
|
||||||
|
h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
size: "small",
|
||||||
|
type: "info",
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
marginRight: "5px",
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.edit(params.row);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"编辑"
|
||||||
|
),
|
||||||
|
h(
|
||||||
|
"Button",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
type: "error",
|
||||||
|
size: "small",
|
||||||
|
},
|
||||||
|
on: {
|
||||||
|
click: () => {
|
||||||
|
this.remove(params.row);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"删除"
|
||||||
|
),
|
||||||
|
]);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
data: [], // 角色数据
|
||||||
|
pageNumber: 1, // 页数
|
||||||
|
pageSize: 10, // 每页数量
|
||||||
|
total: 0, // 总数
|
||||||
|
permData: [], // 菜单权限数据
|
||||||
|
editRolePermId: "", // 编辑权限id
|
||||||
|
selectAllFlag: false, // 全选标识
|
||||||
|
depData: [], // 部门数据
|
||||||
|
dataType: 0, // 数据类型
|
||||||
|
editDepartments: [], // 编辑部门
|
||||||
|
|
||||||
|
saveRoleWay: [], //用户保存用户点击的菜单
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 初始化数据
|
||||||
|
init() {
|
||||||
|
this.getRoleList();
|
||||||
|
// 获取所有菜单权限树
|
||||||
|
this.getPermList();
|
||||||
|
},
|
||||||
|
// 渲染部门前icon
|
||||||
|
renderContent(h, { root, node, data }) {
|
||||||
|
let icon = "";
|
||||||
|
if (data.level == 0) {
|
||||||
|
icon = "ios-navigate";
|
||||||
|
} else if (data.level == 1) {
|
||||||
|
icon = "md-list-box";
|
||||||
|
} else if (data.level == 2) {
|
||||||
|
icon = "md-list";
|
||||||
|
} else if (data.level == 3) {
|
||||||
|
icon = "md-radio-button-on";
|
||||||
|
} else {
|
||||||
|
icon = "md-radio-button-off";
|
||||||
|
}
|
||||||
|
return h(
|
||||||
|
"span",
|
||||||
|
{
|
||||||
|
style: {
|
||||||
|
display: "inline-block",
|
||||||
|
cursor: "pointer",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[
|
||||||
|
h("span", [
|
||||||
|
h("Icon", {
|
||||||
|
props: {
|
||||||
|
type: icon,
|
||||||
|
size: "16",
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
"margin-right": "8px",
|
||||||
|
"margin-bottom": "3px",
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
h("span", data.title),
|
||||||
|
h(
|
||||||
|
"Tag",
|
||||||
|
{
|
||||||
|
props: {
|
||||||
|
color:
|
||||||
|
data.isSuper == 1
|
||||||
|
? "red"
|
||||||
|
: data.isSuper == 0
|
||||||
|
? "default"
|
||||||
|
: "default",
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
"margin-left": "10px",
|
||||||
|
display:
|
||||||
|
data.isSuper == 1 || data.isSuper == 0
|
||||||
|
? "inline-block"
|
||||||
|
: "none",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data.isSuper == 1
|
||||||
|
? "操作权限"
|
||||||
|
: data.isSuper == 0
|
||||||
|
? "查看权限"
|
||||||
|
: ""
|
||||||
|
),
|
||||||
|
]),
|
||||||
|
]
|
||||||
|
);
|
||||||
|
},
|
||||||
|
// 分页 修改页码
|
||||||
|
changePage(v) {
|
||||||
|
this.pageNumber = v;
|
||||||
|
this.getRoleList();
|
||||||
|
this.clearSelectAll();
|
||||||
|
},
|
||||||
|
// 分页 修改页数
|
||||||
|
changePageSize(v) {
|
||||||
|
this.pageNumber = 1;
|
||||||
|
this.pageSize = v;
|
||||||
|
this.getRoleList();
|
||||||
|
},
|
||||||
|
// 变更排序方式
|
||||||
|
changeSort(e) {
|
||||||
|
this.sortColumn = e.key;
|
||||||
|
this.sortType = e.order;
|
||||||
|
if (e.order == "normal") {
|
||||||
|
this.sortType = "";
|
||||||
|
}
|
||||||
|
this.getRoleList();
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置权限
|
||||||
|
*/
|
||||||
|
setRole(val) {
|
||||||
|
let enable;
|
||||||
|
val == "onlyView" ? (enable = 0) : (enable = 1);
|
||||||
|
this.saveRoleWay.map((item) => {
|
||||||
|
item.isSuper = enable;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询所有角色
|
||||||
|
*/
|
||||||
|
getRoleList() {
|
||||||
|
this.loading = true;
|
||||||
|
let params = {
|
||||||
|
pageNumber: this.pageNumber,
|
||||||
|
pageSize: this.pageSize,
|
||||||
|
sort: this.sortColumn,
|
||||||
|
order: this.sort,
|
||||||
|
};
|
||||||
|
getRoleList(params).then((res) => {
|
||||||
|
this.loading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.data = res.result.records;
|
||||||
|
this.total = res.result.total;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询菜单
|
||||||
|
*/
|
||||||
|
getPermList() {
|
||||||
|
this.treeLoading = true;
|
||||||
|
getAllPermissionList().then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.deleteDisableNode(res.result);
|
||||||
|
this.permData = res.result;
|
||||||
|
this.treeLoading = false;
|
||||||
|
}
|
||||||
|
this.treeLoading = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 递归标记禁用节点
|
||||||
|
deleteDisableNode(permData) {
|
||||||
|
let that = this;
|
||||||
|
permData.forEach(function (e) {
|
||||||
|
if (e.status == -1) {
|
||||||
|
e.title = "[已禁用] " + e.title;
|
||||||
|
e.disabled = true;
|
||||||
|
}
|
||||||
|
if (e.children && e.children.length > 0) {
|
||||||
|
that.deleteDisableNode(e.children);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 提交
|
||||||
|
submitRole() {
|
||||||
|
this.$refs.roleForm.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
if (this.modalType == 0) {
|
||||||
|
// 添加
|
||||||
|
this.submitLoading = true;
|
||||||
|
|
||||||
|
addRole(this.roleForm).then((res) => {
|
||||||
|
this.submitLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.getRoleList();
|
||||||
|
this.roleModalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.submitLoading = true;
|
||||||
|
this.roleForm.roleId = this.roleForm.id;
|
||||||
|
|
||||||
|
editRole(this.roleForm).then((res) => {
|
||||||
|
this.submitLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
this.getRoleList();
|
||||||
|
this.roleModalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 点击添加按钮
|
||||||
|
*/
|
||||||
|
addRole() {
|
||||||
|
this.modalType = 0;
|
||||||
|
this.modalTitle = "添加角色";
|
||||||
|
this.$refs.roleForm.resetFields();
|
||||||
|
delete this.roleForm.id;
|
||||||
|
this.roleModalVisible = true;
|
||||||
|
},
|
||||||
|
// 编辑
|
||||||
|
edit(v) {
|
||||||
|
this.modalType = 1;
|
||||||
|
this.modalTitle = "编辑角色";
|
||||||
|
this.$refs.roleForm.resetFields();
|
||||||
|
// 转换null为""
|
||||||
|
for (let attr in v) {
|
||||||
|
if (v[attr] == null) {
|
||||||
|
v[attr] = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let str = JSON.stringify(v);
|
||||||
|
let roleInfo = JSON.parse(str);
|
||||||
|
this.roleForm = roleInfo;
|
||||||
|
this.roleModalVisible = true;
|
||||||
|
},
|
||||||
|
// 删除
|
||||||
|
remove(v) {
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认删除",
|
||||||
|
content: "您确认要删除角色 " + v.name + " ?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
deleteRole(v.id).then((res) => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("删除成功");
|
||||||
|
this.getRoleList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 清除选中
|
||||||
|
clearSelectAll() {
|
||||||
|
this.$refs.table.selectAll(false);
|
||||||
|
},
|
||||||
|
// 选中回调
|
||||||
|
changeSelect(e) {
|
||||||
|
this.selectList = e;
|
||||||
|
this.selectCount = e.length;
|
||||||
|
},
|
||||||
|
// 批量删除
|
||||||
|
delAll() {
|
||||||
|
if (this.selectCount <= 0) {
|
||||||
|
this.$Message.warning("您还未选择要删除的数据");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: "确认删除",
|
||||||
|
content: "您确认要删除所选的 " + this.selectCount + " 条数据?",
|
||||||
|
loading: true,
|
||||||
|
onOk: () => {
|
||||||
|
let ids = "";
|
||||||
|
this.selectList.forEach(function (e) {
|
||||||
|
ids += e.id + ",";
|
||||||
|
});
|
||||||
|
ids = ids.substring(0, ids.length - 1);
|
||||||
|
deleteRole(ids).then((res) => {
|
||||||
|
this.$Modal.remove();
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("删除成功");
|
||||||
|
this.clearSelectAll();
|
||||||
|
this.getRoleList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 菜单权限
|
||||||
|
async editPerm(v) {
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 点击菜单权限每次将赋值的isSuper数据给清空掉
|
||||||
|
*/
|
||||||
|
this.permData.map((item) => {
|
||||||
|
item.children.length != 0
|
||||||
|
? item.children.map((child) => {
|
||||||
|
child.children.length != 0
|
||||||
|
? child.children.map((kid) => {
|
||||||
|
delete kid.isSuper;
|
||||||
|
})
|
||||||
|
: "";
|
||||||
|
delete child.isSuper;
|
||||||
|
})
|
||||||
|
: "";
|
||||||
|
delete item.isSuper;
|
||||||
|
});
|
||||||
|
|
||||||
|
if (this.treeLoading) {
|
||||||
|
this.$Message.warning("菜单权限数据加载中,请稍后点击查看");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.editRolePermId = v.id;
|
||||||
|
this.modalTitle = "分配 " + v.name + " 的菜单权限";
|
||||||
|
// 匹配勾选
|
||||||
|
let rolePerms;
|
||||||
|
// 当前角色的菜单权限
|
||||||
|
let res = await selectRoleMenu(v.id);
|
||||||
|
if (res.result) {
|
||||||
|
rolePerms = res.result;
|
||||||
|
this.rolePermsWay = res.result;
|
||||||
|
}
|
||||||
|
// 递归判断子节点是否可以选中
|
||||||
|
this.checkPermTree(this.permData, rolePerms);
|
||||||
|
this.permModalVisible = true;
|
||||||
|
},
|
||||||
|
// 递归判断子节点
|
||||||
|
checkPermTree(permData, rolePerms) {
|
||||||
|
let that = this;
|
||||||
|
|
||||||
|
permData.forEach((p) => {
|
||||||
|
if (that.hasPerm(p, rolePerms) && p.status != -1) {
|
||||||
|
if (p.children && p.children.length === 0) {
|
||||||
|
this.$set(p, "checked", true);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.$set(p, "checked", false);
|
||||||
|
}
|
||||||
|
if (p.children && p.children.length > 0) {
|
||||||
|
that.checkPermTree(p.children, rolePerms);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 判断角色拥有的权限节点勾选
|
||||||
|
hasPerm(p, rolePerms) {
|
||||||
|
if (!rolePerms) return false;
|
||||||
|
let flag = false;
|
||||||
|
for (let i = 0; i < rolePerms.length; i++) {
|
||||||
|
if (p.id == rolePerms[i].menuId) {
|
||||||
|
this.$set(p, "isSuper", rolePerms[i].isSuper);
|
||||||
|
flag = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (flag) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
// 递归全选节点
|
||||||
|
selectedTreeAll(permData, select) {
|
||||||
|
let that = this;
|
||||||
|
permData.forEach(function (e) {
|
||||||
|
e.checked = select;
|
||||||
|
if (e.children && e.children.length > 0) {
|
||||||
|
that.selectedTreeAll(e.children, select);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/**分配菜单权限 */
|
||||||
|
submitPermEdit() {
|
||||||
|
this.saveRoleWay = [];
|
||||||
|
this.selectIsSuperModel = true; //打开选择权限
|
||||||
|
let selectedNodes = this.$refs.tree.getCheckedAndIndeterminateNodes();
|
||||||
|
let way = [];
|
||||||
|
selectedNodes.forEach((e) => {
|
||||||
|
console.log(e)
|
||||||
|
let perm = {
|
||||||
|
title: e.title,
|
||||||
|
isSuper: e.isSuper ? e.isSuper = 1 : e.isSuper = 0 || 0,
|
||||||
|
menuId: e.id,
|
||||||
|
roleId: this.editRolePermId,
|
||||||
|
};
|
||||||
|
way.push(perm);
|
||||||
|
this.$set(this,'saveRoleWay',way)
|
||||||
|
|
||||||
|
});
|
||||||
|
console.log(this.saveRoleWay)
|
||||||
|
},
|
||||||
|
|
||||||
|
/**保存权限 */
|
||||||
|
saveRole() {
|
||||||
|
this.superModelLoading = true;
|
||||||
|
saveRoleMenu(this.editRolePermId, this.saveRoleWay).then((res) => {
|
||||||
|
this.superModelLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("操作成功");
|
||||||
|
// 标记重新获取菜单数据
|
||||||
|
this.$store.commit("setAdded", false);
|
||||||
|
util.initRouter(this);
|
||||||
|
this.getRoleList();
|
||||||
|
this.permModalVisible = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 加载数据
|
||||||
|
loadData(item, callback) {
|
||||||
|
loadDepartment(item.id, { openDataFilter: false }).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
res.result.forEach(function (e) {
|
||||||
|
e.checked = false;
|
||||||
|
if (e.isParent) {
|
||||||
|
e.loading = false;
|
||||||
|
e.children = [];
|
||||||
|
}
|
||||||
|
if (e.status == -1) {
|
||||||
|
e.title = "[已禁用] " + e.title;
|
||||||
|
e.disabled = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
callback(res.result);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 判断展开子节点
|
||||||
|
expandCheckDep(v) {
|
||||||
|
this.checkDepTree(v.children, this.editDepartments);
|
||||||
|
},
|
||||||
|
// 判断子节点
|
||||||
|
checkDepTree(depData, roleDepIds) {
|
||||||
|
let that = this;
|
||||||
|
depData.forEach(function (p) {
|
||||||
|
if (that.hasDepPerm(p, roleDepIds)) {
|
||||||
|
p.checked = true;
|
||||||
|
} else {
|
||||||
|
p.checked = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 树结构展开层级
|
||||||
|
changeOpen(v) {
|
||||||
|
if (v == "0") {
|
||||||
|
this.permData.forEach((e) => {
|
||||||
|
e.expand = true;
|
||||||
|
if (e.children && e.children.length > 0) {
|
||||||
|
e.children.forEach((c) => {
|
||||||
|
c.expand = true;
|
||||||
|
if (c.children && c.children.length > 0) {
|
||||||
|
c.children.forEach(function (b) {
|
||||||
|
b.expand = true;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else if (v == "1") {
|
||||||
|
this.permData.forEach((e) => {
|
||||||
|
e.expand = false;
|
||||||
|
if (e.children && e.children.length > 0) {
|
||||||
|
e.children.forEach((c) => {
|
||||||
|
c.expand = false;
|
||||||
|
if (c.children && c.children.length > 0) {
|
||||||
|
c.children.forEach(function (b) {
|
||||||
|
b.expand = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else if (v == "2") {
|
||||||
|
this.permData.forEach((e) => {
|
||||||
|
e.expand = true;
|
||||||
|
if (e.children && e.children.length > 0) {
|
||||||
|
e.children.forEach((c) => {
|
||||||
|
c.expand = false;
|
||||||
|
if (c.children && c.children.length > 0) {
|
||||||
|
c.children.forEach(function (b) {
|
||||||
|
b.expand = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else if (v == "3") {
|
||||||
|
this.permData.forEach((e) => {
|
||||||
|
e.expand = true;
|
||||||
|
if (e.children && e.children.length > 0) {
|
||||||
|
e.children.forEach((c) => {
|
||||||
|
c.expand = true;
|
||||||
|
if (c.children && c.children.length > 0) {
|
||||||
|
c.children.forEach(function (b) {
|
||||||
|
b.expand = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.init();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.role-list {
|
||||||
|
height: 500px;
|
||||||
|
overflow-y: auto;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.role-item {
|
||||||
|
width: 50%;
|
||||||
|
display: flex;
|
||||||
|
padding: 20px 0;
|
||||||
|
align-items: center;
|
||||||
|
> .title {
|
||||||
|
flex: 2;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
> .content {
|
||||||
|
flex: 10;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btns {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.btn-item {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
.permModal {
|
||||||
|
.ivu-modal-body {
|
||||||
|
max-height: 560px;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.depModal {
|
||||||
|
.ivu-modal-body {
|
||||||
|
max-height: 500px;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tips {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
font-weight: bold;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue