文件预览组件
This commit is contained in:
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<!-- 父组件的文件id如果是异步获取的 需要加上v-if判断-->
|
||||
<div style="display: inline-block"> <span @click="handlePreview(item)" class="color-blue" v-for="(item) of fileList" :key="item.id">{{ item.name +' ' }}</span></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import {ACCESS_TOKEN} from '@/store/mutation-types'
|
||||
import {getFileInfo} from '@/api/api'
|
||||
// eslint-disable-next-line
|
||||
const Base64 = require('js-base64').Base64
|
||||
|
||||
|
||||
export default {
|
||||
name: 'PreviewFile',
|
||||
props: {
|
||||
/*
|
||||
* 文件id
|
||||
* */
|
||||
fileId: {
|
||||
type: String,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
fileInfo: {},
|
||||
fileList: [],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getFileInfo(this.fileId)
|
||||
},
|
||||
watch: {
|
||||
fileId: {
|
||||
immediate: true,
|
||||
handler(val) {
|
||||
this.initFileList(val)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/*
|
||||
* 通过文件id获取文件的相关信息
|
||||
* */
|
||||
getFileInfo(id) {
|
||||
return new Promise(resolve => {
|
||||
let result = {}
|
||||
getFileInfo({id: id}).then(res => {
|
||||
if (res.success) {
|
||||
result = res.result
|
||||
}
|
||||
}).finally(() => {
|
||||
resolve(result)
|
||||
})
|
||||
})
|
||||
},
|
||||
/*
|
||||
* 获取文件信息
|
||||
* */
|
||||
async initFileList(fileIds) {
|
||||
const fileList = []
|
||||
let arr = fileIds.split(',')
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
let fileObj = {}
|
||||
fileObj = await this.getFileInfo(arr[i])
|
||||
fileList.push({id: fileObj.id, name: fileObj.fileName})
|
||||
}
|
||||
this.fileList = [...fileList]
|
||||
},
|
||||
handlePreview(file) {
|
||||
if (file && file.id) {
|
||||
const fileFullUrl = `${window._CONFIG['domianWebSocketURL']}/sys/common/download/${file.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
|
||||
let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
|
||||
// let url = `${window._CONFIG['onlinePreviewDomainURL']}?url=${encodeURIComponent(fileFullUrl)}`
|
||||
window.open(url)
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.color-blue {
|
||||
color: #069f99 !important;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@@ -7,90 +7,90 @@
|
||||
</div>
|
||||
<a-row>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label class="label">会议名称:</label><span> {{ currentMeetingInfo.meetingName }}</span>
|
||||
<label class="label">会议名称:</label><span>{{ currentMeetingInfo.meetingName }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>会议类型:</label><span> {{ meetingType }}</span>
|
||||
<label>会议类型:</label><span>{{ meetingType }}</span>
|
||||
</a-col>
|
||||
<!--标协会议类型-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType === '2' ">
|
||||
<label>标协会议类型:</label><span> {{ tbMeetingType }}</span>
|
||||
<label>标协会议类型:</label><span>{{ tbMeetingType }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>负责人:</label><span> {{ currentMeetingInfo.directorName }}</span>
|
||||
<label>负责人:</label><span>{{ currentMeetingInfo.directorName }}</span>
|
||||
</a-col>
|
||||
<!--工作组会议-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType === '1' ">
|
||||
<label>工作组:</label><span> {{ currentMeetingInfo.workingGroupName }}</span>
|
||||
<label>工作组:</label><span>{{ currentMeetingInfo.workingGroupName }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>手机号:</label><span> {{ currentMeetingInfo.directorPhone }}</span>
|
||||
<label>手机号:</label><span>{{ currentMeetingInfo.directorPhone }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>召开时间:</label><span> {{ currentMeetingInfo.startTime + '~' + currentMeetingInfo.endTime }}</span>
|
||||
<label>召开时间:</label><span>{{ currentMeetingInfo.startTime + '~' + currentMeetingInfo.endTime }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>年份:</label><span> {{ currentMeetingInfo.particularYear }}</span>
|
||||
<label>年份:</label><span>{{ currentMeetingInfo.particularYear }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>报名截止时间:</label><span> {{ currentMeetingInfo.registerDeadline }}</span>
|
||||
<label>报名截止时间:</label><span>{{ currentMeetingInfo.registerDeadline }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>召开地点:</label><span> {{ currentMeetingInfo.venue + '/' + currentMeetingInfo.address }}</span>
|
||||
<label>召开地点:</label><span>{{ currentMeetingInfo.venue + '/' + currentMeetingInfo.address }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>会议费用:</label><span> {{ currentMeetingInfo.meetingCosts }} 元/人</span>
|
||||
<label>会议费用:</label><span>{{ currentMeetingInfo.meetingCosts }} 元/人</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType === '2' ">
|
||||
<label>会议费用(标协会员):</label><span> {{ currentMeetingInfo.meetingCostsVip }} 元/人</span>
|
||||
<label>会议费用(标协会员):</label><span>{{ currentMeetingInfo.meetingCostsVip }} 元/人</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>预计参加人数:</label><span> {{ currentMeetingInfo.estimatedNumber }}</span>
|
||||
<label>预计参加人数:</label><span>{{ currentMeetingInfo.estimatedNumber }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType === '2' ">
|
||||
<label>酒店名称:</label><span> {{ currentMeetingInfo.hotelName }}</span>
|
||||
<label>酒店名称:</label><span>{{ currentMeetingInfo.hotelName }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType === '2' ">
|
||||
<label>酒店地址:</label><span> {{ currentMeetingInfo.hotelAddress }}</span>
|
||||
<label>酒店地址:</label><span>{{ currentMeetingInfo.hotelAddress }}</span>
|
||||
</a-col>
|
||||
<!-- 国际研讨会的邀请码-->
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType ==='3' ">
|
||||
<label>VIP邀请码:</label><span> {{ currentMeetingInfo.vipInvitationCode }}</span>
|
||||
<label>VIP邀请码:</label><span>{{ currentMeetingInfo.vipInvitationCode }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType ==='3' ">
|
||||
<label>演讲嘉宾邀请码:</label><span> {{ currentMeetingInfo.speakerInvitationCode }}</span>
|
||||
<label>演讲嘉宾邀请码:</label><span>{{ currentMeetingInfo.speakerInvitationCode }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType ==='3' ">
|
||||
<label>特邀嘉宾邀请码:</label><span> {{ currentMeetingInfo.guestInvitationCode }}</span>
|
||||
<label>特邀嘉宾邀请码:</label><span>{{ currentMeetingInfo.guestInvitationCode }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24" v-show="currentMeetingInfo.meetingType ==='3' ">
|
||||
<label>合作伙伴邀请码:</label><span> {{ currentMeetingInfo.cooperativeInvitationCode }}</span>
|
||||
<label>合作伙伴邀请码:</label><span>{{ currentMeetingInfo.cooperativeInvitationCode }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>会议通知:</label><span></span>
|
||||
<label>会议通知:</label><span v-if="currentMeetingInfo.meetingFiles"><preview-file :file-id="currentMeetingInfo.meetingFiles"></preview-file></span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>报名链接:</label><span></span>
|
||||
<label>报名链接:</label><span></span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>报名二维码:</label><img alt="报名二维码"/>
|
||||
<label>报名二维码:</label><img alt="报名二维码"/>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>签到二维码:</label><img alt="签到二维码"/>
|
||||
<label>签到二维码:</label><img alt="签到二维码"/>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row v-show="currentMeetingInfo.meetingType === '2' ">
|
||||
<label class="label">酒店联系人及手机号: </label><span class="content"
|
||||
v-for="(item,index) of currentMeetingInfo.hotelContactsList"
|
||||
:key="index">{{
|
||||
<label class="label">酒店联系人及手机号:</label><span class="content"
|
||||
v-for="(item,index) of currentMeetingInfo.hotelContactsList"
|
||||
:key="index">{{
|
||||
item.hotelContacts + ':' + item.hotelContactsPhone + ' '
|
||||
}}</span>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<label class="label">会议内容: </label><span class="content"> {{ currentMeetingInfo.meetingContent }}</span>
|
||||
<label class="label">会议内容:</label><span class="content">{{ currentMeetingInfo.meetingContent }}</span>
|
||||
</a-row>
|
||||
<a-row>
|
||||
<label class="label">备注: </label><span class="content"> {{ currentMeetingInfo.remark }}</span>
|
||||
<label class="label">备注:</label><span class="content">{{ currentMeetingInfo.remark }}</span>
|
||||
</a-row>
|
||||
<div class="part-title">
|
||||
<div class="part-title-text">参会人员信息</div>
|
||||
@@ -231,6 +231,7 @@ import ProjectDetailModal from '@comp/ProjectDetailModal'
|
||||
import AuditModal from '@views/incomePayments/meetManage/modules/AuditModal'
|
||||
import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
|
||||
import StatusSlot from '@comp/tools/StatusSlot'
|
||||
import PreviewFile from '@comp/jero/PreviewFile'
|
||||
|
||||
|
||||
export default {
|
||||
@@ -245,7 +246,8 @@ export default {
|
||||
ProjectDetailModal,
|
||||
AuditModal,
|
||||
PageHeaderTitle,
|
||||
StatusSlot
|
||||
StatusSlot,
|
||||
PreviewFile
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@@ -341,12 +343,12 @@ export default {
|
||||
{
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
fixed:'right',
|
||||
fixed: 'right',
|
||||
width: 160,
|
||||
scopedSlots: {customRender: 'action'}
|
||||
},
|
||||
],
|
||||
disableMixinCreated:true,
|
||||
disableMixinCreated: true,
|
||||
url: {
|
||||
list: '/meeting/payMeetingSituation/page',
|
||||
delete: '/meeting/payMeetingSituation/delete',
|
||||
@@ -417,11 +419,11 @@ export default {
|
||||
/*
|
||||
* 编辑参会人
|
||||
* */
|
||||
handleEdit(record){
|
||||
handleEdit(record) {
|
||||
this.$router.push({
|
||||
path: '/incomePayments/meetManage/SignUpInfoEdit',
|
||||
query: {
|
||||
id:record.id,
|
||||
id: record.id,
|
||||
meetingId: this.$route.query.id,
|
||||
meetingType: this.currentMeetingInfo.meetingType,
|
||||
}
|
||||
@@ -469,7 +471,7 @@ export default {
|
||||
// let flag = this.selectionRows.some(item => {
|
||||
// return item.meetingType !== 3
|
||||
// })
|
||||
let flag = this.currentMeetingInfo.meetingType !== '3'
|
||||
let flag = this.currentMeetingInfo.meetingType !== '3'
|
||||
if (flag) {
|
||||
this.$message.warn('只有研讨会议才可设置对接人')
|
||||
return
|
||||
|
||||
@@ -22,7 +22,7 @@
|
||||
<label>收费通知号:</label><span>{{ currentInfo.chargeNoticeNo }}</span>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>收费通知:</label><span class="primary-color">{{ currentInfo.fileName }}</span>
|
||||
<label>收费通知:</label><preview-file :file-id="currentInfo.chargeNoticeFileId"></preview-file>
|
||||
</a-col>
|
||||
<a-col :xxl="8" :xl="12" :sm="24">
|
||||
<label>备注:</label><span>{{ currentInfo.remark }}</span>
|
||||
@@ -125,6 +125,7 @@ import SafeguardMemberModal from '@views/incomePayments/memberManage/modules/Saf
|
||||
import ProjectDetailModal from '@comp/ProjectDetailModal'
|
||||
import StatusSlot from '@comp/tools/StatusSlot'
|
||||
import PageHeaderTitle from '@comp/layouts/PageHeaderTitle'
|
||||
import PreviewFile from '@comp/jero/PreviewFile'
|
||||
|
||||
|
||||
import {getAction} from '@api/manage'
|
||||
@@ -138,7 +139,8 @@ export default {
|
||||
SafeguardMemberModal,
|
||||
ProjectDetailModal,
|
||||
StatusSlot,
|
||||
PageHeaderTitle
|
||||
PageHeaderTitle,
|
||||
PreviewFile
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
Reference in New Issue
Block a user