<template>
|
<div>
|
<el-dialog title="上传"
|
v-model="dialogVisitable" width="400px" @close="cancel">
|
<el-form :model="form" ref="formRef" label-width="120px">
|
<el-form-item label="生产前" prop="fileList0">
|
<el-upload
|
v-model:file-list="fileList0"
|
ref="fileUpload0"
|
:action="uploadFileUrl"
|
multiple
|
name="files"
|
:data="{type: 0}"
|
style="width: 100%"
|
:headers="headers"
|
:before-upload="handleBeforeUpload"
|
:on-success="handleUploadSuccess"
|
>
|
<el-button type="primary">上传</el-button>
|
</el-upload>
|
</el-form-item>
|
<el-form-item label="生产后" prop="fileList1">
|
<el-upload
|
v-model:file-list="fileList1"
|
ref="fileUpload1"
|
:action="uploadFileUrl"
|
multiple
|
name="files"
|
:data="{type: 1}"
|
style="width: 100%"
|
:headers="headers"
|
:before-upload="handleBeforeUpload"
|
:on-success="handleUploadSuccess1"
|
>
|
<el-button type="primary">上传</el-button>
|
</el-upload>
|
</el-form-item>
|
<el-form-item label="生产问题" prop="fileList2">
|
<el-upload
|
v-model:file-list="fileList2"
|
ref="fileUpload2"
|
:action="uploadFileUrl"
|
multiple
|
name="files"
|
:data="{type: 2}"
|
style="width: 100%"
|
:headers="headers"
|
:before-upload="handleBeforeUpload"
|
:on-success="handleUploadSuccess2"
|
>
|
<el-button type="primary">上传</el-button>
|
</el-upload>
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="cancel">取消</el-button>
|
<el-button type="primary" @click="submitForm">保存</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup>
|
import {reactive, ref} from "vue";
|
import {addOrEditInspectionTask} from "@/api/inspectionManagement/index.js";
|
import {getToken} from "@/utils/auth.js";
|
|
const { proxy } = getCurrentInstance()
|
const emit = defineEmits()
|
const dialogVisitable = ref(false);
|
const data = reactive({
|
form: {
|
id: '',
|
storageBlobDTO: {}
|
},
|
})
|
|
const { form } = toRefs(data)
|
const fileList0 = ref([])
|
const fileList1 = ref([])
|
const fileList2 = ref([])
|
const uploadFileUrl = ref(import.meta.env.VITE_APP_BASE_API + '/common/minioUploads'); // 上传文件服务器地址
|
const headers = ref({ Authorization: "Bearer " + getToken() });
|
|
// 打开弹框
|
const openDialog = async (row) => {
|
dialogVisitable.value = true
|
form.value.id = row.id
|
}
|
// 上传前校检格式和大小
|
function handleBeforeUpload(file) {
|
|
return true
|
}
|
// 上传成功回调
|
function handleUploadSuccess(res, file) {
|
if (res.code === 200) {
|
console.log("上传成功", res);
|
proxy.$modal.msgSuccess("文件上传成功");
|
console.log('fileList0---', fileList0)
|
} else {
|
proxy.$modal.msgError(res.msg)
|
proxy.$refs.fileUpload0.handleRemove(file)
|
}
|
}
|
function handleUploadSuccess1(res, file) {
|
if (res.code === 200) {
|
proxy.$modal.msgSuccess("文件上传成功");
|
} else {
|
proxy.$modal.msgError(res.msg)
|
proxy.$refs.fileUpload1.handleRemove(file)
|
}
|
}
|
function handleUploadSuccess2(res, file) {
|
if (res.code === 200) {
|
proxy.$modal.msgSuccess("文件上传成功");
|
} else {
|
proxy.$modal.msgError(res.msg)
|
proxy.$refs.fileUpload2.handleRemove(file)
|
}
|
}
|
|
// 提交合并表单
|
const submitForm = () => {
|
proxy.$refs["formRef"].validate(valid => {
|
if (valid) {
|
// 初始化 storageBlobDTO 为一个空数组
|
form.value.storageBlobDTO = []
|
// 合并所有 fileList 到 storageBlobDTO
|
const allFiles = [
|
...fileList0.value,
|
...fileList1.value,
|
...fileList2.value
|
]
|
// 将文件列表赋值给 form
|
form.value.storageBlobDTO = allFiles
|
// 提交数据
|
addOrEditInspectionTask(form.value).then(() => {
|
cancel()
|
proxy.$modal.msgSuccess('提交成功')
|
})
|
}
|
})
|
}
|
// 关闭合并表单
|
const cancel = () => {
|
proxy.resetForm("formRef")
|
dialogVisitable.value = false
|
emit('closeDia')
|
}
|
defineExpose({ openDialog })
|
</script>
|
|
<style scoped>
|
|
</style>
|
