Admin
2022-09-21 999cab6fb3fc6d2a288d365da991351c5a396bf0
src/views/contingencyManagement/contingency/component/openAdd.vue
@@ -30,7 +30,7 @@
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="负责人部门" prop="principalDepartmentId">
                            <el-tree-select v-model="ruleForm.principalDepartmentId" :data="data" class="w100"
                            <el-tree-select v-model="ruleForm.principalDepartmentId" :data="newTreeList" class="w100"
                                            :props="propse" clearable placeholder="请选择"/>
                        </el-form-item>
                    </el-col>
@@ -52,17 +52,8 @@
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="相关附件" prop="fileList">
                            <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>
                            <uploaderFile :fileList="fileList" :systemName="'EMERGENCY'" :disabled="disabled"
                                          @successUploader="successUploader"></uploaderFile>
                        </el-form-item>
                    </el-col>
                </el-row>
@@ -71,7 +62,7 @@
                <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
                        <el-tab-pane label="应急队伍人员" name="first" >
                            <el-button type="primary" size="default" @click="onAddEmergencyPersonnel" :disabled="disabled">新增
                            <el-button type="primary" size="default" @click="onAddEmergencyPersonnel(ruleFormRef)" :disabled="disabled">新增
                            </el-button>
                            <el-table
                                    :data="tableData"
@@ -142,6 +133,7 @@
    import DailogSearchUserManger from "/@/components/DailogSearchUserManger/index.vue"
    import {contingencyApi} from "/@/api/contingencyManagement/contingency";
    import {goalManagementApi} from "/@/api/goalManagement";
    import uploaderFile from '/@/components/uploaderFile/index.vue';
    // import {releaseDrillPlanApi} from "/@/api/releaseDrillPlan";
@@ -150,6 +142,7 @@
        components: {
            AddEmergencyPersonnel,
            DailogSearchUserManger,
            uploaderFile
        },
        setup(prop, {emit}) {
            const isShowDialog = ref(false);
@@ -163,17 +156,11 @@
                principalPhone: '', // 负责人手机
                telephoneNumber: '', // 固定电话
                teamDesc: '',  //队伍描述
                fileList: [
                    {
                        fileUrl: 'url',
                        fileName: 'name',
                    }
                ],
                fileList: [],
                memberList: []
            });
            const titles = ref();
            const disabled = ref();
            const peopleInsertBtn = ref(false)
            const teamId = ref()
            // 打开弹窗
            const openDialog = (title: string, id: number, type: boolean) => {
@@ -181,49 +168,87 @@
                titles.value = title;
                disabled.value = type;
                teamId.value = id
                //如果是新增  无法添加人员
                if(title == '新建应急队伍管理'){
                    peopleInsertBtn.value = true
                }else{
                    peopleInsertBtn.value = false
                }
                if (title == '查看应急队伍管理' || title == '修改应急队伍管理') {
                    contingencyApi()
                        .seeEmergencyTeam(id)
                        .then((res) => {
                            if (res.data.code == 200) {
                                ruleForm.value = res.data.data;
                                fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                                initFileListData()
                                listApi()
                            }
                        });
                }
            }
            // 上传附件
            const fileList = ref<UploadUserFile[]>([])
            const fileList = ref([])
            const initFileListData = async () => {
                for(var a = 0;a<fileList.value.length;a++){
                    fileList.value[a].name = fileList.value[a].fileName
                }
            }
            // 上传成功组装数据
            const successUploader = (list) =>{
                fileList.value = list
                const formFileList = []
                for(var a = 0;a<fileList.value.length;a++){
                    formFileList.push(
                        {
                            fileName:fileList.value[a].fileName,
                            fileUrl:''
                        }
                    )
                }
                ruleForm.value.fileList = formFileList
            }
            //定义树形下拉框
            const principalDepartmentId = ref()
            const data = ref()
            //部门树
            const department = () => {
                goalManagementApi()
            //el-tree-select回显
            const propse = {
                label: 'depName',
                children: 'children',
            };
            const newTreeList = [];
            //得到部门树
            const department = async () => {
                await goalManagementApi()
                    .getTreedepartment()
                    .then((res) => {
                        if (res.data.code == 200) {
                            data.value = res.data.data;
                            getTreeList(res.data.data, newTreeList);
                        } else {
                            ElMessage.error(res.data.msg);
                        }
                    });
            };
            //定义树形下拉框
            const principalDepartmentId = ref()
            const propse = {
                label: 'depName',
                children: 'children',
                value: 'depId',
            // 递归树状数据且修改字段名
            const getTreeList = (treeList, newTreeList) => {
                treeList.map((c) => {
                    let tempData = {
                        depName: c.depName,
                        value: c.depId,
                        children: [],
                    };
                    if (c.children && c.children.length > 0) {
                        tempData.children = [];
                        getTreeList(c.children, tempData.children);
                    }
                    newTreeList.push(tempData);
                });
            };
            const data = ref()
            onMounted(() => {
                department();
            });
            // 打开用户选择弹窗
            const userRef = ref();
            const openUser = () => {
@@ -294,31 +319,43 @@
                }
            };
            const onSubmit = async (title: string, formEl: FormInstance | undefined) => {
                if(!ruleForm.value.fileList){
                    ruleForm.value.fileList = []
                }
                if (title == '新建应急队伍管理') {
                    if (!formEl) return;
                    await formEl.validate((valid, fields) => {
                        if (valid) {
                            isShowDialog.value = false;
                            contingencyApi()
                                .addEmergencyTeam(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();
                            if(teamId.value==null||teamId.value==''){
                                contingencyApi()
                                    .addEmergencyTeam(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 {
                                ElMessage({
                                    showClose: true,
                                    message: '添加成功',
                                    type: 'success',
                                });
                                emit('myAdd', true);
                            }
                        } else {
                            console.log('error submit!', fields);
                        }
@@ -361,12 +398,7 @@
                        principalPhone: '', // 负责人手机
                        telephoneNumber: '', // 固定电话
                        teamDesc: '',  //队伍描述
                        fileList: [
                            {
                                fileUrl: 'url',
                                fileName: 'name',
                            }
                        ],
                        fileList: [],
                        memberList: []
                    };
                }
@@ -375,24 +407,60 @@
                isShowDialog.value = false;
                if (!formEl) return;
                formEl.resetFields();
                fileList.value = []
                tableData.value=[]
                ruleForm.value = {}
            };
            // 定义表格数据
            const tableData = ref([]);
            //添加队伍负责人弹窗
            const addRef = ref();
            const onAddEmergencyPersonnel = () => {
                //未添加队伍 无法修改人员
                if(peopleInsertBtn.value == true){
                    ElMessage({
                        showClose: true,
                        message: '请先添加应急队伍',
                        type: 'warning',
                    });
                }else {
                    addRef.value.openDialog('新建应急队伍人员','',teamId.value);
            const onAddEmergencyPersonnel = async (formEl: FormInstance | undefined) => {
                if(!ruleForm.value.fileList){
                    ruleForm.value.fileList = []
                }
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        // isShowDialog.value = false;
                        if(teamId.value == ''||teamId.value==null){
                            ElMessageBox.confirm('确认添加此应急队伍?', '提示', {
                                confirmButtonText: '确定',
                                cancelButtonText: '取消',
                                type: 'warning',
                            })
                                .then(() => {
                                    contingencyApi()
                                        .addEmergencyTeam(ruleForm.value)
                                        .then((res) => {
                                            if (res.data.code == 200) {
                                                ElMessage({
                                                    showClose: true,
                                                    message: res.data.msg,
                                                    type: 'success',
                                                });
                                                teamId.value = res.data.data.id
                                                addRef.value.openDialog('新建应急队伍人员','',teamId.value);
                                            } else {
                                                ElMessage({
                                                    showClose: true,
                                                    message: res.data.msg,
                                                    type: 'error',
                                                });
                                            }
                                        });
                                })
                                .catch(() => {});
                        }else {
                            addRef.value.openDialog('新建应急队伍人员','',teamId.value);
                        }
                    } else {
                        console.log('error submit!', fields);
                    }
                });
            };
            // 请求列表数据
            const listApi = async () => {
@@ -406,10 +474,6 @@
            // 新增后刷新
            const onMyAdd = (e: object) => {
                listApi();
                // console.log(e)
                // item.value = e
                // tableData.value.push(item.value)
                // console.log(tableData)
            };
            // 打开修改弹窗
            const onEdit = (val: string, row: object) => {
@@ -481,8 +545,10 @@
                onEdit,
                onRowDel,
                department,
                peopleInsertBtn,
                teamId
                teamId,
                newTreeList,
                successUploader,
                initFileListData
            };
        },
    });