From cbb23429b8beed72b58cbb57f9b3c56a0fb2b5d2 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期五, 09 五月 2025 13:31:26 +0800
Subject: [PATCH] 修改
---
src/views/system/department/component/deptDialog.vue | 143 ++++++++++++++++++++++++++++-------------------
1 files changed, 86 insertions(+), 57 deletions(-)
diff --git a/src/views/system/department/component/deptDialog.vue b/src/views/system/department/component/deptDialog.vue
index f037f1e..6aa7fe5 100644
--- a/src/views/system/department/component/deptDialog.vue
+++ b/src/views/system/department/component/deptDialog.vue
@@ -1,33 +1,21 @@
<template>
<div class="system-add-dept-container">
<el-dialog :title="title" v-model="isShowDialog" width="600px">
- <el-form :model="departmentForm" size="default" label-width="90px">
+ <el-form :model="departmentForm" size="default" ref="depRef" :rules="depFormRules" label-width="90px">
<el-row :gutter="35">
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
- <el-form-item label="部门等级">
- <el-select v-model="departmentForm.depLevel" placeholder="请输入部门等级" class="input-add" clearable>
- <el-option
- v-for="item in depLevelList"
- :key="item.id"
- :label="item.name"
- :value="item.id"
- ></el-option>
- </el-select>
- </el-form-item>
- </el-col>
- <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="上级部门">
- <el-cascader :options="deptData" class="input-add" :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" placeholder="请选择部门" clearable v-model="departmentForm.parentDepId"> </el-cascader>
+ <el-input v-model="parentName" class="input-add" disabled clearable/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
- <el-form-item label="部门名称">
+ <el-form-item label="部门名称" prop="depName">
<el-input v-model="departmentForm.depName" class="input-add" placeholder="请输入部门名称" clearable></el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
<el-form-item label="部门描述">
- <el-input v-model="departmentForm.depInfo" class="input-add" type="textarea" placeholder="请输入部门描述" maxlength="150"></el-input>
+ <el-input v-model="departmentForm.info" class="input-add" type="textarea" placeholder="请输入部门描述" maxlength="150"></el-input>
</el-form-item>
</el-col>
</el-row>
@@ -35,7 +23,7 @@
<template #footer>
<span class="dialog-footer">
<el-button @click="onCancel" size="default">取 消</el-button>
- <el-button type="primary" v-throttle @click="onSubmit" size="default">确 定</el-button>
+ <el-button type="primary" v-throttle @click="onSubmit(depRef)" size="default">确 定</el-button>
</span>
</template>
</el-dialog>
@@ -44,7 +32,7 @@
<script lang="ts">
import { ElMessage } from 'element-plus';
-import { reactive, toRefs, onMounted, defineComponent } from 'vue';
+import {reactive, toRefs, onMounted, defineComponent, ref} from 'vue';
import { departmentApi } from '/@/api/systemManage/department';
// 定义接口来定义对象的类型
@@ -54,17 +42,21 @@
parentId: string;
id: number;
}
-interface DeptSate {
+interface DeptState {
title: string;
+ parentName: string
isShowDialog: boolean;
departmentForm: {
depName: string;
- depInfo: string;
- parentDepId: string;
- depLevel:null | number
+ info: string;
+ parentId?: null|number
+ id?: null|number
};
deptData: Array<TableDataRow>;
depLevelList: Array<Type>;
+ depFormRules:{
+
+ }
}
interface Type{
id:number;
@@ -74,14 +66,15 @@
export default defineComponent({
name: 'systemAddDept',
setup(prop, context) {
- const state = reactive<DeptSate>({
+ const state = reactive<DeptState>({
title: '',
+ parentName: '',
isShowDialog: false,
departmentForm: {
depName: '',
- parentDepId: '',
- depInfo: '',
- depLevel:null,
+ parentId: null,
+ info: '',
+ id: null
},
deptData: [], // 部门数据
depLevelList: [
@@ -89,24 +82,49 @@
{id:2,name:'事业部'},
{id:3,name:'车间'},
{id:4,name:'班组'}
- ] // 部门数据
+ ], // 部门数据
+ depFormRules:{
+ depName: [{ required: true, message: '请填写部门名称', trigger: 'blur' }],
+ },
});
+ const depRef = ref()
+ const findParentById=(tree:Array<any>,id:number|null,depName:string)=>{
+ const parent = tree.find(i=>i.id == id)
+ if(parent){
+ return parent[depName]
+ }
+ for(const item of tree){
+ if(item.children){
+ const result = findParentById(item.children,id,depName)
+ if(result){
+ return result
+ }
+ }
+ }
+ return null
+ }
// 打开弹窗
const openDialog = (type: string, value: any, departmentList: []) => {
state.isShowDialog = true;
+ state.departmentForm = JSON.parse(JSON.stringify(value))
+ state.parentName = value.depName
state.deptData = JSON.parse(JSON.stringify(departmentList));
if (type === '新增') {
state.title = '新增部门';
state.departmentForm = {
depName: '',
- parentDepId: '',
- depLevel:null,
- depInfo: ''
+ parentId: value.id,
+ info: ''
};
} else {
+ state.parentName = findParentById(departmentList,value.parentId,'depName')
state.title = '修改部门';
- state.departmentForm = JSON.parse(JSON.stringify(value));
+ state.departmentForm = {
+ depName: value.depName,
+ id: value.id,
+ info: value.info
+ }
}
};
// 关闭弹窗
@@ -119,39 +137,48 @@
};
// 新增
const onSubmit = async () => {
- if (state.title === '新增部门') {
+ depRef.value.validate(async (valid:Boolean) => {
+ if(valid){
+ if (state.title === '新增部门') {
let res = await departmentApi().addDepartment(state.departmentForm);
- if (res.data.code === '200') {
- ElMessage({
- type: 'success',
- message: '部门新增成功',
- duration: 2000
- });
- closeDialog();
- context.emit('getDepartmentList');
+ if (res.data.code === 100) {
+ ElMessage({
+ type: 'success',
+ message: '部门新增成功',
+ duration: 2000
+ });
+ closeDialog();
+ context.emit('getDepartmentList');
} else {
- ElMessage({
- type: 'warning',
- message: res.data.msg
- });
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
}
- } else {
+ } else {
let res = await departmentApi().modDepartment(state.departmentForm);
- if (res.data.code === '200') {
- ElMessage({
- type: 'success',
- message: '部门修改成功',
- duration: 2000
- });
- closeDialog();
- context.emit('getDepartmentList');
+ if (res.data.code === 100) {
+ ElMessage({
+ type: 'success',
+ message: '部门修改成功',
+ duration: 2000
+ });
+ closeDialog();
+ context.emit('getDepartmentList');
} else {
- ElMessage({
- type: 'warning',
- message: res.data.msg
- });
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
}
+ }
+ }else{
+ ElMessage({
+ type:'warning',
+ message:'请完善基本信息'
+ })
}
+ })
};
// 初始化部门数据
const initTableData = () => {};
@@ -160,6 +187,8 @@
initTableData();
});
return {
+ depRef,
+ findParentById,
openDialog,
closeDialog,
onCancel,
--
Gitblit v1.9.2