图片上传修改

zhaojiale

2022-08-12 27bc96878e9c8adfe922c3beca964aeb7bf17520

图片上传修改

 src/api/goalManagement/index.ts

@@ -302,7 +302,18 @@
                url: `/account/dep/list?depId=${params}`,
                method: "get"
            })
        },
        beforeUploadFile(fileName1:string,fileName2:string) {
            return request({
                url: '/minio/file/presign?prefixName='+fileName1+'&suffixName='+fileName2,
                method: 'get',
            })
        },
        searchFile(fileName:string) {
            return request({
                url: '/minio/file/view?obj='+fileName,
                method: 'get',
            })
        }

    }
}

 src/components/equipmentDailog/Dailog.vue

@@ -324,22 +324,8 @@
                </el-table>
            </el-tab-pane>
            <el-tab-pane label="保养维修标准" name="six" v-if="Dailogtype">
                <el-upload
                    v-model:file-list="fileList"
                    class="upload-demo"
                    action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                    multiple
                    :on-preview="handlePreview"
                    :on-remove="handleRemove"
                    :before-remove="beforeRemove"
                    :limit="3"
                    :on-exceed="handleExceed"
                >
                    <el-button type="primary">点击上传</el-button>
                    <template #tip>
                        <div class="el-upload__tip"></div>
                    </template>
                </el-upload>
                <uploaderFile :fileList="fileList" :systemName="'EQUIPMENT'" :disabled="disabled"
                              @successUploader="successUploader"></uploaderFile>
            </el-tab-pane>
        </el-tabs>
        <template #footer>
@@ -374,8 +360,10 @@
import { facilityManagementApi } from '/@/api/facilityManagement';
import { goalManagementApi } from '/@/api/goalManagement';
import { deepClone } from '/@/utils/other';
import uploaderFile from '/@/components/uploaderFile/index.vue';
export default defineComponent({
    components: { categoryDailog, regionDailog, DailogSearchUser, maintenanceDailog, detectDailog, repairDailog, standardDailog },
    components: { categoryDailog, regionDailog, DailogSearchUser, maintenanceDailog,
        detectDailog, repairDailog, standardDailog,uploaderFile },
    setup(props, { emit }) {
        const dialogVisible = ref(false);
        const ruleFormRef = ref<FormInstance>();
@@ -415,9 +403,6 @@
            repairStatus: '',

            takecareStardardeDetailList: [
                {
                    filePath: '123',
                },
            ],

            nextCheckDate: '',
@@ -528,11 +513,61 @@
                    .then((res) => {
                        if (res.data.code == 200) {
                            form.value = res.data.data;

                            //初始化日期格式
                            form.value.actualDestoryDate = timeC(form.value.actualDestoryDate);
                            form.value.actualRecoveryDate = timeC(form.value.actualRecoveryDate);
                            form.value.actualStopDate = timeC(form.value.actualStopDate);
                            form.value.destorySubmitDate = timeC(form.value.destorySubmitDate);
                            form.value.nextCheckDate = timeC(form.value.nextCheckDate);
                            form.value.nextTakecareDate = timeC(form.value.nextTakecareDate);
                            form.value.nextTestDate = timeC(form.value.nextTestDate);
                            form.value.previousCheckDate = timeC(form.value.previousCheckDate);
                            form.value.previousTakecareDate = timeC(form.value.previousTakecareDate);
                            form.value.previousTestDate = timeC(form.value.previousTestDate);
                            form.value.produceTime = timeC(form.value.produceTime);
                            form.value.recoverySubmitDate = timeC(form.value.recoverySubmitDate);
                            form.value.stopSubmitDate = timeC(form.value.stopSubmitDate);
                            form.value.useDate = timeC(form.value.useDate);

                            fileList.value = (res.data.data.takecareStardardeDetailList?res.data.data.takecareStardardeDetailList:[])
                            initFileListData()
                        } else {
                            ElMessage.error(res.data.msg);
                        }
                    });
        };
        const timeC = (timestamp: any) => {
            let a = new Date(timestamp).getTime();
            const date = new Date(a);
            const Y = date.getFullYear() + '-';
            const M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
            const D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + '  ';
            const h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
            const m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
            const s = date.getSeconds(); // 秒
            const dateString = Y + M + D + h + m +`:${s}`;
            // console.log('dateString', dateString); // > dateString 2021-07-06 14:23
            return dateString;
        };
        const initFileListData = async () => {
            for(var a = 0;a<fileList.value.length;a++){
                fileList.value[a].name = fileList.value[a].filePath
            }
        }
        // 上传成功组装数据
        const successUploader = (list) =>{
            fileList.value = list
            const formFileList = []
            for(var a = 0;a<fileList.value.length;a++){
                formFileList.push(
                        {
                            filePath:fileList.value[a].fileName
                        }
                )
            }
            form.value.takecareStardardeDetailList = formFileList
        }
        const rules = reactive<FormRules>({
            qName: [],
            positionNum: [],
@@ -628,6 +663,7 @@
            form.value.testDetailList = [];
            form.value.repaireDetailList = [];
            form.value.checkStandardeDetailList = [];
            fileList.value = []
            dialogVisible.value = false;
        };
        const activeName = ref('first');
@@ -665,16 +701,7 @@
            standardShow.value.openDailog(title, data);
        };
        // 上传
        const fileList = ref<UploadUserFile[]>([
            {
                name: 'element-plus-logo.svg',
                url: 'https://element-plus.org/images/element-plus-logo.svg',
            },
            {
                name: 'element-plus-logo2.svg',
                url: 'https://element-plus.org/images/element-plus-logo.svg',
            },
        ]);
        const fileList = ref([]);

        const handleRemove: UploadProps['onRemove'] = (file, uploadFiles) => {
            console.log(file, uploadFiles);
@@ -845,6 +872,9 @@
            FullScreen,
            timeDate,
            ruleFormRef,
            successUploader,
            initFileListData,
            timeC
        };
    },
});

 src/components/uploaderFile/index.vue

对比新文件
@@ -0,0 +1,178 @@
<template>
    <el-upload
        v-model:file-list="fileList"
        multiple
        :disabled="disabled"
        class="upload-demo"
        :http-request="uploadSectionFile"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove"
        :on-success="successFile"
        :on-error="errorFile"
    >
        <el-button type="primary">点击上传</el-button>
        <template #tip>
            <div class="el-upload__tip">
                请上传文件
                <!--jpg/png files with a size less than 500KB.-->
            </div>
            <slot name="file">

            </slot>
        </template>
    </el-upload>

    <!--<el-dialog v-model="dialogVisible">-->
        <!--<img w-full :src="dialogImageUrl" alt="Preview Image" />-->
    <!--</el-dialog>-->
</template>
<script lang="ts">
import axios from 'axios';
import { ref, defineComponent,onMounted,watch } from 'vue';
import { Plus } from '@element-plus/icons-vue';
import type { UploadProps, UploadUserFile } from 'element-plus';
import { ElMessage } from 'element-plus';
import { goalManagementApi } from '/@/api/goalManagement';

export default defineComponent({
    props: {
        fileList: {
            type: Array,
        },
        disabled: {
            type: Boolean,
            default: () => false,
        },
        systemName: {
            type: String,
            default: () => '',
        },
    },
    components: {
        Plus,
    },
    setup(props, { emit }) {
        const dialogImageUrl = ref('');
        const dialogVisible = ref(false);

        const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
            console.log(uploadFile, uploadFiles);
            emit('deleteFile',uploadFiles);
        };

        const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
            goalManagementApi()
                    .searchFile(uploadFile.fileName)
                    .then((res) => {
                        window.open(res.data, "_blank");
                    })
            dialogImageUrl.value = uploadFile.url!;
            // dialogVisible.value = true;
        };

        const successFile = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
            console.log(response, uploadFile, uploadFiles);
        };
        const errorFile = (error: Error, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
            console.log(error, uploadFile, uploadFiles);
        };
        watch(props.fileList, (val) => {
            viewList.value = val
            // searchFile()
        });
        onMounted(() => {
            if(props.fileList){
                viewList.value = props.fileList
                // searchFile()
            }else {
                viewList.value = []
            }

        });
        const newFileList = ref([])
        const viewList = ref([])
        const searchFile = async () => {
            for(var a = 0;a<props.fileList.length;a++){
                await goalManagementApi()
                        .searchFile(props.fileList[a].fileName)
                        .then((res) => {
                            props.fileList[a].url = res.data
                        })
            }
        };
        const uploadSectionFile = (param) => {
            let form = new FormData();
            form.append('file', param.file);
            //组装文件名（传入后缀名）
            var fileName1 = getFileName(param.file.type.split('/')[1], 1);
            var fileName2 = getFileName(param.file.type.split('/')[1], 2);
            goalManagementApi()
                .beforeUploadFile(fileName1, fileName2)
                .then((res) => {
                    // 转换形式
                    const reader = new FileReader();
                    reader.readAsArrayBuffer(param.file);
                    // 上传图片
                    reader.onload = () => { // 上传图片接口 url:上传图片地址 修改请求头
                        axios.put(res.data.uploadUrl, reader.result,
                            {
                                header:
                                    { "Content-Type": "multipart/form-data" }
                            }
                        )
                        .then(res1 =>
                        {
                            props.fileList[props.fileList.length-1].fileName=res.data.fileName
                            props.fileList[props.fileList.length-1].name=res.data.fileName
                            props.fileList[props.fileList.length-1].fileUrl=''
                            emit('successUploader',props.fileList);
                            ElMessage({
                                showClose: true,
                                message: '上传成功',
                                type: 'success',
                            });
                        })
                    };
                });
        };
        const getFileName = (suffix, type) => {
            var projectName = props.systemName;
            var date = getNowDate();
            var fileName1 = projectName + '/' + date + '_';
            var fileName2 = '.' + suffix;
            if (type == 1) {
                return fileName1;
            } else if (type == 2) {
                return fileName2;
            }
            return '';
        };

        //获取当前年月日
        const getNowDate = () => {
            var a = new Date().getTime(); //获取到当前时间戳
            var now = new Date(a); //创建一个指定的日期对象
            var year = now.getFullYear(); //年份
            var month = now.getMonth() + 1; //月份（0-11）
            var date = now.getDate(); //天数（1到31）
            return year + '-' + month + '-' + date;
        };

        return {
            dialogImageUrl,
            dialogVisible,
            handleRemove,
            handlePictureCardPreview,
            successFile,
            errorFile,
            uploadSectionFile,
            viewList
        };
    },
});
</script>
<style scoped>
    .upload-demo{
        width: 100%;
    }
</style>

 src/components/uploaderImg/index.vue

@@ -1,12 +1,13 @@
<template>
    <el-upload
            v-model:file-list="fileList"
            action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
            list-type="picture-card"
            :on-preview="handlePictureCardPreview"
            :on-remove="handleRemove"
            :on-success="successFile"
            :on-error="errorFile"
        v-model:file-list="fileList"
        :disabled="disabled"
        :http-request="uploadSectionFile"
        list-type="picture-card"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove"
        :on-success="successFile"
        :on-error="errorFile"
    >
        <el-icon><Plus /></el-icon>
    </el-upload>
@@ -16,50 +17,141 @@
    </el-dialog>
</template>
<script lang="ts">
    import { ref,defineComponent } from 'vue'
    import { Plus } from '@element-plus/icons-vue'
    import type { UploadProps, UploadUserFile } from 'element-plus'
import axios from 'axios';
import { ref, defineComponent,onMounted,watch } from 'vue';
import { Plus } from '@element-plus/icons-vue';
import type { UploadProps, UploadUserFile } from 'element-plus';
import { ElMessage } from 'element-plus';
import { goalManagementApi } from '/@/api/goalManagement';

    export default defineComponent({
        props: {
            // svg 图标组件名字
            fileList: {
                type: Array,
            },
export default defineComponent({
    props: {
        // svg 图标组件名字
        fileList: {
            type: Array,
        },
        components: {
            Plus
        disabled: {
            type: Boolean,
            default: () => false,
        },
        setup() {

            const dialogImageUrl = ref('')
            const dialogVisible = ref(false)

            const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
                console.log(uploadFile, uploadFiles)
            }

            const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
                dialogImageUrl.value = uploadFile.url!
                dialogVisible.value = true
            }

            const successFile = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles)  => {
                console.log(response, uploadFile,uploadFiles)
            }
            const errorFile = (error: Error, uploadFile: UploadFile, uploadFiles: UploadFiles)  => {
                console.log(error, uploadFile,uploadFiles)
            }


            return {
                dialogImageUrl,
                dialogVisible,
                handleRemove,
                handlePictureCardPreview,
                successFile,
                errorFile
            };
        systemName: {
            type: String,
            default: () => '',
        },
    });
</script>
    },
    components: {
        Plus,
    },
    setup(props, { emit }) {
        const dialogImageUrl = ref('');
        const dialogVisible = ref(false);

        const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
            console.log(uploadFile, uploadFiles);
        };

        const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
            dialogImageUrl.value = uploadFile.url!;
            dialogVisible.value = true;
        };

        const successFile = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
            console.log(response, uploadFile, uploadFiles);
        };
        const errorFile = (error: Error, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
            console.log(error, uploadFile, uploadFiles);
        };
        watch(props.fileList, (val) => {
            viewList.value = val
            // searchFile()
        });
        onMounted(() => {
            if(props.fileList){
                viewList.value = props.fileList
                // searchFile()
            }else {
                viewList.value = []
            }

        });
        const newFileList = ref([])
        const viewList = ref([])
        const searchFile = async () => {
            for(var a = 0;a<props.fileList.length;a++){
                await goalManagementApi()
                        .searchFile(props.fileList[a].fileName)
                        .then((res) => {
                            props.fileList[a].url = res.data
                        })
            }
        };
        const uploadSectionFile = (param) => {
            let form = new FormData();
            form.append('file', param.file);
            //组装文件名（传入后缀名）
            var fileName1 = getFileName(param.file.type.split('/')[1], 1);
            var fileName2 = getFileName(param.file.type.split('/')[1], 2);
            goalManagementApi()
                .beforeUploadFile(fileName1, fileName2)
                .then((res) => {
                    // 转换形式
                    const reader = new FileReader();
                    reader.readAsArrayBuffer(param.file);
                    // 上传图片
                    reader.onload = () => { // 上传图片接口 url:上传图片地址 修改请求头
                        axios.put(res.data.uploadUrl, reader.result,
                            {
                                header:
                                    { "Content-Type": "multipart/form-data" }
                            }
                        )
                        .then(res1 =>
                        {
                            props.fileList[props.fileList.length-1].fileName=res.data.fileName
                            props.fileList[props.fileList.length-1].fileUrl=''
                            emit('successUploader',props.fileList);
                            ElMessage({
                                showClose: true,
                                message: '上传成功',
                                type: 'success',
                            });
                        })
                    };
                });
        };
        const getFileName = (suffix, type) => {
            var projectName = props.systemName;
            var date = getNowDate();
            var fileName1 = projectName + '/' + date + '_';
            var fileName2 = '.' + suffix;
            if (type == 1) {
                return fileName1;
            } else if (type == 2) {
                return fileName2;
            }
            return '';
        };

        //获取当前年月日
        const getNowDate = () => {
            var a = new Date().getTime(); //获取到当前时间戳
            var now = new Date(a); //创建一个指定的日期对象
            var year = now.getFullYear(); //年份
            var month = now.getMonth() + 1; //月份（0-11）
            var date = now.getDate(); //天数（1到31）
            return year + '-' + month + '-' + date;
        };

        return {
            dialogImageUrl,
            dialogVisible,
            handleRemove,
            handlePictureCardPreview,
            successFile,
            errorFile,
            uploadSectionFile,
            viewList
        };
    },
});
</script>

 src/views/accidentManagementSystem/accidentExpress/component/openAdd.vue

@@ -1,6 +1,7 @@
<template>
    <div class="system-edit-user-container">
        <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full" @close="closeDialog(ruleFormRef)">
        <el-dialog :title="titles" v-model="isShowDialog" width="50%" draggable :fullscreen="full"
                   destroy-on-close @close="closeDialog(ruleFormRef)">
            <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
            <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" size="default" label-width="140px">
                <el-row :gutter="35">
@@ -94,7 +95,8 @@
                        <el-form-item label="事故照片" prop="fileList">
                            <!--<el-input v-model="ruleForm.fileList" :disabled="disabled"-->
                            <!--type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input>-->
                            <uploaderImg :fileList="fileListDemo"></uploaderImg>
                            <uploaderImg :fileList="fileList" :disabled="disabled"
                                         :systemName="'INCIDENT_MANAGE'" @successUploader="successUploader"></uploaderImg>
                        </el-form-item>
                    </el-col>
                </el-row>
@@ -157,7 +159,7 @@
        const titles = ref();
        const disabled = ref();
        // 打开弹窗
        const openDialog = (title: string, id: number, type: boolean) => {
        const openDialog = async (title: string, id: number, type: boolean) => {
            isShowDialog.value = true;
            titles.value = title;
            disabled.value = type;
@@ -167,24 +169,39 @@
                    .then((res) => {
                        if (res.data.code == 200) {
                            ruleForm.value = res.data.data;
                            fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                            initFileListData()
                        }
                    });
            }
        };
        const initFileListData = async () => {
            for(var a = 0;a<fileList.value.length;a++){
                await goalManagementApi()
                        .searchFile(fileList.value[a].fileName)
                        .then((res) => {
                            fileList.value[a].url = res.data
                        })
            }
        }
        //日期选择器
        const value1 = ref('');
        // 上传附件
        const fileList = ref<UploadUserFile[]>([]);
        const fileListDemo = ref<UploadUserFile[]>([
            {
                name: 'food.jpeg',
                url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
            },
            {
                name: 'food.jpeg',
                url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
            },
        ]);
        const fileList = ref([]);
        // 上传成功组装数据
        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 treeSelect = ref();

@@ -292,6 +309,9 @@
        // const emit=defineEmits(['myAdd'])
        // 表单提交验证必填项
        const submitForm = async (title: string, formEl: FormInstance | undefined) => {
            if(!ruleForm.value.fileList){
                ruleForm.value.fileList = []
            }
            if (title == '新建事故快报') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
@@ -327,12 +347,6 @@
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        isShowDialog.value = false;
                        ruleForm.value.fileList = [
                            // {
                            //     fileUrl: 'url',
                            //     fileName: 'name',
                            // },
                        ];
                        accidentManagementSystemApi()
                            .accidentView(ruleForm.value)
                            .then((res) => {
@@ -380,6 +394,7 @@
        };
        const closeDialog = (formEl: FormInstance | undefined) => {
            formEl.resetFields();
            fileList.value = []
            console.log(ruleForm);
            isShowDialog.value = false;
        };
@@ -459,7 +474,7 @@
            getTreeList,
            newTreeList,
            closeDialog,
            fileListDemo,
            successUploader
        };
    },
});

 src/views/accidentManagementSystem/accidentExpress/index.vue

@@ -41,7 +41,8 @@
                <el-table-column align="center" prop="accidentName" label="事故名称" show-overflow-tooltip sortable></el-table-column>
                <el-table-column align="center" prop="deptName" label="事故部门" show-overflow-tooltip sortable></el-table-column>
                <el-table-column align="center" prop="occurrencePlace" label="发生地点" show-overflow-tooltip sortable></el-table-column>
                <el-table-column align="center" prop="occurrenceTime" label="发生时间" show-overflow-tooltip sortable></el-table-column>
                <el-table-column align="center" prop="occurrenceTime" label="发生时间" show-overflow-tooltip sortable
                                 :formatter="dateFormat"></el-table-column>
                <el-table-column align="center" prop="accidentCause" label="事故原因" show-overflow-tooltip sortable>
                    <template #default="scope">
                        <div v-if="scope.row.accidentCause=='1'">人的不安全行为</div>
@@ -49,7 +50,8 @@
                    </template>
                </el-table-column>
                <el-table-column align="center" prop="createName" label="创建人" show-overflow-tooltip sortable></el-table-column>
                <el-table-column align="center" prop="gmtModitify" label="更新时间" show-overflow-tooltip sortable></el-table-column>
                <el-table-column align="center" prop="gmtModitify" label="更新时间" show-overflow-tooltip sortable
                                 :formatter="dateFormat"></el-table-column>
                <el-table-column label="操作" width="260" align="center" fixed="right">
                    <template #default="scope">
                        <!-- <el-button size="small" text disabled>
@@ -268,7 +270,16 @@
                addRef.value.openDialog('修改事故快报',row,false);
            }
        };

//格式化表格时间
        const dateFormat = (row,column) => {
            // 获取单元格数据
            let data = row[column.property];
            if(data == null) {
                return null;
            }
            let dt = new Date(data)
            return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate() + ' ' + dt.getHours() + ':' + dt.getMinutes() + ':' + dt.getSeconds()
        };
        return {
            upButton,
            upShow,
@@ -291,6 +302,7 @@
            onDelete,
            deletAll,
            onDeleteAll,
            dateFormat
        };
    },
});

 src/views/accidentManagementSystem/accidentReport/component/openAdd.vue

@@ -166,11 +166,11 @@
                            />
                        </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="ruleForm.describe" type="textarea" placeholder="请填写应急防范措施" maxlength="150"></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="事故照片">
                            <uploaderImg :fileList="ruleForm.expressFileList" :disabled="true"></uploaderImg>
                        </el-form-item>
                      </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="相关人员笔录" prop="relevantPersonnelRecords">
                            <el-input v-model="ruleForm.relevantPersonnelRecords" :disabled="disabled"
@@ -186,8 +186,9 @@
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="事故分析会议纪要" prop="fileList">
                            <uploaderImg :fileList="fileList" :disabled="disabled"></uploaderImg>
                        <el-form-item label="事故分析会议纪要">
                            <uploaderFile :fileList="fileList" :systemName="'INCIDENT_MANAGE'" :disabled="disabled"
                                          @successUploader="successUploader"></uploaderFile>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
@@ -221,6 +222,7 @@
import AccidentName from '/@/views/accidentManagementSystem/workInjuryDeclaration/component/accidentName.vue';
import RegionsDialog from '/@/components/regionsDialog/index.vue';
import uploaderImg from '/@/components/uploaderImg/index.vue';
import uploaderFile from '/@/components/uploaderFile/index.vue';
import { emergencySuppliesApi } from '/@/api/contingencyManagement/emergencyResources';
import { accidentManagementSystemApi } from '/@/api/workInjuryDeclaration';
import { goalManagementApi } from '/@/api/goalManagement';
@@ -231,7 +233,8 @@
        AccidentName,
        DailogSearchUserManger,
        RegionsDialog,
        uploaderImg
        uploaderImg,
        uploaderFile
    },
    setup(props, { emit }) {
        const isShowDialog = ref(false);
@@ -266,6 +269,8 @@
        const titles = ref();
        const disabled = ref();
        const statusDisabled = ref(true)
        // 上传附件
        const fileList = ref([]);
        // 打开弹窗
        const openDialog = (title: string, id: number, type: boolean,statusDisabledFlag:string) => {
            isShowDialog.value = true;
@@ -291,18 +296,53 @@
                            accidentDepartmentId.value = res.data.data.accidentDepartmentId
                            occurrencePlace.value = res.data.data.occurrencePlace
                            occurrenceTime.value = res.data.data.occurrenceTime
                            fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                            initFileListData()
                        }
                    });
            }
        };
        const initFileListData = async () => {
            //事故照片
            if(ruleForm.value.expressFileList){
                for(var a = 0;a<ruleForm.value.expressFileList.length;a++){
                    await goalManagementApi()
                            .searchFile(ruleForm.value.expressFileList[a].fileName)
                            .then((res) => {
                                ruleForm.value.expressFileList[a].url = res.data
                                console.log('ruleForm',ruleForm)
                            })
                }
            }else {
                ruleForm.value.expressFileList = []
            }

            // 事故分析会议纪要
            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 onCancel = (formEl: FormInstance | undefined) => {
            resetForm(formEl);
        };
        //日期选择器
        const value1 = ref('');
        // 上传附件
        const fileList = ref<UploadUserFile[]>([]);

        // 可选择树
        const treeSelect = ref();
        //定义树形下拉框
@@ -423,7 +463,9 @@
            delete ruleForm.value.accidentDepartmentId
            delete ruleForm.value.occurrencePlace
            delete ruleForm.value.occurrenceTime

            if(!ruleForm.value.fileList){
                ruleForm.value.fileList = []
            }
            if (title == '新建事故报告') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
@@ -458,7 +500,6 @@
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        //TODO 上传组件待定
                        ruleForm.value.fileList = []
                        isShowDialog.value = false;
                        accidentManagementSystemApi()
                            .editAccidentReport(ruleForm.value)
@@ -512,12 +553,14 @@
                };
            }
        };

        const resetForm = (formEl: FormInstance | undefined) => {
            isShowDialog.value = false;
            if (!formEl) return;
            formEl.resetFields();
            // ruleForm.value.accidentExpressId = item[0].id
            ruleForm.value = {}
            fileList.value = []
            accidentName.value = ''
            accidentDepartmentId.value = ''
            occurrencePlace.value = ''
@@ -629,7 +672,9 @@
            accidentDepartmentId,
            occurrencePlace,
            occurrenceTime,
            accidentName
            accidentName,
            successUploader,
            initFileListData
        };
    },
});

 src/views/accidentManagementSystem/workInjuryDeclaration/component/openAdd.vue

@@ -81,7 +81,8 @@
                    </el-col>
                    <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                        <el-form-item label="相关附件">
                            <uploaderImg :fileList="fileList" :disabled="disabled"></uploaderImg>
                            <uploaderImg :fileList="fileList" :name="INCIDENT_MANAGE"
                                         @successUploader="successUploader" :disabled="disabled"></uploaderImg>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
@@ -184,10 +185,35 @@
                    .then((res) => {
                        if (res.data.code == 200) {
                            ruleForm.value = res.data.data;
                            fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                            initFileListData()
                        }
                    });
            }
        };
        const initFileListData = async () => {
            for(var a = 0;a<fileList.value.length;a++){
                await goalManagementApi()
                        .searchFile(fileList.value[a].fileName)
                        .then((res) => {
                            fileList.value[a].url = res.data
                        })
            }
        }
        // 上传成功组装数据
        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 value1 = ref('');
        // 上传附件
@@ -241,6 +267,7 @@
        // 关闭弹窗
        const closeDialog = (formEl: FormInstance | undefined) => {
            formEl.resetFields();
            fileList.value=[]
            isShowDialog.value = false;
        };
        // 必填项提示
@@ -346,12 +373,14 @@
        };
        // 表单提交验证必填项
        const submitForm = 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;
                        ruleForm.value.fileList=[]
                        delete ruleForm.value.accidentName
                        delete ruleForm.value.occurrenceTime
                        delete ruleForm.value.id
@@ -384,7 +413,6 @@
                await formEl.validate((valid, fields) => {
                    if (valid) {
                        isShowDialog.value = false;
                        ruleForm.value.fileList=[]
                        delete ruleForm.value.accidentName
                        delete ruleForm.value.occurrenceTime
                        accidentManagementSystemApi()
@@ -491,7 +519,9 @@
            newTreeList,
            propse,
            closeDialog,
            uploaderImg
            uploaderImg,
            successUploader,
            initFileListData
        };
    },
});

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

@@ -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>
@@ -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);
@@ -188,14 +181,34 @@
                        .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()
@@ -313,6 +326,9 @@
                }
            };
            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) => {
@@ -346,7 +362,6 @@
                    if (!formEl) return;
                    await formEl.validate((valid, fields) => {
                        if (valid) {
                          ruleForm.value.fileList=[]
                            isShowDialog.value = false;
                            contingencyApi()
                                .editEmergencyTeam(ruleForm.value)
@@ -390,6 +405,7 @@
                isShowDialog.value = false;
                if (!formEl) return;
                formEl.resetFields();
                fileList.value = []
                tableData.value=[]
                ruleForm.value = {}
            };
@@ -494,7 +510,9 @@
                department,
                peopleInsertBtn,
                teamId,
                newTreeList
                newTreeList,
                successUploader,
                initFileListData
            };
        },
    });

 src/views/contingencyManagement/contingency/index.vue

@@ -79,7 +79,9 @@
        </el-table-column>
        <el-table-column prop="teamDesc" label="队伍描述" show-overflow-tooltip sortable></el-table-column>
        <el-table-column prop="principalPhone" label="负责人手机" show-overflow-tooltip sortable></el-table-column>
        <el-table-column prop="attachments" label="相关附件" show-overflow-tooltip sortable></el-table-column>
        <el-table-column prop="fileList" label="相关附件" show-overflow-tooltip sortable>

        </el-table-column>
        <el-table-column label="操作" width="200" align="center" fixed="right">
          <template #default="scope">
            <el-button size="small" text type="primary" @click="onEdit('详情',scope.row.id)">
@@ -179,6 +181,11 @@
      let res = await contingencyApi().getTeamManagementList(listQuery)
      if(res.data.code === '200'){
        tableData.value = res.data.data;
        for(var a = 0;a<tableData.value.length;a++){
          if(tableData.value[a].fileList!=null&&tableData.value[a].fileList!=''&&tableData.value[a].fileList.length!=0){
            tableData.value[a].fileList = tableData.value[a].fileList[0].fileName
          }
        }
        pageIndex.value = res.data.pageIndex;
        pageSize.value = res.data.pageSize;
        total.value = res.data.total;

 src/views/contingencyManagement/emergencyDrill/drillImplementationEvaluation/component/approvalProgress.vue

@@ -167,20 +167,7 @@
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20" style="margin-bottom: 0!important;">
            <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>
              <uploaderFile :fileList="ruleForm.planFileList" :disabled="true"></uploaderFile>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
@@ -368,20 +355,8 @@
          </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="ruleForm.userList"
                  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>
@@ -421,12 +396,14 @@
import DailogSearchUser from "/@/components/DailogSearchUser/index.vue"
import {emergencyDrillEvaluationApi} from "/@/api/contingencyManagement/emergencyDrillEvaluation";
import {goalManagementApi} from "/@/api/goalManagement";
import uploaderFile from '/@/components/uploaderFile/index.vue';
export default defineComponent({
  name: 'approvalProgress',
  components: {
    UserSelections,
    RegionsDialog,
    DailogSearchUser
    DailogSearchUser,
    uploaderFile
  },
  setup(props, { emit }) {
    const isShowDialog = ref(false)
@@ -512,6 +489,8 @@
                  ruleForm.value.evaluationUserListString += res.data.data.evaluationUserList[a].userName+';'
                }
              }
              fileList.value = (res.data.data.evaluationFileList?res.data.data.evaluationFileList:[])
              initFileListData()
            });
      }
      if(title=='演练实施评价'){
@@ -548,6 +527,8 @@
                      }
                    }
                  }
                  fileList.value = (res.data.data.evaluationFileList?res.data.data.evaluationFileList:[])
                  initFileListData()
                });
      }
      if(title=='演练实施查看评价'){
@@ -584,15 +565,41 @@
                        ruleForm.value.evaluationUserListString += res.data.data.evaluationUserList[a].userName+';'
                      }
                    }

                    fileList.value = (res.data.data.evaluationFileList?res.data.data.evaluationFileList:[])
                    initFileListData()
                  }
                });
      }

    };
    const initFileListData = async () => {
      for(var a = 0;a<ruleForm.value.planFileList.length;a++){
        ruleForm.value.planFileList[a].name = ruleForm.value.planFileList[a].fileName
      }
      // 事故分析会议纪要
      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 resetForm = (formEl: FormInstance | undefined) => {
      isShowDialog.value = false;
      if (!formEl) return;
      formEl.resetFields();
      fileList.value = []
    };
    // 关闭弹窗
    const closeDialog = () => {
@@ -605,7 +612,7 @@
    //日期选择器
    const value1 = ref('')
    // 上传附件
    const fileList = ref<UploadUserFile[]>([])
    const fileList = ref([])
    // 可选择树
    const treeSelect = ref()
    const tree = [
@@ -663,6 +670,9 @@
    // })

    const submitForm = async (title: string, formEl: FormInstance | undefined) => {
      if(!ruleForm.value.fileList){
        ruleForm.value.fileList = []
      }
      //演练负责人(评价)
      ruleForm.value.userList = ruleForm.value.evaluationUserList

@@ -861,7 +871,9 @@
      newTreeList,
      selectUser,
      submitForm,
      realRuleForm
      realRuleForm,
      successUploader,
      initFileListData
    };
  },
});

 src/views/contingencyManagement/emergencyDrill/releaseOfDrillPlan/component/openAdd.vue

@@ -162,20 +162,8 @@
          </el-col>
          <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20" style="margin-bottom: 0!important;">
            <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"-->
              <!--&gt;-->
                <!--<el-button type="primary"-->
                <!--&gt;点击上传</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>
@@ -215,12 +203,13 @@
import {releaseDrillPlanApi} from "/@/api/contingencyManagement/emergencyDrillPlan";
import {goalManagementApi} from "/@/api/goalManagement";
import { Session } from '/@/utils/storage';

import uploaderFile from '/@/components/uploaderFile/index.vue';
export default defineComponent({
  name: 'openAdd',
  components: {
    RegionsDialog,
    DailogSearchUser
    DailogSearchUser,
    uploaderFile
  },
  setup(props, { emit }) {
    const isShowDialog = ref(false)
@@ -281,14 +270,35 @@
                for(var a = 0;a<res.data.data.chargeUserList.length;a++){
                  ruleForm.value.chargeUserListString += res.data.data.chargeUserList[a].userName+';'
                }
                fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                initFileListData()
              }
            });
      }
    };
    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 value1 = ref('')
    // 上传附件
    const fileList = ref<UploadUserFile[]>([])
    const fileList = ref([])
    // 可选择树
    const treeSelect = ref()
    const tree = [
@@ -318,6 +328,9 @@
    });
    // 表单提交验证必填项
    const submitForm = async (title: string, formEl: FormInstance | undefined) => {
      if(!ruleForm.value.fileList){
        ruleForm.value.fileList = []
      }
      ruleForm.value.userList = ruleForm.value.userList.concat(ruleForm.value.chargeUserList)
      delete ruleForm.value.planName
      delete ruleForm.value.chargeUserListString
@@ -412,6 +425,7 @@
    }
    const resetForm = (formEl: FormInstance | undefined) => {
      isShowDialog.value = false;
      fileList.value=[]
      if (!formEl) return;
      ruleForm.value = {
        makingPlanDate: '', // 计划制定日期
@@ -473,7 +487,6 @@
        )
        ruleForm.value.userListString+=e[a].realName+';'
      }

    };
    const SearchFZUser = (e:any) => {
      console.log('演练负责人员',e[0].userName)
@@ -532,7 +545,9 @@
      onUser,
      userFZRef,
      SearchUser,
      SearchFZUser
      SearchFZUser,
      successUploader,
      initFileListData
    };
  },
});

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

@@ -106,17 +106,8 @@
                    </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>
                            <uploaderFile :fileList="fileList" :systemName="'EMERGENCY'" :disabled="disabled"
                                          @successUploader="successUploader"></uploaderFile>
                        </el-form-item>
                    </el-col>
                    <!--          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">-->
@@ -158,13 +149,14 @@
import RegionsDialog from '/@/components/regionsDialog/index.vue';
import { emergencyPlanApi } from '/@/api/contingencyManagement/emergencyPlan';
import { goalManagementApi } from '/@/api/goalManagement';

import uploaderFile from '/@/components/uploaderFile/index.vue';
export default defineComponent({
    name: 'openAdd',
    components: {
        CheckTemplate,
        DailogSearchUserManger,
        RegionsDialog,
        uploaderFile
    },
    setup(prop, { emit }) {
        const isShowDialog = ref(false);
@@ -211,15 +203,35 @@
                                    responsibleDepartment.value.push(res.data.data.deptList[a].departmentId)
                                }
                            }

                            fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                            initFileListData()
                        }
                    });
            }
        };
        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 releaseDate = ref('');
        // 上传附件
        const fileList = ref<UploadUserFile[]>([]);
        const fileList = ref([]);
        //el-tree-select回显
        const propse = {
            label: 'depName',
@@ -272,6 +284,9 @@
        const data = ref();

        const submitForm = async (title: string, formEl: FormInstance | undefined) => {
            if(!ruleForm.value.fileList){
                ruleForm.value.fileList = []
            }
            if (title == '新建应急预案管理') {
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
@@ -306,10 +321,9 @@
                if (!formEl) return;
                await formEl.validate((valid, fields) => {
                    if (valid) {
            ruleForm.value.fileList=[]
            isShowDialog.value = false;
            delete ruleForm.value.teamName
            emergencyPlanApi()
                        isShowDialog.value = false;
                        delete ruleForm.value.teamName
                        emergencyPlanApi()
                            .editEmergencyTeam(ruleForm.value)
                            .then((res) => {
                                if (res.data.code == 200) {
@@ -356,6 +370,7 @@
            if (!formEl) return;
            formEl.resetFields();
            ruleForm.value = {};
            fileList.value = []
        };
        // 应急队伍弹窗
        const Shows = ref();
@@ -429,6 +444,8 @@
            onUser,
            newTreeList,
            changeDepartment,
            successUploader,
            initFileListData
        };
    },
});

 src/views/goalManagement/TargetBook/component/DailogAdd.vue

@@ -1,5 +1,5 @@
<template>
    <el-dialog v-model="dialogVisible" :before-close="resetForm" :fullscreen="full" :title="titles" width="50%" draggable>
    <el-dialog v-model="dialogVisible" :before-close="resetForm" :fullscreen="full" :title="titles" width="50%" draggable @close="resetForm">
        <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button>
        <el-form :model="form" :disabled="disabled" label-width="120px">
            <el-row>
@@ -28,22 +28,8 @@
            <el-row>
                <el-col :span="24">
                    <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"
                            multiple
                            :on-preview="handlePreview"
                            :on-remove="handleRemove"
                            :before-remove="beforeRemove"
                            :limit="3"
                            :on-exceed="handleExceed"
                        >
                            <el-button type="primary">点击上传</el-button>
                            <template #tip>
                                <div class="el-upload__tip">添加相关附件</div>
                            </template>
                        </el-upload>
                        <uploaderFile :fileList="fileList" :systemName="'GOAL_MANAGE'" :disabled="disabled"
                                      @successUploader="successUploader" @deleteFile="deleteFile"></uploaderFile>
                    </el-form-item>
                </el-col>
            </el-row>
@@ -64,8 +50,9 @@
import { ElMessage, ElMessageBox } from 'element-plus';
import type { UploadProps, UploadUserFile } from 'element-plus';
import { goalManagementApi } from '/@/api/goalManagement';
import uploaderFile from '/@/components/uploaderFile/index.vue';
export default defineComponent({
    components: { DailogSearch },
    components: { DailogSearch,uploaderFile },
    setup(props, { emit }) {
        const dialogVisible = ref<boolean>(false);
        const form = ref({
@@ -89,12 +76,53 @@
                        if (res.data.code == 200) {
                            form.value = res.data.data;
                            form.value.signDate=timeC(form.value.signDate)


                            if(res.data.data.extraFile!=null&&res.data.data.extraFile!=''){
                                var extraFileList = res.data.data.extraFile.split(',')
                                for(var a = 0;a<extraFileList.length;a++){
                                    fileList.value.push(
                                            {
                                                name:extraFileList[a]
                                            }
                                    )
                                }
                            }else {
                                fileList.value = []
                            }
                        } else {
                            ElMessage.error(res.data.msg);
                        }
                    });
        };
            const timeC = (timestamp: any) => {
        // 上传成功组装数据
        const successUploader = (list) =>{
            console.log('successUploader',list)
            fileList.value = list
            var formFileList = ''
            for(var a = 0;a<fileList.value.length;a++){
                if(a==fileList.value.length-1){
                    formFileList+=fileList.value[a].name
                }else {
                    formFileList+=fileList.value[a].name+','
                }
            }
            form.value.extraFile = formFileList
        }
        const deleteFile = (list) =>{
            console.log('deleteFile',list)
            fileList.value = list
            const formFileList = ''
            for(var a = 0;a<fileList.value.length;a++){
                if(a==fileList.value.length-1){
                    formFileList.value+=fileList.value[a].name
                }else {
                    formFileList.value+=fileList.value[a].name+','
                }
            }
            form.value.extraFile = formFileList
        }
        const timeC = (timestamp: any) => {
            let a = new Date(timestamp).getTime();
            const date = new Date(a);
            const Y = date.getFullYear() + '-';
@@ -142,6 +170,7 @@
                extraFile: '666', //责任书附件
                jobId: '', //岗位
            };
            fileList.value = []
        };
        // 安全目标指标弹窗
        const Shows = ref();
@@ -153,7 +182,7 @@
         form.value.jobName=val.date
        }
        // 点击上传
        const fileList = ref<UploadUserFile[]>([
        const fileList = ref([
        ]);

        const handleRemove: UploadProps['onRemove'] = (file, uploadFiles) => {
@@ -204,6 +233,8 @@
            full,
            toggleFullscreen,
            FullScreen,
            successUploader,
            deleteFile
        };
    },
});

 src/views/goalManagement/performanceAppraisal/component/DailogAq.vue

@@ -79,23 +79,9 @@
            </el-row>
            <el-row>
                <el-col :span="24">
                    <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"
                            multiple
                            :on-preview="handlePreview"
                            :on-remove="handleRemove"
                            :before-remove="beforeRemove"
                            :limit="3"
                            :on-exceed="handleExceed"
                        >
                            <el-button type="primary">点击上传</el-button>
                            <template #tip>
                                <div class="el-upload__tip">添加相关附件</div>
                            </template>
                        </el-upload>
                    <el-form-item label="附件">
                        <uploaderFile :fileList="fileList" :systemName="'GOAL_MANAGE'" :disabled="disabled"
                                      @successUploader="successUploader" @deleteFile="deleteFile"></uploaderFile>
                    </el-form-item>
                </el-col>
            </el-row>
@@ -154,8 +140,9 @@
import { goalManagementApi } from '/@/api/goalManagement';
import type { UploadProps, UploadUserFile } from 'element-plus';
import type { FormInstance, FormRules } from 'element-plus';
import uploaderFile from '/@/components/uploaderFile/index.vue';
export default defineComponent({
    components: { DailogSearchUser, DailogSearch },
    components: { DailogSearchUser, DailogSearch,uploaderFile },
    setup(props, { emit }) {
        const dialogVisible = ref<boolean>(false);
        const ruleFormRef = ref<FormInstance>();
@@ -173,7 +160,7 @@
            examineTemplateName: '',
            examineTotalNumber: '', ////总分
            acceptanceNumber: '', ///合格分数
            extraFile: '9', //责任书附件
            extraFile: '', //责任书附件
            itemDetail: '', ////考核项目
            memo: '', ////备注信息
            numberDetailJson: [], ////各个考核项目的具体得分，json格式。形式为：[{“id”:"123","number":"123"}]
@@ -195,11 +182,55 @@
                            form.value = res.data.data;
                            form.value.examineDate = timeC(form.value.examineDate);
                            form.value.numberDetailJson = form.value.currentExamineDtoList;


                            if(res.data.data.extraFile!=null&&res.data.data.extraFile!=''){
                                var extraFileList = res.data.data.extraFile.split(',')
                                for(var a = 0;a<extraFileList.length;a++){
                                    fileList.value.push(
                                            {
                                                name:extraFileList[a]
                                            }
                                    )
                                }
                            }else {
                                fileList.value = []
                            }

                            // fileList.value = (res.data.data.fileList?res.data.data.fileList:[])
                        } else {
                            ElMessage.error(res.data.msg);
                        }
                    });
        };
        // 上传成功组装数据
        const successUploader = (list) =>{
            console.log('successUploader',list)
            fileList.value = list
            var formFileList = ''
            for(var a = 0;a<fileList.value.length;a++){
                if(a==fileList.value.length-1){
                    formFileList+=fileList.value[a].name
                }else {
                    formFileList+=fileList.value[a].name+','
                }
            }
            form.value.extraFile = formFileList
        }
        const deleteFile = (list) =>{
            console.log('deleteFile',list)
            fileList.value = list
            const formFileList = ''
            for(var a = 0;a<fileList.value.length;a++){
                if(a==fileList.value.length-1){
                    formFileList.value+=fileList.value[a].name
                }else {
                    formFileList.value+=fileList.value[a].name+','
                }
            }
            form.value.extraFile = formFileList
        }

        const timeC = (timestamp: any) => {
            let a = new Date(timestamp).getTime();
            const date = new Date(a);
@@ -287,6 +318,7 @@
        const handleClose = (formEl: FormInstance | undefined) => {
            if (!formEl) return;
            formEl.resetFields();
            fileList.value=[]
        };
        const activeName = ref('1');
        // 新增弹窗
@@ -404,6 +436,8 @@
            full,
            toggleFullscreen,
            FullScreen,
            successUploader,
            deleteFile
        };
    },
});