|
@@ -0,0 +1,139 @@
|
|
|
+<template>
|
|
|
+ <div style="margin-top: 10px; height: 400px">
|
|
|
+ <div style="margin-top: 10px">
|
|
|
+ <el-upload
|
|
|
+ class="upload-demo"
|
|
|
+ ref="upload"
|
|
|
+ accept=".xlsx,.xls,.png,.jpg,.jpeg,.text"
|
|
|
+ :action="apiUrl + '/targetManagement/uploadTargetFile'"
|
|
|
+ :headers="header"
|
|
|
+ :file-list="fileList"
|
|
|
+ :limit="1"
|
|
|
+ :data="targetFileData"
|
|
|
+ :on-success="uploadSuccess"
|
|
|
+ :on-error="uploadError"
|
|
|
+ :on-exceed="handleExceed"
|
|
|
+ :before-upload="beforeUpload"
|
|
|
+ :auto-upload="false"
|
|
|
+ >
|
|
|
+ <template #trigger>
|
|
|
+ <el-button type="primary" icon="Picture">选取文件</el-button>
|
|
|
+ </template>
|
|
|
+ <el-button
|
|
|
+ style="margin-left: 10px"
|
|
|
+ type="success"
|
|
|
+ icon="Upload"
|
|
|
+ @click="submitUpload"
|
|
|
+ >上传</el-button>
|
|
|
+ <template #tip>
|
|
|
+ <div class="el-upload__tip">
|
|
|
+ 只能上传 xls/xlsx/png/jpg/jpeg/text 类型文件,且一次只能传一个文件
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-upload>
|
|
|
+ </div>
|
|
|
+ <div id="ss" style="padding-top: 30px">
|
|
|
+ <el-table :data="QtResultData" stripe border highlight-current-row row-key="childKey" height="240" style="width: 100%">
|
|
|
+ <el-table-column prop="id" label="文件id" header-align="center" v-if="false"/>
|
|
|
+ <el-table-column prop="name" label="文件名称" header-align="center"/>
|
|
|
+ <el-table-column prop="path" label="操作" header-align="center" align="center" width="300">
|
|
|
+ <template v-slot="scope">
|
|
|
+<!-- <el-button type="primary" @click="seeFile(scope.row)">预览文件</el-button>-->
|
|
|
+ <el-button type="primary" v-if="scope.row.name.endsWith('.xls') || scope.row.name.endsWith('.xlsx') || scope.row.name.endsWith('.text')" @click="downloadFile(scope.row)">下载文件</el-button>
|
|
|
+ <el-image v-else :src="'http://webhis.thyy.cn:8080' + scope.row.path" :preview-src-list="['http://webhis.thyy.cn:8080' + scope.row.path]" fit="cover"
|
|
|
+ style="width: 80px; height: 20px; cursor: pointer; padding-right: 8px; padding-top: 6px"></el-image>
|
|
|
+ <el-button type="primary" @click="deleteFile(scope.row)" :loading="downloading">{{ downloading ? '删除中...' : '删除文件' }}</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+import {nextTick, onMounted, ref, watch} from "vue";
|
|
|
+import {ElMessage, UploadFile, UploadFiles} from "element-plus";
|
|
|
+import env from "@/utils/setting";
|
|
|
+import {deleteTargetFileByFileId, selectTargetFileById} from '@/api/target-management/target-dict'
|
|
|
+import {useUserStore} from "@/pinia/user-store";
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ targetFileInfo: {
|
|
|
+ type: Object,
|
|
|
+ default: {}
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const targetFileData = ref({})
|
|
|
+const downloading = ref(false)
|
|
|
+const downloadingD = ref(false)
|
|
|
+const QtResultData = ref([])
|
|
|
+
|
|
|
+watch(() => props.targetFileInfo, () => {
|
|
|
+ targetFileData.value = props.targetFileInfo
|
|
|
+ queryTargetFileById(props.targetFileInfo.fileId)
|
|
|
+})
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ nextTick(() => {
|
|
|
+ targetFileData.value = props.targetFileInfo
|
|
|
+ queryTargetFileById(props.targetFileInfo.fileId)
|
|
|
+ })
|
|
|
+})
|
|
|
+
|
|
|
+// ------------------ 上传 ---------------------
|
|
|
+const fileList = ref([]);
|
|
|
+const apiUrl = env.VITE_BASE_URL;
|
|
|
+
|
|
|
+const upload = ref(null);
|
|
|
+const header = {
|
|
|
+ token: useUserStore().getToken,
|
|
|
+};
|
|
|
+const submitUpload = () => {
|
|
|
+ nextTick(() => {
|
|
|
+ upload.value.submit();
|
|
|
+ });
|
|
|
+};
|
|
|
+const uploadSuccess = (response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) => {
|
|
|
+ console.log(response, uploadFile, uploadFiles);
|
|
|
+ ElMessage.success("上传成功!");
|
|
|
+};
|
|
|
+const uploadError = () => {
|
|
|
+ ElMessage.error("上传失败!");
|
|
|
+};
|
|
|
+const handleExceed: UploadProps['onExceed'] = (files) => {
|
|
|
+ upload.value!.clearFiles()
|
|
|
+ const file = files[0] as UploadRawFile
|
|
|
+ file.uid = genFileId()
|
|
|
+ upload.value!.handleStart(file)
|
|
|
+}
|
|
|
+const beforeUpload = (file: File, row) => {
|
|
|
+ if (file.size / 1024 / 1024 > 2) {
|
|
|
+ ElMessage.error('上传图片大小不能超过 2MB!')
|
|
|
+ row.isOversize = true
|
|
|
+ }
|
|
|
+}
|
|
|
+const queryTargetFileById = (fileId: String)=> {
|
|
|
+ selectTargetFileById({fileId: fileId})
|
|
|
+ .then((res: any) => {
|
|
|
+ QtResultData.value = res.fileList
|
|
|
+ });
|
|
|
+}
|
|
|
+// 下载文件
|
|
|
+const downloadFile = (row) => {
|
|
|
+ if(row.name.endsWith(".xls") || row.name.endsWith(".xlsx") || row.name.endsWith(".text")){
|
|
|
+ window.location.href = 'http://webhis.thyy.cn:8080' + row.path
|
|
|
+ } else {
|
|
|
+ // downloadImageNew('http://webhis.thyy.cn:8080' + row.path, row.name);
|
|
|
+ }
|
|
|
+}
|
|
|
+//删除文件
|
|
|
+const deleteFile = (row) => {
|
|
|
+ downloadingD.value = true
|
|
|
+ deleteTargetFileByFileId(row.id, props.targetFileInfo.id, props.targetFileInfo.pid, props.targetFileInfo.year).then((res: any) => {
|
|
|
+ ElMessage.success("删除指标文件成功!");
|
|
|
+ queryTargetFileById(props.targetFileInfo.fileId)
|
|
|
+ downloadingD.value = false
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|