admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页区域模块样式跳转

Browse Source
This commit is contained in:
yjl 2023-03-06 20:37:50 +08:00
parent 8f6419de30
commit 559b258eef
2 changed files with 127 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/js/http.js
View File

@ -47,7 +47,7 @@ if (process.env.NODE_ENV == 'development') {
// axios.defaults.baseURL = 'http://ue6a4s.natappfree.cc' // 邱平毅vpn本地 // axios.defaults.baseURL = 'http://ue6a4s.natappfree.cc' // 邱平毅vpn本地
// axios.defaults.baseURL = 'http://139.9.66.234:6324/' // 河南春笋 // axios.defaults.baseURL = 'http://139.9.66.234:6324/' // 河南春笋
// axios.defaults.baseURL ='http://124.71.67.160:8088/' //中建四局线上 // axios.defaults.baseURL ='http://124.71.67.160:8088/' //中建四局线上
axios.defaults.baseURL ='http://182.90.224.147:100/' //演示平台/ // axios.defaults.baseURL ='http://182.90.224.147:100/' //演示平台/
// axios.defaults.baseURL = 'http://192.168.34.125:6023/' //杨意本地 http/1.1 // axios.defaults.baseURL = 'http://192.168.34.125:6023/' //杨意本地 http/1.1
// axios.defaults.baseURL ='http://47.97.202.104:6023/' //金林湾线上 // axios.defaults.baseURL ='http://47.97.202.104:6023/' //金林湾线上
// axios.defaults.baseURL = 'http://192.168.34.231:6023/'; //杨思瑞本地 // axios.defaults.baseURL = 'http://192.168.34.231:6023/'; //杨思瑞本地
@ -79,7 +79,7 @@ if (process.env.NODE_ENV == 'development') {
// axios.defaults.baseURL = 'http://183.234.150.152:9090/' //华发 huaxin 123456789 // axios.defaults.baseURL = 'http://183.234.150.152:9090/' //华发 huaxin 123456789
// axios.defaults.baseURL = 'http://139.9.66.234:7072/' //三江集团测试环境 // axios.defaults.baseURL = 'http://139.9.66.234:7072/' //三江集团测试环境
// axios.defaults.baseURL = 'http://116.169.63.183:7070' //三江集团正式环境 // axios.defaults.baseURL = 'http://116.169.63.183:7070' //三江集团正式环境
// axios.defaults.baseURL = 'http://192.168.34.221:8188' //郭圣雄本地 axios.defaults.baseURL = 'http://182.90.224.147:18170' //郭圣雄本地
} else if (process.env.NODE_ENV == 'debug') { } else if (process.env.NODE_ENV == 'debug') {
axios.defaults.baseURL = 'https://www.ceshi.com' axios.defaults.baseURL = 'https://www.ceshi.com'

159
src/components/areaTree.vue
View File

@ -1,46 +1,117 @@
<template> <template>
<div <div
class="areaTreeBox" class="areaTreeBox"
:class="videoType == 1 || modules == 'markingRoom' || modules == 'carManage' ? 'hasVedio' : 'noVideo'" :class="
videoType == 1 || modules == 'markingRoom' || modules == 'carManage'
? 'hasVedio'
: 'noVideo'
"
id="videoTreeBox" id="videoTreeBox"
> >
<div <div
class="areaTreeInner whiteBlock fullHeight" class="areaTreeInner whiteBlock fullHeight"
v-show="expandOnoff || videoType == 1 || modules == 'markingRoom' || modules == 'carManage'" v-show="
expandOnoff ||
videoType == 1 ||
modules == 'markingRoom' ||
modules == 'carManage'
"
:class="$props.styleType ? 'black' : ''" :class="$props.styleType ? 'black' : ''"
> >
<div class="pageTitle" v-if="videoType == 1">视频列表</div> <div class="pageTitle" v-if="videoType == 1">视频列表</div>
<p :class="modules == 'markingRoom' || modules == 'carManage' ? 'pageTitle' : 'treeTitle'" v-else> <p
:class="
modules == 'markingRoom' || modules == 'carManage'
? 'pageTitle'
: 'treeTitle'
"
v-else
>
查看全部工地 查看全部工地
</p> </p>
<div class="treeBox"> <div class="treeBox">
<vue-scroll v-if="treeData.length > 0 || videoType != 1"> <vue-scroll v-if="treeData.length > 0 || videoType != 1">
<el-tree :data="treeData" @node-click="handleNodeClick" :props="defaultProps" node-key="itemId" ref="tree"> <el-tree
:data="treeData"
@node-click="handleNodeClick"
:props="defaultProps"
node-key="itemId"
ref="tree"
>
<span class="custom-tree-node" slot-scope="{ node, data }"> <span class="custom-tree-node" slot-scope="{ node, data }">
<span v-show="data.videoName" class="icon-video" :class="data.deviceType == 2 ? 'icon-video2' : ''"> </span>
<span <span
:class="data.videoName ? 'videoName' : data.projectName ? 'projectName' : data.companyType == 2 ? 'companyName2' : ''" v-show="data.videoName"
class="icon-video"
:class="data.deviceType == 2 ? 'icon-video2' : ''"
>
</span>
<span
:class="
data.videoName
? 'videoName'
: data.projectName
? 'projectName'
: data.companyType == 2
? 'companyName2'
: ''
"
>{{ node.label }}</span >{{ node.label }}</span
> >
<span v-show="data.projectNum && videoType == 0">({{ data.projectNum }})</span> <span v-show="data.projectNum && videoType == 0"
<el-tooltip effect="dark" content="播放项目所有视频" placement="top"> >({{ data.projectNum }})</span
>
<el-tooltip
effect="dark"
content="播放项目所有视频"
placement="top"
>
<span <span
class="playAllBtn" class="playAllBtn"
v-show="videoType == 1 && data.projectName && data.list.length > 0" v-show="
videoType == 1 && data.projectName && data.list.length > 0
"
@click.stop="playMutipleVideo(data)" @click.stop="playMutipleVideo(data)"
></span> ></span>
</el-tooltip> </el-tooltip>
<span v-show="data.projectName && modules == 'markingRoom'" class="statusImgBox"> <span
<img v-show="data.standardDevStopUsingNum != 0" src="@/assets/images/no_alarm.png" alt="" srcset="" /> v-show="data.projectName && modules == 'markingRoom'"
<img v-show="data.standardDevNotOnline != 0" src="@/assets/images/offline_alarm.png" alt="" srcset="" /> class="statusImgBox"
<img v-show="data.standardTemperatureAlarmNum != 0" src="@/assets/images/temp_alarm.png" alt="" srcset="" /> >
<img v-show="data.standardHumidityAlarmNum != 0" src="@/assets/images/humi_alarm.png" alt="" srcset="" /> <img
v-show="data.standardDevStopUsingNum != 0"
src="@/assets/images/no_alarm.png"
alt=""
srcset=""
/>
<img
v-show="data.standardDevNotOnline != 0"
src="@/assets/images/offline_alarm.png"
alt=""
srcset=""
/>
<img
v-show="data.standardTemperatureAlarmNum != 0"
src="@/assets/images/temp_alarm.png"
alt=""
srcset=""
/>
<img
v-show="data.standardHumidityAlarmNum != 0"
src="@/assets/images/humi_alarm.png"
alt=""
srcset=""
/>
</span> </span>
</span> </span>
</el-tree> </el-tree>
</vue-scroll> </vue-scroll>
<div class="placeholderBox" v-else> <div class="placeholderBox" v-else>
<img src="@/assets/images/longguang/noData2.png" alt="" srcset="" v-if="company == 'longguang'" /> <img
src="@/assets/images/longguang/noData2.png"
alt=""
srcset=""
v-if="company == 'longguang'"
/>
<img src="@/assets/images/noData2.png" alt="" srcset="" v-else /> <img src="@/assets/images/noData2.png" alt="" srcset="" v-else />
<p>{{ $t('message.videoManage.empty') }}</p> <p>{{ $t('message.videoManage.empty') }}</p>
</div> </div>
@ -49,17 +120,25 @@
<div <div
class="onoffBtn" class="onoffBtn"
:class="expandOnoff ? 'active' : ''" :class="expandOnoff ? 'active' : ''"
v-show="videoType == 0 && modules != 'markingRoom' && modules != 'carManage'" v-show="
videoType == 0 && modules != 'markingRoom' && modules != 'carManage'
"
@click="expandOnoff = !expandOnoff" @click="expandOnoff = !expandOnoff"
> >
<i v-show="expandOnoff" class="el-icon-caret-left"></i> <i v-show="expandOnoff" class="el-icon-caret-left"></i>
<span v-show="!expandOnoff"><i class="el-icon-caret-right"></i>查看所有工地</span> <span v-show="!expandOnoff"
><i class="el-icon-caret-right"></i>查看所有工地</span
>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { getstandardDevListApi } from '@/assets/js/api/markingRoom' import { getstandardDevListApi } from '@/assets/js/api/markingRoom'
import { getComapnyStatisticsListApi, getComapnyVideoListApi, getComapnyParentNameApi } from '@/assets/js/api/company/project' import {
getComapnyStatisticsListApi,
getComapnyVideoListApi,
getComapnyParentNameApi
} from '@/assets/js/api/company/project'
import { getVideoItemInfoApi } from '@/assets/js/api/equipmentCenter/cameraList' import { getVideoItemInfoApi } from '@/assets/js/api/equipmentCenter/cameraList'
export default { export default {
props: ['videoType', 'modules', 'activeLive', 'styleType', 'videoSn'], props: ['videoType', 'modules', 'activeLive', 'styleType', 'videoSn'],
@ -85,7 +164,7 @@ export default {
}, },
methods: { methods: {
getMarkRoomDev(sn) { getMarkRoomDev(sn) {
getstandardDevListApi({ projectSn: sn }).then(res => { getstandardDevListApi({ projectSn: sn }).then((res) => {
this.markRoomDevList = res.result this.markRoomDevList = res.result
}) })
}, },
@ -141,7 +220,7 @@ export default {
sn: this.searchsn, sn: this.searchsn,
videoType: this.videoType, videoType: this.videoType,
standardType: this.modules == 'markingRoom' ? 1 : 0 standardType: this.modules == 'markingRoom' ? 1 : 0
}).then(res => { }).then((res) => {
console.log('-----tree') console.log('-----tree')
this.treeData = res.result.companyList this.treeData = res.result.companyList
? res.result.companyList ? res.result.companyList
@ -159,9 +238,12 @@ export default {
if (this.$route.path.indexOf('/firm/towerManage') != -1) { if (this.$route.path.indexOf('/firm/towerManage') != -1) {
this.$emit('getTreeData', this.treeData) this.$emit('getTreeData', this.treeData)
} }
console.log('areaTree.vue传递设备列表数据 --- this.activeLive : ',this.activeLive) console.log(
'areaTree.vue传递设备列表数据 --- this.activeLive : ',
this.activeLive
)
if (this.activeLive) { if (this.activeLive) {
this.treeData.forEach(item => { this.treeData.forEach((item) => {
if (this.activeLive.devSn == item.serialNumber) { if (this.activeLive.devSn == item.serialNumber) {
this.handleNodeClick(item) this.handleNodeClick(item)
this.$nextTick(() => { this.$nextTick(() => {
@ -178,7 +260,7 @@ export default {
//playType 播放方式，1高清RTMP,2流畅RTMP,3高清HLS,4流畅HLS,5高清轻量级插件，6流畅轻量级插件 //playType 播放方式，1高清RTMP,2流畅RTMP,3高清HLS,4流畅HLS,5高清轻量级插件，6流畅轻量级插件
getVideoItemInfoApi({ getVideoItemInfoApi({
itemId: itemId itemId: itemId
}).then(res => { }).then((res) => {
var result = res.result var result = res.result
var url = '' var url = ''
@ -250,7 +332,7 @@ export default {
let sn1 = data.projectSn ? data.projectSn : data.companySn let sn1 = data.projectSn ? data.projectSn : data.companySn
getComapnyParentNameApi({ getComapnyParentNameApi({
sn: sn1 sn: sn1
}).then(res => { }).then((res) => {
let backArr = [] let backArr = []
let data = res.result let data = res.result
console.log(res) console.log(res)
@ -345,9 +427,11 @@ export default {
color: #5181f6; color: #5181f6;
// font-weight: bold; // font-weight: bold;
.icon-video { .icon-video {
background: url('../assets/images/icon-video-blue.png') center center no-repeat; background: url('../assets/images/icon-video-blue.png') center center
no-repeat;
&.icon-video2 { &.icon-video2 {
background: url('../assets/images/icon-video2-blue.png') center center no-repeat; background: url('../assets/images/icon-video2-blue.png') center
center no-repeat;
} }
} }
} }
@ -407,7 +491,7 @@ export default {
.treeBox { .treeBox {
height: calc(100% - 42px); height: calc(100% - 42px);
width: 306px; width: 306px;
margin-left: -50px; margin-left: -15px;
} }
.hasVedio.areaTreeBox { .hasVedio.areaTreeBox {
height: 100%; height: 100%;
@ -464,7 +548,8 @@ export default {
transform: translateY(-50%); transform: translateY(-50%);
background: url('../assets/images/icon-play.png') center center no-repeat; background: url('../assets/images/icon-play.png') center center no-repeat;
&:hover { &:hover {
background: url('../assets/images/icon-play-blue.png') center center no-repeat; background: url('../assets/images/icon-play-blue.png') center center
no-repeat;
} }
} }
.statusImgBox { .statusImgBox {
@ -484,16 +569,19 @@ export default {
color: #5181f6; color: #5181f6;
// font-weight: bold; // font-weight: bold;
.icon-video { .icon-video {
background: url('../assets/images/longguang/icon-video-blue.png') center center no-repeat !important; background: url('../assets/images/longguang/icon-video-blue.png') center
center no-repeat !important;
&.icon-video2 { &.icon-video2 {
background: url('../assets/images/longguang/icon-video2-blue.png') center center no-repeat !important; background: url('../assets/images/longguang/icon-video2-blue.png')
center center no-repeat !important;
} }
} }
} }
} }
.playAllBtn { .playAllBtn {
&:hover { &:hover {
background: url('../assets/images/longguang/icon-watch-video.png') center center no-repeat !important; background: url('../assets/images/longguang/icon-watch-video.png') center
center no-repeat !important;
} }
} }
} }
@ -523,7 +611,8 @@ export default {
color: #fff; color: #fff;
font-weight: 100 !important; font-weight: 100 !important;
font-size: 15px; font-size: 15px;
font-family: '黑体', '微软雅黑', 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif !important; font-family: '黑体', '微软雅黑', 'Helvetica Neue', Helvetica, 'PingFang SC',
'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif !important;
} }
.custom-tree-node { .custom-tree-node {
color: #fff; color: #fff;
@ -537,11 +626,13 @@ export default {
} }
} }
.icon-video { .icon-video {
background: url('../assets/images/icon-video-white.png') center center no-repeat; background: url('../assets/images/icon-video-white.png') center center
no-repeat;
// background-size: 14px auto ; // background-size: 14px auto ;
vertical-align: top; vertical-align: top;
&.icon-video2 { &.icon-video2 {
background: url('../assets/images/icon-video2.png') center center no-repeat; background: url('../assets/images/icon-video2.png') center center
no-repeat;
} }
} }
.projectName:hover { .projectName:hover {