Files
income_payments_enterprise_…/src/views/standardsAssociation/memberInfo/modules/PreViewImgModal.vue
T

69 lines
1.4 KiB
Vue

<template>
<j-modal
title="预览"
width="800px"
:visible="previewVisible"
:maskClosable="false"
:footer="null"
@cancel="handleCancel()"
cancelText="关闭">
<!-- <img src="../../../../assets/images/wmi.png">-->
<img :src="imgSrc" class="img" v-if="imgSrc" />
<img :src="getImgView()" class="img" v-else/>
</j-modal>
</template>
<script>
import { getFileAccessHttpUrl } from '@/api/memberManage'
export default {
name: 'PreViewImgModal',
data() {
return {
previewVisible: false,
imgId: '',
imgSrc: ''
}
},
methods: {
open(val) {
this.previewVisible = true
this.imgId = val
},
openPre(val) {
// this.$nextTick(() => {
// if (val === 1) {
// this.imgSrc = require('../../../../assets/images/wmi.png')
// } else if (val === 2) {
// this.imgSrc = require('../../../../assets/images/cam.png')
// }
// })
// this.previewVisible = true
},
handleCancel() {
this.$nextTick(() => {
this.imgId = ''
this.previewVisible = false
})
},
/* 图片预览 */
getImgView() {
let text = this.imgId
if (text && text.indexOf(',') > 0) {
text = text.substring(0, text.indexOf(','))
}
return getFileAccessHttpUrl(text)
}
}
}
</script>
<style scoped lang="less">
.img {
max-width: 100%;
max-height: 100%;
display: block;
margin: auto;
}
</style>