Commit adf8ec91 authored by 张毅辰's avatar 张毅辰

编译通过修改

parent cfb43248
import request from "@/utils/request"; import request from "@/utils/request";
import { AxiosPromise } from "axios"; import { AxiosPromise } from "axios";
import { DeptForm, DeptQuery, DeptVO } from "./types"; import { DeptForm, DeptQuery, DeptVO } from "./types";
import Qs from "qs";
/** /**
* 部门树形表格 * 部门下拉列表
*
* @param queryParams
*/ */
export function listDepts(queryParams?: DeptQuery): AxiosPromise<DeptVO[]> { export function getDeptOptions(): AxiosPromise<OptionType[]> {
return request({ return request({
url: "/api/v1/dept", url: "/system/dept/treeSelect",
method: "get", method: "get",
params: queryParams,
}); });
} }
/** /**
* 部门下拉列表 * 1.新增部门
*/ * 2.删除部门
export function getDeptOptions(): AxiosPromise<OptionType[]> { * 3.修改部门
* 4.修改部门状态
* 5.查询部门列表
* 6.查询部门列表(排除节点)
* 7.查询部门详细
* -----------------
* 10.查询部门下拉树结构
* 11.查询子部门
* 12.根据角色ID查询部门树结构
* 13.查询无部门人员
* 14.根据查询内容查询用户
* 15.查询该部门下的所有用户
* 16.转部门
* */
// 1.新增部门
export function addDept(data: any) {
data = Qs.stringify(data);
return request({ return request({
url: '/system/dept/treeSelect', url: "/system/dept/add",
method: "post",
data,
headers: {},
});
}
// 2.删除部门
export function delDept(deptId: any) {
return request({
url: "/system/dept/deleteLogical/" + deptId,
method: "delete",
});
}
// 3.修改部门
export function updateDept(data: any) {
const businessId = data.businessId;
data = Qs.stringify(data);
return request({
url: "/system/dept/update/" + businessId,
method: "put",
data,
headers: {},
});
}
// 4.修改部门状态
export function statusChange(data: any) {
const businessId = data.businessId;
data = Qs.stringify(data);
return request({
url: "/system/dept/statusChange/" + businessId,
method: "put",
data,
headers: {},
});
}
// 5.查询部门列表
export function listDept(query: any) {
return request({
url: "/system/dept/list",
method: "get", method: "get",
params: query,
}); });
} }
/** // 6.查询部门列表(排除节点)
* 获取部门详情 export function listDeptExcludeChild(deptId: any) {
*
* @param id
*/
export function getDeptForm(id: number): AxiosPromise<DeptForm> {
return request({ return request({
url: "/api/v1/dept/" + id + "/form", url: "/system/dept/list/exclude/" + deptId,
method: "get", method: "get",
}); });
} }
/** // 7.查询部门详细
* 新增部门 export function getDept(deptId: any) {
*
* @param data
*/
export function addDept(data: DeptForm) {
return request({ return request({
url: "/api/v1/dept", url: "/system/dept/detail/" + deptId,
method: "post", method: "get",
data: data,
}); });
} }
/** // 10.查询部门下拉树结构
* 修改部门 export function treeSelect() {
*
* @param id
* @param data
*/
export function updateDept(id: number, data: DeptForm) {
return request({ return request({
url: "/api/v1/dept/" + id, url: "/system/dept/treeSelect",
method: "put", method: "get",
data: data,
}); });
} }
/** // 11.查询子部门
* 删除部门 export function getChildrenDept(userId: any) {
*
* @param ids
*/
export function deleteDept(ids: string) {
return request({ return request({
url: "/api/v1/dept/" + ids, url: "/system/dept/getChildren/" + userId,
method: "delete", method: "get",
});
}
// 12.根据角色ID查询部门树结构
export function roleDeptTreeSelect(roleId: any, menuId: any) {
return request({
url: "/system/dept/roleDeptTreeSelect/" + roleId + "/" + menuId,
method: "get",
});
}
// 13.查询无部门人员
export function queryUserWithoutDept(params: any) {
return request({
url: "/system/dept/getAllUserWithoutDept",
method: "get",
params,
});
}
// 14.根据查询内容查询用户
export function queryUserByName(params: any) {
return request({
url: "/system/user/getListWithDept",
method: "get",
params,
});
}
// 15.查询该部门下的所有用户
export function queryUserByDeptId(id: any, params: any) {
return request({
url: "/system/dept/getAllUserByDeptId/" + id,
method: "get",
params,
});
}
// 16.转部门
export function transformDept(data: any) {
return request({
url: "/system/dept/update/{businessId}",
method: "put",
data,
}); });
} }
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
* 部门查询参数 * 部门查询参数
*/ */
export interface DeptQuery { export interface DeptQuery {
keywords?: string; deptName?: string;
status?: number; flag?: string;
} }
/** /**
...@@ -51,21 +51,33 @@ export interface DeptForm { ...@@ -51,21 +51,33 @@ export interface DeptForm {
/** /**
* 部门ID(新增不填) * 部门ID(新增不填)
*/ */
id?: number; businessId?: number | undefined;
/** /**
* 部门名称 * 部门名称
*/ */
name?: string; deptName?: string;
/** /**
* 父部门ID * 父部门ID
*/ */
parentId: number; parentId: number | undefined;
/** /**
* 排序 * 排序
*/ */
sort?: number; orderNum?: number;
/**
* 负责人
*/
leader?: string;
/**
* 手机号
*/
phone?: string;
/**
* 邮箱
*/
email?: string;
/** /**
* 状态(1:启用;0:禁用) * 状态(1:启用;0:禁用)
*/ */
status?: number; flag?: string;
} }
...@@ -32,7 +32,7 @@ export function getRoleOptions( ...@@ -32,7 +32,7 @@ export function getRoleOptions(
} }
/** 角色数据权限*/ /** 角色数据权限*/
export function dataScope(data) { export function dataScope(data: any) {
return request({ return request({
url: "/system/role/dataScope", url: "/system/role/dataScope",
method: "put", method: "put",
......
// export default {
import { useSearchParamsStore } from "@/store/modules/searchParams";
const searchParamsObj = useSearchParamsStore();
// 路由离开前存储筛选条件
export function setDataCache(path, param) {
// store.dispatch('searchSave/searchParamsSet', {
// path: path,
// param: {
// ...param
// }
// }).then(r => {} )
// console.log('store.getters.searchParams', store.getters.searchParams)
}
// 获取缓存的筛选条件 分页参数需统一,如需自定义分页参数,在列表页自行修改
export function getDataCache(routerPath) {
if (searchParamsObj.searchParams[routerPath]) {
const { searchParams } = searchParamsObj;
const path = routerPath;
const param = searchParams[path]; // 保留着的查询条件
if (param) {
return param;
}
else {
const paramNew = '{"page":1,"rows":10}';
return paramNew;
}
}
else {
const paramNew = '{"page":1,"rows":10}';
return paramNew;
}
}
// }
//# sourceMappingURL=filterData.js.map
\ No newline at end of file
// export default {
import { useSearchParamsStore } from "@/store/modules/searchParams";
const searchParamsObj = useSearchParamsStore()
// 路由离开前存储筛选条件
export function setDataCache(path: any, param: any) {
// store.dispatch('searchSave/searchParamsSet', {
// path: path,
// param: {
// ...param
// }
// }).then(r => {} )
// console.log('store.getters.searchParams', store.getters.searchParams)
}
// 获取缓存的筛选条件 分页参数需统一,如需自定义分页参数,在列表页自行修改
export function getDataCache(routerPath: any) {
if (searchParamsObj.searchParams[routerPath]) {
const { searchParams } = searchParamsObj;
const path = routerPath
const param = searchParams[path] // 保留着的查询条件
if (param){
return param
} else {
const paramNew = '{"page":1,"rows":10}'
return paramNew
}
} else {
const paramNew = '{"page":1,"rows":10}'
return paramNew
}
}
// }
<template>
<el-button
v-if="isShow"
:size="size"
:type="type"
:class="className"
:icon="icon"
:disabled="disabled"
@click="defaultClick"
>{{ name }}</el-button>
<el-button
v-else
v-hasPermi="hasper"
:size="size"
:type="type"
:class="className"
:icon="icon"
:disabled="disabled"
@click="defaultClick"
>{{ name }}</el-button>
</template>
<script>
// import { getInfo } from '@/api/login'
import store from '../../store/index'
export default {
name: 'CoolButton',
props: {// 调用该组件时需要传递过来的属性
name: {
type: String
},
className: {
type: String
},
type: {
type: String
},
haspermi: {
type: Array
},
size: {
type: String
},
icon: {
type: String
},
disabled: {
type: Boolean
}
},
data() {
return {
isShow: true,
hasper: '',
butname: this.name
}
},
computed: {},
created() {
this.getInfoMessage()
},
methods: {
defaultClick() {
this.$emit('btn-click')
},
getInfoMessage() {
const data = this.haspermi
// getInfo().then(res => {
// if (res.data.permissions[0] === '*:*:*') {
// this.isShow = true
// this.hasper = []
// } else {
// this.isShow = false
// this.hasper = data
// }
// })
if (store.getters.permissions[0] === '*:*:*') {
this.isShow = true
this.hasper = []
} else {
this.isShow = false
this.hasper = data
}
}
}
}
</script>
<style scoped>
/*按钮样式*/
input{
border: none;
padding: 2px 10px;
border-radius: 6px;
margin: 2px 6px;
color:#fff
}
/*不同属性按钮颜色不同*/
.primary{background-color: #409eff}
.danger{background-color: #f56c6c}
.success{background-color: #67c23a}
.warning{background-color: #e6a23c}
</style>
...@@ -3,7 +3,7 @@ import App from "./App.vue"; ...@@ -3,7 +3,7 @@ import App from "./App.vue";
import router from "@/router"; import router from "@/router";
import { setupStore } from "@/store"; import { setupStore } from "@/store";
import { setupDirective } from "@/directive"; import { setupDirective } from "@/directive";
import moment from "moment";
import "@/permission"; import "@/permission";
// 本地SVG图标 // 本地SVG图标
...@@ -23,3 +23,13 @@ setupDirective(app); ...@@ -23,3 +23,13 @@ setupDirective(app);
setupStore(app); setupStore(app);
app.use(router).use(i18n).mount("#app"); app.use(router).use(i18n).mount("#app");
app.config.globalProperties.transformDateByFormat = function (
value: any,
format: any
) {
if (!value || value === "") {
return "-";
}
return moment(value).format(format || "YYYY-MM-DD HH:mm:ss");
};
import { defineStore } from "pinia";
export const useSearchParamsStore = defineStore("searchParams", () => {
const searchParams = ref<object>({});
return {
searchParams,
};
});
...@@ -3,15 +3,21 @@ ...@@ -3,15 +3,21 @@
* @param {*} data 数据源 * @param {*} data 数据源
* @param {*} id id字段 默认 'id' * @param {*} id id字段 默认 'id'
*/ */
export function handleTree(data, id, parentId, children, rootId) { export function handleTree(
data: any,
id: any,
parentId: any,
children: any,
rootId: any
) {
id = id || "id"; id = id || "id";
parentId = parentId || "parentId"; parentId = parentId || "parentId";
children = children || "children"; const number = Math.random();
rootId = rootId =
rootId || rootId ||
Math.min( Math.min(
Math, number,
...data.map((item) => { ...data.map((item: any) => {
return item[parentId]; return item[parentId];
}) })
) || ) ||
......
<script setup lang="ts"> <script setup lang="ts">
const route = useRoute();
import { DeptForm, DeptQuery } from "@/api/dept/types";
import { import {
getDeptForm,
deleteDept,
updateDept,
addDept, addDept,
getDeptOptions, delDept,
listDepts, getDept,
listDept,
listDeptExcludeChild,
statusChange,
updateDept,
} from "@/api/dept"; } from "@/api/dept";
import TreeSelect from "vue3-treeselect";
import { DeptVO, DeptForm, DeptQuery } from "@/api/dept/types"; import "vue3-treeselect/dist/vue3-treeselect.css";
import { getDataCache, setDataCache } from "@/assets/js/filterData";
import { handleTree } from "@/utils/common";
defineOptions({ defineOptions({
name: "Dept", name: "Dept",
inheritAttrs: false, inheritAttrs: false,
}); });
const queryFormRef = ref(ElForm); // 搜索条件
const deptFormRef = ref(ElForm); const showSearch = ref(true);
const Loading = ref(true);
const loading = ref(false); const deptList = ref([]);
const ids = ref<number[]>([]); const deptOptions = ref([]);
const dialog = reactive({ const title = ref("");
title: "", const open = ref(false);
visible: false, const statusOptions = reactive([
}); {
dictLabel: "启用",
dictValue: "1",
},
{
dictLabel: "停用",
dictValue: "0",
},
]);
const queryParams = reactive<DeptQuery>({}); const queryParams = reactive<DeptQuery>({});
const deptList = ref<DeptVO[]>();
const deptOptions = ref<OptionType[]>();
const formData = reactive<DeptForm>({ const formData = reactive<DeptForm>({
status: 1, businessId: 0,
parentId: 0, parentId: 0,
sort: 1, deptName: "",
orderNum: 0,
leader: "",
phone: "",
email: "",
flag: "1",
}); });
const rules = reactive({ const rules = reactive({
parentId: [{ required: true, message: "上级部门不能为空", trigger: "blur" }], parentId: [{ required: true, message: "请选择上级部门", trigger: "blur" }],
name: [{ required: true, message: "部门名称不能为空", trigger: "blur" }], deptName: [{ required: true, message: "请输入部门名称", trigger: "blur" }],
sort: [{ required: true, message: "显示排序不能为空", trigger: "blur" }], orderNum: [{ required: true, message: "请输入菜单顺序", trigger: "blur" }],
email: [
{
type: "email",
message: "'请输入正确的邮箱地址",
trigger: ["blur", "change"],
},
],
phone: [
{
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
message: "请输入正确的手机号码",
trigger: "blur",
},
],
}); });
const commonField = computed({
get() {
return commonField;
},
});
const queryFormRef = ref(ElForm);
const deptFormRef = ref(ElForm);
/** 查询 */ /** 查询 */
function handleQuery() { function getList() {
loading.value = true; Loading.value = true;
listDepts(queryParams).then(({ data }) => { listDept(queryParams).then((response) => {
deptList.value = data; deptList.value = handleTree(response.data, "businessId");
loading.value = false; Loading.value = false;
}); });
} }
/**重置查询 */
function resetQuery() { function resetQuery() {
queryFormRef.value.resetFields(); Object.assign(queryParams, {
handleQuery(); deptName: "",
flag: "",
});
getList();
} }
/** 行复选框选中记录选中ID集合 */ function normalizer(node) {
function handleSelectionChange(selection: any) { if (node.children && !node.children.length) {
ids.value = selection.map((item: any) => item.id); delete node.children;
}
return {
id: node.businessId,
label: node.deptName,
children: node.children,
};
} }
/** 获取部门下拉数据 */ function cancel() {
async function loadDeptOptions() { open.value = false;
getDeptOptions().then((response) => { reset();
deptOptions.value = [ }
{
value: 0, function reset() {
label: "顶级部门", Object.assign(formData, {
children: response.data, businessId: undefined,
}, parentId: undefined,
]; deptName: "",
orderNum: 0,
leader: "",
phone: "",
email: "",
flag: "1",
}); });
} }
/** /** 修改状态按钮操作 */
* 打开弹窗 function handleStatusChange(row) {
* const text = row.flag === "0" ? "停用" : "启用";
* @param parentId 父部门ID ElMessageBox.confirm(
* @param deptId 部门ID `“${row.deptName}”部门即将被${text},是否继续?`,
*/ "提示",
async function openDialog(parentId?: number, deptId?: number) { {
await loadDeptOptions(); confirmButtonText: "确定",
dialog.visible = true; cancelButtonText: "取消",
if (deptId) { type: "warning",
dialog.title = "修改部门"; }
getDeptForm(deptId).then(({ data }) => { )
Object.assign(formData, data); .then(function () {
const dept = Object.assign({}, row, { children: [] });
dept.children = [];
return statusChange(dept);
})
.then((response) => {
if (response.code === 200) {
ElMessage({
message: text + "成功",
type: "success",
});
} else {
ElMessage({
message: response.message,
type: "error",
});
getList();
}
})
.catch(function () {
row.flag = row.flag === "0" ? "1" : "0";
}); });
} else { }
dialog.title = "新增部门";
formData.parentId = parentId ?? 0; /** 新增按钮操作 */
function handleAdd(row) {
reset();
if (row !== undefined) {
formData.parentId = row.businessId;
} }
open.value = true;
title.value = "添加部门";
listDept().then((response) => {
deptOptions.value = handleTree(response.data, "businessId");
});
} }
/** 表单提交 */ /** 修改按钮操作 */
function handleSubmit() { function handleUpdate(row) {
deptFormRef.value.validate((valid: any) => { reset();
getDept(row.businessId).then((response) => {
Object.assign(formData, response.data);
open.value = true;
title.value = "修改";
});
listDeptExcludeChild(row.businessId).then((response) => {
deptOptions.value = handleTree(response.data, "businessId");
});
}
/** 提交按钮 */
function submitForm() {
deptFormRef.value.validate((valid) => {
if (valid) { if (valid) {
const deptId = formData.id; if (formData.businessId !== undefined) {
loading.value = true; updateDept(formData).then((response) => {
if (deptId) { if (response.code === 200) {
updateDept(deptId, formData) ElMessage({
.then(() => { message: "修改成功",
ElMessage.success("修改成功"); type: "success",
closeDialog(); });
handleQuery(); open.value = false;
}) getList();
.finally(() => (loading.value = false)); }
});
} else { } else {
addDept(formData) addDept(formData).then((response) => {
.then(() => { if (response.code === 200) {
ElMessage.success("新增成功"); ElMessage({
closeDialog(); message: "新增成功",
handleQuery(); type: "success",
}) });
.finally(() => (loading.value = false)); open.value = false;
getList();
}
});
} }
} }
}); });
} }
/** 删除部门 */ /** 删除按钮操作 */
function handleDelete(deptId?: number) { function handleDelete(row) {
const deptIds = [deptId || ids.value].join(","); ElMessageBox.confirm("所选择数据被删除后不可再恢复,是否继续?", "提示", {
if (!deptIds) {
ElMessage.warning("请勾选删除项");
return;
}
ElMessageBox.confirm(`确认删除已选中的数据项?`, "警告", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning", type: "warning",
}).then(() => { })
deleteDept(deptIds).then(() => { .then(function () {
ElMessage.success("删除成功"); return delDept(row.businessId);
resetQuery(); })
}); .then(() => {
}); getList();
} ElMessage({
message: "删除成功",
/** 关闭弹窗 */ type: "success",
function closeDialog() { });
dialog.visible = false; })
resetForm(); .catch(function () {});
}
/** 重置表单 */
function resetForm() {
deptFormRef.value.resetFields();
deptFormRef.value.clearValidate();
formData.id = undefined;
formData.parentId = 0;
formData.status = 1;
formData.sort = 1;
} }
onMounted(() => { onMounted(() => {
handleQuery(); Object.assign(queryParams, JSON.parse(getDataCache(route.path)));
getList();
}); });
</script> </script>
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="search-container"> <div class="search-container">
<el-form ref="queryFormRef" :model="queryParams" :inline="true"> <el-form
<el-form-item label="关键字" prop="keywords"> v-show="showSearch"
ref="queryFormRef"
style="padding: 0 0 0 10px"
:model="queryParams"
:inline="true"
>
<el-form-item label="部门名称" prop="deptName">
<el-input <el-input
v-model="queryParams.keywords" v-model="queryParams.deptName"
placeholder="部门名称" placeholder="请输入登录名"
@keyup.enter="handleQuery" clearable
style="width: 200px"
/> />
</el-form-item> </el-form-item>
<el-form-item label="部门状态" prop="flag">
<el-form-item label="部门状态" prop="status">
<el-select <el-select
v-model="queryParams.status" v-model="queryParams.flag"
placeholder="部门状态" placeholder="全部"
clearable clearable
class="!w-[100px]"
> >
<el-option :value="1" label="正常" /> <el-option
<el-option :value="0" label="禁用" /> v-for="dict in statusOptions"
:key="dict.dictValue"
:label="dict.dictLabel"
:value="dict.dictValue"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button class="filter-item" type="primary" @click="handleQuery"> <el-button type="primary" @click="getList"
<i-ep-search /> ><i-ep-search />搜索</el-button
搜索 >
</el-button> <el-button @click="resetQuery">
<el-button @click="resetQuery"> <i-ep-refresh />重置 </el-button> <i-ep-refresh />
重置</el-button
>
</el-form-item>
<el-form-item style="float: right">
<!-- //新增按钮-->
<el-button type="primary" @click="handleAdd"
><i-ep-Plus />新增</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<el-card shadow="never" class="table-container"> <el-card shadow="never" class="table-container">
<template #header> <template #header>
<el-button <div class="tableTitle">部门管理列表</div>
v-hasPerm="['sys:dept:add']"
type="success"
@click="openDialog(0, undefined)"
><i-ep-plus />新增</el-button
>
<el-button
v-hasPerm="['sys:dept:delete']"
type="danger"
:disabled="ids.length === 0"
@click="handleDelete()"
><i-ep-delete />删除
</el-button>
</template> </template>
<el-table <el-table
v-loading="loading" v-loading="Loading"
:data="deptList" :data="deptList"
row-key="id" row-key="businessId"
default-expand-all default-expand-all
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
@selection-change="handleSelectionChange"
> >
<el-table-column type="selection" width="55" align="center" /> <el-table-column
<el-table-column prop="name" label="部门名称" min-width="200" /> :show-overflow-tooltip="true"
<el-table-column prop="status" label="状态" width="100"> prop="deptName"
label="部门名称"
width="260"
/>
<el-table-column
:show-overflow-tooltip="true"
prop="orderNum"
label="排序"
/>
<el-table-column label="状态" align="center" width="100">
<template #default="scope"> <template #default="scope">
<el-tag v-if="scope.row.status == 1" type="success">正常</el-tag> <el-switch
<el-tag v-else type="info">禁用</el-tag> v-model="scope.row.flag"
active-value="1"
inactive-value="0"
@change="handleStatusChange(scope.row)"
/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column
<el-table-column prop="sort" label="排序" width="100" /> :show-overflow-tooltip="true"
prop="leader"
<el-table-column label="操作" fixed="right" align="left" width="200"> label="负责人"
width="200"
/>
<el-table-column
:show-overflow-tooltip="true"
prop="phone"
label="联系电话"
width="200"
/>
<el-table-column
:show-overflow-tooltip="true"
label="创建时间"
align="center"
prop="createDate"
>
<template #default="scope">
<span>{{
scope.row.createDate | transformDateByFormat("YYYY-MM-DD HH:mm")
}}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
width="200"
>
<template #default="scope"> <template #default="scope">
<!-- //修改-->
<el-button <el-button
v-hasPerm="['sys:dept:add']" v-hasPermi="['sys:dept:update']"
type="primary"
link
size="small" size="small"
@click.stop="openDialog(scope.row.id, undefined)"
><i-ep-plus />新增
</el-button>
<el-button
v-hasPerm="['sys:dept:edit']"
type="primary"
link link
size="small"
@click.stop="openDialog(scope.row.parentId, scope.row.id)"
><i-ep-edit />编辑
</el-button>
<el-button
v-hasPerm="['sys:dept:delete']"
type="primary" type="primary"
@click="handleUpdate(scope.row)"
>修改</el-button
>
<!-- //新增按钮-->
<el-button
v-hasPermi="['sys:dept:add']"
size="small"
link link
type="primary"
@click="handleAdd(scope.row)"
>新增</el-button
>
<!-- //删除-->
<el-button
v-hasPermi="['sys:dept:delete']"
size="small" size="small"
@click.stop="handleDelete(scope.row.id)" link
type="primary"
@click="handleDelete(scope.row)"
>删除</el-button
> >
<i-ep-delete />删除
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-card> </el-card>
<!-- 添加或修改部门对话框 -->
<el-dialog <el-dialog
v-model="dialog.visible" title="部门信息"
:title="dialog.title" v-model="open"
width="600px" width="600px"
@closed="closeDialog" append-to-body
destroy-on-close
> >
<el-form <el-form
ref="deptFormRef" ref="deptFormRef"
:model="formData" :model="formData"
:rules="rules" :rules="rules"
label-width="80px" label-width="auto"
> >
<el-form-item label="上级部门" prop="parentId"> <el-row>
<el-tree-select <el-col v-if="formData.parentId !== 0" :span="24">
v-model="formData.parentId" <el-form-item label="上级部门" prop="parentId">
placeholder="选择上级部门" <treeSelect
:data="deptOptions" v-model="formData.parentId"
filterable :options="deptOptions"
check-strictly :normalizer="normalizer"
:render-after-expand="false" placeholder="选择上级部门"
/> />
</el-form-item> </el-form-item>
<el-form-item label="部门名称" prop="name"> </el-col>
<el-input v-model="formData.name" placeholder="请输入部门名称" /> <el-col :span="12">
</el-form-item> <el-form-item label="部门名称" prop="deptName">
<el-form-item label="显示排序" prop="sort"> <el-input
<el-input-number v-model.trim="formData.deptName"
v-model="formData.sort" placeholder="请输入部门名称"
controls-position="right" />
style="width: 100px" </el-form-item>
:min="0" </el-col>
/> <el-col :span="12">
</el-form-item> <el-form-item label="部门排序" prop="orderNum">
<el-form-item label="部门状态"> <el-input-number
<el-radio-group v-model="formData.status"> v-model="formData.orderNum"
<el-radio :label="1">正常</el-radio> controls-position="right"
<el-radio :label="0">禁用</el-radio> :min="0"
</el-radio-group> />
</el-form-item> </el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="负责人" prop="leader">
<el-input
v-model.trim="formData.leader"
placeholder="请输入负责人"
maxlength="20"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系电话" prop="phone">
<el-input
v-model.trim="formData.phone"
placeholder="请输入联系电话"
show-word-limit
maxlength="11"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="邮箱" prop="email">
<el-input
v-model.trim="formData.email"
placeholder="请输入邮箱"
maxlength="50"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="部门状态">
<el-radio-group v-model="formData.flag">
<el-radio label="1">启用</el-radio>
<el-radio label="0">停用</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form> </el-form>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button type="primary" @click="handleSubmit"> 确 定 </el-button> <el-button class="cancelBtn" @click="cancel">取 消</el-button>
<el-button @click="closeDialog"> 取 消 </el-button> <el-button class="submitBtn" type="primary" @click="submitForm"
>确 定</el-button
>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment