46 lines
		
	
	
		
			1.2 KiB
		
	
	
	
		
			Vue
		
	
	
		
		
			
		
	
	
			46 lines
		
	
	
		
			1.2 KiB
		
	
	
	
		
			Vue
		
	
	
|  | <template> | ||
|  |   <div v-if="file.length === 0 && name && url"> | ||
|  |     {{ name }} | ||
|  |     <el-button type="primary" size="small" class="ml-5" @click="fnPreviewPdf(url)"> | ||
|  |       预览 | ||
|  |     </el-button> | ||
|  |   </div> | ||
|  |   <template v-if="file.length > 0 && !name && !url"> | ||
|  |     <div v-for="(item, index) in file" :key="index" class="mt-5"> | ||
|  |       {{ item.name || item.fileName || item[nameKey] }} | ||
|  |       <el-button type="primary" size="small" class="ml-10" @click="fnPreviewPdf(item.filePath || item[urlKey])"> | ||
|  |         预览 | ||
|  |       </el-button> | ||
|  |     </div> | ||
|  |   </template> | ||
|  |   <app-pdf v-model:visible="pdfDialog.visible" :src="pdfDialog.src" /> | ||
|  | </template> | ||
|  | 
 | ||
|  | <script setup> | ||
|  | import { ref } from "vue"; | ||
|  | import { ElButton } from "element-plus"; | ||
|  | import "element-plus/es/components/button/style/css"; | ||
|  | import AppPdf from "../pdf/index.vue"; | ||
|  | 
 | ||
|  | defineOptions({ | ||
|  |   name: "AppPreviewPdf", | ||
|  | }); | ||
|  | defineProps({ | ||
|  |   file: { type: Array, default: () => [] }, | ||
|  |   nameKey: { type: String, default: "" }, | ||
|  |   urlKey: { type: String, default: "" }, | ||
|  |   name: { type: String, default: "" }, | ||
|  |   url: { type: String, default: "" }, | ||
|  | }); | ||
|  | const pdfDialog = ref({ | ||
|  |   visible: false, | ||
|  |   src: "", | ||
|  | }); | ||
|  | const fnPreviewPdf = (src) => { | ||
|  |   pdfDialog.value.visible = true; | ||
|  |   pdfDialog.value.src = src; | ||
|  | }; | ||
|  | </script> | ||
|  | 
 | ||
|  | <style scoped lang="scss"></style> |