<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=0.5">
<title>云看板</title>
<link href="/lib/bootstrap/bootstrap.min.css" rel="stylesheet" />
<link href="/css/dashboard.css" rel="stylesheet" />
<script type="text/javascript" src="/js/service.js"></script>
<script type="text/javascript" src="/js/session.js"></script>
<script type="text/javascript" src="/js/getService.js"></script>
<script type="text/javascript" src="/lib/jquery-3.4.1.js"></script>
<script type="text/javascript" src="/lib/jquery-3.4.1.min.js"></script>
</head>
<body id="container" class="container-fluid">
<style>
body{
overflow-y: hidden;
overflow-x: hidden;
}
</style>
<!-- <div class="row no-padding head-bar" style="height:81px"> -->
<!-- <div class="col-lg-1 col-md-1">
</div>
<div class="col-lg-4 col-md-4 page-title">
云看板
</div> -->
<!-- <div class="col-lg-3 col-md-3 block-padding">
<button type="button" class="btn btn-warning"
onclick="window.location.replace('/pages/dashboard/warehouse.html');">仓库看板</button>
<button type="button" class="btn btn-warning"
onclick="window.location.replace('/pages/dashboard/produce.html');">制造看板</button>
<button type="button" class="btn btn-warning"
onclick="window.location.replace('/pages/dashboard/line.html');">产线看板</button>
<button type="button" class="btn btn-warning"
onclick="window.location.replace('/pages/dashboard/quality.html');">品质看板</button>
</div> -->
<!-- <div class="col-lg-4 col-md-4">
</div>-->
<!-- </div> -->
<div class="my-container" id="div-main">
<div id="two">
<div style="width: 50%;height: 100%;float:left;margin-left: -25px;margin-right: 5px;" v-for="task in taskList">
<video autoplay="true" loop="true" muted="muted" id="twoVideo2" v-if="task.isVideo" class="videoType" :src="'/upVedio/ABB/'+task.fileName" controls width="100%" height="100%" > </video>
<img v-if="task.isImg" class="imgType" :src="'/upVedio/ABB/'+task.fileName" width="100%" />
<iframe v-if="task.isPdf" class="pdfType" width="100%" border="0" frameborder="0" v-bind:src="'/lib/pdfjs/web/viewer.html?file=/upVedio/ABB/'+task.fileName" style="background-color:#ffffff"></iframe>
</div>
<div style="width: 49%;height: 100%;float:left;">
<video autoplay="true" loop="true" muted="muted" id="twoVideo" class="videoType" :src="'/upVedio/ABB/'+firstFile" controls width="106%" height="100%" > </video>
<img id="twoImg" class="imgType" :src="'/upVedio/ABB/'+firstFile" width="100%" />
<iframe class="pdfType" id="twoPdf" width="100%" border="0" frameborder="0" v-bind:src="'/lib/pdfjs/web/viewer.html?file=/upVedio/ABB/'+firstFile" style="background-color:#ffffff"></iframe>
</div>
</div>
<div class="row" v-for="task in taskList" id="one" style="margin-left: -25px">
<video v-if="task.isVideo" autoplay="true" loop="true" muted="muted" id="oneVideo" class="videoType" :src="'/upVedio/AAA/'+task.fileName" controls width="100%" height="100%" > </video>
<img v-if="task.isImg" class="imgType" :src="'/upVedio/AAA/'+task.fileName" width="101%" />
<iframe v-if="task.isPdf" class="pdfType" width="100%" border="0" frameborder="0" v-bind:src="'/lib/pdfjs/web/viewer.html?file=/upVedio/AAA/'+task.fileName" style="background-color:#ffffff"></iframe>
</div>
</div>
<!-- jQuery -->
<script src="/lib/jquery.min.js"></script>
<script src="/lib/vue.min.js"></script>
<script src="/lib/echarts/echarts.min.js"></script>
<script src="/lib/echarts/theme/macarons.js"></script>
<script src="/js/service/produce-task.js"></script>
<script type="text/javascript">
// setTimeout(ServiceProduceTask.getVedioFileList(),500)
// $(".videoType").height($(window).height()-85);
// $(".imgType").height($(window).height()-85);
$(".videoType").height($(window).height());
$(".imgType").height($(window).height());
$(".pdfType").height($(window).height());
var vm = new Vue({
el: '#div-main',
data: {
listInit: ServiceProduceTask.getVedioFileList(),
taskList: [],
timer: '',
pageSize: 1,
pageIndex: 0,
timer: '',
upVideo:'',
firstFile:''
},
methods: {
get() {
this.upVideo = this.listInit[0].upVideo;
this.firstFile = this.listInit[0].fileName;
if(this.listInit[0].isImg){
$("#twoVideo").hide();
$("#twoPdf").hide();
}else if(this.listInit[0].isVideo){
$("#twoImg").hide();
$("#twoPdf").hide();
}else{
$("#twoVideo").hide();
$("#twoImg").hide();
}
if(this.upVideo == 'AAA'){
$("#two").hide();
}else{
$("#one").hide();
// this.listInit.splice(0, 1);
}
},
get2(){
this.listInit=ServiceProduceTask.getVedioFileList();
if(this.upVideo != 'AAA'){
this.listInit.splice(0, 1);
}
this.taskList = this.listInit.slice(this.pageIndex,this.pageSize);
if(this.pageSize >= this.listInit.length){
this.pageIndex = 0;
this.pageSize = 1;
}else{
this.pageIndex = this.pageIndex + 1;
this.pageSize = this.pageSize + 1;
}
// this.getVideo();
},
getVideo(){
var _video1 = $('#twoVideo')[0];
var _video2 = $('#twoVideo2')[0];
var _video3 = $('#oneVideo')[0];
if($('#twoVideo').is(':hidden') && _video1.paused){
}else{
_video1.play();
}
if($('#twoVideo2').is(':hidden') && _video2.paused){
}else{
_video1.play();
}
if($('#oneVideo').is(':hidden') && _video3.paused){
}else{
_video1.play();
}
}
},
mounted() {
this.get();
this.get2();
this.timer = setInterval(this.get2, 10000);
},
beforeDestroy() {
clearInterval(this.timer);
}
})
// function getVideo(){
// var _video1 = $('#twoVideo')[0];
// var _video2 = $('#twoVideo2')[0];
// var _video3 = $('#oneVideo')[0];
// if($('#twoVideo').is(':hidden') && _video1.paused){
// }else{
// _video1.play();
// }
// if($('#twoVideo2').is(':hidden') && _video2.paused){
// }else{
// _video1.play();
// }
// if($('#oneVideo').is(':hidden') && _video3.paused){
// }else{
// _video1.play();
// }
// if(_video3.paused){
// _video3.play();
// //_video.pause();//暂停
// }
// }
</script>
</body>
</html>