7.5提交

This commit is contained in:
zoujiandong 2023-07-05 10:57:07 +08:00
parent 616519e0f0
commit 8b6b373803
20 changed files with 456 additions and 333 deletions

View File

@ -1,15 +1,21 @@
import request from '../../utils/request'; import request from '../../utils/request';
export function login(data) { export function login(data) {
return request({ return request({
url:'/admin/basic/login', url:'/admin/login',
method: 'post', method: 'post',
data data
}) })
} }
export function logout() {
return request({
url:'/admin/user/loginout',
method: 'put'
})
}
export function getCaptcha() { export function getCaptcha() {
return request({ return request({
url:'/admin/basic/captcha', url:'/admin/captcha',
method: 'get' method: 'get'
}) })
} }
@ -24,7 +30,14 @@ export function getAppConfig() {
// 根据角色获取菜单 // 根据角色获取菜单
export function getUserMenuRole() { export function getUserMenuRole() {
return request({ return request({
url:'/admin/role/menu',//'https://www.fastmock.site/mock/ebb1956b65d6078940cacb295a06be27/mock/menu', // url:'/admin/user/menu',//'https://www.fastmock.site/mock/ebb1956b65d6078940cacb295a06be27/mock/menu', //
method: 'get'
})
}
// 根据角色获取按钮权限Button
export function getUserButtonRole() {
return request({
url:'/admin/user/button',//'https://www.fastmock.site/mock/ebb1956b65d6078940cacb295a06be27/mock/menu', //
method: 'get' method: 'get'
}) })
} }

View File

@ -1,6 +1,6 @@
import request from '../../utils/request' import request from '../../utils/request'
const url = '/api/v1/post'; const url = '/admin/post';
export function getPost(params) { export function getPost(params) {
return request({ return request({
@ -9,6 +9,13 @@ export function getPost(params) {
params params
}) })
} }
export function getPostList(params){
return request({
url:'/admin/post/list',
method: 'get',
params
})
}
export function addPost(data) { export function addPost(data) {
return request({ return request({

View File

@ -8,6 +8,13 @@ export function getRole(params) {
params params
}) })
} }
export function getRoleList(params) {
return request({
url:'/admin/role/list',
method: 'get',
params,
})
}
export function addRole(data) { export function addRole(data) {
return request({ return request({

View File

@ -1,6 +1,6 @@
import request from '../../utils/request'; import request from '../../utils/request';
const url = '/api/v1/sys-api'; const url = '/admin/api';
export function getSysApi(params) { export function getSysApi(params) {
return request({ return request({
@ -9,7 +9,12 @@ export function getSysApi(params) {
params params
}) })
} }
export function getSysApiList() {
return request({
url:'/admin/api/list',
method: 'get'
})
}
export function addSysApi(data) { export function addSysApi(data) {
return request({ return request({
url, url,

View File

@ -1,6 +1,6 @@
import request from '../../utils/request'; import request from '../../utils/request';
const url = '/api/v1/dept'; const url = '/admin/dept';
export function getDept(params) { export function getDept(params) {
return request({ return request({

View File

@ -34,9 +34,9 @@ export function removeUser(data) {
}) })
} }
export function updateUser(data) { export function updateUser(data,id) {
return request({ return request({
url, url:`${url}/${id}`,
method: 'put', method: 'put',
data, data,
}) })
@ -52,7 +52,7 @@ export function updateUserStatus(data) {
export function resetUserPwd(data) { export function resetUserPwd(data) {
return request({ return request({
url:'/api/v1/user/pwd/reset', url:'/admin/user/password',
method: 'put', method: 'put',
data data
}) })

View File

@ -1,15 +1,16 @@
import { useUserStore } from '@/store/userInfo'; import { usePermissionStore } from '@/store/permission';
export default { export default {
checkPermission(el, binding) { checkPermission(el, binding) {
const store = useUserStore(); const store = usePermissionStore();
const { value } = binding; const { value } = binding;
const all_permission = '*:*:*' const permissions = store.buttonPermissions;
const permissions = store.userInfo && store.userInfo.permissions; const all_permission = '*'
console.log('permissions-------');
console.log(permissions);
if (typeof value === 'string') { if (typeof value === 'string') {
const hasPermission = permissions.some((permission) => { const hasPermission = permissions.some((permission) => {
return all_permission === permission || value === permission; return all_permission==permission || value === permission;
}) })
if (!hasPermission) { if (!hasPermission) {

View File

@ -42,11 +42,14 @@ const { userInfo } = storeToRefs(store);
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const handleLogout = () => { const handleLogout = () => {
proxy.$modal.warning({ proxy.$modal.warning({
title: '提示', title: '提示',
content: '确定注销并退出登陆系统吗?', content: '确定注销并退出登陆系统吗?',
hideCancel: false, hideCancel: false,
onOk: () => { onOk: () => {
const store = useUserStore();
store.userLogut();
window.sessionStorage.removeItem('token'); window.sessionStorage.removeItem('token');
clearLocalStorage(); clearLocalStorage();
proxy.$router.push('/login'); proxy.$router.push('/login');

View File

@ -7,13 +7,13 @@
<template #icon> <template #icon>
<component :is="menu.icon" v-if="menu.icon"/> <component :is="menu.icon" v-if="menu.icon"/>
</template> </template>
<template #title>{{ menu.menu_name }}</template> <template #title>{{ menu.menu_title }}</template>
<sub-menu :menuList="menu.children" /> <sub-menu :menuList="menu.children" />
</a-sub-menu> </a-sub-menu>
<a-menu-item <a-menu-item
v-if="menu.parent_id!=0 && isRouteParams(menu.path)" v-if="menu.parent_id!=0 && isRouteParams(menu.path)"
:key="menu.path" :key="menu.path"
>{{ menu.menu_name }}</a-menu-item> >{{ menu.menu_title }}</a-menu-item>
</template> </template>
</template> </template>
<script setup> <script setup>

View File

@ -8,18 +8,16 @@ import router from './router/';
import { parseTime } from '@/utils/parseTime'; import { parseTime } from '@/utils/parseTime';
// Directive // Directive
//import permission from '@/directive/permission/permission'; import permission from '@/directive/permission/permission';
// 引入 Arco 图标库 // 引入 Arco 图标库
import * as ArcoIconModules from '@arco-design/web-vue/es/icon'; import * as ArcoIconModules from '@arco-design/web-vue/es/icon';
console.log(import.meta.env);
// Initialize the Pinia instance // Initialize the Pinia instance
const pinia = createPinia(); const pinia = createPinia();
const app = createApp(App); const app = createApp(App);
// app.directive('has', permission.checkPermission); app.directive('has', permission.checkPermission);
// 挂载全局变量 // 挂载全局变量
app.config.globalProperties.message = Message; app.config.globalProperties.message = Message;

View File

@ -80,7 +80,9 @@ router.beforeEach(async (to, from, next) => {
console.log(store.token,permissionStore.addRouters.length) console.log(store.token,permissionStore.addRouters.length)
if (store.token && permissionStore.addRouters.length==0) { if (store.token && permissionStore.addRouters.length==0) {
//store.getUserInfo(); //store.getUserInfo();
await permissionStore.getButtonRole();
await permissionStore.getMenuRole(); await permissionStore.getMenuRole();
console.log(permissionStore.addRouters)
permissionStore.addRouters.forEach((route) => { permissionStore.addRouters.forEach((route) => {
router.addRoute('/', route); router.addRoute('/', route);
}); });

View File

@ -1,7 +1,7 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { getUserMenuRole } from '@/api/admin/login'; import { getUserMenuRole,getUserButtonRole } from '@/api/admin/login';
// import { getCurrentInstance} from 'vue';
// const { proxy } = getCurrentInstance();
const modules = import.meta.glob('../views/**/*.vue'); const modules = import.meta.glob('../views/**/*.vue');
export const usePermissionStore = defineStore('permisson', { export const usePermissionStore = defineStore('permisson', {
@ -9,6 +9,7 @@ export const usePermissionStore = defineStore('permisson', {
return { return {
addRouters: [], addRouters: [],
menuList: [], menuList: [],
buttonPermissions:[]
}; };
}, },
getters: { getters: {
@ -19,43 +20,45 @@ export const usePermissionStore = defineStore('permisson', {
this.menuList = menus; this.menuList = menus;
}, },
GenerateRoutes(routeList) { GenerateRoutes(routeList) {
try {
const routes = []; const routes = [];
const buttons=[];
routeList.forEach((item) => { routeList.forEach((item) => {
const route = {}; const route = {};
route.path = item.path; if (item.menu_type ==1 || item.menu_type ==2) {
route.name = item.menu_title; route.path = item.path;
if (item.parent_id==0) { route.name = item.menu_name;
route.component = modules[`../views/index.vue`]; if (item.menu_type ==1) {
} else{ route.component = modules[`../views/index.vue`];
route.component = modules[`../views${item.component}.vue`] || modules['../views/error-page/888.vue']; } else if (item.menu_type ==2) {
route.component = modules[`../views${item.component}.vue`] || modules['../views/error-page/888.vue'];
}
route.meta = {
title: item.menu_title,
permission: item.permission,
};
}
if (item.children) {
route.children = this.GenerateRoutes(item.children);
} }
route.meta = {
title: item.menu_name,
permission: item.permission,
};
if (item.children) {
route.children = this.GenerateRoutes(item.children);
}
routes.push(route); routes.push(route);
// } // }
}); });
return routes; return routes;
} catch (error) {
}
}, },
async getMenuRole() { async getMenuRole() {
const res = await getUserMenuRole(); const res = await getUserMenuRole();
console.log(res.data);
this.setMenuList(res.data); this.setMenuList(res.data);
this.addRouters = await this.GenerateRoutes(res.data); this.addRouters =await this.GenerateRoutes(res.data);
console.log("--------this.addRouters"); },
console.log(this.addRouters); async getButtonRole() {
const {code,data,message} = await getUserButtonRole();
if(code==200){
this.buttonPermissions=data;
}else{
//proxy.$notification.error(message);
}
}, },
ClearMenuList() { ClearMenuList() {
this.menuList = []; this.menuList = [];

View File

@ -1,5 +1,6 @@
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { setLocalStorage, getLocalStorage } from '@/utils/storage'; import { setLocalStorage, getLocalStorage } from '@/utils/storage';
import {logout} from '@/api/admin/login'
import { getInfo } from '@/api/admin/sys-user'; import { getInfo } from '@/api/admin/sys-user';
import { getAppConfig } from '@/api/admin/login'; import { getAppConfig } from '@/api/admin/login';
@ -9,6 +10,7 @@ export const useUserStore = defineStore('user', {
token: window.sessionStorage.getItem('token') || '', token: window.sessionStorage.getItem('token') || '',
uid: window.sessionStorage.getItem('uid') || '', uid: window.sessionStorage.getItem('uid') || '',
sysConfig: getLocalStorage('sysConfig'), sysConfig: getLocalStorage('sysConfig'),
buttonPermissions:[],
userInfo:window.sessionStorage.getItem('manage-userInfo')?JSON.parse(window.sessionStorage.getItem('manage-userInfo')):'' userInfo:window.sessionStorage.getItem('manage-userInfo')?JSON.parse(window.sessionStorage.getItem('manage-userInfo')):''
} }
}, },
@ -46,10 +48,14 @@ export const useUserStore = defineStore('user', {
} catch (err) { } catch (err) {
console.error(err); console.error(err);
} }
},
async userLogut() {
const {code} = await logout();
if(code==200){
this.token = null;
this.userInfo = null;
} }
},
userLogout() {
this.token = null;
this.userInfo = null;
} }
}
}) })

View File

@ -1,14 +1,14 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<a-form :model="queryForm" ref="queryFormRef" layout="inline"> <a-form :model="queryForm" ref="queryFormRef" layout="inline">
<a-form-item field="title" label="标题"> <a-form-item field="api_name" label="标题">
<a-input v-model="queryForm.title" placeholder="请输入标题" @press-enter="handleQuery" /> <a-input v-model="queryForm.api_name" placeholder="请输入标题" @press-enter="handleQuery" />
</a-form-item> </a-form-item>
<a-form-item field="path" label="地址"> <a-form-item field="api_path" label="地址">
<a-input v-model="queryForm.path" placeholder="请输入地址" @press-enter="handleQuery" /> <a-input v-model="queryForm.api_path" placeholder="请输入地址" @press-enter="handleQuery" />
</a-form-item> </a-form-item>
<a-form-item field="action" label="类型"> <a-form-item field="action" label="类型">
<a-select v-model="queryForm.action" placeholder="请选择类型"> <a-select v-model="queryForm.api_method" placeholder="请选择类型">
<a-option>GET</a-option> <a-option>GET</a-option>
<a-option>POST</a-option> <a-option>POST</a-option>
<a-option>PUT</a-option> <a-option>PUT</a-option>
@ -43,12 +43,12 @@
'show-total': true, 'show-total': true,
'show-jumper': true, 'show-jumper': true,
'show-page-size': true, 'show-page-size': true,
total: pager.count, total: pager.total,
current: currentPage, current: currentPage,
}" }"
row-key="id" row-key="id"
@page-change="handlePageChange" @page-change="handlePageChange"
@page-size-change="handlePageSizeChange" @page-size-change="handlepage_sizeChange"
> >
<template #reqType="{ record }"> <template #reqType="{ record }">
<a-tag v-if="record.action.toLowerCase() === 'get'" color="cyan">{{record.action}}</a-tag> <a-tag v-if="record.action.toLowerCase() === 'get'" color="cyan">{{record.action}}</a-tag>
@ -71,25 +71,12 @@
> >
<template #title> 修改接口管理 </template> <template #title> 修改接口管理 </template>
<a-form :model="drawerForm" ref="drawerFormRef" :rules="rules"> <a-form :model="drawerForm" ref="drawerFormRef" :rules="rules">
<a-form-item field="handle" label="Handle"> <a-form-item field="api_name" label="标题">
<a-input v-model="drawerForm.handle" placeholder="请输入Handle" /> <a-input v-model="drawerForm.api_name" placeholder="请输入标题" />
</a-form-item>
<a-form-item field="title" label="标题">
<a-input v-model="drawerForm.title" placeholder="请输入标题" />
</a-form-item>
<a-form-item field="type" label="类型">
<a-select
v-model="drawerForm.type"
placeholder="请选择类型"
allow-clear
>
<a-option>SYS</a-option>
<a-option>BUS</a-option>
</a-select>
</a-form-item> </a-form-item>
<a-form-item field="action" label="方式"> <a-form-item field="action" label="方式">
<a-select <a-select
v-model="drawerForm.action" v-model="drawerForm.api_method"
placeholder="请选择请求方式" placeholder="请选择请求方式"
allow-clear allow-clear
> >
@ -100,7 +87,7 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item field="path" label="路径"> <a-form-item field="path" label="路径">
<a-input v-model="drawerForm.path" disabled /> <a-input v-model="drawerForm.api_path" disabled />
</a-form-item> </a-form-item>
</a-form> </a-form>
</a-drawer> </a-drawer>
@ -119,9 +106,9 @@ const currentPage = ref(1);
// Pager // Pager
const pager = { const pager = {
count: 0, total: 0,
pageIndex: 1, page: 1,
pageSize: 10, page_size: 10,
}; };
// From // From
@ -139,10 +126,10 @@ const drawerVisible = ref(false);
// Table Columns // Table Columns
const columns = [ const columns = [
{ title: '标题', dataIndex: 'title' }, { title: '标题', dataIndex: 'api_name' },
{ title: '请求类型', dataIndex: 'action', slotName: 'reqType' }, { title: '请求类型', dataIndex: 'api_method', slotName: 'api_method' },
{ title: '请求信息', dataIndex: 'path' }, { title: '请求链接', dataIndex: 'api_path' },
{ title: '创建时间', dataIndex: 'createdAt', slotName: 'createdAt' }, { title: '创建时间', dataIndex: 'created_at', slotName: 'created_at' },
{ title: '操作', slotName: 'action' }, { title: '操作', slotName: 'action' },
]; ];
@ -155,19 +142,19 @@ const handleDrawerSubmit = (done) => {
proxy.$refs.drawerFormRef.validate(async (valid) => { proxy.$refs.drawerFormRef.validate(async (valid) => {
if (!valid) { if (!valid) {
let res; let res;
if (!drawerForm.id) { if (!drawerForm.api_id) {
const { code, msg } = await addSysApi(drawerForm); const { code, message } = await addSysApi(drawerForm);
if (code == 200 ) { if (code == 200 ) {
proxy.$notification.success('新增成功'); proxy.$notification.success('新增成功');
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
} else { } else {
const { code, msg } = await updateSysApi(drawerForm, drawerForm.id); const { code, message } = await updateSysApi(drawerForm, drawerForm.api_id);
if (code == 200 ) { if (code == 200 ) {
proxy.$notification.success('修改成功'); proxy.$notification.success('修改成功');
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
} }
drawerVisible.value = false; drawerVisible.value = false;
@ -211,7 +198,7 @@ const handleUpdate = async (record) => {
* @param {Number} [page] * @param {Number} [page]
*/ */
const handlePageChange = (page) => { const handlePageChange = (page) => {
pager.pageIndex = page; pager.page = page;
// //
currentPage.value = page; currentPage.value = page;
@ -219,19 +206,19 @@ const handlePageChange = (page) => {
}; };
// //
const handlePageSizeChange = (pageSize) => { const handlepage_sizeChange = (page_size) => {
pager.pageSize = pageSize; pager.page_size = page_size;
getSysApiInfo({ ...pager, ...queryForm }); getSysApiInfo({ ...pager, ...queryForm });
}; };
// //
const getSysApiInfo = async (params = {}) => { const getSysApiInfo = async (params = {}) => {
const { data, code, msg } = await getSysApi(params); const { data, code, message } = await getSysApi(params);
if ( code == 200 ) { if ( code == 200 ) {
tableData.value = data.list; tableData.value = data.data;
Object.assign(pager, { count: data.count, pageIndex: data.pageIndex, pageSize: data.pageSize }); Object.assign(pager, { total: data.total, page: data.page, page_size: data.page_size });
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
}; };

View File

@ -1,18 +1,18 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<a-form :model="queryForm" ref="queryFormRef" layout="inline"> <a-form :model="queryForm" ref="queryFormRef" layout="inline">
<a-form-item field="deptName" label="部门名称"> <a-form-item field="dept_name" label="部门名称">
<a-input v-model="queryForm.deptName" placeholder="请输入部门名称" @press-enter="handleQuery" /> <a-input v-model="queryForm.dept_name" placeholder="请输入部门名称" @press-enter="handleQuery" />
</a-form-item> </a-form-item>
<a-form-item field="status" label="部门状态"> <a-form-item field="dept_status" label="部门状态">
<a-select v-model="queryForm.status" placeholder="请选择部门状态"> <a-select v-model="queryForm.dept_status" placeholder="请选择部门状态">
<a-option :value="2">正常</a-option> <a-option :value="2">正常</a-option>
<a-option :value="1">停用</a-option> <a-option :value="1">停用</a-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-space> <a-space>
<a-button v-has="'admin:sysDept:query'" type="primary" @click="handleQuery"><icon-search /> 搜索</a-button> <a-button type="primary" @click="handleQuery"><icon-search /> 搜索</a-button>
<a-button @click="handleResetQuery"><icon-loop /> 重置</a-button> <a-button @click="handleResetQuery"><icon-loop /> 重置</a-button>
</a-space> </a-space>
</a-form-item> </a-form-item>
@ -21,7 +21,7 @@
<a-divider /> <a-divider />
<div class="action"> <div class="action">
<a-button v-has="'admin:sysDept:add'" type="primary" @click="handleAdd()"><icon-plus /> 新增</a-button> <a-button type="primary" @click="handleAdd()"><icon-plus /> 新增</a-button>
</div> </div>
<!-- 异步数据需要defualt-expanded-keys 传入所有行Key才能默认展开 --> <!-- 异步数据需要defualt-expanded-keys 传入所有行Key才能默认展开 -->
@ -32,17 +32,17 @@
:default-expanded-keys="[1]" :default-expanded-keys="[1]"
row-key="deptId" row-key="deptId"
> >
<template #status="{ record }"> <template #dept_status="{ record }">
<a-tag color="green" v-if="record.status === 2">正常</a-tag> <a-tag color="green" v-if="record.dept_status === 2">正常</a-tag>
<a-tag color="red" v-else> 停用 </a-tag> <a-tag color="red" v-else> 停用 </a-tag>
</template> </template>
<template #createdAt="{ record }"> <template #created_at="{ record }">
{{ parseTime(record.createdAt) }} {{ parseTime(record.created_at) }}
</template> </template>
<template #action="{ record }"> <template #action="{ record }">
<a-button v-has="'admin:sysDept:edit'" type="text" @click="handleUpdate(record)"><icon-edit /> 修改</a-button> <a-button type="text" @click="handleUpdate(record)"><icon-edit /> 修改</a-button>
<a-button v-has="'admin:sysDept:add'" type="text" @click="handleAdd(record)"><icon-plus /> 新增</a-button> <a-button type="text" @click="handleAdd(record)"><icon-plus /> 新增</a-button>
<a-button v-has="'admin:sysDept:remove'" type="text" @click="() => { deleteVisible = true; deleteData = [record.deptId]; }"><icon-delete /> 删除</a-button> <a-button type="text" @click="() => { deleteVisible = true; deleteData = [record.dept_id]; }"><icon-delete /> 删除</a-button>
</template> </template>
</a-table> </a-table>
@ -57,29 +57,29 @@
<a-form :model="modalForm" :rules="rules" ref="modalFormRef"> <a-form :model="modalForm" :rules="rules" ref="modalFormRef">
<a-form-item field="parentId" label="上级部门"> <a-form-item field="parentId" label="上级部门">
<a-tree-select <a-tree-select
v-model="modalForm.parentId" v-model="modalForm.parent_id"
:data="tableData" :data="tableData"
:field-names="{ key: 'deptId', title: 'deptName' }" :field-names="{ key: 'dept_id', title: 'dept_name' }"
placeholder="请选择上级部门" placeholder="请选择上级部门"
allow-clear allow-clear
/> />
</a-form-item> </a-form-item>
<a-form-item field="deptName" label="部门名称"> <a-form-item field="dept_name" label="部门名称">
<a-input v-model="modalForm.deptName" placeholder="请输入部门名称" /> <a-input v-model="modalForm.dept_name" placeholder="请输入部门名称" />
</a-form-item> </a-form-item>
<a-form-item field="leader" label="负责人"> <!-- <a-form-item field="leader" label="负责人">
<a-input v-model="modalForm.leader" placeholder="请输入负责人" /> <a-input v-model="modalForm.leader" placeholder="请输入负责人" />
</a-form-item> </a-form-item>
<a-form-item field="phone" label="联系电话"> <a-form-item field="phone" label="联系电话">
<a-input v-model="modalForm.phone" placeholder="请输入联系电话" /> <a-input v-model="modalForm.phone" placeholder="请输入联系电话" />
</a-form-item> </a-form-item>
<a-form-item field="email" label="邮箱"> <a-form-item field="email" label="邮箱">
<a-input v-model="modalForm.email" placeholder="请输入邮箱" /> <a-input v-model="modalForm.email" placeholder="请输入邮箱" />
</a-form-item> </a-form-item>-->
<a-form-item field="status" label="部门状态"> <a-form-item field="status" label="部门状态">
<a-radio-group v-model="modalForm.status"> <a-radio-group v-model="modalForm.status">
<a-radio :value="2">正常</a-radio> <a-radio :value="1">正常</a-radio>
<a-radio :value="1">停用</a-radio> <a-radio :value="2">删除</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
</a-form> </a-form>
@ -89,6 +89,7 @@
<DeleteModal <DeleteModal
:data="deleteData" :data="deleteData"
:visible="deleteVisible" :visible="deleteVisible"
:delType="'dept_ids'"
:apiDelete="removeDept" :apiDelete="removeDept"
@deleteVisibleChange="() => deleteVisible = false" @deleteVisibleChange="() => deleteVisible = false"
/> />
@ -120,35 +121,31 @@ const modalTitle = ref('默认标题');
// Form // Form
const queryForm = reactive({}); const queryForm = reactive({});
const modalForm = reactive({ const modalForm = reactive({
status: 2, status: 1,
}); });
// rules // rules
const rules = { const rules = {
parentId: [{ required: true, message: '请选择上级部门' }], parent_id: [{ required: true, message: '请选择上级部门' }],
deptName: [{ required: true, message: '请输入部门名称' }], dept_name: [{ required: true, message: '请输入部门名称' }],
leader: [{ required: true, message: '请输入负责人' }], // leader: [{ required: true, message: '' }],
}; };
// Columns // Columns
const columns = [ const columns = [
{ {
title: '部门名称', title: '部门名称',
dataIndex: 'deptName', dataIndex: 'dept_name',
},
{
title: '排序',
dataIndex: 'sort',
},
{
title: '状态',
dataIndex: 'status',
slotName: 'status',
}, },
// {
// title: '',
// dataIndex: 'dept_status',
// slotName: 'dept_status',
// },
{ {
title: '创建时间', title: '创建时间',
dataIndex: 'createdAt', dataIndex: 'created_at',
slotName: 'createdAt', slotName: 'created_at',
}, },
{ {
title: '操作', title: '操作',
@ -173,11 +170,11 @@ const handleResetQuery = () => {
} }
// //
const handleAdd = ({ deptId, status = 2 } = {}) => { const handleAdd = ({ dept_id, dept_status = 2 } = {}) => {
modalVisible.value = true; modalVisible.value = true;
modalTitle.value = '新增部门'; modalTitle.value = '新增部门';
if (deptId) Object.assign(modalForm, {parentId: deptId, status}); if (dept_id) Object.assign(modalForm, {parent_id: dept_id, dept_status});
}; };
// //
@ -186,15 +183,15 @@ const handleUpdate = async (record) => {
modalTitle.value = '修改部门信息'; modalTitle.value = '修改部门信息';
await nextTick(); await nextTick();
const { parentId, deptName, leader, phone, email, status, deptId } = record; const { parent_id, dept_name, leader, phone, email, dept_status, dept_id } = record;
Object.assign(modalForm, { Object.assign(modalForm, {
parentId, parent_id,
deptName, dept_name,
leader, leader,
phone, phone,
email, email,
status, dept_status,
deptId, dept_id,
}); });
}; };
@ -203,9 +200,9 @@ function deepDelChildren(data) {
const depts = data; const depts = data;
let len = depts?.length; let len = depts?.length;
// let len = depts && depts.length; // let len = depts && depts.length;
for (let i = 0; i < len; i++) { for (let i = 0; i < len; i++) {
if (depts[i].children.length > 0) { if (depts[i].children && depts[i].children.length >0) {
deepDelChildren(depts[i].children); deepDelChildren(depts[i].children);
} else { } else {
delete depts[i].children; delete depts[i].children;
@ -220,19 +217,19 @@ const handleBeforeOk = (done) => {
proxy.$refs.modalFormRef.validate(async (err) => { proxy.$refs.modalFormRef.validate(async (err) => {
if (!err) { if (!err) {
let res; let res;
if (Reflect.has(modalForm, 'deptId')) { if (Reflect.has(modalForm, 'dept_id')) {
const { code, msg } = await updateDept(modalForm, modalForm.deptId); const { code, message } = await updateDept(modalForm, modalForm.dept_id);
if (code == 200 ) { if (code == 200 ) {
proxy.$notification.success('修改成功'); proxy.$notification.success('修改成功');
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
} else { } else {
const { code, msg } = await addDept(modalForm); const { code, message } = await addDept(modalForm);
if (code == 200 ) { if (code == 200 ) {
proxy.$notification.success('新增成功'); proxy.$notification.success('新增成功');
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
} }
done(); done();
@ -246,11 +243,11 @@ const handleBeforeOk = (done) => {
// //
const getDeptInfo = async (params = {}) => { const getDeptInfo = async (params = {}) => {
const { data, code, msg } = await getDept(params); const { data, code, message } = await getDept(params);
if ( code == 200 ) { if ( code == 200 ) {
tableData.value = deepDelChildren(data); tableData.value = deepDelChildren(data);
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
}; };

View File

@ -53,7 +53,7 @@
</a-table> </a-table>
<!-- 菜单管理新增与提交弹窗 --> <!-- 菜单管理新增与提交弹窗 -->
<a-modal v-model:visible="modalVisible" :title="modalTitle" title-align="start" :width="800" modal-class="menu-modal" @before-ok="handleSubmit" @close="() => {$refs.modalFormRef.resetFields(); modalForm.menuId = null;}"> <a-modal v-model:visible="modalVisible" :title="modalTitle" title-align="start" width="800" modal-class="menu-modal" @before-ok="handleSubmit" @close="() => {$refs.modalFormRef.resetFields(); modalForm.menuId = null;}">
<a-form :model="modalForm" :rules="modalRules" ref="modalFormRef" auto-label-width label-align="left"> <a-form :model="modalForm" :rules="modalRules" ref="modalFormRef" auto-label-width label-align="left">
<a-form-item field="menu_type" label="菜单类型"> <a-form-item field="menu_type" label="菜单类型">
<a-radio-group v-model="modalForm.menu_type"> <a-radio-group v-model="modalForm.menu_type">
@ -65,12 +65,12 @@
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :span="12"> <a-col :span="12">
<a-form-item field="parent_id" label="上级菜单"> <a-form-item field="parent_id" label="上级菜单">
<a-tree-select v-model="modalForm.parent_id" :data="tableData" :field-names="{ key: 'menu_id', icon: '_' ,title:'menu_name'}" :allow-search="true" :filter-tree-node="filterTreeNode" placeholder="请选择上级菜单"/> <a-tree-select v-model="modalForm.parent_id" :data="tableData" :field-names="{ key: 'menu_id', icon: '_' ,title:'menu_title'}" :allow-search="true" :filter-tree-node="filterTreeNode" placeholder="请选择上级菜单"/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="menu_name" label="菜单标题"> <a-form-item field="menu_title" label="菜单标题">
<a-input v-model="modalForm.menu_name" placeholder="请输入菜单标题" /> <a-input v-model="modalForm.menu_title" placeholder="请输入菜单标题" />
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
@ -94,7 +94,7 @@
<a-col :span="12" v-if="modalForm.menu_type !== 3 && modalForm.menu_type"> <a-col :span="12" v-if="modalForm.menu_type !== 3 && modalForm.menu_type">
<a-form-item field="menu_title" label="路由名称"> <a-form-item field="menu_title" label="路由名称">
<a-input v-model="modalForm.menu_title" placeholder="请输入路由名称" /> <a-input v-model="modalForm.menu_name" placeholder="请输入路由名称" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12" v-if="modalForm.menu_type !== 3 && modalForm.menu_type"> <a-col :span="12" v-if="modalForm.menu_type !== 3 && modalForm.menu_type">
@ -109,11 +109,11 @@
<a-input v-model="modalForm.path" placeholder="请输入路由地址" /> <a-input v-model="modalForm.path" placeholder="请输入路由地址" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<!-- <a-col :span="12" v-if="modalForm.menuType === 'C' || modalForm.menuType === 'F'"> <a-col :span="12" v-if="modalForm.menu_type == 2 || modalForm.menu_type == 3">
<a-form-item field="permission" label="权限标识"> <a-form-item field="permission" label="权限标识">
<a-input v-model="modalForm.permission" placeholder="请输入权限标识"/> <a-input v-model="modalForm.permission" placeholder="请输入权限标识"/>
</a-form-item> </a-form-item>
</a-col> --> </a-col>
</a-row> </a-row>
<!-- <a-form-item field="isFrame" label="是否外链" v-if="modalForm.menuType !== 'F'"> <!-- <a-form-item field="isFrame" label="是否外链" v-if="modalForm.menuType !== 'F'">
<a-radio-group v-model="modalForm.isFrame"> <a-radio-group v-model="modalForm.isFrame">
@ -122,14 +122,18 @@
</a-radio-group> </a-radio-group>
</a-form-item> --> </a-form-item> -->
<a-form-item field="menu_status" label="菜单状态" v-if="modalForm.menuType !== 'F'"> <a-form-item field="menu_status" label="菜单状态" v-if="modalForm.menuType !== 'F'">
<a-radio-group v-model="modalForm.menu_status"> <a-radio-group v-model="modalForm.menu_status" :disabled="modalForm.menu_id?true:false">
<a-radio :value="0">显示</a-radio> <a-radio :value="0">显示</a-radio>
<a-radio :value="1">隐藏</a-radio> <a-radio :value="1">隐藏</a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<a-form-item field="api_ids" label="API权限" v-if="modalForm.menu_type !== 1 && modalForm.menu_type"> <a-row :gutter="24">
<a-transfer v-model:model-value="modalForm.api_ids" :data="transferData" :title="['未授权', '已授权']" show-search /> <a-col :span="24">
</a-form-item> <a-form-item field="apis" label="API权限" v-if="modalForm.menu_type !== 1 && modalForm.menu_type">
<a-transfer v-model:model-value="modalForm.apis" :data="transferData" :title="['未授权', '已授权']" show-search />
</a-form-item>
</a-col>
</a-row>
</a-form> </a-form>
</a-modal> </a-modal>
@ -149,7 +153,7 @@
import { onMounted, reactive, ref, getCurrentInstance, computed, watch, watchEffect } from 'vue'; import { onMounted, reactive, ref, getCurrentInstance, computed, watch, watchEffect } from 'vue';
import * as ArcoIconModules from '@arco-design/web-vue/es/icon'; import * as ArcoIconModules from '@arco-design/web-vue/es/icon';
import { getMenu } from '@/api/admin/menu'; import { getMenu } from '@/api/admin/menu';
import { getSysApi } from '@/api/admin/sys-api'; import { getSysApiList } from '@/api/admin/sys-api';
import { addMenu, removeMenu, updateMenu, getMenuDetails } from '@/api/admin/menu'; import { addMenu, removeMenu, updateMenu, getMenuDetails } from '@/api/admin/menu';
// Akiraka 20230210 // Akiraka 20230210
@ -161,7 +165,7 @@ watch(() => deleteVisible.value ,(value) => {
if ( value == false ) { if ( value == false ) {
getSysMenuInfo(pager); getSysMenuInfo(pager);
} }
}) });
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
@ -193,7 +197,11 @@ function useQueryData() {
// //
const modalForm = reactive({ const modalForm = reactive({
menu_type: '', menu_type: '',
menu_status: 0, menu_status: null,
menu_id:'',
api_ids:[],
menu_name:'',
menu_title:'',
}); });
// //
@ -225,7 +233,7 @@ watchEffect(() => {
// Table // Table
const columns = [ const columns = [
{ title: '菜单名称', dataIndex: 'menu_name',width: "220" }, { title: '菜单名称', dataIndex: 'menu_title',width: "220" },
// { title: '', dataIndex: 'icon', slotName: 'icon' }, // { title: '', dataIndex: 'icon', slotName: 'icon' },
{ title: '路由地址', dataIndex: 'path', width: "400" }, { title: '路由地址', dataIndex: 'path', width: "400" },
{ title: '组件地址', dataIndex: 'component', width: "300" }, { title: '组件地址', dataIndex: 'component', width: "300" },
@ -245,16 +253,16 @@ const modalVisible = ref(false);
const modalTitle = ref('默认标题'); const modalTitle = ref('默认标题');
// //
const handleAddMenu = (parentId = null) => { const handleAddMenu = (parent_id = null) => {
modalVisible.value = true; modalVisible.value = true;
modalTitle.value = '新增菜单'; modalTitle.value = '新增菜单';
if (parentId) modalForm.parentId = parentId; if (parent_id) modalForm.parent_id = parent_id;
getSysMenuInfo(); getSysMenuInfo();
}; };
// TreeSearchFilter // TreeSearchFilter
const filterTreeNode = (searchVal, nodeData) => { const filterTreeNode = (searchVal, nodeData) => {
return nodeData.title.indexOf(searchVal) > -1; return nodeData.menu_name.indexOf(searchVal) > -1;
}; };
// //
@ -270,6 +278,9 @@ const handleUpdate = async (record) => {
const handleSubmit = (done) => { const handleSubmit = (done) => {
proxy.$refs.modalFormRef.validate(async (valid) => { proxy.$refs.modalFormRef.validate(async (valid) => {
if (!valid) { if (!valid) {
if(modalForm.menu_type==3){
modalForm.menu_name=modalForm.menu_title
};
if (!modalForm.menu_id) { if (!modalForm.menu_id) {
console.log("dasdasd",modalForm) console.log("dasdasd",modalForm)
const {code,message} = await addMenu(modalForm); const {code,message} = await addMenu(modalForm);
@ -297,24 +308,24 @@ const handleSubmit = (done) => {
// //
const getSysMenuInfo = async (params = {}) => { const getSysMenuInfo = async (params = {}) => {
const { code, data, msg } = await getMenu(params); const { code, data, message } = await getMenu(params);
console.log(data); console.log(data);
if ( code == 200 ) { if ( code == 200 ) {
tableData.value = data; tableData.value = data;
} else { } else {
proxy.$notification.error(msg) proxy.$notification.error(message)
} }
}; };
// API // API
const getSysApiInfo = async () => { const getSysApiInfo = async () => {
const { code, data, msg } = await getSysApi({ pageSize: 10000, type: 'BUS' }); const { code, data, message } = await getSysApiList();
if ( code == 200 ) { if ( code == 200 ) {
transferData.value = data.list.map((item) => { transferData.value = data.map((item) => {
return { value: item.id, label: item.title }; return { value: item.api_id, label: item.api_name };
}); });
} else { } else {
proxy.$notification.error(msg) proxy.$notification.error(message)
} }
}; };
@ -330,10 +341,13 @@ const parseIconName = computed(() => {
return iconNameList; return iconNameList;
}); });
const parent_id=computed(()=>{
return modalForm.parent_id==0?'无':modalForm.parent_id
})
onMounted(() => { onMounted(() => {
getSysMenuInfo(); getSysMenuInfo();
//getSysApiInfo(); getSysApiInfo();
}); });
</script> </script>
@ -351,6 +365,7 @@ onMounted(() => {
/* 覆盖默认穿梭框样式 */ /* 覆盖默认穿梭框样式 */
.menu-modal { .menu-modal {
width:800px;
.arco-transfer-view { .arco-transfer-view {
height: 350px; height: 350px;
width: 250px; width: 250px;

View File

@ -1,21 +1,13 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<a-form :model="queryForm" ref="queryFormRef" layout="inline"> <a-form :model="queryForm" ref="queryFormRef" layout="inline">
<a-form-item field="postCode" label="岗位编码">
<a-input v-model="queryForm.postCode" placeholder="请输入岗位编码" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="postName" label="岗位名称"> <a-form-item field="postName" label="岗位名称">
<a-input v-model="queryForm.postName" placeholder="请输入岗位名称" @press-enter="handleQuery" /> <a-input v-model="queryForm.post_name" placeholder="请输入岗位名称" @press-enter="handleQuery" />
</a-form-item>
<a-form-item field="status" label="岗位状态">
<a-select v-model="queryForm.status" placeholder="请选择岗位状态" :style="{ width: '181px' }">
<a-option :value="2">正常</a-option>
<a-option :value="1">停用</a-option>
</a-select>
</a-form-item> </a-form-item>
<a-form-item> <a-form-item>
<a-space> <a-space>
<a-button v-has="'admin:sysPost:query'" type="primary" @click="handleQuery"><icon-search /> 搜索</a-button> <a-button type="primary" @click="handleQuery"><icon-search /> 搜索</a-button>
<a-button @click="handleResetQuery"><icon-loop /> 重置</a-button> <a-button @click="handleResetQuery"><icon-loop /> 重置</a-button>
</a-space> </a-space>
</a-form-item> </a-form-item>
@ -26,9 +18,8 @@
<!-- action --> <!-- action -->
<div class="action"> <div class="action">
<a-space> <a-space>
<a-button v-has="'admin:sysPost:add'" type="primary" @click="handleAdd"><icon-plus /> 新增 </a-button> <a-button v-has="'admin:sysPost:add'" type="primary" @click="handleAdd"><icon-plus /> 新增 </a-button>
<a-button v-has="'admin:sysPost:remove'" type="primary" status="danger" @click="() => { deleteVisible = true; }"><icon-delete /> 批量删除 </a-button> <a-button v-has="'admin:sysPost:remove'" type="primary" status="danger" @click="() => { deleteVisible = true; }"><icon-delete /> 批量删除 </a-button>
<a-button type="primary" status="warning" disabled><icon-download /> 导出 </a-button>
</a-space> </a-space>
</div> </div>
@ -36,24 +27,24 @@
<a-table <a-table
:columns="columns" :columns="columns"
:data="tableData" :data="tableData"
:pagination="{ 'show-total': true, 'show-jumper': true, 'show-page-size': true, total: pager.count, current: currentPage }" :pagination="{ 'show-total': true, 'show-jumper': true, 'show-page-size': true, total: pager.total, current: currentPage }"
:row-selection="{ type: 'checkbox', showCheckedAll: true }" :row-selection="{ type: 'checkbox', showCheckedAll: true }"
row-key="postId" row-key="post_id"
@selection-change="(selection) => {deleteData = selection;}" @selection-change="(selection) => {deleteData = selection;}"
@page-change="handlePageChange" @page-change="handlePageChange"
@page-size-change="handlePageSizeChange" @page-size-change="handlepage_sizeChange"
> >
<template #createdAt="{ record }"> <template #createdAt="{ record }">
{{ parseTime(record.createdAt) }} {{ parseTime(record.createdAt) }}
</template> </template>
<template #status="{ record }"> <!-- <template #dept_status="{ record }">
<a-tag v-if="record.status == 2" color="green">正常</a-tag> <a-tag v-if="record.dept_status == 1" color="green">正常</a-tag>
<a-tag v-else color="red">停用</a-tag> <a-tag v-else color="red">删除</a-tag>
</template> </template> -->
<template #action="{ record }"> <template #action="{ record }">
<a-space> <a-space>
<a-button v-has="'admin:sysPost:edit'" type="text" @click="handleUpdate(record)"><icon-edit /> 修改</a-button> <a-button v-has="'admin:sysPost:edit'" type="text" @click="handleUpdate(record)"><icon-edit /> 修改</a-button>
<a-button v-has="'admin:sysPost:remove'" type="text" @click="() => { deleteVisible = true; deleteData = [record.postId]; }"><icon-delete /> 删除</a-button> <a-button v-has="'admin:sysPost:remove'" type="text" @click="() => { deleteVisible = true; deleteData = [record.post_id]; }"><icon-delete /> 删除</a-button>
</a-space> </a-space>
</template> </template>
</a-table> </a-table>
@ -64,24 +55,14 @@
:title="modalTitle" :title="modalTitle"
title-align="start" title-align="start"
@before-ok="handleSubmit" @before-ok="handleSubmit"
@close="() => {$refs.modalFormRef.resetFields(); modalForm.postId = null;}" @close="() => {$refs.modalFormRef.resetFields(); modalForm.post_id = null;}"
> >
<a-form :model="modalForm" :rules="rules" ref="modalFormRef"> <a-form :model="modalForm" :rules="rules" ref="modalFormRef">
<a-form-item field="postName" label="岗位名称"> <a-form-item field="post_name" label="岗位名称">
<a-input v-model="modalForm.postName" placeholder="请输入岗位名称" /> <a-input v-model="modalForm.post_name" placeholder="请输入岗位名称" />
</a-form-item> </a-form-item>
<a-form-item field="postCode" label="岗位编码">
<a-input v-model="modalForm.postCode" placeholder="请输入岗位编码" /> <!-- <a-form-item field="status" label="岗位状态">
</a-form-item>
<a-form-item field="sort" label="岗位排序">
<a-input-number
v-model="modalForm.sort"
mode="button"
:default-value="0"
:style="{ width: '150px' }"
/>
</a-form-item>
<a-form-item field="status" label="岗位状态">
<a-radio-group v-model="modalForm.status"> <a-radio-group v-model="modalForm.status">
<a-radio :value="2"> 正常 </a-radio> <a-radio :value="2"> 正常 </a-radio>
<a-radio :value="1"> 停用 </a-radio> <a-radio :value="1"> 停用 </a-radio>
@ -89,7 +70,7 @@
</a-form-item> </a-form-item>
<a-form-item field="remark" label="备注"> <a-form-item field="remark" label="备注">
<a-textarea v-model="modalForm.remark" placeholder="请输入备注内容" /> <a-textarea v-model="modalForm.remark" placeholder="请输入备注内容" />
</a-form-item> </a-form-item> -->
</a-form> </a-form>
</a-modal> </a-modal>
@ -125,22 +106,20 @@ const { proxy } = getCurrentInstance();
const currentPage = ref(1); const currentPage = ref(1);
// Pager // Pager
const pager = { const pager = {
count: 0, total: 0,
pageIndex: 1, page: 1,
pageSize: 10, page_size: 10,
}; };
// form // form
const queryForm = reactive({}); const queryForm = reactive({});
const modalForm = reactive({ const modalForm = reactive({
sort: 0, sort: 0,
status: 2, status: 1,
}); });
// Rules // Rules
const rules = { const rules = {
postName: [{ required: true, message: '请输入岗位名称' }], post_name: [{ required: true, message: '请输入岗位名称' }]
postCode: [{ required: true, message: '请输入岗位编码' }],
sort: [{ required: true, message: '请选择岗位排序' }],
}; };
// Modal // Modal
@ -152,12 +131,9 @@ let batchList = [];
// Table Columns // Table Columns
const columns = [ const columns = [
{ title: '岗位编号', dataIndex: 'postId' }, { title: '岗位编号', dataIndex: 'post_id' },
{ title: '岗位编码', dataIndex: 'postCode' }, { title: '岗位名称', dataIndex: 'post_name' },
{ title: '岗位名称', dataIndex: 'postName' }, { title: '创建时间', dataIndex: 'created_at', slotName: 'created_at' },
{ title: '岗位排序', dataIndex: 'sort' },
{ title: '状态', dataIndex: 'status', slotName: 'status' },
{ title: '创建时间', dataIndex: 'createdAt', slotName: 'createdAt' },
{ title: '操作', slotName: 'action' }, { title: '操作', slotName: 'action' },
]; ];
@ -185,19 +161,21 @@ const handleSubmit = (done) => {
proxy.$refs.modalFormRef.validate(async (valid) => { proxy.$refs.modalFormRef.validate(async (valid) => {
if (!valid) { if (!valid) {
let res; let res;
if (!modalForm.postId) { if (!modalForm.post_id) {
const { code, msg } = await addPost(modalForm); const { code, message } = await addPost(modalForm);
if (code == 200 ) { if (code == 200 ) {
proxy.$notification.success('新增成功'); proxy.$notification.success('新增成功');
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
} else { } else {
const { code, msg } = await updatePost(modalForm, modalForm.postId); console.log("post_id:"+modalForm.post_id)
const { code, message } = await updatePost(modalForm, modalForm.post_id);
if (code == 200 ) { if (code == 200 ) {
proxy.$notification.success('更新成功'); proxy.$notification.success('更新成功');
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
} }
done(); done();
@ -218,7 +196,7 @@ const handleBatchDelete = () => {
hideCancel: false, hideCancel: false,
onOk: async () => { onOk: async () => {
const res = await removePost({ ids: batchList }); const res = await removePost({ ids: batchList });
proxy.$message.success(res.msg); proxy.$message.success(res.message);
getPostInfo(pager); getPostInfo(pager);
}, },
onCancel: () => { onCancel: () => {
@ -235,7 +213,7 @@ const handleBatchDelete = () => {
* @param {Number} [page] * @param {Number} [page]
*/ */
const handlePageChange = (page) => { const handlePageChange = (page) => {
pager.pageIndex = page; pager.page = page;
// //
currentPage.value = page; currentPage.value = page;
@ -243,27 +221,27 @@ const handleBatchDelete = () => {
}; };
// //
const handlePageSizeChange = (pageSize) => { const handlepage_sizeChange = (page_size) => {
pager.pageSize = pageSize; pager.page_size = page_size;
getPostInfo({ ...pager, ...queryForm }); getPostInfo({ ...pager, ...queryForm });
}; };
// //
const getPostInfo = async (params = {}) => { const getPostInfo = async (params = {}) => {
const { data, code, msg } = await getPost(params); const { data, code, message } = await getPost(params);
if ( code == 200 ) { if ( code == 200 ) {
tableData.value = data.list; tableData.value = data.data;
Object.assign(pager, { count: data.count, pageIndex: data.pageIndex, pageSize: data.pageSize }); Object.assign(pager, { total: data.total, page: data.page, page_size: data.page_size });
} else { } else {
proxy.$notification.error(msg); proxy.$notification.error(message);
} }
}; };
// //
const handleQuery = async () => { const handleQuery = async () => {
const params = { const params = {
pageIndex: pager.pageIndex, page: pager.page,
pageSize: pager.pageSize, page_size: pager.page_size,
...queryForm, ...queryForm,
}; };

View File

@ -101,15 +101,15 @@
<a-radio :value="1"></a-radio> <a-radio :value="1"></a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
<div>{{checkedKeys}}</div>
<a-form-item label="权限设置"> <a-form-item label="权限设置">
<a-tree <a-tree
v-model:checked-keys="checkedKeys" v-model:checked-keys="checkedKeys"
:checkable="true" :checkable="true"
:check-strictly="false" :check-strictly="false"
:data="treeData" :data="treeData"
:default-expand-all="false" :default-expand-all="true"
:field-names="{ key: 'menu_id', title: 'menu_name',icon: '_' }" :field-names="{ key: 'menu_id', title: 'menu_title',icon: '_'}"
/> />
</a-form-item> </a-form-item>
<!-- <!--
@ -329,19 +329,21 @@
const { code, data, message } = await roleDetail(record.role_id); const { code, data, message } = await roleDetail(record.role_id);
if (code == 200) { if (code == 200) {
Object.assign(modalForm, data); Object.assign(modalForm, data);
checkedKeys.value = data.menu_ids; checkedKeys.value = data.menu_ids;
// console.log(data.menu_ids)
// checkedKeys id
} else { } else {
proxy.$notification.error(message); proxy.$notification.error(message);
} }
//await nextTick(); //await nextTick();
//Object.assign(modalForm, record); //Object.assign(modalForm, record);
// checkedKeys id const menuIdsChecked = [];
// const menuIdsChecked = []; data.menu_ids.forEach((item) => {
// record.sysMenu.forEach((item) => { menuIdsChecked.push(item);
// menuIdsChecked.push(new String(item.menu_id)); });
// }); checkedKeys.value = menuIdsChecked;
// checkedKeys.value = menuIdsChecked;
}; };
// //

View File

@ -1,8 +1,9 @@
<template> <template>
<div class="tree-container"> <div class="tree-container">
<a-tree <a-tree
ref="treeRef"
:data="props.data" :data="props.data"
:field-names="{ key: 'deptId', title: 'deptName' }" :field-names="{ key: 'dept_id', title: 'dept_name' }"
block-node block-node
@select="handleTreeSelect" @select="handleTreeSelect"
/> />
@ -10,18 +11,25 @@
</template> </template>
<script setup> <script setup>
import {ref} from 'vue'
const props = defineProps({ const props = defineProps({
data: { data: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
}); });
const treeRef=ref(null)
const emits = defineEmits(['nodeClick']); const emits = defineEmits(['nodeClick']);
const resetTree=()=>{
const handleTreeSelect = (selectKeys) => { treeRef.value.selectAll(false)
emits('nodeClick', { deptId: `/${selectKeys}/` });
} }
const handleTreeSelect = (selectKeys) => {
emits('nodeClick', { dept_id: `${selectKeys}` });
}
defineExpose({
resetTree
});
</script> </script>
<style lang="scss"> <style lang="scss">

View File

@ -2,11 +2,11 @@
<div class="app-container"> <div class="app-container">
<!-- Query --> <!-- Query -->
<a-form ref="queryFormRef" :model="queryForm" layout="inline"> <a-form ref="queryFormRef" :model="queryForm" layout="inline">
<a-form-item field="deptName" label="部门名称"> <a-form-item field="dept_name" label="部门名称">
<a-input v-model="queryForm.deptName" placeholder="请输入部门名称" @press-enter="handleQuery" /> <a-input v-model="queryForm.dept_name" placeholder="请输入部门名称" @press-enter="handleQuery" />
</a-form-item> </a-form-item>
<a-form-item field="username" label="用户名称"> <a-form-item field="access" label="用户昵称">
<a-input v-model="queryForm.nick_name" placeholder="请输入用户名称" @press-enter="handleQuery" /> <a-input v-model="queryForm.nick_name" placeholder="请输入称" @press-enter="handleQuery" />
</a-form-item> </a-form-item>
<a-form-item field="phone" label="手机号码"> <a-form-item field="phone" label="手机号码">
<a-input v-model="queryForm.phone" placeholder="请输入用户手机号" @press-enter="handleQuery" /> <a-input v-model="queryForm.phone" placeholder="请输入用户手机号" @press-enter="handleQuery" />
@ -17,12 +17,36 @@
placeholder="请选择用户状态" placeholder="请选择用户状态"
:style="{ width: '205px' }" :style="{ width: '205px' }"
> >
<a-option :value="2">正常</a-option> <!-- 1:正常 2:审核中 3:审核失败 -->
<a-option :value="1">停用</a-option> <a-option :value="1">正常</a-option>
<a-option :value="2">审核中</a-option>
<a-option :value="3">审核失败</a-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
<a-divider direction="vertical" :style="{ height: '30px' }" /> <!-- <a-divider direction="vertical" :style="{ height: '30px' }" /> -->
<a-form-item field="is_deleted" label="删除状态">
<a-select
v-model="queryForm.is_deleted"
placeholder="请选择删除状态"
:style="{ width: '182px' }"
>
<!-- 1:正常 2:审核中 3:审核失败 -->
<a-option :value="1"></a-option>
<a-option :value="0"></a-option>
</a-select>
</a-form-item>
<a-form-item field="is_disabled" label="禁用状态">
<a-select
v-model="queryForm.is_disabled"
placeholder="请选择禁用状态"
:style="{ width: '182px' }"
>
<!-- 1:正常 2:审核中 3:审核失败 -->
<a-option :value="1"></a-option>
<a-option :value="0"></a-option>
</a-select>
</a-form-item>
<a-form-item class="form-action"> <a-form-item class="form-action">
<a-space size="medium"> <a-space size="medium">
<a-button type="primary" @click="handleQuery"><icon-search /> 搜索</a-button> <a-button type="primary" @click="handleQuery"><icon-search /> 搜索</a-button>
@ -38,7 +62,7 @@
<a-row> <a-row>
<a-col :span="4"> <a-col :span="4">
<!-- tree组件只在组件第一次渲染时展开此处等待数据加载完成再渲染组件 --> <!-- tree组件只在组件第一次渲染时展开此处等待数据加载完成再渲染组件 -->
<tree-dept v-if="treeDeptData" :data="treeDeptData" @node-click="getSysUserInfo" /> <tree-dept v-if="treeDeptData" ref="treeRef_parent" :data="treeDeptData" @nodeClick="getSysUserInfo" :selectedKeys="queryForm.dept_id" />
</a-col> </a-col>
<a-col :span="20"> <a-col :span="20">
<!-- Action --> <!-- Action -->
@ -59,19 +83,17 @@
@page-change="handlePageChange" @page-change="handlePageChange"
@page-size-change="handlePageSizeChange" @page-size-change="handlePageSizeChange"
> >
<template #user_id="{record,rowIndex}">
<div>{{(rowIndex+1)+(pager.page-1)*10}}</div>
</template>
<template #role_name="{ record }"> <template #role_name="{ record }">
{{ record.role.role_name}} {{ record.role.role_name}}
</template> </template>
<template #dept="{ record }"> <template #dept_name="{ record }">
{{ record.dept.dept_name }} {{ record.dept?.dept_name }}
</template> </template>
<template #role_status="{ record }"> <template #status="{ record }">
<a-switch
v-model="record.role_status"
:checked-value="2"
:unchecked-value="1"
@change="handleSwitchChange(record)"
/>
</template> </template>
<template #created_at="{ record }"> <template #created_at="{ record }">
{{ parseTime(record.created_at) }} {{ parseTime(record.created_at) }}
@ -104,19 +126,27 @@
> >
<a-row :gutter="16"> <a-row :gutter="16">
<a-col :span="12"> <a-col :span="12">
<a-form-item field="nickName" label="用户昵称"> <a-form-item field="access" label="账号名称">
<a-input <a-input
v-model="modalForm.nickName" v-model="modalForm.access"
placeholder="请输入账号名称"
/>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item field="nick_name" label="用户昵称">
<a-input
v-model="modalForm.nick_name"
placeholder="请输入用户昵称" placeholder="请输入用户昵称"
/> />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="deptId" label="所属部门"> <a-form-item field="dept_id" label="所属部门">
<a-tree-select <a-tree-select
v-model="modalForm.deptId" v-model="modalForm.dept_id"
:data="treeDeptData" :data="treeDeptData"
:field-names="{ key: 'deptId', title: 'deptName' }" :field-names="{ key: 'dept_id', title: 'dept_name' }"
placeholder="请选择所属部门" placeholder="请选择所属部门"
/> />
</a-form-item> </a-form-item>
@ -126,19 +156,29 @@
<a-input v-model="modalForm.phone" placeholder="请输入手机号码" /> <a-input v-model="modalForm.phone" placeholder="请输入手机号码" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="email" label="邮箱"> <a-form-item field="email" label="邮箱">
<a-input v-model="modalForm.email" placeholder="请输入邮箱" /> <a-input v-model="modalForm.email" placeholder="请输入邮箱" />
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="username" label="用户名称"> <a-form-item field="is_deleted" label="是否删除">
<a-input <!-- 1:正常 2:审核中 3:审核失败 -->
v-model="modalForm.username" <a-radio-group v-model="modalForm.is_deleted">
placeholder="请输入用户名称" <a-radio :value="1"> </a-radio>
/> <a-radio :value="0"> </a-radio>
</a-radio-group>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12">
<a-form-item field="is_deleted" label="是否禁用">
<!-- 1:正常 2:审核中 3:审核失败 -->
<a-radio-group v-model="modalForm.is_disabled">
<a-radio :value="1"> </a-radio>
<a-radio :value="0"> </a-radio>
</a-radio-group>
</a-form-item>
</a-col>
<a-col v-if="!modalForm.user_id" :span="12"> <a-col v-if="!modalForm.user_id" :span="12">
<a-form-item field="password" label="用户密码"> <a-form-item field="password" label="用户密码">
<a-input-password <a-input-password
@ -150,47 +190,46 @@
<a-col :span="12"> <a-col :span="12">
<a-form-item field="sex" label="用户性别"> <a-form-item field="sex" label="用户性别">
<a-select v-model="modalForm.sex" placeholder="请选择用户性别"> <a-select v-model="modalForm.sex" placeholder="请选择用户性别">
<a-option value="0"> </a-option> <a-option :value="1"> </a-option>
<a-option value="1"> </a-option> <a-option :value="2"> </a-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="status" label="状态"> <a-form-item field="status" label="状态">
<!-- 1:正常 2:审核中 3:审核失败 -->
<a-radio-group v-model="modalForm.status"> <a-radio-group v-model="modalForm.status">
<a-radio value="2"> 正常 </a-radio> <a-radio :value="1"> 正常 </a-radio>
<a-radio value="1"> 停用 </a-radio> <a-radio :value="2"> 审核中 </a-radio>
<a-radio :value="3"> 审核失败 </a-radio>
</a-radio-group> </a-radio-group>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="postId" label="岗位"> <a-form-item field="post_id" label="岗位">
<a-select v-model="modalForm.postId" placeholder="请选择岗位"> <a-select v-model="modalForm.post_id" placeholder="请选择岗位">
<a-option <a-option
v-for="item in postList" v-for="item in postList"
:key="item.postId" :key="item.post_id"
:value="item.postId" :value="item.post_id"
:label="item.postName" :label="item.post_name"
/> />
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :span="12"> <a-col :span="12">
<a-form-item field="roleId" label="角色"> <a-form-item field="role_id" label="角色">
<a-select v-model="modalForm.roleId" placeholder="请选择角色"> <a-select v-model="modalForm.role_id" placeholder="请选择角色">
<a-option <a-option
:key="item.role_id"
v-for="item in roleList" v-for="item in roleList"
:key="item.roleId" :value="item.role_id"
:value="item.roleId" :label="item.role_name"
:label="item.roleName"
/> />
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
<a-form-item field="remark" label="备注">
<a-textarea placeholder="请输入备注" allow-clear />
</a-form-item>
</a-form> </a-form>
</a-modal> </a-modal>
@ -206,16 +245,16 @@
:rules="resetPwdRules" :rules="resetPwdRules"
auto-label-width auto-label-width
> >
<a-form-item field="password" label="密码"> <a-form-item field="password" label="密码">
<a-input-password <a-input-password
v-model="resetPwdForm.password" v-model="resetPwdForm.password"
placeholder="请输入密码" placeholder="请输入密码"
/> />
</a-form-item> </a-form-item>
<a-form-item field="repeatPwd" label="确认密码"> <a-form-item field="password" label="新密码">
<a-input-password <a-input-password
v-model="resetPwdForm.repeatPwd" v-model="resetPwdForm.new_password"
placeholder="请输入确认密码" placeholder="请输入密码"
/> />
</a-form-item> </a-form-item>
</a-form> </a-form>
@ -225,6 +264,7 @@
<DeleteModal <DeleteModal
:data="deleteData" :data="deleteData"
:visible="deleteVisible" :visible="deleteVisible"
:delType="'user_ids'"
:apiDelete="removeUser" :apiDelete="removeUser"
@deleteVisibleChange="() => deleteVisible = false" @deleteVisibleChange="() => deleteVisible = false"
/> />
@ -233,13 +273,14 @@
</template> </template>
<script setup> <script setup>
import { reactive, ref, getCurrentInstance, onMounted, watch } from 'vue'; import { reactive, ref, getCurrentInstance, onMounted, watch,nextTick} from 'vue';
import { IconSearch, IconLoop } from '@arco-design/web-vue/es/icon'; import { IconSearch, IconLoop } from '@arco-design/web-vue/es/icon';
import TreeDept from './components/TreeDept.vue'; import TreeDept from './components/TreeDept.vue';
import { getUser, addUser, updateUser, removeUser, updateUserStatus, resetUserPwd } from '@/api/admin/sys-user'; import { getUser, addUser, updateUser, removeUser, updateUserStatus, resetUserPwd } from '@/api/admin/sys-user';
import { getRole } from '@/api/admin/role'; import { getRoleList } from '@/api/admin/role';
import { getPost } from '@/api/admin/post'; import { getPostList } from '@/api/admin/post';
import { getDept } from '@/api/admin/sys-dept'; import { getDept } from '@/api/admin/sys-dept';
const treeRef_parent = ref(null);
// Akiraka 20230210 // Akiraka 20230210
const deleteData = ref([]) const deleteData = ref([])
@ -262,7 +303,7 @@ const { currentPage, getSysPostInfo, getSysRoleInfo, getSysDeptTreeInfo, getSysU
// Pager // Pager
const pager = reactive({ const pager = reactive({
total: 0, total: 1,
page: 1, page: 1,
page_size: 10 page_size: 10
}); });
@ -311,13 +352,33 @@ function useQueryData() {
// //
const handleResetQuery = () => { const handleResetQuery = () => {
proxy.$refs.queryFormRef.resetFields();
proxy.$refs.queryFormRef.resetFields();
treeRef_parent.value.resetTree();
queryForm.dept_id='';
queryForm.nick_name='';
getSysUserInfo(queryForm); getSysUserInfo(queryForm);
}; };
return { queryForm, handleQuery, handleResetQuery }; return { queryForm, handleQuery, handleResetQuery };
} }
// const changeSelect=(value,type)=>{
// console.log(value)
// if(type=='role'){
// console.log(value.role_name)
// role_name.value=value.role_name;
// modalForm.role={
// role_name:value.role_name,
// role_id:value.role_id
// }
// }else if(type=='post'){
// post_name.value=value.post_name;
// modalForm.post={
// post_name:value.post_name,
// post_id:value.post_id
// }
// }
// };
function useResetPwd() { function useResetPwd() {
const resetPwdVisible = ref(false); const resetPwdVisible = ref(false);
@ -355,8 +416,14 @@ function useResetPwd() {
proxy.$refs.resetPwdFormRef.validate(async (err) => { proxy.$refs.resetPwdFormRef.validate(async (err) => {
if (!err) { if (!err) {
resetParams.password = resetPwdForm.password; resetParams.password = resetPwdForm.password;
const { msg } = await resetUserPwd(resetParams); resetParams.new_password=resetPwdForm.new_password;
proxy.$message.success(msg); const { message,code } = await resetUserPwd(resetParams);
if(code==200){
proxy.$message.success('密码设置成功');
}else{
proxy.$message.error(message);
}
done(); done();
getSysUserInfo(); getSysUserInfo();
} else { } else {
@ -381,10 +448,12 @@ function useApiInfo() {
* @param {*} [params] * @param {*} [params]
*/ */
const getSysUserInfo = async (params = {}) => { const getSysUserInfo = async (params = {}) => {
queryForm.dept_id=params.dept_id;
console.log(params)
const { data, code, message } = await getUser(params); const { data, code, message } = await getUser(params);
if ( code == 200 ) { if ( code == 200 ) {
tableData.value = data.data; tableData.value = data.data;
Object.assign(pager, { count: data.total, pageIndex: data.page, page_size: data.page_size }); Object.assign(pager, { total: data.total, page: data.page, page_size: data.page_size });
} else { } else {
proxy.$notification.error(message); proxy.$notification.error(message);
} }
@ -392,14 +461,27 @@ function useApiInfo() {
// //
const getSysRoleInfo = async () => { const getSysRoleInfo = async () => {
const res = await getRole(); const {data,code,message} = await getRoleList({
roleList.value = res.data.list; role_name:''
});
if (code == 200 ) {
roleList.value = data;
} else {
proxy.$notification.error(message);
}
}; };
// //
const getSysPostInfo = async () => { const getSysPostInfo = async () => {
const res = await getPost(); const {data,code,message} = await getPostList({
postList.value = res.data.list; post_name:''
});
if (code == 200 ) {
postList.value = data;
} else {
proxy.$notification.error(message);
}
}; };
// //
@ -428,6 +510,7 @@ function useTableList() {
{ {
title: '编号', title: '编号',
dataIndex: 'user_id', dataIndex: 'user_id',
slotName: 'user_id',
}, },
{ {
title: '角色', title: '角色',
@ -435,13 +518,13 @@ function useTableList() {
slotName: 'role_name', slotName: 'role_name',
}, },
{ {
title: '昵称', title: '用户昵称',
dataIndex: 'nick_name', dataIndex: 'nick_name',
}, },
{ {
title: '部门', title: '部门',
dataIndex: 'dept_name', dataIndex: 'dept_name',
slotName: 'dept', slotName: 'dept_name',
}, },
{ {
title: '手机号', title: '手机号',
@ -449,8 +532,8 @@ function useTableList() {
}, },
{ {
title: '状态', title: '状态',
dataIndex: 'role_status', dataIndex: 'status',
slotName: 'role_status', slotName: 'status',
}, },
{ {
title: '创建时间', title: '创建时间',
@ -480,6 +563,7 @@ function useTableList() {
// //
const handlePageSizeChange = (page_size) => { const handlePageSizeChange = (page_size) => {
console.log(queryForm);
pager.page_size = page_size; pager.page_size = page_size;
getSysUserInfo({ ...pager, ...queryForm }); getSysUserInfo({ ...pager, ...queryForm });
}; };
@ -520,18 +604,22 @@ function useModalOperate() {
const modalTitle = ref('默认标题'); const modalTitle = ref('默认标题');
// Form // Form
const modalForm = reactive({ status: '2' }); const modalForm = reactive({ status: null });
// AddRules // AddRules
const rules = { const rules = {
nickName: [{ required: true, message: '请输入用户昵称' }], nick_name: [{ required: true, message: '请输入用户昵称' }],
deptId: [{ required: true, message: '请选择所属部门' }], dept_id: [{ required: true, message: '请选择所属部门' }],
phone: [{ required: true, message: '请输入手机号' }], phone: [{ required: true, message: '请输入手机号' }],
sex: [{ required: true, message: '请选择性别' }],
role_id: [{ required: true, message: '请选择角色' }],
status:[{ required: true, message: '请选择状态' }],
post_id:[{ required: true, message: '请选择岗位' }],
email: [ email: [
{ required: true, message: '请输入邮箱' }, { required: false, message: '请输入邮箱' },
{ type: 'email', message: '请输入正确的邮箱格式' }, { type: 'email', message: '请输入正确的邮箱格式' },
], ],
username: [{ required: true, message: '请输入用户名称' }], access: [{ required: true, message: '请输入用户名称' }],
password: [{ required: true, message: '请输入用户密码' }], password: [{ required: true, message: '请输入用户密码' }],
}; };
@ -554,6 +642,9 @@ function useModalOperate() {
*/ */
const handleUpdate = (val) => { const handleUpdate = (val) => {
modalVisible.value = true; modalVisible.value = true;
modalTitle.value = '修改用户';
// role_name.value= val.role.role_name;
// post_name.value= val.post.post_name;
Object.assign(modalForm, val); Object.assign(modalForm, val);
}; };
@ -615,7 +706,7 @@ onMounted(() => {
<style lang="scss"> <style lang="scss">
@media screen and (max-width: 1720px) { @media screen and (max-width: 1720px) {
.form-action { .form-action {
margin-top: 12px; margin-top: 0px;
} }
} }