应急预案管理数据对接

13937891274

2022-08-05 2dcd6731b0ba9359dac02931211e53e81e56be68

应急预案管理数据对接

 src/views/contingencyManagement/panManagement/component/abolishLibrary.vue

@@ -48,12 +48,7 @@
</template>

<script lang="ts">
import {
  ref,
  reactive,
  defineComponent,
  onMounted,
} from 'vue';
import { ref, reactive, defineComponent, onMounted } from 'vue';

import type { FormInstance } from 'element-plus';
import {
@@ -129,9 +124,10 @@
                            type: 'error',
                        });
                        emit('myAdd', true);
            openDialog()
                        openDialog();
                    }
                }).catch(() => {});
                })
                .catch(() => {});
        };
        // 分页
        const pageIndex = ref();

 src/views/contingencyManagement/panManagement/component/approval.vue

对比新文件
@@ -0,0 +1,430 @@
<template>
    <div class="system-edit-user-container">
        <el-dialog :title="titles" v-model="isShowDialog" width="40%" draggable :fullscreen="full" :close-on-click-modal="false">
            <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
            <el-form ref="ruleFormRef" :model="ruleForm" size="default" label-width="120px" :disabled="disabled">
                <el-row :gutter="35">
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="预案名称" prop="name">
                            <el-input v-model="ruleForm.name" 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="responsibleDepartment">
                            <el-tree-select
                                v-model="ruleForm.treeSelect"
                                :data="data"
                                multiple
                                :render-after-expand="true"
                                :props="propse"
                                show-checkbox
                                clearable
                                check-strictly
                            />
                            <el-divider />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="预案类型" prop="type">
                            <el-select v-model="ruleForm.type" class="w100" placeholder="请选择">
                                <el-option label="综合应急预案" value="综合应急预案"></el-option>
                                <el-option label="现场处置方案" value="现场处置方案"></el-option>
                                <el-option label="专项应急预案" value="专项应急预案"></el-option>
                                <el-option label="其他预案" value="其他预案"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="危险源关联" prop="associatedDanger">
                            <el-select v-model="ruleForm.associatedDanger" class="w100" placeholder="请选择">
                                <el-option label="是" :value="false"></el-option>
                                <el-option label="否" :value="true"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="预案级别" prop="level">
                            <el-select v-model="ruleForm.level" class="w100" placeholder="请选择">
                                <el-option label="公司级" value="公司级"></el-option>
                                <el-option label="分厂级" value="分厂级"></el-option>
                                <el-option label="车间级" value="车间级"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="编写人" prop="authorId">
                            <el-input v-model="ruleForm.authorUid" placeholder="请选择" class="input-with-select">
                                <template #append>
                                    <el-button :icon="Search" @click="openUser" />
                                </template>
                            </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="authorDeptId">
                            <el-tree-select
                                v-model="ruleForm.authorDeptId"
                                check-strictly
                                :data="data"
                                class="w100"
                                :props="propse"
                                clearable
                                :render-after-expand="false"
                                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="releaseDate">
                            <el-date-picker
                                v-model="ruleForm.releaseDate"
                                type="datetime"
                                class="w100"
                                placeholder="选择日期时间"
                                value-format="YYYY-MM-DD HH:mm:ss"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="应急队伍" prop="emergencyTeam">
                            <el-input v-model="ruleForm.emergencyTeam" placeholder="请选择" class="input-with-select">
                                <template #append>
                                    <el-button :icon="Search" @click="daiInpt" />
                                </template>
                            </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-upload
                                v-model:file-list="fileList"
                                class="upload-demo"
                                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                                :on-change="handleChange"
                            >
                                <el-button type="primary">点击上传</el-button>
                                <template #tip>
                                    <div class="el-upload__tip">添加相关附件</div>
                                </template>
                            </el-upload>
                        </el-form-item>
                    </el-col>
                    <!--          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">-->
                    <!--            <el-form-item label="区域名称" prop="areaName">-->
                    <!--              <el-input-->
                    <!--                  v-model="ruleForm.areaName"-->
                    <!--                  placeholder="请选择"-->
                    <!--                  class="input-with-select"-->
                    <!--              >-->
                    <!--                <template #append>-->
                    <!--                  <el-button :icon="Search" @click="regionsDialog"/>-->
                    <!--                </template>-->
                    <!--              </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="authorId">
                            <el-radio-group v-model="ruleForm.resource">
                                <el-radio label="不通过" />
                                <el-radio label="通过" />
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="审批意见" prop="authorId">
                            <el-input v-model="ruleForm.name" type="textarea" 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="是否完成" prop="authorId" @change="typeChang">
                            <el-radio-group v-model="ruleForm.complete">
                                <el-radio :label="false">是</el-radio>
                                <el-radio :label="true">否</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                    <el-col v-if="ruleForm.complete" :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="审批人" prop="authorId">
                            <el-input v-model="ruleForm.authorUid" placeholder="请选择" class="input-with-select">
                                <template #append>
                                    <el-button :icon="Search" @click="openUser" />
                                </template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button>
                    <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button>
                </span>
            </template>
        </el-dialog>
        <CheckTemplate ref="Shows" />
        <DailogSearchUser ref="userRef" @SearchUser="onUser" />
        <RegionsDialog ref="openRef" />
    </div>
</template>

<script lang="ts">
import { ref, defineComponent, onMounted } from 'vue';

import type { UploadUserFile, FormInstance } from 'element-plus';
import { ElMessage } from 'element-plus';
import { Search, FullScreen } from '@element-plus/icons-vue';
import DailogSearchUser from '/@/components/DailogSearchUser/index.vue';
import CheckTemplate from '/@/components/checkTemplate/index.vue';
import RegionsDialog from '/@/components/regionsDialog/index.vue';
import { emergencyPlanApi } from '/@/api/emergencyPlan';
import { goalManagementApi } from '/@/api/goalManagement';

export default defineComponent({
    name: 'openAdd',
    components: {
        CheckTemplate,
        DailogSearchUser,
        RegionsDialog,
    },
    setup(prop, { emit }) {
        const isShowDialog = ref(false);
        const ruleFormRef = ref<FormInstance>();
        const ruleForm = ref({
            name: '', // 预案名称
            type: '', //预案类型
            associatedDanger: '', // 危险源关联
            level: '', // 预案级别
            authorUid: '', // 编写人
            authorDeptId: '', // 编写部门
            releaseDate: '', // 发布实施日期
            fileList: [
                {
                    fileUrl: 'url',
                    fileName: 'name',
                },
            ],
            emergencyTeam: '', //应急队伍
            areaList: [], //区域列表
            teamList: [],
            deptList: [],
            abolishStatus: false,
        });
        const titles = ref();
        const disabled = ref();

        // 打开弹窗
        const openDialog = (title: string, id: number, type: boolean) => {
            isShowDialog.value = true;
            titles.value = title;
            disabled.value = type;
            if (title == '查看应急预案管理' || title == '修改应急预案管理') {
                emergencyPlanApi()
                    .seeEmergencyTeam(id)
                    .then((res) => {
                        if (res.data.code == 200) {
                            ruleForm.value = res.data.data;
                        }
                    });
            }
        };
        //日期选择器
        const releaseDate = ref('');
        // 上传附件
        const fileList = ref<UploadUserFile[]>([]);
        //部门树
        const department = () => {
            goalManagementApi()
                .getTreedepartment()
                .then((res) => {
                    if (res.data.code == 200) {
                        data.value = res.data.data;
                    } else {
                        ElMessage.error(res.data.msg);
                    }
                });
        };
        const treeSelect = ref();
        // const trees = ref();
        const propse = {
            label: 'depName',
            children: 'children',
            value: 'depId',
        };
        onMounted(() => {
            department();
        });
        //定义树形下拉框
        const responsibleDepartment = ref();
        const data = ref();

        const submitForm = async (title: string, formEl: FormInstance | undefined) => {
            if (title == '新建应急预案管理') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        isShowDialog.value = false;
                        emergencyPlanApi()
                            .addEmergencyPlan(ruleForm.value)
                            .then((res) => {
                                if (res.data.code == 200) {
                                    ElMessage({
                                        showClose: true,
                                        message: res.data.msg,
                                        type: 'success',
                                    });
                                    emit('myAdd', true);
                                } else {
                                    ElMessage({
                                        showClose: true,
                                        message: res.data.msg,
                                        type: 'error',
                                    });
                                    emit('myAdd', true);
                                }
                                formEl.resetFields();
                            });
                    } else {
                        console.log('error submit!', fields);
                    }
                });
            } else if (title == '修改应急预案管理') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        isShowDialog.value = false;
                        emergencyPlanApi()
                            .editEmergencyTeam(ruleForm.value)
                            .then((res) => {
                                if (res.data.code == 200) {
                                    ElMessage({
                                        showClose: true,
                                        message: '修改成功',
                                        type: 'success',
                                    });
                                    emit('myAdd', true);
                                } else {
                                    ElMessage({
                                        showClose: true,
                                        message: res.data.msg,
                                        type: 'error',
                                    });
                                    emit('myAdd', true);
                                }
                                formEl.resetFields();
                            });
                    } else {
                        console.log('error submit!', fields);
                    }
                });
                formEl.resetFields();
                ruleForm.value = {
                    name: '', // 预案名称
                    type: '', //预案类型
                    associatedDanger: '', // 危险源关联
                    level: '', // 预案级别
                    authorUid: '', // 编写人
                    authorDeptId: '', // 编写部门
                    releaseDate: '', // 发布实施日期
                    fileList: [
                        {
                            fileUrl: 'url',
                            fileName: 'name',
                        },
                    ],
                    emergencyTeam: '', //应急队伍
                    areaList: [], //区域列表
                    teamList: [],
                    deptList: [],
                    abolishStatus: false,
                };
            }
        };
        const resetForm = (formEl: FormInstance | undefined) => {
            isShowDialog.value = false;
            if (!formEl) return;
            formEl.resetFields();
        };
        // 应急队伍弹窗
        const Shows = ref();
        const daiInpt = () => {
            Shows.value.openDailog();
        };
        // 选择区域弹窗
        const openRef = ref();
        const regionsDialog = () => {
            openRef.value.openDailog();
        };
        // 打开用户选择弹窗
        const userRef = ref();
        const openUser = () => {
            userRef.value.openDailog();
        };
        //回显
        const onUser = (e: any) => {
            ruleForm.value.authorUid = e.uid;
        };
        const typeChang = () => {
            console.log('tag', ruleForm);
        };
        //全屏
        const full = ref(false);
        const toggleFullscreen = () => {
            if (full.value == false) {
                full.value = true;
            } else {
                full.value = false;
            }
        };
        return {
            openDialog,
            fileList,
            responsibleDepartment,
            data,
            Search,
            releaseDate,
            treeSelect,
            // trees,
            propse,
            department,
            daiInpt,
            Shows,
            submitForm,
            openUser,
            userRef,
            regionsDialog,
            openRef,
            toggleFullscreen,
            FullScreen,
            full,
            titles,
            disabled,
            emit,
            isShowDialog,
            ruleFormRef,
            ruleForm,
            resetForm,
            onUser,
            typeChang,
        };
    },
});
</script>
<style scoped lang="scss">
.textarea {
    height: 168px !important;
}
.textarea ::v-deep .el-textarea__inner {
    height: 168px !important;
}
::v-deep .el-table__cell {
    font-weight: 400;
}
.el-divider--horizontal {
    height: 0;
    margin: 0;
    border-top: transparent;
}
.el-select {
    width: 100%;
}
</style>

 src/views/contingencyManagement/panManagement/component/initiateApproval.vue

对比新文件
@@ -0,0 +1,405 @@
<template>
    <div class="system-edit-user-container">
        <el-dialog :title="titles" v-model="isShowDialog" width="40%" draggable :fullscreen="full" :close-on-click-modal="false">
            <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
            <el-form ref="ruleFormRef" :model="ruleForm" size="default" label-width="120px" :disabled="disabled">
                <el-row :gutter="35">
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="预案名称" prop="name">
                            <el-input v-model="ruleForm.name" 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="responsibleDepartment">
                            <el-tree-select
                                v-model="ruleForm.treeSelect"
                                :data="data"
                                multiple
                                :render-after-expand="true"
                                :props="propse"
                                show-checkbox
                                clearable
                                check-strictly
                            />
                            <el-divider />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="预案类型" prop="type">
                            <el-select v-model="ruleForm.type" class="w100" placeholder="请选择">
                                <el-option label="综合应急预案" value="综合应急预案"></el-option>
                                <el-option label="现场处置方案" value="现场处置方案"></el-option>
                                <el-option label="专项应急预案" value="专项应急预案"></el-option>
                                <el-option label="其他预案" value="其他预案"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="危险源关联" prop="associatedDanger">
                            <el-select v-model="ruleForm.associatedDanger" class="w100" placeholder="请选择">
                                <el-option label="是" :value="false"></el-option>
                                <el-option label="否" :value="true"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="预案级别" prop="level">
                            <el-select v-model="ruleForm.level" class="w100" placeholder="请选择">
                                <el-option label="公司级" value="公司级"></el-option>
                                <el-option label="分厂级" value="分厂级"></el-option>
                                <el-option label="车间级" value="车间级"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="编写人" prop="authorId">
                            <el-input v-model="ruleForm.authorUid" placeholder="请选择" class="input-with-select">
                                <template #append>
                                    <el-button :icon="Search" @click="openUser" />
                                </template>
                            </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="authorDeptId">
                            <el-tree-select
                                v-model="ruleForm.authorDeptId"
                                check-strictly
                                :data="data"
                                class="w100"
                                :props="propse"
                                clearable
                                :render-after-expand="false"
                                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="releaseDate">
                            <el-date-picker
                                v-model="ruleForm.releaseDate"
                                type="datetime"
                                class="w100"
                                placeholder="选择日期时间"
                                value-format="YYYY-MM-DD HH:mm:ss"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="应急队伍" prop="emergencyTeam">
                            <el-input v-model="ruleForm.emergencyTeam" placeholder="请选择" class="input-with-select">
                                <template #append>
                                    <el-button :icon="Search" @click="daiInpt" />
                                </template>
                            </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-upload
                                v-model:file-list="fileList"
                                class="upload-demo"
                                action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                                :on-change="handleChange"
                            >
                                <el-button type="primary">点击上传</el-button>
                                <template #tip>
                                    <div class="el-upload__tip">添加相关附件</div>
                                </template>
                            </el-upload>
                        </el-form-item>
                    </el-col>
                    <!--          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">-->
                    <!--            <el-form-item label="区域名称" prop="areaName">-->
                    <!--              <el-input-->
                    <!--                  v-model="ruleForm.areaName"-->
                    <!--                  placeholder="请选择"-->
                    <!--                  class="input-with-select"-->
                    <!--              >-->
                    <!--                <template #append>-->
                    <!--                  <el-button :icon="Search" @click="regionsDialog"/>-->
                    <!--                </template>-->
                    <!--              </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="authorId">
                            <el-input v-model="ruleForm.authorUid" placeholder="请选择" class="input-with-select">
                                <template #append>
                                    <el-button :icon="Search" @click="openUser" />
                                </template>
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="resetForm(ruleFormRef)" size="default">关闭</el-button>
                    <el-button size="default" type="primary" v-if="disabled == true ? false : true" @click="submitForm(titles, ruleFormRef)">确定</el-button>
                </span>
            </template>
        </el-dialog>
        <CheckTemplate ref="Shows" />
        <DailogSearchUser ref="userRef" @SearchUser="onUser" />
        <RegionsDialog ref="openRef" />
    </div>
</template>

<script lang="ts">
import { ref, defineComponent, onMounted } from 'vue';

import type { UploadUserFile, FormInstance } from 'element-plus';
import { ElMessage } from 'element-plus';
import { Search, FullScreen } from '@element-plus/icons-vue';
import DailogSearchUser from '/@/components/DailogSearchUser/index.vue';
import CheckTemplate from '/@/components/checkTemplate/index.vue';
import RegionsDialog from '/@/components/regionsDialog/index.vue';
import { emergencyPlanApi } from '/@/api/emergencyPlan';
import { goalManagementApi } from '/@/api/goalManagement';

export default defineComponent({
    name: 'openAdd',
    components: {
        CheckTemplate,
        DailogSearchUser,
        RegionsDialog,
    },
    setup(prop, { emit }) {
        const isShowDialog = ref(false);
        const ruleFormRef = ref<FormInstance>();
        const ruleForm = ref({
            name: '', // 预案名称
            type: '', //预案类型
            associatedDanger: '', // 危险源关联
            level: '', // 预案级别
            authorUid: '', // 编写人
            authorDeptId: '', // 编写部门
            releaseDate: '', // 发布实施日期
            fileList: [
                {
                    fileUrl: 'url',
                    fileName: 'name',
                },
            ],
            emergencyTeam: '', //应急队伍
            areaList: [], //区域列表
            teamList: [],
            deptList: [],
            abolishStatus: false,
        });
        const titles = ref();
        const disabled = ref();

        // 打开弹窗
        const openDialog = (title: string, id: number, type: boolean) => {
            isShowDialog.value = true;
            titles.value = title;
            disabled.value = type;
            if (title == '查看应急预案管理' || title == '修改应急预案管理') {
                emergencyPlanApi()
                    .seeEmergencyTeam(id)
                    .then((res) => {
                        if (res.data.code == 200) {
                            ruleForm.value = res.data.data;
                        }
                    });
            }
        };
        //日期选择器
        const releaseDate = ref('');
        // 上传附件
        const fileList = ref<UploadUserFile[]>([]);
        //部门树
        const department = () => {
            goalManagementApi()
                .getTreedepartment()
                .then((res) => {
                    if (res.data.code == 200) {
                        data.value = res.data.data;
                    } else {
                        ElMessage.error(res.data.msg);
                    }
                });
        };
        const treeSelect = ref();
        // const trees = ref();
        const propse = {
            label: 'depName',
            children: 'children',
            value: 'depId',
        };
        onMounted(() => {
            department();
        });
        //定义树形下拉框
        const responsibleDepartment = ref();
        const data = ref();

        const submitForm = async (title: string, formEl: FormInstance | undefined) => {
            if (title == '新建应急预案管理') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        isShowDialog.value = false;
                        emergencyPlanApi()
                            .addEmergencyPlan(ruleForm.value)
                            .then((res) => {
                                if (res.data.code == 200) {
                                    ElMessage({
                                        showClose: true,
                                        message: res.data.msg,
                                        type: 'success',
                                    });
                                    emit('myAdd', true);
                                } else {
                                    ElMessage({
                                        showClose: true,
                                        message: res.data.msg,
                                        type: 'error',
                                    });
                                    emit('myAdd', true);
                                }
                                formEl.resetFields();
                            });
                    } else {
                        console.log('error submit!', fields);
                    }
                });
            } else if (title == '修改应急预案管理') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        isShowDialog.value = false;
                        emergencyPlanApi()
                            .editEmergencyTeam(ruleForm.value)
                            .then((res) => {
                                if (res.data.code == 200) {
                                    ElMessage({
                                        showClose: true,
                                        message: '修改成功',
                                        type: 'success',
                                    });
                                    emit('myAdd', true);
                                } else {
                                    ElMessage({
                                        showClose: true,
                                        message: res.data.msg,
                                        type: 'error',
                                    });
                                    emit('myAdd', true);
                                }
                                formEl.resetFields();
                            });
                    } else {
                        console.log('error submit!', fields);
                    }
                });
                formEl.resetFields();
                ruleForm.value = {
                    name: '', // 预案名称
                    type: '', //预案类型
                    associatedDanger: '', // 危险源关联
                    level: '', // 预案级别
                    authorUid: '', // 编写人
                    authorDeptId: '', // 编写部门
                    releaseDate: '', // 发布实施日期
                    fileList: [
                        {
                            fileUrl: 'url',
                            fileName: 'name',
                        },
                    ],
                    emergencyTeam: '', //应急队伍
                    areaList: [], //区域列表
                    teamList: [],
                    deptList: [],
                    abolishStatus: false,
                };
            }
        };
        const resetForm = (formEl: FormInstance | undefined) => {
            isShowDialog.value = false;
            if (!formEl) return;
            formEl.resetFields();
        };
        // 应急队伍弹窗
        const Shows = ref();
        const daiInpt = () => {
            Shows.value.openDailog();
        };
        // 选择区域弹窗
        const openRef = ref();
        const regionsDialog = () => {
            openRef.value.openDailog();
        };
        // 打开用户选择弹窗
        const userRef = ref();
        const openUser = () => {
            userRef.value.openDailog();
        };
        //回显
        const onUser = (e: any) => {
            ruleForm.value.authorUid = e.uid;
        };
        //全屏
        const full = ref(false);
        const toggleFullscreen = () => {
            if (full.value == false) {
                full.value = true;
            } else {
                full.value = false;
            }
        };
        return {
            openDialog,
            fileList,
            responsibleDepartment,
            data,
            Search,
            releaseDate,
            treeSelect,
            // trees,
            propse,
            department,
            daiInpt,
            Shows,
            submitForm,
            openUser,
            userRef,
            regionsDialog,
            openRef,
            toggleFullscreen,
            FullScreen,
            full,
            titles,
            disabled,
            emit,
            isShowDialog,
            ruleFormRef,
            ruleForm,
            resetForm,
            onUser,
        };
    },
});
</script>
<style scoped lang="scss">
.textarea {
    height: 168px !important;
}
.textarea ::v-deep .el-textarea__inner {
    height: 168px !important;
}
::v-deep .el-table__cell {
    font-weight: 400;
}
.el-divider--horizontal {
    height: 0;
    margin: 0;
    border-top: transparent;
}
.el-select {
    width: 100%;
}
</style>

 src/views/contingencyManagement/panManagement/component/openAdd.vue

@@ -1,20 +1,8 @@
<template>
  <div class="system-edit-user-container">
    <el-dialog
        :title="titles"
        v-model="isShowDialog"
        width="40%"
        draggable
        :fullscreen="full"
    >
        <el-dialog :title="titles" v-model="isShowDialog" width="40%" draggable :fullscreen="full" :close-on-click-modal="false">
      <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
      <el-form
          ref="ruleFormRef"
          :model="ruleForm"
          size="default"
          label-width="120px"
          :disabled="disabled"
      >
            <el-form ref="ruleFormRef" :model="ruleForm" size="default" label-width="120px" :disabled="disabled">
        <el-row :gutter="35">
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
            <el-form-item label="预案名称" prop="name">
@@ -65,11 +53,7 @@
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
            <el-form-item label="编写人" prop="authorId" >
              <el-input
                  v-model="ruleForm.authorUid"
                  placeholder="请选择"
                  class="input-with-select"
              >
                            <el-input v-model="ruleForm.authorName" placeholder="请选择" class="input-with-select">
                <template #append>
                  <el-button :icon="Search" @click="openUser"/>
                </template>
@@ -86,7 +70,8 @@
                  :props="propse"
                  clearable
                  :render-after-expand="false"
                  placeholder="请选择"/>
                                placeholder="请选择"
                            />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
@@ -102,11 +87,7 @@
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
            <el-form-item label="应急队伍" prop="emergencyTeam">
              <el-input
                  v-model="ruleForm.emergencyTeam"
                  placeholder="请选择"
                  class="input-with-select"
              >
                            <el-input v-model="ruleForm.emergencyTeam" placeholder="请选择" class="input-with-select">
                <template #append>
                  <el-button :icon="Search" @click="daiInpt" />
                </template>
@@ -121,12 +102,9 @@
                  action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                  :on-change="handleChange"
              >
                <el-button type="primary"
                >点击上传</el-button>
                                <el-button type="primary">点击上传</el-button>
                <template #tip>
                  <div class="el-upload__tip">
                    添加相关附件
                  </div>
                                    <div class="el-upload__tip">添加相关附件</div>
                </template>
              </el-upload>
            </el-form-item>
@@ -154,38 +132,28 @@
      </template>
    </el-dialog>
    <CheckTemplate ref="Shows"/>
    <DailogSearchUser ref="userRef" @SearchUser="onUser"/>
        <DailogSearchUserManger ref="userRef" @SearchUser="onUser" />
    <RegionsDialog ref="openRef"/>
  </div>
</template>

<script lang="ts">
import {
  ref,
  defineComponent,
  onMounted,
} from 'vue';
import { ref, defineComponent, onMounted } from 'vue';

import type {
  UploadUserFile,
  FormInstance,
} from 'element-plus'
import type { UploadUserFile, FormInstance } from 'element-plus';
import { ElMessage } from 'element-plus';
import {
  Search,
  FullScreen
} from '@element-plus/icons-vue'
import DailogSearchUser from "/@/components/DailogSearchUser/index.vue"
import CheckTemplate from '/@/components/checkTemplate/index.vue'
import RegionsDialog from '/@/components/regionsDialog/index.vue'
import {emergencyPlanApi} from "/@/api/emergencyPlan";
import {goalManagementApi} from "/@/api/goalManagement";
import { Search, FullScreen } from '@element-plus/icons-vue';
import DailogSearchUserManger from '/@/components/DailogSearchUserManger/index.vue';
import CheckTemplate from '/@/components/checkTemplate/index.vue';
import RegionsDialog from '/@/components/regionsDialog/index.vue';
import { emergencyPlanApi } from '/@/api/emergencyPlan';
import { goalManagementApi } from '/@/api/goalManagement';

export default defineComponent({
  name: 'openAdd',
  components: {
    CheckTemplate,
    DailogSearchUser,
        DailogSearchUserManger,
    RegionsDialog,
  },
  setup(prop, {emit}) {
@@ -197,20 +165,21 @@
      associatedDanger: '', // 危险源关联
      level: '', // 预案级别
      authorUid: '', // 编写人
            authorName: '',
      authorDeptId: '', // 编写部门
      releaseDate: '', // 发布实施日期
      fileList: [
        {
          fileUrl: 'url',
          fileName: 'name',
        }
                },
      ],
      emergencyTeam: '', //应急队伍
      areaList: [],  //区域列表
      teamList: [],
      deptList: [],
      abolishStatus: false,
    })
        });
    const titles = ref();
    const disabled = ref();

@@ -230,9 +199,9 @@
      }
    };
    //日期选择器
    const releaseDate = ref('')
        const releaseDate = ref('');
    // 上传附件
    const fileList = ref<UploadUserFile[]>([])
        const fileList = ref<UploadUserFile[]>([]);
    //部门树
    const department = () => {
      goalManagementApi()
@@ -245,7 +214,7 @@
            }
          });
    };
    const treeSelect = ref()
        const treeSelect = ref();
    // const trees = ref();
    const propse = {
      label: 'depName',
@@ -256,7 +225,7 @@
      department();
    });
    //定义树形下拉框
    const responsibleDepartment = ref()
        const responsibleDepartment = ref();
    const data = ref();

    const submitForm = async (title: string, formEl: FormInstance | undefined) => {
@@ -288,9 +257,8 @@
          } else {
            console.log('error submit!', fields);
          }
        })
      }
      else if (title == '修改应急预案管理') {
                });
            } else if (title == '修改应急预案管理') {
        if (!formEl) return;
        await formEl.validate((valid, fields) => {
          if (valid) {
@@ -326,13 +294,14 @@
          associatedDanger: '', // 危险源关联
          level: '', // 预案级别
          authorUid: '', // 编写人
                    authorName: '',
          authorDeptId: '', // 编写部门
          releaseDate: '', // 发布实施日期
          fileList: [
            {
              fileUrl: 'url',
              fileName: 'name',
            }
                        },
          ],
          emergencyTeam: '', //应急队伍
          areaList: [],  //区域列表
@@ -348,15 +317,15 @@
      formEl.resetFields();
    };
    // 应急队伍弹窗
    const Shows=ref()
        const Shows = ref();
    const daiInpt=()=>{
      Shows.value.openDailog()
    }
            Shows.value.openDailog();
        };
    // 选择区域弹窗
    const openRef=ref()
        const openRef = ref();
    const regionsDialog=()=>{
      openRef.value.openDailog()
    }
            openRef.value.openDailog();
        };
    // 打开用户选择弹窗
    const userRef = ref();
    const openUser = () => {
@@ -364,7 +333,8 @@
    };
    //回显
    const onUser = (e:any) => {
      ruleForm.value.authorUid=e.uid
            ruleForm.value.authorUid = e[0].uid;
            ruleForm.value.authorName = e[0].realName;
    };
    //全屏
    const full = ref(false);

 src/views/contingencyManagement/panManagement/component/openEdit.vue

文件已删除

 src/views/contingencyManagement/panManagement/index.vue

@@ -4,10 +4,10 @@
      <div class="system-user-search mb15">
        <el-form :inline="true" class="demo-form-inline">
          <el-form-item>
            <el-input size="default" v-model="listQuery.searchParams.name" placeholder="预案名称" style="max-width: 215px;"> </el-input>
                        <el-input size="default" v-model="listQuery.searchParams.name" placeholder="预案名称" style="max-width: 215px"> </el-input>
          </el-form-item>
          <el-form-item>
            <el-select size="default" v-model="listQuery.searchParams.type" placeholder="请选择预案类型" class="ml10" style="max-width: 215px;">
                        <el-select size="default" v-model="listQuery.searchParams.type" placeholder="请选择预案类型" class="ml10" style="max-width: 215px">
              <el-option label="综合应急预案" value="admin"></el-option>
              <el-option label="现场处置方案" value="common"></el-option>
              <el-option label="专项应急预案" value="common"></el-option>
@@ -15,12 +15,8 @@
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button size="default" type="primary" class="ml10" @click="onSubmit">
              查询
            </el-button>
            <el-button size="default" class="ml10" @click="submitReset">
              重置
            </el-button>
                        <el-button size="default" type="primary" class="ml10" @click="onSubmit"> 查询 </el-button>
                        <el-button size="default" class="ml10" @click="submitReset"> 重置 </el-button>
          </el-form-item>
        </el-form>
      </div>
@@ -28,22 +24,20 @@
        <div class="button_Left">
          <el-button size="default" type="primary"  @click="onOpenAdd">
            <el-icon>
              <Plus />
            </el-icon>新建
                            <Plus /> </el-icon
                        >新建
          </el-button>
          <el-button size="default" type="warning" plain :disabled="warning">
            <el-icon>
              <Edit />
            </el-icon>修改
                            <Edit /> </el-icon
                        >修改
          </el-button>
          <el-button size="default" type="danger" plain :disabled="danger" @click="onDeleteAll">
            <el-icon>
              <Delete />
            </el-icon>删除
                            <Delete /> </el-icon
                        >删除
          </el-button>
          <el-button size="default" type="primary"  @click="onabolishLibrary">
            废止库
          </el-button>
                    <el-button size="default" type="primary" @click="onabolishLibrary"> 废止库 </el-button>
        </div>
        <div class="button_Right">
<!--          <el-button size="default" @click="upButton">-->
@@ -63,16 +57,8 @@
<!--          </el-button>-->
        </div>
      </div>
      <el-table
          :data="tableData"
          style="width: 100%"
          ref="multipleTableRef"
          @selection-change="handleSelectionChange"
      >
        <el-table-column
            type="selection"
            width="55"
        />
            <el-table :data="tableData" style="width: 100%" ref="multipleTableRef" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55" />
        <el-table-column prop="name" label="预案名称" show-overflow-tooltip sortable></el-table-column>
        <el-table-column prop="type" label="预案类型" show-overflow-tooltip sortable></el-table-column>
        <el-table-column prop="level" label="预案级别" show-overflow-tooltip sortable></el-table-column>
@@ -80,19 +66,49 @@
        <el-table-column label="操作" width="260" align="center" fixed="right">
          <template #default="scope">
            <el-button size="small" text type="primary" @click="isDialogFormVisible(scope.row.id)">
              <el-icon style="margin-right: 5px;">
                <VideoPlay />
              </el-icon>启动
                            <el-icon style="margin-right: 5px">
                                <VideoPlay /> </el-icon
                            >启动
            </el-button>
            <el-button size="small" text type="primary" @click="abolish(scope.row.id)">
              <el-icon style="margin-right: 5px;">
                <VideoPause />
              </el-icon>废止
                            <el-icon style="margin-right: 5px">
                                <VideoPause /> </el-icon
                            >废止
            </el-button>
            <el-button size="small" text type="primary" @click="onEdit('修改',scope.row.id)">
              <el-icon style="margin-right: 5px;">
                <EditPen />
              </el-icon>修改
                            <el-icon style="margin-right: 5px">
                                <EditPen /> </el-icon
                            >修改
                        </el-button>
                        <el-button
                            size="small"
                            text
                            type="primary"
                            v-if="scope.row.approveStatus === 0 || scope.row.approveStatus === null"
                            @click="initiateApproval(scope.row.id)"
                        >
                            发起审批
                        </el-button>
                        <el-button
                            size="small"
                            text
                            type="primary"
                            v-if="scope.row.approveStatus === 1 || scope.row.checkApprove == true"
                            @click="onApproval(scope.row.id)"
                        >
                            审批
                        </el-button>
                        <el-button
                            size="small"
                            text
                            type="primary"
                            v-if="scope.row.approveStatus === 1 || scope.row.checkApprove == false"
                            @click="initiateApproval(scope.row.id)"
                        >
                            查看审批
                        </el-button>
                        <el-button size="small" text type="primary" v-if="scope.row.approveStatus === 2" @click="initiateApproval(scope.row.id)">
                            查看审批流程
            </el-button>
<!--            <el-button size="small" text type="primary" @click="jumpFrom(0)">-->
<!--              <el-icon style="margin-right: 5px;">-->
@@ -104,8 +120,8 @@
<!--            </el-button>-->
            <el-button size="small" text type="primary" @click="onRowDel(scope.row.id)">
              <el-icon>
                <Delete />
              </el-icon>删除
                                <Delete /> </el-icon
                            >删除
            </el-button>
          </template>
        </el-table-column>
@@ -128,6 +144,8 @@
    </el-card>
    <OpenAdd ref="addRef" @myAdd="onMyAdd"/>
    <AbolishLibrary ref="abolishRef"/>
        <InitiateApproval ref="initiateApprovalRef" />
        <Approval ref="approvalRef" />
<!--    <StartUp ref="startRef" @myAdd="startUp"/>-->
    <el-dialog v-model="dialogFormVisible" width="30%" title="启动" :fullscreen="full">
      <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
@@ -139,9 +157,7 @@
      <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取消</el-button>
        <el-button type="primary" @click="onDetermine"
        >确定</el-button
        >
                    <el-button type="primary" @click="onDetermine">确定</el-button>
      </span>
      </template>
    </el-dialog>
@@ -149,44 +165,29 @@
</template>

<script lang="ts">
import {
  reactive,
  onMounted,
  ref,
  defineComponent
} from 'vue';
import {
  ElMessageBox,
  ElMessage,
} from 'element-plus';
import { reactive, onMounted, ref, defineComponent } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
// import {useRouter} from "vue-router"
import type {
  // FormInstance,
} from 'element-plus'
import { Plus,
  Edit,
  Delete,
  Upload,
  Download,
  Refresh,
  VideoPause,
  VideoPlay,
  EditPen,
  FullScreen
} from '@element-plus/icons-vue'
import type {} from // FormInstance,
'element-plus';
import { Plus, Edit, Delete, Upload, Download, Refresh, VideoPause, VideoPlay, EditPen, FullScreen } from '@element-plus/icons-vue';
import OpenAdd from '/@/views/contingencyManagement/panManagement/component/openAdd.vue';
// import StartUp from '/@/views/contingencyManagement/panManagement/component/startUp.vue';
import AbolishLibrary from '/@/views/contingencyManagement/panManagement/component/abolishLibrary.vue';
import InitiateApproval from '/@/views/contingencyManagement/panManagement/component/initiateApproval.vue';
import Approval from '/@/views/contingencyManagement/panManagement/component/approval.vue';
// import UpData from '/@/views/contingencyManagement/panManagement/component/upData.vue';
import {emergencyPlanApi} from "/@/api/emergencyPlan";
import {emergencyPlanLogApi} from "/@/api/emergencyPlanLog";
import { emergencyPlanApi } from '/@/api/emergencyPlan';
import { emergencyPlanLogApi } from '/@/api/emergencyPlanLog';

export default defineComponent({
  name: 'systemUser',
  components: {
    OpenAdd,
    // StartUp,
        InitiateApproval,
    AbolishLibrary,
        Approval,
    EditPen,
    Plus,
    Edit,
@@ -197,7 +198,7 @@
    VideoPause,
    VideoPlay,
    // UpData,
    emergencyPlanApi
        emergencyPlanApi,
  },
  setup(prop, {emit}) {
    // 列表参数
@@ -205,16 +206,16 @@
      pageIndex: 1,
      pageSize: 10,
      searchParams: {
        name: "",
        type: "",
                name: '',
                type: '',
        abolishStatus: false,
      }
    })
            },
        });
    // 定义表格数据
    const tableData = ref([]);
    // 列表数据请求
    const onSubmit = async () => {
      let res = await emergencyPlanApi().getEmergencyPlanList(listQuery)
            let res = await emergencyPlanApi().getEmergencyPlanList(listQuery);
      if(res.data.code === '200'){
        tableData.value = res.data.data;
        pageIndex.value = res.data.pageIndex;
@@ -224,10 +225,10 @@
        ElMessage({
          showClose: true,
          type:'error',
          message:res.data.msg
        })
                    message: res.data.msg,
                });
      }
    }
        };
    // 重置
    const submitReset = () => {
      listQuery.searchParams.name = '';
@@ -237,7 +238,6 @@
    const warning = ref(true);
    const danger = ref(true);


    // 上传
    // const upShow=ref()
    // const upButton=()=>{
@@ -245,15 +245,15 @@
    // }
    // 启动弹窗
    const isDialogFormVisible = (data: any) => {
      dialogFormVisible.value=true
      form.value.planId=data
    }
    const dialogFormVisible = ref(false)
            dialogFormVisible.value = true;
            form.value.planId = data;
        };
        const dialogFormVisible = ref(false);
    const form = ref ({
      remark: '',
    })
        });
    const onDetermine = () => {
      dialogFormVisible.value=false
            dialogFormVisible.value = false;
      emergencyPlanLogApi()
        .addEmergencyPlanLog(form.value)
        .then((res) => {
@@ -275,8 +275,8 @@
        });
        form.value = {
          remark: '',
        }
    }
            };
        };
    // 打开新增用户弹窗
    const addRef = ref();
    const onOpenAdd = () => {
@@ -310,7 +310,8 @@
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
            })
                .then(() => {
        emergencyPlanApi()
            .EmergencyTeam(data)
            .then((res) => {
@@ -330,18 +331,20 @@
                onSubmit();
              }
            });
      }).catch(() => {});
                })
                .catch(() => {});
    };

    // 删除用户
    const onRowDel = (id: number) => {
      let arr = [];
      arr.push(id)
            arr.push(id);
      ElMessageBox.confirm('确定删除所选项吗?', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
            })
                .then(() => {
        emergencyPlanApi()
              .deleteEmergencyTeam(arr)
              .then((res) => {
@@ -361,7 +364,8 @@
                  onSubmit();
                }
              });
        }).catch(() => {});
                })
                .catch(() => {});
    };

    const deleteAll = ref();
@@ -444,6 +448,16 @@
    //     }
    //   })
    // }
        // 发起审批弹窗
        const initiateApprovalRef = ref();
        const initiateApproval = () => {
            initiateApprovalRef.value.openDialog();
        };
        // 审批
        const approvalRef = ref();
        const onApproval = () => {
            approvalRef.value.openDialog();
        };
    //全屏
    const full = ref(false);
    const toggleFullscreen = () => {
@@ -458,8 +472,6 @@
      onSubmit();
    });
    return {
      // upButton,
      // upShow,
      tableData,
      onSubmit,
      onOpenAdd,  //新增
@@ -470,8 +482,6 @@
      onRowDel,
      onHandleSizeChange,
      onHandleCurrentChange,
      // jumpFrom,
      // router,
      toggleFullscreen,
      FullScreen,
      full,
@@ -487,13 +497,16 @@
      handleSelectionChange,
      onMyAdd,
      onDeleteAll,
      // dialogTableVisible,
      dialogFormVisible,
      isDialogFormVisible,
      form,
      emit,
      onDetermine,
      onEdit,
            initiateApproval,
            initiateApprovalRef,
            onApproval,
            approvalRef,
    };
  },
});