From 3d17b311e7e7e642bb812494ecaa24aaeb382bdd Mon Sep 17 00:00:00 2001
From: 13937891274 <kxc0822>
Date: 星期三, 20 七月 2022 17:57:20 +0800
Subject: [PATCH] 应急队伍一览对接
---
src/views/contingencyManagement/contingency/component/openAdd.vue | 203 +++++++++++++++++++++++++++++++++-----------------
1 files changed, 135 insertions(+), 68 deletions(-)
diff --git a/src/views/contingencyManagement/contingency/component/openAdd.vue b/src/views/contingencyManagement/contingency/component/openAdd.vue
index 3ee7941..7a3e369 100644
--- a/src/views/contingencyManagement/contingency/component/openAdd.vue
+++ b/src/views/contingencyManagement/contingency/component/openAdd.vue
@@ -1,7 +1,7 @@
<template>
<div class="system-edit-user-container">
<el-dialog
- title="新建应急队伍管理"
+ :title="title"
v-model="isShowDialog"
width="769px"
draggable
@@ -31,9 +31,9 @@
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="队伍负责人" prop="teamLeader">
+ <el-form-item label="队伍负责人" prop="principalUid">
<el-input
- v-model="ruleForm.teamLeader"
+ v-model="ruleForm.principalUid"
placeholder="请选择"
class="input-with-select"
>
@@ -44,28 +44,28 @@
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="负责人部门" prop="responsibleDepartment">
+ <el-form-item label="负责人部门" prop="principalDepartmentId">
<el-tree-select
- v-model="ruleForm.responsibleDepartment"
+ v-model="ruleForm.principalDepartmentId"
:data="data" class="w100"
placeholder="请选择"/>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="负责人手机" prop="teamPhone">
- <el-input v-model="ruleForm.teamPhone" placeholder="请填写负责人手机"></el-input>
+ <el-form-item label="负责人手机" prop="principalPhone">
+ <el-input v-model="ruleForm.principalPhone" placeholder="请填写负责人手机"></el-input>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
- <el-form-item label="固定电话" prop="telephone">
- <el-input v-model="ruleForm.telephone" placeholder="请填写固定电话"></el-input>
+ <el-form-item label="固定电话" prop="telephoneNumber">
+ <el-input v-model="ruleForm.telephoneNumber" placeholder="请填写固定电话"></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-form-item label="队伍描述" prop="teamDesc">
<el-input
class="textarea"
- v-model="ruleForm.describe"
+ v-model="ruleForm.teamDesc"
type="textarea"
maxlength="150"
placeholder="请填写队伍描述"
@@ -73,7 +73,7 @@
</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="attachments">
<el-upload
v-model:file-list="fileList"
class="upload-demo"
@@ -121,27 +121,29 @@
</el-row>
</el-form>
<template #footer>
- <span class="dialog-footer">
- <el-button @click="onCancel" size="default">关闭</el-button>
- <el-button size="default" type="primary" @click="submitForm(ruleFormRef)">确定</el-button>
- </span>
+ <span class="dialog-footer">
+ <el-button @click="isShowDialog = !isShowDialog" size="default">关闭</el-button>
+ <el-button size="default" type="primary" @click="onSubmit">确定</el-button>
+ </span>
</template>
</el-dialog>
- <AddEmergencyPersonnel ref="addRef" />
- <UserSelections ref="userRef"/>
+ <AddEmergencyPersonnel ref="addRef" />
+ <UserSelections ref="userRef"/>
</div>
</template>
<script lang="ts">
-import { reactive,
+import {
+ reactive,
ref,
- defineComponent
+ defineComponent,
+ toRefs,
} from 'vue';
-
+import { ElMessage } from 'element-plus';
import type {
UploadUserFile,
TabsPaneContext,
- FormInstance,
+ // FormInstance,
FormRules,
} from 'element-plus'
@@ -151,6 +153,7 @@
} from '@element-plus/icons-vue'
import AddEmergencyPersonnel from "/@/views/contingencyManagement/contingency/component/addEmergencyPersonnel.vue";
import UserSelections from "/@/components/userSelections/index.vue"
+import {contingencyApi} from "/@/api/contingency";
// 定义表格数据类型
interface User {
personnelName: string
@@ -158,43 +161,79 @@
phone: string;
position: string;
}
+
+
+
+
+// 定义接口来定义对象的类型
+interface MenuDataTree {
+ id: number;
+ label: string;
+ children?: MenuDataTree[];
+}
+interface RoleState {
+ title:string,
+ // buttonName:string,
+ isShowDialog: boolean;
+ ruleForm: {
+ teamName: string;
+ teamLevel: string;
+ principalUid: number;
+ principalDepartmentId: number;
+ principalPhone: string;
+ telephoneNumber: string;
+ teamDesc: string;
+ };
+ menuData: Array<MenuDataTree>;
+}
export default defineComponent({
name: 'openAdd',
components: {
AddEmergencyPersonnel,
UserSelections,
},
- setup() {
- const isShowDialog = ref(false)
-
- const ruleFormRef = ref<FormInstance>()
- //定义表单
- const ruleForm = reactive({
+ setup(prop,context) {
+ const state = reactive<RoleState>({
+ isShowDialog: false,
+ title:'',
+ // buttonName:'',
+ ruleForm: {
teamName: '', // 队伍名称
- teamLeader: '', //队伍负责人
- department: [], // 负责人部门
- phone: '', // 负责人手机
- telephone: '', // 固定电话
- describe: '', // 队伍描述
+ teamLevel: '', // 队伍级别
+ principalUid: 1, // 队伍负责人
+ principalDepartmentId: 2, //负责人部门
+ principalPhone: '', // 负责人手机
+ telephoneNumber: '', // 固定电话
+ teamDesc: '', //队伍描述
+ },
+ menuData: [],
});
// 打开弹窗
- const openDialog = () => {
- // state.ruleForm = row;
- isShowDialog.value = true;
- };
- // 关闭弹窗
- const closeDialog = () => {
- isShowDialog.value = false;
- };
- // 取消
- const onCancel = () => {
- closeDialog();
+ const openDialog = (type: string, value: any) => {
+ state.isShowDialog = true;
+ if(type === '新建'){
+ state.title = '新建应急队伍管理'
+ // state.buttonName = '新增'
+ state.ruleForm = {
+ teamName: '', // 队伍名称
+ teamLevel: '', // 队伍级别
+ principalUid: 1, // 队伍负责人
+ principalDepartmentId: 2, //负责人部门
+ principalPhone: '', // 负责人手机
+ telephoneNumber: '', // 固定电话
+ teamDesc: '', //队伍描述
+ }
+ }else{
+ state.title = '修改应急队伍管理'
+ // state.buttonName = '确定'
+ state.ruleForm = JSON.parse(JSON.stringify(value))
+ }
};
// 上传附件
const fileList = ref<UploadUserFile[]>([])
//定义树形下拉框
- const responsibleDepartment = ref()
+ const principalDepartmentId = ref()
const data = [
{
value: '1',
@@ -277,28 +316,28 @@
trigger: 'change',
},
],
- teamLeader: [
+ principalUid: [
{
required: true,
message: '队伍负责人不能为空',
trigger: 'change',
},
],
- responsibleDepartment: [
+ principalDepartmentId: [
{
required: true,
message: '负责人部门不能为空',
trigger: 'change',
},
],
- teamPhone: [
+ principalPhone: [
{
required: true,
message: '负责人手机不能为空',
trigger: 'change',
},
],
- telephone: [
+ telephoneNumber: [
{
required: true,
message: '固定电话不能为空',
@@ -306,17 +345,6 @@
},
],
})
- // 表单提交验证必填项
- const submitForm = async (formEl: FormInstance | undefined) => {
- if (!formEl) return
- await formEl.validate((valid, fields) => {
- if (valid) {
- console.log('submit!')
- } else {
- console.log('error submit!', fields)
- }
- })
- }
//全屏
const full = ref(false);
const toggleFullscreen = () => {
@@ -326,22 +354,59 @@
full.value = false;
}
};
+ // 新增
+ const onSubmit = async () => {
+ if(state.title === '新建应急队伍管理'){
+ let res = await contingencyApi().addEmergencyTeam(state.ruleForm)
+ if(res.data.code === '200'){
+ ElMessage({
+ type:'success',
+ message:'队伍新增成功',
+ // duration:2000
+ })
+ state.isShowDialog = false
+ context.emit('refreshRoleList')
+ }else{
+ ElMessage({
+ type:'warning',
+ message:res.data.msg
+ })
+ }
+ }
+ else{
+ let res = await contingencyApi().editEmergencyTeam(state.ruleForm)
+ if(res.data.code === '200'){
+ ElMessage({
+ type:'success',
+ message:'队伍修改成功',
+ // duration:2000
+ })
+ state.isShowDialog = false
+ context.emit('refreshRoleList')
+ }else{
+ ElMessage({
+ type:'warning',
+ message:res.data.msg
+ })
+ }
+ }
+ };
return {
openDialog,
- closeDialog,
- isShowDialog,
- onCancel,
+ // closeDialog,
+ // isShowDialog,
+ // onCancel,
fileList,
- responsibleDepartment,
+ principalDepartmentId,
data,
activeName,
handleClick,
tableData,
multipleSelection,
Search,
- ruleForm,
- ruleFormRef,
- submitForm,
+ onSubmit,
+ // ruleForm,
+ // ruleFormRef,
rules,
addRef,
userRef,
@@ -350,6 +415,7 @@
toggleFullscreen,
FullScreen,
full,
+ ...toRefs(state),
};
},
});
@@ -364,4 +430,5 @@
::v-deep .el-table__cell {
font-weight: 400;
}
-</style>
\ No newline at end of file
+</style>
+
--
Gitblit v1.9.2