Commit c4e4024f authored by 王晓倩's avatar 王晓倩

视频可视化

parent d1172cb1
This diff is collapsed.
......@@ -12,6 +12,7 @@
<link rel="stylesheet" href="https://js.arcgis.com/3.33/dijit/themes/nihilo/nihilo.css">
<title>危化品企业监管平台</title>
<script src="./EasyWasmPlayer.js"></script>
</head>
<body>
<noscript>
......
......@@ -2,6 +2,7 @@
<div class="pomentWrap">
<el-row :gutter="5" type="flex" justify="space-around">
<el-col :xs="12" :sm="12" :md="6" :lg="4" :xl="4">
<!-- <el-aside>-->
<div class="topBar">
<el-tree
:data="treeData"
......@@ -15,30 +16,75 @@
>
</el-tree>
</div>
<!-- </el-aside>-->
</el-col>
<el-col :xs="12" :sm="12" :md="18" :lg="20" :xl="20">
<el-table :data="tableData.pageData" border style="width:100%;" v-loading="loading">
<el-table-column prop="deviceName" label></el-table-column>
</el-table>
<!-- <el-main>-->
<div>
<el-row>
<div class="box" :class="[flag == 'newplay1' ? 'boxred' : 'boxblack']">
<div id="newplay1" style="width:100%; height:100%;" @click="chooseWindow('newplay1')">
<span class="novideo">无信号</span>
</div>
</div>
<div class="box" :class="[flag == 'newplay2' ? 'boxred' : 'boxblack']">
<div id="newplay2" style="width:100%; height:100%;" @click="chooseWindow('newplay2')">
<span class="novideo">无信号</span>
</div>
</div>
</el-row>
<el-row>
<div class="box" :class="[flag == 'newplay3' ? 'boxred' : 'boxblack']">
<div id="newplay3" style="width:100%; height:100%;" @click="chooseWindow('newplay3')">
<span class="novideo">无信号</span>
</div>
</div>
<div class="box" :class="[flag == 'newplay4' ? 'boxred' : 'boxblack']">
<div id="newplay4" style="width:100%; height:100%;" @click="chooseWindow('newplay4')">
<span class="novideo">无信号</span>
</div>
</div>
</el-row>
</div>
<!-- </el-main>-->
</el-col>
</el-row>
</div>
</template>
<style lang="scss" scped>
@import '@/utils/public.scss';
.box{
float:left;
width:550px;
height:300px;
background-color: #edf1f6;
text-align: center;
position:relative;
right:0px;
}
.boxred{
border: 1px solid red;
}
.boxblack{
border: 1px solid black;
}
.novideo{
/*padding: 147px 0px 147px 0px;*/
/*display: block;*/
line-height: 300px;
}
</style>
<script lang="ts">
import { Component, Vue, Provide, Watch } from "vue-property-decorator";
import METHOD from "@/utils/methods"
@Component({
components: { }
})
export default class VideoList extends Vue {
@Provide() tableData: Object = { pageData: [], total: 0 };
@Provide() PAGE: any = { page: 1, size: 100000 };
@Provide() searchData: any = { account: "", userName: "" };
@Provide() loading: Boolean = false;
@Provide() playerWindow: String = "newplay1";
@Provide() flag:String = "";
@Provide() treeData: any = [
{
enterpriseId: 0,
......@@ -66,7 +112,18 @@
nodeClick(data: any, node: any, target: any) {
let that = this;
that.treecheckedObj = node.data;
if(node.level == "3"){
var player = new WasmPlayer(null, that.playerWindow, null, {Height: true});
console.log(that.playerWindow, node.data.deviceNumber)
player.play('http://27.128.189.137:10001/flv/hls/' + that.treecheckedObj.deviceNumber + '.flv', 1);
}
}
chooseWindow(data: any){
this.playerWindow = data;
this.flag = data;
}
created() {
let that = this;
that.getTreeData();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment