| commit | author | age | ||
| 9bcb19 | 1 | <template> |
| I | 2 | <a-modal |
| 3 | title="预览图片" | |
| 4 | :footer="null" | |
| 5 | :width="900" | |
| 6 | :visible="visible" | |
| 7 | @cancel="handleCancel" | |
| 8 | > | |
| 9 | <a-spin :spinning="divLoading"> | |
| 10 | <div style="text-align: center"> | |
| 11 | <img :src="src" style="max-width: 99%"> | |
| 12 | </div> | |
| 13 | </a-spin> | |
| 14 | </a-modal> | |
| 15 | </template> | |
| 16 | <script> | |
| 17 | import { sysFileInfoPreview } from '@/api/modular/system/fileManage' | |
| 18 | export default { | |
| 19 | data () { | |
| 20 | return { | |
| 21 | visible: false, | |
| 22 | src: '', | |
| 23 | divLoading: false | |
| 24 | } | |
| 25 | }, | |
| 26 | methods: { | |
| 27 | /** | |
| 28 | * 初始化 | |
| 29 | */ | |
| 30 | preview (record) { | |
| 31 | this.visible = true | |
| 32 | this.divLoading = true | |
| 33 | this.sysFileInfoPreview(record) | |
| 34 | }, | |
| 35 | /** | |
| 36 | * 获取图片并转为链接 | |
| 37 | */ | |
| 38 | sysFileInfoPreview (record) { | |
| 39 | sysFileInfoPreview({ id: record.id }).then((res) => { | |
| 40 | this.divLoading = false | |
| 41 | this.downloadfile(res) | |
| 42 | }).catch((err) => { | |
| 43 | this.divLoading = false | |
| 44 | this.$message.error('预览错误：' + err.message) | |
| 45 | }) | |
| 46 | }, | |
| 47 | /** | |
| 48 | * 转图片类型 | |
| 49 | */ | |
| 50 | downloadfile (res) { | |
| 51 | const blob = new Blob([res]) | |
| 52 | this.src = window.URL.createObjectURL(blob) | |
| 53 | }, | |
| 54 | handleCancel () { | |
| 55 | this.src = '' | |
| 56 | this.visible = false | |
| 57 | } | |
| 58 | } | |
| 59 | } | |
| 60 | </script> | |
