This commit is contained in:
陈红丽 2024-07-10 10:17:17 +08:00
parent a1bde6dca0
commit 3936af6394
12 changed files with 404 additions and 54 deletions

View File

@ -1,5 +1,5 @@
# 是否开启mock # 是否开启mock
VITE_USE_MOCK = true VITE_USE_MOCK = false
# 网站根目录 # 网站根目录
VITE_PUBLIC_PATH = / VITE_PUBLIC_PATH = /

View File

@ -13,9 +13,9 @@ export function getDeptList(params?) {
/** /**
* @description: ID获取详情 * @description: ID获取详情
*/ */
export function getDeptDetail(userId) { export function getDeptDetail(deptId) {
return http.request({ return http.request({
url: '/dept/detail/'+userId, url: '/dept/detail/'+deptId,
method: 'get', method: 'get',
}); });
} }
@ -32,7 +32,7 @@ export function deptAdd(data:any) {
/** /**
* @description: * @description:
*/ */
export function deptpdate(data:any) { export function deptUpdate(data:any) {
return http.request({ return http.request({
url: '/dept/update', url: '/dept/update',
method: 'PUT', method: 'PUT',
@ -42,18 +42,18 @@ export function deptpdate(data:any) {
/** /**
* @description: * @description:
*/ */
export function deptDelete(userId) { export function deptDelete(deptId) {
return http.request({ return http.request({
url: '/dept/delete/'+userId, url: '/dept/delete/'+deptId,
method: 'DELETE', method: 'DELETE',
}); });
} }
/** /**
* @description: * @description:
*/ */
export function deptBatchDelete(userId) { export function deptBatchDelete(deptId) {
return http.request({ return http.request({
url: '/dept/batchDelete/'+userId, url: '/dept/batchDelete/'+deptId,
method: 'DELETE', method: 'DELETE',
}); });
} }

View File

@ -20,9 +20,9 @@ export function getLevelAllList(params?) {
/** /**
* @description: ID获取详情 * @description: ID获取详情
*/ */
export function getLevelDetail(userId) { export function getLevelDetail(levelId) {
return http.request({ return http.request({
url: '/level/detail/'+userId, url: '/level/detail/'+levelId,
method: 'get', method: 'get',
}); });
} }
@ -49,18 +49,18 @@ export function levelUpdate(data:any) {
/** /**
* @description: * @description:
*/ */
export function levelDelete(userId) { export function levelDelete(levelId) {
return http.request({ return http.request({
url: '/level/delete/'+userId, url: '/level/delete/'+levelId,
method: 'DELETE', method: 'DELETE',
}); });
} }
/** /**
* @description: * @description:
*/ */
export function levelBatchDelete(userId) { export function levelBatchDelete(levelId) {
return http.request({ return http.request({
url: '/level/batchDelete/'+userId, url: '/level/batchDelete/'+levelId,
method: 'DELETE', method: 'DELETE',
}); });
} }

View File

@ -20,9 +20,9 @@ export function getPositionAllList(params?) {
/** /**
* @description: ID获取详情 * @description: ID获取详情
*/ */
export function getPositionDetail(userId) { export function getPositionDetail(positionId) {
return http.request({ return http.request({
url: '/position/detail/'+userId, url: '/position/detail/'+positionId,
method: 'get', method: 'get',
}); });
} }
@ -49,18 +49,18 @@ export function positionUpdate(data:any) {
/** /**
* @description: * @description:
*/ */
export function positionDelete(userId) { export function positionDelete(positionId) {
return http.request({ return http.request({
url: '/position/delete/'+userId, url: '/position/delete/'+positionId,
method: 'DELETE', method: 'DELETE',
}); });
} }
/** /**
* @description: * @description:
*/ */
export function positionBatchDelete(userId) { export function positionBatchDelete(positionId) {
return http.request({ return http.request({
url: '/role/batchDelete/'+userId, url: '/role/batchDelete/'+positionId,
method: 'DELETE', method: 'DELETE',
}); });
} }

View File

@ -20,9 +20,9 @@ export function getRoleAllList(params?) {
/** /**
* @description: ID获取详情 * @description: ID获取详情
*/ */
export function getRoleDetail(userId) { export function getRoleDetail(roleId) {
return http.request({ return http.request({
url: '/role/detail/'+userId, url: '/role/detail/'+roleId,
method: 'get', method: 'get',
}); });
} }
@ -49,18 +49,18 @@ export function roleUpdate(data:any) {
/** /**
* @description: * @description:
*/ */
export function roleDelete(userId) { export function roleDelete(roleId) {
return http.request({ return http.request({
url: '/role/delete/'+userId, url: '/role/delete/'+roleId,
method: 'DELETE', method: 'DELETE',
}); });
} }
/** /**
* @description: * @description:
*/ */
export function roleBatchDelete(userId) { export function roleBatchDelete(roleId) {
return http.request({ return http.request({
url: '/role/batchDelete/'+userId, url: '/role/batchDelete/'+roleId,
method: 'DELETE', method: 'DELETE',
}); });
} }

View File

@ -138,10 +138,13 @@ export function userDelete(userId) {
/** /**
* @description: * @description:
*/ */
export function userBatchDelete(userId) { export function userBatchDelete(params:any) {
return http.request({ return http.request({
url: '/user/batchDelete/'+userId, url: '/user/batchDelete',
method: 'DELETE', method: 'DELETE',
params:{
...params
}
}); });
} }
/** /**

View File

@ -70,7 +70,9 @@
const showModal = ref(false); const showModal = ref(false);
const previewUrl = ref(''); const previewUrl = ref('');
const fileList = ref<Ifiles[]>([]); const fileList = computed(() => {
return props.list;
});
const hideUpload = computed(() => { const hideUpload = computed(() => {
if (!props.limit) return false; if (!props.limit) return false;

View File

@ -0,0 +1,197 @@
<template>
<el-dialog
v-model="props.visible"
:title="props.deptId?'编辑':'新增'"
width="600"
:close-on-click-modal="false"
:before-close="dialogClose"
>
<el-form
ref="formRef"
:model="formData"
label-width="80px"
>
<el-form-item label="部门类型" prop="type">
<el-select v-model="formData.type" class="flex-1" clearable placeholder="请选择部门类型">
<el-option v-for="(item, index) in optionData.deptTypeList" :key="index" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item
label="父级部门"
prop="parentId"
:rules="{ required: true, message: '请选择父级部门', trigger: 'change' }"
>
<el-tree-select
class="flex-1"
v-model="formData.parentId"
:data="deptOptions"
clearable
node-key="id"
:props="{
label: 'name',
}"
:default-expand-all="true"
placeholder="请选择父级菜单"
check-strictly
/>
</el-form-item>
<el-form-item
label="部门名称"
prop="name"
:rules="{ required: true, message: '请输入部门名称', trigger: 'blur' }"
>
<el-input
v-model="formData.name"
placeholder="请输入部门名称"
clearable
/>
</el-form-item>
<el-form-item label="部门排序" prop="sort" class="flex-1">
<div>
<el-input-number v-model="formData.sort" :max="9999"/>
<div class="form-tips">数值越小越排前</div>
</div>
</el-form-item>
<el-form-item label="部门备注" prop="note">
<el-input
class="flex-1"
v-model="formData.note"
type="textarea"
placeholder="请输入部门名称"
clearable
/>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogClose">取消</el-button>
<el-button :loading="subLoading" type="primary" @click="submit">
确定
</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import type {FormInstance} from "element-plus";
import { deptAdd,deptUpdate,getDeptList,getDeptDetail } from '@/api/system/dept';
import {onMounted, reactive, readonly, ref, shallowRef} from "vue";
import {getModulesKey} from "@/router";
import {arrayToTree, treeToArray,message,buildTree} from "@/utils/auth";
import {useLockFn} from "@/utils/useLockFn";
import IconPicker from "@/components/icon/picker.vue";
const props = defineProps({
visible: {
type: Boolean,
required: true,
default: false
},
deptId: {
type: Number,
required: true,
default: 0
},
pid: {
type: Number,
default: 0
}
});
const optionData = reactive({
deptTypeList: [{
id:1,
name:'公司'
},
{
id:2,
name:'子公司'
},
{
id:3,
name:'部门'
},
{
id:4,
name:'小组'
}],
});
const emit = defineEmits(["success","update:visible"]);
const formRef = shallowRef<FormInstance>();
const componentsOptions = ref(getModulesKey());
const querySearch = (queryString: string, cb: any) => {
const results = queryString
? componentsOptions.value.filter((item) =>
item.toLowerCase().includes(queryString.toLowerCase())
)
: componentsOptions.value;
cb(results.map((item) => ({value: item})));
};
const formData = reactive({
id: "",
//id
parentId: 0,
//
type: 1,
//
name: "",
//
sort: 0,
note:''
});
const dialogClose = () => {
emit("update:visible", false);
};
const deptOptions = ref<any[]>([]);
const getMenu = async () => {
const data: any = await getDeptList();
const menu: any = [{id: 0, name: "顶级", children: []}];
const lists = buildTree(data)
menu[0].children.push(...lists)
deptOptions.value = menu
};
const handleSubmit = async () => {
await formRef.value?.validate();
props.deptId ? await deptUpdate(formData) : await deptAdd(formData);
message("操作成功");
emit("update:visible", false);
emit("success");
};
const { isLock:subLoading,lockFn: submit } = useLockFn(handleSubmit);
const setFormData = (data: Record<any, any>) => {
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
formData[key] = data[key];
}
}
};
const getDetail = async () => {
const data = await getDeptDetail(
props.deptId
);
setFormData(data);
};
const handleClose = () => {
emit("close");
};
onMounted(() => {
getMenu()
if (props.deptId) {
getDetail()
}else{
formData.parentId=props.pid
}
});
</script>

View File

@ -0,0 +1,146 @@
<template>
<div class="menu-index">
<el-card :bordered="false" class="pt-3 mb-3 proCard">
<div>
<el-button type="primary" @click="handleAdd()">
<template #icon>
<el-icon>
<plus />
</el-icon>
</template>
新增
</el-button>
<el-button @click="handleExpand"> 展开/折叠</el-button>
</div>
</el-card>
<el-card :bordered="false" class="pt-3 mb-3 proCard">
<el-table border v-loading="loading" ref="tableRef" :data="lists" row-key="id"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column label="部门名称" prop="name" min-width="150" show-overflow-tooltip/>
<el-table-column align="center" label="部门类型" prop="type" min-width="80">
<template #default="{ row }">
<div v-if="row.type ==1">公司</div>
<div v-else-if="row.type == 2">子公司</div>
<div v-else-if="row.type == 3">部门</div>
<div v-else-if="row.type == 4">小组</div>
</template>
</el-table-column>
<el-table-column align="center" label="部门排序" prop="sort" min-width="100"/>
<el-table-column align="center" label="部门备注" prop="note" min-width="100"/>
<el-table-column align="center" label="创建人" prop="createUser" min-width="180"></el-table-column>
<el-table-column align="center" label="创建时间" prop="createTime" min-width="180"></el-table-column>
<el-table-column align="center" label="操作" width="160" fixed="right">
<template #default="{ row }">
<el-button type="primary" link
@click="handleAdd(row.id)">
新增
</el-button>
<el-button type="primary" link @click="handleEdit(row)">
编辑
</el-button>
<el-button type="danger" link @click="handleDelete(row.id)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<editDialog
ref="editRef"
v-if="editVisible"
:deptId="deptId"
:pid="pid"
v-model:visible="editVisible"
@success="getLists"
>
</editDialog>
</div>
</template>
<script lang="ts" setup name="menu">
import {defineAsyncComponent, nextTick, onMounted, readonly, ref, shallowRef,onActivated} from "vue";
import {getDeptList,deptDelete} from "@/api/system/dept";
import type {ElTable} from "element-plus";
import icon from "@/components/icon/index.vue";
const tableRef = shallowRef<InstanceType<typeof ElTable>>();
import {confirm, message,buildTree} from "@/utils/auth";
const editDialog = defineAsyncComponent(() =>
import('./edit.vue')
)
const isExpand = ref(false);
const loading = ref(false);
const editVisible=ref(false);
const deptId=ref(0);
const pid=ref(0)
const lists = ref([]);
const getLists = async () => {
loading.value = true;
try {
const data = await getDeptList();
lists.value = buildTree(data);
loading.value = false;
} catch (error) {
loading.value = false;
}
};
const handleAdd = async (parentId:any) => {
deptId.value=0
pid.value=parentId?parentId:0
await nextTick();
editVisible.value=true
};
const handleEdit = async (data: any) => {
deptId.value=data.id
await nextTick();
editVisible.value=true
};
const handleDelete = async (deptId: number) => {
await confirm("确定要删除?");
try {
loading.value = true;
await deptDelete(deptId);
message("删除成功");
getLists();
} catch (e) {
loading.value = false;
}
};
const handleExpand = () => {
isExpand.value = !isExpand.value;
toggleExpand(lists.value, isExpand.value);
};
const toggleExpand = (children: any[], unfold = true) => {
for (const key in children) {
tableRef.value?.toggleRowExpansion(children[key], unfold);
if (children[key].children) {
toggleExpand(children[key].children!, unfold);
}
}
};
const getAll=()=>{
getLists();
}
onMounted(() => {
getAll()
});
// onActivated(() => {
// getAll()
// });
</script>
<style scoped>
</style>

View File

@ -10,7 +10,7 @@
</template> </template>
新增 新增
</el-button> </el-button>
<el-button @click="handleExpand" v-perm="['sys:user:add']"> 展开/折叠</el-button> <el-button @click="handleExpand"> 展开/折叠</el-button>
</div> </div>
</el-card> </el-card>
<el-card :bordered="false" class="pt-3 mb-3 proCard"> <el-card :bordered="false" class="pt-3 mb-3 proCard">

View File

@ -5,7 +5,7 @@
<div class="flex"> <div class="flex">
<el-form-item label="账号" prop="username" class="flex-1" <el-form-item label="账号" prop="username" class="flex-1"
:rules="{ required: true, message: '请输入账号', trigger: 'blur' }"> :rules="{ required: true, message: '请输入账号', trigger: 'blur' }">
<el-input :disabled="isRoot" v-model="formData.username" placeholder="请输入账号" clearable /> <el-input :disabled="props.userId" v-model="formData.username" placeholder="请输入账号" clearable />
</el-form-item> </el-form-item>
<el-form-item label="密码" prop="password" class="flex-1" <el-form-item label="密码" prop="password" class="flex-1"
:rules="{ required: props.userId ? false : true, message: '请输入密码', trigger: 'blur' }"> :rules="{ required: props.userId ? false : true, message: '请输入密码', trigger: 'blur' }">
@ -30,20 +30,17 @@
<div class="flex"> <div class="flex">
<el-form-item label="角色" prop="roles" class="flex-1" <el-form-item label="角色" prop="roles" class="flex-1"
:rules="{ required: true, message: '请选择角色', trigger: 'change' }"> :rules="{ required: true, message: '请选择角色', trigger: 'change' }">
<el-select v-model="formData.roles" :disabled="isRoot" multiple class="flex-1" clearable placeholder="请选择角色"> <el-select v-model="formData.roles" multiple class="flex-1" clearable placeholder="请选择角色">
<el-option v-if="isRoot" label="系统管理员" value="0" />
<el-option v-for="(item, index) in optionData.roleList" :key="index" :label="item.name" :value="item.id" /> <el-option v-for="(item, index) in optionData.roleList" :key="index" :label="item.name" :value="item.id" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="部门" prop="deptId" class="flex-1"> <el-form-item label="部门" prop="deptId" class="flex-1">
<!-- <el-tree-select <el-tree-select
v-model="formData.deptId" v-model="formData.deptId"
:data="optionData.deptList" :data="optionData.deptList"
:render-after-expand="false" :render-after-expand="false"
/> --> :props="{ value: 'id',label: 'name'}"
<el-select v-model="formData.deptId" class="flex-1" clearable placeholder="请选择部门"> />
<el-option v-for="(item, index) in optionData.deptList" :key="index" :label="item.name" :value="item.id" />
</el-select>
</el-form-item> </el-form-item>
</div> </div>
<div class="flex"> <div class="flex">
@ -100,8 +97,8 @@
</div> </div>
<el-form-item label="头像" prop="images"> <el-form-item label="头像" prop="images">
<BasicUpload :action="`${uploadUrl}/api/upload/uploadFile`" :list="formData.avatar?[{name:'avatar',url:formData.avatar}]:[]" :headers="uploadHeaders" <BasicUpload :action="`${uploadUrl}/api/upload/uploadFile`" :list="formData.avatar?[{name:formData.avatarName,url:formData.avatar}]:[]" :headers="uploadHeaders"
:data="{ name: 'avatar' }" :limit="1" @upload-change="uploadChange" /> :data="{ name: 'user' }" :limit="1" @upload-change="uploadChange" @delete="handleDelete"/>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
@ -124,7 +121,7 @@ import { getRoleAllList } from '@/api/system/role';
import { getDeptList } from '@/api/system/dept'; import { getDeptList } from '@/api/system/dept';
import { getLevelAllList } from '@/api/system/level'; import { getLevelAllList } from '@/api/system/level';
import { getPositionAllList } from '@/api/system/position'; import { getPositionAllList } from '@/api/system/position';
import { message } from "@/utils/auth"; import {buildTree, message } from "@/utils/auth";
import { FormInstance } from "element-plus"; import { FormInstance } from "element-plus";
const formRef = shallowRef<FormInstance>(); const formRef = shallowRef<FormInstance>();
@ -152,6 +149,7 @@ const uploadHeaders = reactive({
}); });
const formData = reactive({ const formData = reactive({
id: 0, id: 0,
avatarName:'',
email: '', email: '',
username: "", username: "",
realname: "", realname: "",
@ -169,10 +167,8 @@ const formData = reactive({
city: [], city: [],
avatar: "", avatar: "",
password: "", password: "",
passwordConfirm: "", passwordConfirm: ""
userStatus: 'enable'
}); });
const fileList = ref([]);
const passwordConfirmValidator = ( const passwordConfirmValidator = (
rule: object, rule: object,
value: string, value: string,
@ -185,10 +181,6 @@ const passwordConfirmValidator = (
callback(); callback();
}; };
const isRoot = computed(() => {
return formData.userId == 1;
});
const dialogClose = () => { const dialogClose = () => {
emit("update:visible", false); emit("update:visible", false);
}; };
@ -228,13 +220,17 @@ const optionData = reactive({
function uploadChange(data: string[]) { function uploadChange(data: string[]) {
formData.avatar = data.fileUrl; formData.avatar = data.fileUrl;
formData.avatarName =data.fileName
}
const handleDelete =async(file)=>{
console.log(file)
} }
const getAllDict = async () => { const getAllDict = async () => {
let list = await getRoleAllList(); let list = await getRoleAllList();
optionData.roleList = list ? list : []; optionData.roleList = list ? list : [];
list = await getDeptList(); list = await getDeptList();
optionData.deptList = list ? list : []; optionData.deptList = list ? buildTree(list) : [];
list = await getLevelAllList(); list = await getLevelAllList();
optionData.levelList = list ? list : []; optionData.levelList = list ? list : [];
list = await getPositionAllList(); list = await getPositionAllList();

View File

@ -29,7 +29,7 @@
新建 新建
</el-button> </el-button>
<el-button type="danger" @click="handleDelete" :disabled="!selectionData.length"> <el-button type="danger" @click="handleDelete()" :disabled="!selectionData.length">
<template #icon> <template #icon>
<el-icon class="el-input__icon"> <el-icon class="el-input__icon">
<Delete /> <Delete />
@ -180,8 +180,13 @@ const uploadHeaders = reactive({
async function handleDelete(record: Recordable) { async function handleDelete(record: Recordable) {
let ids = ''
if(!record){
ids = selectionData.value.map(({id}) => id);
console.log(ids)
}
await confirm('确定要删除?'); await confirm('确定要删除?');
selectionData.value.length>0? await userBatchDelete(selectionData.value.join()):await userDelete(record.row.id); record? await userDelete(record.row.id):await userBatchDelete({integers:ids});
message("删除成功"); message("删除成功");
reloadTable() reloadTable()
} }
@ -248,6 +253,7 @@ const handleExport = async()=>{
exportLoading.value=true exportLoading.value=true
const data=await userExport() const data=await userExport()
downloadByData(data, '用户信息.xlsx'); downloadByData(data, '用户信息.xlsx');
exportLoading.value=false
message("导出成功"); message("导出成功");
} }