Merge branch 'master' of http://192.168.0.56:3000/haozq/lj-zhgd-htweb
This commit is contained in:
commit
a547d8c35f
|
|
@ -51,4 +51,22 @@ export function getPersonsInfo(query) {
|
|||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
/* 人员树选中人员触发的接口 */
|
||||
export function getPersonDetail(query) {
|
||||
return request({
|
||||
url: '/bracelet/consControl/getPersonDetail',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
/* 人员历史轨迹 */
|
||||
export function getHistoryGj(query) {
|
||||
return request({
|
||||
url: '/bracelet/consControl/getHistoryGj',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import request from '@/utils/request'
|
||||
/* 人员树 */
|
||||
export function getBallDeviceLists(query) {
|
||||
return request({
|
||||
url: '/bracelet/consControl/getBallDeviceLists',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
|
@ -1,14 +1,14 @@
|
|||
<template>
|
||||
<div class="app-container" style="background-color: #F9F9F9;">
|
||||
<el-tabs v-model="activeName" class="demo-tabs">
|
||||
<!-- <el-tab-pane label="实时监控" class="realTimeManage" name="first">
|
||||
<realTimeManage/>
|
||||
</el-tab-pane> -->
|
||||
<el-tab-pane label="实时监控" class="realTimeManage" name="first">
|
||||
<realTimeManage />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="人员管控" class="personManage" name="second">
|
||||
<personManage/>
|
||||
<personManage />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="吊装管控" class="hoistManage" name="three">
|
||||
<hoistManage/>
|
||||
<hoistManage />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
|
|
@ -16,20 +16,19 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
// import realTimeManage from './realTimeManage/realTimeManage.vue';
|
||||
import realTimeManage from './realTimeManage/realTimeManage.vue';
|
||||
import personManage from './personManage/personManage.vue';
|
||||
import hoistManage from './hoistManage/hoistManage.vue';
|
||||
export default {
|
||||
name: "manage",
|
||||
components: {
|
||||
// realTimeManage,
|
||||
realTimeManage,
|
||||
personManage,
|
||||
hoistManage
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// activeName: 'first'
|
||||
activeName: 'second'
|
||||
activeName: 'first'
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
|
@ -37,9 +36,8 @@ export default {
|
|||
methods: {
|
||||
// test();
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
<style></style>
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
<div class="content">
|
||||
<div id="searchBox" class="layout" v-if="isShowHistoryGj">
|
||||
<el-button type="primary" plain @click="clsoeHistoryGj" style="margin-right: 10px;">返回</el-button>
|
||||
<el-date-picker v-model="chooseDate" @change="loadGj" :editable="false" :clearable="false" type="date"
|
||||
<el-date-picker v-model="chooseDate" @change="loadHistoryGj" :editable="false" :clearable="false" type="date"
|
||||
format="yyyy-MM-dd" value-format="yyyy-MM-dd" placeholder="选择日期">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
|
|
@ -73,8 +73,9 @@
|
|||
<div class="layout" v-if="person.sh.isWarn == 0"><img
|
||||
src="../../../../assets/person_img/position_nowarn.png">正常
|
||||
</div>
|
||||
<div class="layout info" v-if="person.sh.isWarn == 1"><img
|
||||
src="../../../../assets/person_img/position_warn.png">异常</div>
|
||||
<div class="layout" v-if="person.sh.isWarn == 1"><img
|
||||
src="../../../../assets/person_img/position_warn.png">异常
|
||||
</div>
|
||||
<div class="layout info"><img src="../../../../assets/person_img/temp.png">{{ person.sh.temp }}</div>
|
||||
</div>
|
||||
<div class="layout">
|
||||
|
|
@ -169,7 +170,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { personsTree, teamPersonByTower, spotCheck, getCheckConfig, checkConfig, getPersonsInfo } from "@/api/construction/manage/personManage.js";
|
||||
import { personsTree, teamPersonByTower, spotCheck, getCheckConfig, checkConfig, getPersonsInfo, getPersonDetail, getHistoryGj } from "@/api/construction/manage/personManage.js";
|
||||
import no_warn from "@/assets/svg/no_warn.svg";
|
||||
import no_warn2 from "@/assets/svg/no_warn2.svg";
|
||||
import warn from "@/assets/svg/warn.svg";
|
||||
|
|
@ -214,13 +215,6 @@ export default {
|
|||
},
|
||||
// 表单校验
|
||||
rules: {},
|
||||
//记录设备位置数据
|
||||
deviceData: [
|
||||
{ "position": { lng: 116.404, lat: 39.915 }, "deviceName": "设备11", show: false, },
|
||||
{ "position": { lng: 116.405, lat: 39.915 }, "deviceName": "设备22", show: false, },
|
||||
{ "position": { lng: 116.404, lat: 39.916 }, "deviceName": "设备33", show: false, },
|
||||
{ "position": { lng: 116.404, lat: 39.917 }, "deviceName": "设备44", show: false, },
|
||||
],
|
||||
map: null,
|
||||
BMap: null,
|
||||
// 作业杆塔
|
||||
|
|
@ -260,99 +254,33 @@ export default {
|
|||
isPerson: false,
|
||||
isShowHistoryGj: false,
|
||||
// 轨迹定位数组
|
||||
gjArr: [
|
||||
{ lon: 117.287800, lat: 31.255550 },
|
||||
{ lon: 117.287450, lat: 31.255650 },
|
||||
{ lon: 117.287700, lat: 31.255750 },
|
||||
{ lon: 117.287650, lat: 31.255850 },
|
||||
],
|
||||
gjArr: [],
|
||||
person: {
|
||||
name: '张三',
|
||||
phone: '18855798259',
|
||||
teamName: '张三班组',
|
||||
idCard: '341181199807165636',
|
||||
warnName: '离开工作区域',
|
||||
warnType: 'danger',
|
||||
hasSafetyHat: true,
|
||||
name: null,
|
||||
phone: null,
|
||||
teamName: null,
|
||||
idCard: null,
|
||||
warnName: null,
|
||||
warnType: 'success',
|
||||
hasSafetyHat: false,
|
||||
sh: {
|
||||
devId: 37,
|
||||
name: '1号手环',
|
||||
elec: 10,
|
||||
isWarn: 0,
|
||||
temp: '37℃',
|
||||
heartRate: '80次/分',
|
||||
bloodPressure: '150/80mmHg',
|
||||
mjCode: '1号马甲'
|
||||
devId: null,
|
||||
name: null,
|
||||
elec: 0,
|
||||
isWarn: 1,
|
||||
temp: null,
|
||||
heartRate: null,
|
||||
bloodPressure: null,
|
||||
mjCode: null,
|
||||
},
|
||||
hat: {
|
||||
name: '1号安全帽',
|
||||
name: null,
|
||||
},
|
||||
workTeamNum: 5,
|
||||
workPersonNum: 30
|
||||
workTeamNum: 0,
|
||||
workPersonNum: 0
|
||||
},
|
||||
// 预警表格
|
||||
warnTable: [
|
||||
{
|
||||
warnTime: '2024-08-15 11:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 12:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 13:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 11:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 12:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 13:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 11:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 12:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 13:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 11:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 12:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 13:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 11:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 12:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
{
|
||||
warnTime: '2024-08-15 13:32:12',
|
||||
warnContent: '离开工作区域'
|
||||
},
|
||||
],
|
||||
warnTable: [],
|
||||
//保存表格数据
|
||||
hatTable: [
|
||||
{
|
||||
|
|
@ -550,7 +478,7 @@ export default {
|
|||
this.dialogVisible2 = false
|
||||
},
|
||||
// 获取班组下的人员定位及杆塔坐标
|
||||
laodPersonsInfo(params) {
|
||||
loadPersonsInfo(params) {
|
||||
getPersonsInfo(params).then((res) => {
|
||||
const data = res.data;
|
||||
if (data) {
|
||||
|
|
@ -583,6 +511,55 @@ export default {
|
|||
}
|
||||
}).catch((res) => { })
|
||||
},
|
||||
// 人员树选中人员加载的数据
|
||||
loadPersonDetail(params) {
|
||||
getPersonDetail(params).then((res) => {
|
||||
const data = res.data;
|
||||
if (data && data.vo) {
|
||||
const obj = data.vo;
|
||||
this.warnTable = obj.warnInfoList;
|
||||
this.person.name = obj.name;
|
||||
this.person.phone = obj.phone;
|
||||
this.person.teamName = obj.teamName;
|
||||
this.person.idCard = obj.idCard;
|
||||
this.person.warnName = obj.warnName;
|
||||
this.person.warnType = obj.warnType;
|
||||
this.person.hasSafetyHat = obj.hasSafetyHat;
|
||||
this.person.sh.devId = obj.bracelet.devId;
|
||||
this.person.sh.name = obj.bracelet.name;
|
||||
this.person.sh.elec = obj.bracelet.elec;
|
||||
this.person.sh.isWarn = obj.bracelet.isWarn;
|
||||
this.person.sh.temp = this.handleData(obj.bracelet.temp);
|
||||
this.person.sh.heartRate = this.handleData(obj.bracelet.heartRate);
|
||||
this.person.sh.bloodPressure = this.handleData(obj.bracelet.bloodPressure);
|
||||
this.person.sh.mjCode = this.handleData(obj.mjCode);
|
||||
this.person.hat.name = obj.safetyHat.name;
|
||||
}
|
||||
}).catch((res) => { })
|
||||
},
|
||||
// 人员历史轨迹
|
||||
loadHistoryGj() {
|
||||
// 手环设备ID和开始时间
|
||||
let obj = {
|
||||
'id': this.person.sh.devId,
|
||||
'startTime': this.chooseDate
|
||||
};
|
||||
getHistoryGj(obj).then((res) => {
|
||||
const data = res.data;
|
||||
if (data && data.length > 0) {
|
||||
this.gjArr = data;
|
||||
} else {
|
||||
this.gjArr = [];
|
||||
}
|
||||
this.loadGj();
|
||||
}).catch((res) => { })
|
||||
},
|
||||
handleData(value) {
|
||||
if (!value) {
|
||||
return '--';
|
||||
}
|
||||
return value;
|
||||
},
|
||||
handler({ BMap, map }) {
|
||||
this.BMap = BMap;
|
||||
this.map = map;
|
||||
|
|
@ -615,7 +592,7 @@ export default {
|
|||
'id': towerId,
|
||||
'teamId': teamId
|
||||
}
|
||||
this.laodPersonsInfo(obj);
|
||||
this.loadPersonsInfo(obj);
|
||||
} else if (node.level === 4) {
|
||||
this.isTower = false;
|
||||
this.isTeam = false;
|
||||
|
|
@ -663,6 +640,12 @@ export default {
|
|||
this.isTower = false;
|
||||
this.isTeam = false;
|
||||
this.isPerson = true;
|
||||
// id：人员ID type: 0 班组成员 1 临时人员
|
||||
const obj = {
|
||||
'id': item.id,
|
||||
'type': item.type
|
||||
}
|
||||
this.loadPersonDetail(obj);
|
||||
},
|
||||
/* 添加人员定位的覆盖物 */
|
||||
addPersonMarker(item) {
|
||||
|
|
@ -687,25 +670,24 @@ export default {
|
|||
marker.addEventListener("click", () => { this.clickMarker(item) });
|
||||
},
|
||||
// 人员绑定手环历史轨迹
|
||||
openHistoryGj(devId) {
|
||||
openHistoryGj() {
|
||||
this.removeOverlay();
|
||||
this.loadHistoryGj();
|
||||
this.isShowHistoryGj = true;
|
||||
this.loadGj(this.chooseDate);
|
||||
},
|
||||
// 关闭历史轨迹
|
||||
clsoeHistoryGj(devId) {
|
||||
clsoeHistoryGj() {
|
||||
this.removeOverlay();
|
||||
this.isShowHistoryGj = false;
|
||||
const obj = {
|
||||
'id': this.id,
|
||||
'teamId': this.teamId
|
||||
}
|
||||
this.laodPersonsInfo(obj);
|
||||
this.loadPersonsInfo(obj);
|
||||
},
|
||||
// 获取人员运动轨迹
|
||||
loadGj(val) {
|
||||
loadGj() {
|
||||
this.removeOverlay();
|
||||
alert(val);
|
||||
const list = this.gjArr;
|
||||
if (list.length >= 2) { // 轨迹数组大于2个才会展示轨迹
|
||||
// 已轨迹的起点作为中心点
|
||||
|
|
|
|||
|
|
@ -1,93 +1,51 @@
|
|||
<template>
|
||||
<div class="realTimeManage" style="width: 100%;height: 80vh;background-color: #ffffff;box-shadow: 10px 10px 5px #000000;">
|
||||
<div class="left">
|
||||
<div class="leftTop">
|
||||
<div class="title1">
|
||||
实时监控
|
||||
</div>
|
||||
<div class="controlDeck">
|
||||
<div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div>聚焦</div>
|
||||
<div>缩放</div>
|
||||
<div>光圈</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="monitorList" >
|
||||
<!-- -->
|
||||
<el-tree :data="monitorList" icon="el-icon-search" node-key="id" :default-expanded-keys="[1]"
|
||||
@node-click="handleNodeClick" :render-content="renderContent" style="font-size: 14px;"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightTop">
|
||||
<div class="title">
|
||||
<el-tabs v-model="splitScreenName" class="demo-tabs" @tab-click="splitScreenClick">
|
||||
<el-tab-pane label="一画面" class="realTimeManage" name="first">
|
||||
<div style="width: 100%;height: 52vh;">
|
||||
<video id="video" class="vjs-default-skin" autoplay controls preload="none"
|
||||
style="height:100%;width:100%;object-fit: fill"></video>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="四画面" class="personManage" name="second">
|
||||
<<!-- div style="width: 100%;height: 52vh;">
|
||||
<video id="video" class="vjs-default-skin" autoplay controls preload="none"
|
||||
style="height:50%;width:50%;object-fit: fill"></video>
|
||||
<video id="video" class="vjs-default-skin" autoplay controls preload="none"
|
||||
style="height:50%;width:50%;object-fit: fill"></video>
|
||||
<video id="video" class="vjs-default-skin" autoplay controls preload="none"
|
||||
style="height:50%;width:50%;object-fit: fill"></video>
|
||||
<video id="video" class="vjs-default-skin" autoplay controls preload="none"
|
||||
style="height:50%;width:50%;object-fit: fill"></video>
|
||||
</div> -->
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
<div class="down">
|
||||
<div v-for="(item, index) in violationPhoto" :key="item.id">
|
||||
<div>
|
||||
<img :src="item.path" style="width: 100%;height: 100%;"/>
|
||||
</div>
|
||||
<div>
|
||||
<span>{{ item.cameraName }}</span>
|
||||
<span>{{ item.time }}</span>
|
||||
</div>
|
||||
<div>{{ item.content }}</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div>预警信息</div>
|
||||
<div>
|
||||
<el-table :data="tableData" style="width: 100%" :show-header="false">
|
||||
<el-table-column prop="deviceType" label="设备类型"/>
|
||||
<el-table-column prop="deviceName" label="设备名称"/>
|
||||
<el-table-column prop="time" label="预警时间" />
|
||||
<el-table-column prop="warnContent" label="预警内容" />
|
||||
</el-table>
|
||||
<el-pagination v-model:current-page="pageNo" v-model:page-size="pageSize" :page-sizes="[5, 10, 20, 50]"
|
||||
:background="true" layout="prev, pager, next, jumper,->,total, sizes" :total="total"
|
||||
@current-change="getHasRole" @size-change="handler" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="realTimeManage">
|
||||
<div class="left">
|
||||
<!-- 云平台 -->
|
||||
<div class="cloud-platform-box">
|
||||
|
||||
</div>
|
||||
<!-- 球机树 -->
|
||||
<div class="tree-box tree">
|
||||
<el-input placeholder="请输入关键字" prefix-icon="el-icon-search" v-model="filterText" maxlength="30"
|
||||
style="margin: 10px 0;"></el-input>
|
||||
<el-tree :data="treeData" icon="el-icon-search" node-key="id" :default-expanded-keys="idArr"
|
||||
@node-click="handleNodeClick" :render-content="renderContent" style="font-size: 15px;letter-spacing: 1px;"
|
||||
ref="tree" :highlight-current="true" :filter-node-method="filterNode" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<!-- 视频 -->
|
||||
<div class="center">
|
||||
<div class="change-box layout">
|
||||
<el-button type="primary" plain>1</el-button>
|
||||
<el-button type="primary" plain>4</el-button>
|
||||
</div>
|
||||
<!-- 球机视频 -->
|
||||
<div class="video-box">
|
||||
<video id="videoPlayer1" class="ball-content" autoplay="autoplay" loop="loop" muted controls="controls"></video>
|
||||
</div>
|
||||
<!-- 违章识别 -->
|
||||
<div class="vio-box"></div>
|
||||
</div>
|
||||
<!-- 预警信息 -->
|
||||
<div class="right">
|
||||
<h4>预警信息</h4>
|
||||
<el-table :data="tableData" style="width: 100%">
|
||||
<el-table-column prop="deviceType" label="设备类型" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="deviceName" label="设备名称" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="warnTime" label="违章时间" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="warnContent" label="违章内容" align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getBallDeviceLists } from "@/api/construction/manage/realTimeManage.js";
|
||||
/* import { include } from '../../../../utils/video/include.js'
|
||||
import { video } from '../../../../utils/video/video-7.19.1.min.js'
|
||||
import { flv } from '../../../../utils/video/flv.js'
|
||||
|
|
@ -97,394 +55,276 @@
|
|||
import { videoQX } from '../../../../utils/video/videoQX';
|
||||
|
||||
import $ from 'jquery'; */
|
||||
export default {
|
||||
name: 'realTimeManage',
|
||||
data() {
|
||||
return {
|
||||
//页码
|
||||
pageNo: 1,
|
||||
//每页条数
|
||||
pageSize: 5,
|
||||
|
||||
//保存球机数据
|
||||
monitorList: [
|
||||
{
|
||||
id: '1',
|
||||
label: '工程xxxxxxx',
|
||||
children: [
|
||||
{
|
||||
label: '张三',
|
||||
puId: '123123123123'
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '工程xxxxxxx',
|
||||
children: [
|
||||
{
|
||||
label: '张三1',
|
||||
puId: '798779798779877'
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '工程xxxxxxx',
|
||||
children: [
|
||||
{
|
||||
label: '#张三2',
|
||||
puId: '565445646464654'
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
splitScreenName: 'first',
|
||||
//保存违章照片
|
||||
violationPhoto: [{"id": "1", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "2", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "3", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "4", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "5", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "6", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "7", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "8", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "9", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}, {"id": "10", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10"}]
|
||||
//保存表格数据
|
||||
,tableData: [
|
||||
{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
time: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽阿三大苏打啊飒飒大苏打飒飒打撒打撒'
|
||||
},{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
time: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
},{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
time: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
},{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
time: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
},
|
||||
{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
time: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
}
|
||||
]
|
||||
};
|
||||
export default {
|
||||
name: 'realTimeManage',
|
||||
/* 球机树前端筛选 */
|
||||
watch: {
|
||||
filterText(val) {
|
||||
this.$refs.tree.filter(val);
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
//页码
|
||||
pageNo: 1,
|
||||
//每页条数
|
||||
pageSize: 5,
|
||||
// 球机树过滤
|
||||
filterText: '',
|
||||
//球机树数据
|
||||
treeData: [],
|
||||
// 球机树默认展示的节点
|
||||
idArr: [],
|
||||
splitScreenName: 'first',
|
||||
//保存违章照片
|
||||
violationPhoto: [{ "id": "1", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "2", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "3", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "4", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "5", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "6", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "7", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "8", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "9", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }, { "id": "10", "path": "http://192.168.0.14:1909/file/ynRealName/violationBlack/2024/05/13/08ffd23539df47ed873058a163249ffe005Qblgkgy1h3h38c7wwrj30q70q7gs5.jpg", "cameraName": "违规10", "time": "2024-03-03", "content": "未正确佩戴安全帽10" }]
|
||||
//保存表格数据
|
||||
, tableData: [
|
||||
{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
warnTime: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽阿三大苏打啊飒飒大苏打飒飒打撒打撒'
|
||||
}, {
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
warnTime: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
}, {
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
warnTime: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
}, {
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
warnTime: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
},
|
||||
{
|
||||
deviceType: '监控设备',
|
||||
deviceName: 'xxxxx球机',
|
||||
warnTime: '2024-03-03',
|
||||
warnContent: '人员未佩戴安全帽'
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.laodBallDeviceLists();
|
||||
},
|
||||
mounted() {
|
||||
this.loadExternalScript();
|
||||
},
|
||||
methods: {
|
||||
/* 加载球机树 */
|
||||
laodBallDeviceLists() {
|
||||
getBallDeviceLists().then(res => {
|
||||
const treeData = res.data;
|
||||
if (treeData && treeData.length > 0) {
|
||||
this.treeData = treeData
|
||||
// 设置默认展示球机层级
|
||||
treeData.forEach(item => {
|
||||
this.idArr.push(item.id);
|
||||
})
|
||||
}
|
||||
}).catch(res => { });
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted(){
|
||||
this.loadExternalScript();
|
||||
// const queryParams = this.$route.query;
|
||||
// console.log("queryParams");
|
||||
},
|
||||
methods: {
|
||||
async loadExternalScript() {
|
||||
try {
|
||||
// 假设你的JavaScript文件位于'/path/to/your/script.js'
|
||||
const module = await import('../../../../utils/video/videoPage');
|
||||
// 如果你需要使用module.export导出的内容，可以在这里进行操作
|
||||
} catch (e) {
|
||||
console.error('Error loading the external script:', e);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
|
||||
splitScreenClick(pane, event){
|
||||
console.log("pane:", );
|
||||
console.log("event:", event);
|
||||
|
||||
if(pane.name === 'first'){
|
||||
|
||||
}
|
||||
if(pane.name === 'second'){
|
||||
|
||||
}
|
||||
},
|
||||
//树组件节点点击
|
||||
handleNodeClick(data){
|
||||
console.log(data.puId)
|
||||
},
|
||||
//给梳妆街头不同层级设置不同的icon
|
||||
renderContent(h, { node, data }) {
|
||||
// 根据层级使用不同的图标
|
||||
let icon;
|
||||
if (node.level === 1) {
|
||||
icon = 'el-icon-coin'; // 第一层使用主页图标
|
||||
} else if (node.level === 2) {
|
||||
icon = 'el-icon-s-unfold'; // 第二层使用展开图标
|
||||
} else {
|
||||
icon = 'el-icon-user'; // 其他层级使用平台图标
|
||||
}
|
||||
|
||||
return (
|
||||
<span class="custom-tree-node">
|
||||
<i class={icon}></i>
|
||||
<span>{node.label}</span>
|
||||
</span>
|
||||
);
|
||||
},
|
||||
|
||||
//
|
||||
//分页器设置
|
||||
handler(){
|
||||
getHasRole()
|
||||
},
|
||||
//获取表格数据
|
||||
getHasRole (page = 1){
|
||||
//修改当前页码
|
||||
this.pageNo = page;
|
||||
/* let request = await reqAllRoleList(pageNo.value, pageSize.value, keyWord.value);
|
||||
if (request.data.code == 200) {
|
||||
total.value = request.data.data.total;
|
||||
roleArr.value = request.data.data.records;
|
||||
} */
|
||||
async loadExternalScript() {
|
||||
try {
|
||||
// 假设你的JavaScript文件位于'/path/to/your/script.js'
|
||||
const module = await import('../../../../utils/video/videoPage');
|
||||
// 如果你需要使用module.export导出的内容，可以在这里进行操作
|
||||
} catch (e) {
|
||||
console.error('Error loading the external script:', e);
|
||||
}
|
||||
},
|
||||
|
||||
/* 球机树过滤 */
|
||||
filterNode(value, data, node) {
|
||||
if (!value) {
|
||||
if (node.level == 1) {
|
||||
node.expanded = true
|
||||
} else {
|
||||
node.expanded = false
|
||||
}
|
||||
return true
|
||||
}
|
||||
// 查询列表是否有匹配数据
|
||||
let val = value.toLowerCase()
|
||||
return this.chooseNode(val, data, node)
|
||||
},
|
||||
// 过滤父节点 子节点:如果输入的参数是父节点且能匹配，则返回该节点以及其下的所有子节点；如果参数是子节点，则返回该节点的父节点。
|
||||
chooseNode(value, data, node) {
|
||||
if (data.label.indexOf(value) !== -1) {
|
||||
return true
|
||||
}
|
||||
const level = node.level
|
||||
// 如果传入的节点本身就是一级节点就不用校验了
|
||||
if (level === 1) {
|
||||
return false
|
||||
}
|
||||
// 先取当前节点的父节点
|
||||
let parentData = node.parent
|
||||
// 遍历当前节点的父节点
|
||||
let index = 0
|
||||
while (index < level - 1) {
|
||||
// 如果匹配到直接返回
|
||||
if (parentData.data.label.indexOf(value) !== -1) {
|
||||
return true
|
||||
}
|
||||
// 否则的话再往上一层做匹配
|
||||
parentData = parentData.parent
|
||||
index++
|
||||
}
|
||||
// 没匹配到返回false
|
||||
return false
|
||||
},
|
||||
//球机树节点点击
|
||||
handleNodeClick(data, node, item) {
|
||||
if (node.level === 2) {
|
||||
alert(data.id);
|
||||
}
|
||||
},
|
||||
splitScreenClick(pane, event) {
|
||||
console.log("pane:",);
|
||||
console.log("event:", event);
|
||||
|
||||
if (pane.name === 'first') {
|
||||
|
||||
}
|
||||
if (pane.name === 'second') {
|
||||
|
||||
}
|
||||
},
|
||||
//给梳妆街头不同层级设置不同的icon
|
||||
renderContent(h, { node, data }) {
|
||||
// 根据层级使用不同的图标
|
||||
let icon;
|
||||
if (node.level === 1) {
|
||||
icon = 'el-icon-coin'; // 第一层使用主页图标
|
||||
} else if (node.level === 2) {
|
||||
icon = 'el-icon-s-unfold'; // 第二层使用展开图标
|
||||
} else {
|
||||
icon = 'el-icon-user'; // 其他层级使用平台图标
|
||||
}
|
||||
|
||||
return (
|
||||
<span class="custom-tree-node">
|
||||
<i class={icon}></i>
|
||||
<span>{node.label}</span>
|
||||
</span>
|
||||
);
|
||||
},
|
||||
|
||||
//
|
||||
//分页器设置
|
||||
handler() {
|
||||
getHasRole()
|
||||
},
|
||||
//获取表格数据
|
||||
getHasRole(page = 1) {
|
||||
//修改当前页码
|
||||
this.pageNo = page;
|
||||
/* let request = await reqAllRoleList(pageNo.value, pageSize.value, keyWord.value);
|
||||
if (request.data.code == 200) {
|
||||
total.value = request.data.data.total;
|
||||
roleArr.value = request.data.data.records;
|
||||
} */
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.realTimeManage {
|
||||
width: 100%;
|
||||
height: 80vh;
|
||||
background-color: #fff;
|
||||
box-shadow: 10px 10px 5px #000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.layout {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
.realTimeManage .left {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
padding: 0 0.5%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.cloud-platform-box {
|
||||
width: 100%;
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.tree-box {
|
||||
width: 100%;
|
||||
height: calc(100% - 250px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.realTimeManage .center {
|
||||
width: 48%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.change-box {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.video-box {
|
||||
width: 100%;
|
||||
height: calc(100% - 250px);
|
||||
}
|
||||
|
||||
.ball-content {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
object-fit: fill;
|
||||
}
|
||||
|
||||
.vio-box {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.realTimeManage .right {
|
||||
width: 30%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
.realTimeManage>div>div{
|
||||
float: left;
|
||||
}
|
||||
.realTimeManage .left{
|
||||
width: 66%;
|
||||
/* tree节点过长换行处理 */
|
||||
.tree {
|
||||
width: 100%;
|
||||
|
||||
::v-deep .el-tree-node {
|
||||
white-space: normal;
|
||||
|
||||
.el-tree-node__content {
|
||||
height: 100%;
|
||||
}
|
||||
.realTimeManage .left>div{
|
||||
float: left;
|
||||
}
|
||||
.realTimeManage .left>.leftTop{
|
||||
width: 23%;
|
||||
height: 75%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.title1{
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
color: #333333;
|
||||
width: 100%;
|
||||
height: 8%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-indent: 20px;
|
||||
margin: 4px 0;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck{
|
||||
width: 100%;
|
||||
height: 42%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1){
|
||||
width: 100%;
|
||||
height: 85%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div{
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(1){
|
||||
position: absolute;
|
||||
top: 7%;
|
||||
left: 6.35%;
|
||||
background-image: url('../../../../assets/images/control1.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(2){
|
||||
position: absolute;
|
||||
top: 12.55%;
|
||||
left: 3.7%;
|
||||
background-image: url('../../../../assets/images/control2.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(3){
|
||||
position: absolute;
|
||||
top: 12.5%;
|
||||
left: 9%;
|
||||
background-image: url('../../../../assets/images/control3.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(4){
|
||||
position: absolute;
|
||||
top: 18%;
|
||||
left: 6.35%;
|
||||
background-image: url('../../../../assets/images/control4.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(5){
|
||||
position: absolute;
|
||||
top: 21.9%;
|
||||
left: 1%;
|
||||
background-image: url('../../../../assets/images/control5.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(6){
|
||||
position: absolute;
|
||||
top: 27%;
|
||||
left: 1%;
|
||||
background-image: url('../../../../assets/images/control6.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(7){
|
||||
position: absolute;
|
||||
top: 27%;
|
||||
left: 5.3%;
|
||||
background-image: url('../../../../assets/images/control7.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(8){
|
||||
position: absolute;
|
||||
top: 27%;
|
||||
left: 7.55%;
|
||||
background-image: url('../../../../assets/images/control8.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(9){
|
||||
position: absolute;
|
||||
top: 21.9%;
|
||||
left: 11.8%;
|
||||
background-image: url('../../../../assets/images/control9.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(1)>div:nth-child(10){
|
||||
position: absolute;
|
||||
top: 27%;
|
||||
left: 11.8%;
|
||||
background-image: url('../../../../assets/images/control10.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(2){
|
||||
width: 100%;
|
||||
height: 15%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(2)>div{
|
||||
color: #06182E;
|
||||
font-size: 14px;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(2)>div:nth-child(1){
|
||||
margin-left: 9%;
|
||||
}
|
||||
.realTimeManage .left>.leftTop>.controlDeck>div:nth-child(2)>div:nth-child(3){
|
||||
margin-right: 9%;
|
||||
}
|
||||
|
||||
|
||||
.realTimeManage .left>.leftTop>.monitorList{
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.realTimeManage .left>.leftTop>.monitorList>div:nth-child(1){
|
||||
border-top: 0.5px solid #F5F4F4;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.realTimeManage .left>.rightTop{
|
||||
width: 77%;
|
||||
height: 75%;
|
||||
}
|
||||
.realTimeManage .left>.down{
|
||||
margin-top: 1%;
|
||||
width: 100%;
|
||||
height: 23%;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
.realTimeManage .left>.down>div{
|
||||
height: 100%;
|
||||
width: 17%;
|
||||
margin-left: 2%;
|
||||
display: inline-block;
|
||||
}
|
||||
.realTimeManage .left>.down>div>div:nth-child(1){
|
||||
width: 100%;
|
||||
height: 68%;
|
||||
}
|
||||
.realTimeManage .left>.down>div>div:nth-child(2){
|
||||
width: 100%;
|
||||
height: 16%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.realTimeManage .left>.down>div>div:nth-child(2)>span{
|
||||
text-indent: 8px;
|
||||
color: #333333;
|
||||
font-size: 14px;
|
||||
}
|
||||
.realTimeManage .left>.down>div>div:nth-child(3){
|
||||
width: 100%;
|
||||
height: 16%;
|
||||
text-indent: 8px;
|
||||
color: #333333;
|
||||
font-size: 14px;
|
||||
}
|
||||
.realTimeManage .right{
|
||||
margin-left: 1%;
|
||||
width:32%;
|
||||
height: 100%;
|
||||
}
|
||||
.realTimeManage .right>div:nth-child(1){
|
||||
width: 100%;
|
||||
height: 6%;
|
||||
color: #333333;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-indent: 20px;
|
||||
}
|
||||
.realTimeManage .right>div:nth-child(2){
|
||||
width: 100%;
|
||||
height: 94%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
}
|
||||
/* 滚动槽 */
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
-webkit-box-shadow: inset 0 0 5px #e8eceb;
|
||||
border-radius: 5px;
|
||||
|
||||
::v-deep .el-tree-node__label {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/* 滚动条滑块 */
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
-webkit-box-shadow: inset 0 0 6px #cbb7b7;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:window-inactive {
|
||||
background: #e8eceb;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: #e8eceb;
|
||||
}
|
||||
</style>
|
||||
}
|
||||
|
||||
::v-deep .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
||||
color: #1890ff;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue