|
@@ -13,7 +13,7 @@
|
|
:disabled="!!file"
|
|
:disabled="!!file"
|
|
:before-upload="upload"
|
|
:before-upload="upload"
|
|
:file-list="fileList"
|
|
:file-list="fileList"
|
|
- :http-request="() => {}"
|
|
|
|
|
|
+ :http-request="httpsApi"
|
|
:on-preview="previewFile"
|
|
:on-preview="previewFile"
|
|
:accept="accept"
|
|
:accept="accept"
|
|
:before-remove="removeFile"
|
|
:before-remove="removeFile"
|
|
@@ -24,7 +24,7 @@
|
|
<template v-slot:tip>
|
|
<template v-slot:tip>
|
|
<div class="el-upload__tip">注:可上传{{ size }}以内的{{ formatDesc }}</div>
|
|
<div class="el-upload__tip">注:可上传{{ size }}以内的{{ formatDesc }}</div>
|
|
</template>
|
|
</template>
|
|
- <template v-slot:file="{ file }: { file: UploadFile }">
|
|
|
|
|
|
+ <template v-slot:file="{ file }">
|
|
<div class="file" @click.stop="previewFile()">
|
|
<div class="file" @click.stop="previewFile()">
|
|
<div>
|
|
<div>
|
|
<el-icon><Document /></el-icon>
|
|
<el-icon><Document /></el-icon>
|
|
@@ -37,7 +37,7 @@
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<el-form-item label="附件标题:" class="mandatory">
|
|
<el-form-item label="附件标题:" class="mandatory">
|
|
<el-input
|
|
<el-input
|
|
- v-model="caseFile.filesTitle"
|
|
|
|
|
|
+ v-model="caseFile.imgInfo"
|
|
placeholder="请输入最多不能超过50字"
|
|
placeholder="请输入最多不能超过50字"
|
|
maxlength="50"
|
|
maxlength="50"
|
|
show-word-limit
|
|
show-word-limit
|
|
@@ -54,50 +54,65 @@ import {
|
|
OtherFormatDesc,
|
|
OtherFormatDesc,
|
|
OtherFormats,
|
|
OtherFormats,
|
|
} from "@/constant/caseFile";
|
|
} from "@/constant/caseFile";
|
|
|
|
+import { uploadFile } from "@/store/system";
|
|
import { maxFileSize } from "@/constant/caseFile";
|
|
import { maxFileSize } from "@/constant/caseFile";
|
|
import { useUpload } from "@/hook/upload";
|
|
import { useUpload } from "@/hook/upload";
|
|
-import { CaseFile, addCaseFile } from "@/store/caseFile";
|
|
|
|
-import { ElMessage, UploadFile } from "element-plus";
|
|
|
|
|
|
+import { saveOrUpdate, CaseImg } from "@/store/case";
|
|
|
|
+import { ElMessage } from "element-plus";
|
|
import { computed, ref, watchEffect } from "vue";
|
|
import { computed, ref, watchEffect } from "vue";
|
|
import { QuiskExpose } from "@/helper/mount";
|
|
import { QuiskExpose } from "@/helper/mount";
|
|
|
|
|
|
const props = defineProps<{
|
|
const props = defineProps<{
|
|
caseId: number;
|
|
caseId: number;
|
|
- fileType: number;
|
|
|
|
|
|
+ data: CaseImg;
|
|
}>();
|
|
}>();
|
|
|
|
|
|
-const caseFile = ref<CaseFile>({
|
|
|
|
|
|
+const caseFile = ref<CaseImg>({
|
|
caseId: props.caseId,
|
|
caseId: props.caseId,
|
|
- filesTypeId: props.fileType,
|
|
|
|
- filesTitle: "",
|
|
|
|
|
|
+ id: props.data?.id,
|
|
|
|
+ imgUrl: props.data.imgUrl,
|
|
|
|
+ imgInfo: props.data.imgInfo,
|
|
|
|
+ sort: props.data?.sort || '',
|
|
} as any);
|
|
} as any);
|
|
|
|
|
|
const { size, fileList, upload, removeFile, previewFile, file, accept } = useUpload({
|
|
const { size, fileList, upload, removeFile, previewFile, file, accept } = useUpload({
|
|
maxSize: maxFileSize,
|
|
maxSize: maxFileSize,
|
|
- formats: props.fileType === FileDrawType ? DrawFormats : OtherFormats,
|
|
|
|
|
|
+ formats: DrawFormats,
|
|
});
|
|
});
|
|
|
|
|
|
const formatDesc = computed(() =>
|
|
const formatDesc = computed(() =>
|
|
- props.fileType === FileDrawType ? DrawFormatDesc : OtherFormatDesc
|
|
|
|
|
|
+DrawFormatDesc
|
|
);
|
|
);
|
|
|
|
|
|
watchEffect(() => {
|
|
watchEffect(() => {
|
|
if (file.value?.name) {
|
|
if (file.value?.name) {
|
|
- caseFile.value.filesTitle = file.value?.name.substring(0, 50);
|
|
|
|
|
|
+ caseFile.value.imgUrl = file.value && file.value[0]?.url;
|
|
|
|
+ caseFile.value.imgInfo = file.value?.name.substring(0, 50);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
|
|
|
|
+const httpsApi = async ({file})=> {
|
|
|
|
+ console.log('httpsApi', file)
|
|
|
|
+ let fileUrl = await uploadFile(file);
|
|
|
|
+
|
|
|
|
+ file.value = [{
|
|
|
|
+ name: file.name,
|
|
|
|
+ url: fileUrl,
|
|
|
|
+ }]
|
|
|
|
+ console.log('httpsApi', file, fileUrl)
|
|
|
|
+}
|
|
|
|
+
|
|
defineExpose<QuiskExpose>({
|
|
defineExpose<QuiskExpose>({
|
|
async submit() {
|
|
async submit() {
|
|
if (!file.value) {
|
|
if (!file.value) {
|
|
ElMessage.error("请上传附件");
|
|
ElMessage.error("请上传附件");
|
|
throw "请上传附件";
|
|
throw "请上传附件";
|
|
- } else if (!caseFile.value.filesTitle.trim()) {
|
|
|
|
|
|
+ } else if (!caseFile.value.imgInfo.trim()) {
|
|
ElMessage.error("附件标题不能为空!");
|
|
ElMessage.error("附件标题不能为空!");
|
|
throw "附件标题不能为空!";
|
|
throw "附件标题不能为空!";
|
|
}
|
|
}
|
|
-
|
|
|
|
- await addCaseFile({ ...caseFile.value, file: file.value });
|
|
|
|
|
|
+ console.log('defineExpose', caseFile.value, file.value.value[0]?.url)
|
|
|
|
+ await saveOrUpdate({ ...caseFile.value, imgUrl: file.value && file.value.value && file.value.value[0]?.url });
|
|
return caseFile.value;
|
|
return caseFile.value;
|
|
},
|
|
},
|
|
});
|
|
});
|