<html
>
<head
></head
>
<body
>
##
A4纸宽度
180mm
<div style
="width:180mm">
<table border
="1" cellspacing
="0" cellpadding
="15" style
="width:100%">
<caption
>
<div style
="font-size:20px;color:#333333;font-weight: bold;padding-top:10px">演播室预约申请表
</div
>
<div
style
="font-size:14px;color:#828282;padding:15px;text-align:right"
>申请时间：
2020-07-27 11：
22</div
>
</caption
>
<tr style
="text-align:center;height:40px">
<td style
="width:140px;font-weight:bold;">申请部门
</td
>
<td colspan
="3">信息网络中心
</td
>
</tr
>
<tr style
="text-align:center">
<td style
="width:140px;font-weight:bold;">申请人
</td
>
<td
>陈婉
</td
>
<td style
="width:140px;font-weight:bold;">联系电话
</td
>
<td
>18203753395</td
>
</tr
>
<tr style
="text-align:center;">
<td style
="width:140px;font-weight:bold;">活动名称及内容
</td
>
<td colspan
="3" style
="text-align:left">
<div style
="line-height:20px">
因为场地及设备需要准备时间，申请需至少提前
1 天流转到管理员处，否则不予受理。
演播厅内只可开展教学有关及学生素质教育活动
</div
>
</td
>
</tr
>
<tr style
="text-align:center">
<td style
="width:140px;font-weight:bold;">使用时间
</td
>
<td colspan
="3" style
="text-align:left">
<span
>2019-05-27 14:20</span
>
</td
>
</tr
>
<tr style
="text-align:center">
<td rowspan
="3" style
="width:140px;font-weight:bold;">使用场地及设置情况
</td
>
<td colspan
="3" style
="text-align:left">
<div style
="line-height:20px">
因为场地及设备需要准备时间，申请需至少提前
1 天流转到管理员处，否则不予受理。
演播厅内只可开展教学有关及学生素质教育活动，严禁进行非法活动及任何盈利性的活动。 凡讲
</div
>
</td
>
</tr
>
<tr style
="text-align:center">
<td style
="text-align:left">
<span
>请选择使用场地
</span
>
</td
>
<td colspan
="3">
<span
>综合演播室
</span
>
</td
>
</tr
>
<tr style
="text-align:center">
<td style
="text-align:left">
<span
>是否使用多媒体设备
</span
>
</td
>
<td colspan
="3">
<span
>是
</span
>
</td
>
</tr
>
<tr style
="text-align:center;">
<td style
="width:140px;font-weight:bold;">申请部门审批意见
</td
>
<td colspan
="3">
<div style
="text-align:left;padding-bottom:10px">请信息中心配合谢谢
</div
>
<div style
="width:130px;text-align:center;float:right">
<img src
="@/assets/img/user.png" alt
>
<div style
="height:100%">2019-05-23 09:53</div
>
</div
>
</td
>
</tr
>
<tr style
="text-align:center">
<td style
="width:140px;font-weight:bold;">信息网络中心审批意见
</td
>
<td colspan
="3">
<div style
="text-align:left;padding-bottom:10px">请信息中心配合谢谢
</div
>
<div style
="width:230px;float:right">
<img style
="width:180px;height:61px" src
="1.jpg" alt
>
<div style
="height:100%">2019-05-23 09:53</div
>
</div
>
</td
>
</tr
>
</table
>
<div
style
="text-align:left;color: #4F4F4F;margin-top:15px;font-size:14px;padding-left:25px"
>【注意事项】
</div
>
<ul style
="text-align:left;color: #828282; font-size:14px;line-height: 28px;margin-top:0px;">
<li
>因为场地及设备需要准备时间，申请需至少提前
1 天流转到管理员处
</li
>
<li
>因为场地及设备需要准备时间，申请需至少提前
1 天流转到管理员处
</li
>
<li
>因为场地及设备需要准备时间，申请需至少提前
1 天流转到管理员处
</li
>
<li
>因为场地及设备需要准备时间，申请需至少提前
1 天流转到管理员处
</li
>
</ul
>
</div
>
</body
>
</html
>
然后再git上下载pdf.js 把文件放在pubilc/static下面 http://mozilla.github.io/pdf.js/ https://github.com/goSunadeod/vue-pdf.js-demo 点击某条数据的时候触发事件 把id传过去
getApplyData(val
) {
const h
= this.$createElement
this.$msgbox({
title
: '提示',
message
: h('p', null, [
h('span', null, '此操作将预览当前报表单，是否继续?')
]),
showCancelButton
: true,
confirmButtonText
: '确定',
cancelButtonText
: '取消',
type
: 'warning',
beforeClose
: (action
, instance
, done
) => {
if (action
=== 'confirm') {
console
.log(val
.id
)
instance
.confirmButtonLoading
= true
instance
.confirmButtonText
= '加载中...'
this.id
= val
.id
const hostUrl
= 'http://*******'
const pdfurl
=
`http://192.168.31.35:9528/static/pdf/web/viewer.html?file=${encodeURIComponent(
`${hostUrl}/***/**/print/${val.id}`
)}`
instance
.confirmButtonLoading
= false
done()
window
.open(pdfurl
)
} else {
instance
.confirmButtonLoading
= false
done()
}
}
})
},
百度云：https://pan.baidu.com/s/1bHgkX0vLbA9rdvOh5YX_LQ 提取码：hu8r
