修改选择问题

bozhou-古井贡酒
LAPTOP-S9HJSOEB\昊天 10 months ago
parent f6c06f393b
commit d1e2cae606

@ -32,8 +32,7 @@
<a-select showSearch <a-select showSearch
ref="select" ref="select"
style="width: 100%" style="width: 100%"
:placeholder="checkObj.category" :value="checkObj.category"
:defaultValue="checkObj.category"
@change="change" @change="change"
> >

@ -1,48 +1,23 @@
<template> <template>
<div id="videos"> <div id="videos">
<a-button type="primary" @click="full" v-if="!isFullscreen">
全屏<a-icon type="right" />
</a-button>
<a-button type="primary" @click="full" v-if="isFullscreen"
><a-icon type="left" /> 退出全屏
</a-button>
<a-button <a-button type="primary" @click="countVideo(2)"> <a-icon type="appstore"/></a-button>
type="primary" <a-button type="primary" @click="countVideo(3)"> <a-icon type="number"/></a-button>
@click="full"
v-if="!isFullscreen"
> 全屏<a-icon type="right" /> </a-button>
<a-button
type="primary"
@click="full"
v-if="isFullscreen"
><a-icon type="left" /> 退出全屏 </a-button>
<a-button <a-tabs :activeKey="activeKey" default-active-key="1" @edit="onEdit" @change="onTabClick">
type="primary" <a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title"> </a-tab-pane>
@click="countVideo(2)"
> <a-icon type="appstore" /></a-button>
<a-button
type="primary"
@click="countVideo(3)"
> <a-icon type="number" /></a-button>
<a-tabs
:activeKey="activeKey"
default-active-key="1"
@edit="onEdit"
@change="onTabClick"
>
<a-tab-pane
v-for="pane in panes"
:key="pane.key"
:tab="pane.title"
>
</a-tab-pane>
</a-tabs> </a-tabs>
<a-row <a-row v-for="rowIndex in row" :key="rowIndex">
v-for='rowIndex in row'
:key='rowIndex'
>
<a-col <a-col
v-for='colIndex in column' v-for="colIndex in column"
:key='colIndex' :key="colIndex"
:span="24 / column" :span="24 / column"
:style="{ height: videoHeight }" :style="{ height: videoHeight }"
> >
@ -51,7 +26,7 @@
:id="rowIndex + '-' + colIndex" :id="rowIndex + '-' + colIndex"
autoplay autoplay
muted muted
:style="{'height': '100%',width:'100%','object-fit':'fill'}" :style="{ height: '100%', width: '100%', 'object-fit': 'fill' }"
></video> ></video>
</a-col> </a-col>
</a-row> </a-row>
@ -68,8 +43,8 @@
type: String, type: String,
default() { default() {
return ""; return "";
}, }
}, }
}, },
data() { data() {
return { return {
@ -83,14 +58,14 @@
isFullscreen: false, isFullscreen: false,
originHeight: 0, originHeight: 0,
fullHeight: 0, fullHeight: 0,
players: [], players: []
}; };
}, },
//watch: {}, //watch: {},
computed: { computed: {
videoHeight() { videoHeight() {
return (this.clientHeight / this.row )+ "px"; return this.clientHeight / this.row + "px";
}, }
}, },
destroyed() { destroyed() {
this.destory(); this.destory();
@ -131,20 +106,17 @@
getWallStyle() { getWallStyle() {
this.$api.httpApi this.$api.httpApi
.getWallStyle({ .getWallStyle({
data: {}, data: {}
}) })
.then((res) => { .then(res => {
if (res.code == 200) { if (res.code == 200) {
this.row = res.data[0]; this.row = res.data[0];
this.column = res.data[1]; this.column = res.data[1];
this.getClientHeight(); this.getClientHeight();
sessionStorage.setItem( sessionStorage.setItem("originHeight", this.clientHeight);
"originHeight",
this.clientHeight
);
} }
}) })
.catch((err) => { .catch(err => {
console.log(err); console.log(err);
}); });
}, },
@ -154,9 +126,7 @@
console.log("clientHeight:" + this.clientHeight); console.log("clientHeight:" + this.clientHeight);
}, },
onEdit(targetKey, action) { onEdit(targetKey, action) {
const index = this.panes.findIndex( const index = this.panes.findIndex(pane => pane.key === targetKey);
(pane) => pane.key === targetKey
);
if (index !== -1) { if (index !== -1) {
this.panes.splice(index, 1); this.panes.splice(index, 1);
} }
@ -177,7 +147,7 @@
this.panes.push({ this.panes.push({
title: "视频墙 " + i, title: "视频墙 " + i,
content: "Content of Tab " + i, content: "Content of Tab " + i,
key: i - 1, key: i - 1
}); });
} }
}, },
@ -196,9 +166,9 @@
this.$nextTick(() => { this.$nextTick(() => {
this.$api.httpApi this.$api.httpApi
.getAllCameras({ .getAllCameras({
data: {}, data: {}
}) })
.then((res) => { .then(res => {
if (res.code == 200) { if (res.code == 200) {
let cameras = res.data; let cameras = res.data;
this.pageInfo(cameras); this.pageInfo(cameras);
@ -210,8 +180,7 @@
console.log(camerasPage); console.log(camerasPage);
this.players = []; this.players = [];
for (let i = 1; i <= camerasPage.length; i++) { for (let i = 1; i <= camerasPage.length; i++) {
let rowIndex = let rowIndex = Math.floor((i - 1) / this.column) + 1;
Math.floor((i - 1) / this.column) + 1;
if (rowIndex > this.row) { if (rowIndex > this.row) {
return; return;
} }
@ -236,7 +205,7 @@
} }
} }
}) })
.catch((err) => { .catch(err => {
console.log(err); console.log(err);
}); });
}); });
@ -301,8 +270,8 @@
this.getClientHeight(); this.getClientHeight();
} }
}); });
}, }
}, }
}; };
</script> </script>
<style> <style>

Loading…
Cancel
Save