|
|
@ -3,18 +3,23 @@ |
|
|
|
<div class="EventDetail"> |
|
|
|
<BlackBar class="left"> |
|
|
|
<!-- <img src="./images/test.png" style="width: 100%;" /> --> |
|
|
|
<div class="example"> |
|
|
|
<div class="example" > |
|
|
|
<div class="title"> |
|
|
|
<h3>调度记录</h3> |
|
|
|
<span> {{ startTime }} 至 {{ endTime }} </span> |
|
|
|
</div> |
|
|
|
<div class="body"> |
|
|
|
<div class="body" id="printbody"> |
|
|
|
<div v-for="(item, index) in data" :key="index" style="display: flex;gap:10px"> |
|
|
|
<div style="width:130px">{{ beautifyOperationTime(item.operationTime) }}</div> |
|
|
|
<div style="width:50px">{{ item.operatorName }}</div> |
|
|
|
|
|
|
|
<div style="width: 80px" v-if="item.processName && item.type !== 'text'">【{{ item.processName }}】</div> |
|
|
|
<el-image v-if="['bmp','jpg','jpeg','png'].indexOf(item.type)!==-1" :preview-src-list="[uploadUrl +item.context]" :src="uploadUrl +item.context" style="width: 200px;height: auto"></el-image> |
|
|
|
<video v-else-if="['mp4','avi','xmvb'].indexOf(item.type)!==-1" :src="uploadUrl +item.context" style="width: 200px;height: 160px" muted controls ></video> |
|
|
|
<div v-else-if="['mp4','avi','xmvb'].indexOf(item.type)!==-1" style="flex:1;display: flex;flex-direction: column;" > |
|
|
|
<div >{{ item.remark }}</div> |
|
|
|
<video :src="uploadUrl +item.context" style="width: 200px;height: 160px" muted controls ></video> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div style="flex:1" v-else> |
|
|
|
<span style="width: 80px" v-if="item.processName">【{{ item.processName }}】</span> |
|
|
|
{{ item.context }}</div> |
|
|
@ -73,7 +78,35 @@ export default { |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
print(){ |
|
|
|
window.print(); |
|
|
|
var printContent = document.getElementById('printbody').innerHTML; |
|
|
|
var l=(screen.availWidth-1080)/2; |
|
|
|
var t=(screen.availHeight-400)/2; |
|
|
|
|
|
|
|
var printWindow = window.open('', '_blank', 'height=400,width=1080,top='+t+',left='+l+',toolbar=no,menubar=no,location=no,status=yes'); |
|
|
|
|
|
|
|
|
|
|
|
printWindow.document.write('<html><head><title>打印区域</title>'); |
|
|
|
|
|
|
|
|
|
|
|
printWindow.document.write('</head><body onBlur="window.focus();">'); |
|
|
|
|
|
|
|
printWindow.document.write(`<div style="width:800px;text-align:center"><h3>调度记录</h3><h4> ${ this.startTime } 至 ${ this.endTime } </h4></div>`); |
|
|
|
printWindow.document.write(``); |
|
|
|
printContent = printContent.replace(/width: 130px;/g,'width: 170px;') |
|
|
|
printContent = printContent.replace(/class="el-image__inner el-image__preview"/g,'style="width:400px;height:auto"') |
|
|
|
printContent = printContent.replace(/display: flex; gap: 10px;/g,'display: flex; gap: 10px;margin-bottom:10px') |
|
|
|
printContent = printContent.replace(/width: 200px; height: 160px;/g,'display: none; width: 200px; height: 160px;') |
|
|
|
|
|
|
|
console.log(printContent) |
|
|
|
printWindow.document.write(printContent); |
|
|
|
|
|
|
|
|
|
|
|
printWindow.document.write('</body></html>'); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
printWindow.print(); |
|
|
|
}, |
|
|
|
initData() { |
|
|
|
request({ |
|
|
|