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-04-01 14:26:45 +08:00
parent c4b23c5be3
commit 12840ac241
10 changed files with 278 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -78,17 +78,17 @@ if (process.env.NODE_ENV == 'development') {
// axios.defaults.baseURL = 'http://192.168.34.221:8188' //郭圣雄本地
// axios.defaults.baseURL = 'http://192.168.34.221:8210' //郭圣雄本地
// axios.defaults.baseURL = 'http://192.168.34.221:12346' //郭圣雄本地
axios.defaults.baseURL = 'http://192.168.34.221:12350' //金林湾本地
// axios.defaults.baseURL = 'http://192.168.34.221:12350' //金林湾本地
// axios.defaults.baseURL = 'http://192.168.34.122:8070' //彭洁本地
// axios.defaults.baseURL = 'http://101.43.164.214:11111' //百色线上
// axios.defaults.baseURL = 'http://101.43.164.214:12345/#/'//内蒙古线上
// axios.defaults.baseURL = 'http://121.196.214.246/api'//金林湾线上新
axios.defaults.baseURL = 'http://121.196.214.246/api/'//金林湾线上新
} else if (process.env.NODE_ENV == 'debug') {
axios.defaults.baseURL = 'https://www.ceshi.com'
} else if (process.env.NODE_ENV == 'production') {
let host = window.location.host
axios.defaults.baseURL = window.location.protocol + '//' + host + '/api'//金林湾地址
axios.defaults.baseURL = window.location.protocol + '//' + host + '/api/'//金林湾地址
// axios.defaults.baseURL = window.location.protocol + '//' + host + '/'
// axios.defaults.baseURL ='http://192.168.34.216:6023/'
// axios.defaults.baseURL = window.location.protocol + "//" + host.split(":")[0] + ":6023" + "/"

28
src/store/index.js
View File

@ -45,21 +45,29 @@ export default new Vuex.Store({
PAGESIZRS: [10, 20, 30, 50],
// UPLOADURL:'http://10.0.1.43:6023/upload/image',//测试
// FILEURL:'http://10.0.1.43:6023/image/',//测试
// BASEURL: baseUrl
// ? baseUrl
// : window.location.protocol + "//" + window.location.host + "/", //正式部署地址
// UPLOADURL:
// window.location.protocol + "//" + window.location.host + "/upload/image", //正式部署地址
// FILEURL: window.location.protocol + "//" + window.location.host + "/image/", //正式部署地址
//----------------
BASEURL: baseUrl
? baseUrl
: window.location.protocol + "//" + window.location.host + "/api", //
// UPLOADURL:
// window.location.protocol + "//" + window.location.host + "/api/upload/image", //
// FILEURL: window.location.protocol + "//" + window.location.host + "/image/", //测试
// tag: 本地测试接口 // BASEURL:'http://192.168.34.174:6023/',
: window.location.protocol + "//" + window.location.host + "/api/", //金林湾部署地址 // UPLOADURL: 'http://182.90.224.237:7000/upload/image',
UPLOADURL:
window.location.protocol +
"//" +
window.location.host +
"/api/upload/image", //金林湾部署地址
FILEURL: window.location.protocol + "//" + window.location.host + "/image/", //金林湾部署地址 // FILEURL: 'http://182.90.224.237:7000/image/',
// tag: 本地测试接口 // BASEURL:'http://192.168.34.174:6023/',
/* 2022-05-16 */
// tag: 部署河南项目时，需要打开这两行代码
// UPLOADURL: 'http://139.9.66.234:6324/`upload/image',
// FILEURL: 'http://139.9.66.234:6324/image/',
/* 2022-06-06 广西本地的*/ // UPLOADURL: 'http://182.90.224.237:7000/upload/image',
// FILEURL: 'http://182.90.224.237:7000/image/',
// 邱平毅的
/* 2022-06-06 广西本地的*/ // 邱平毅的
// BASEURL:'http://192.168.34.116:6023/',
// UPLOADURL: 'http://192.168.34.116:6023/upload/image',
// FILEURL: 'http://192.168.34.116:6023/image/',
@ -78,8 +86,8 @@ export default new Vuex.Store({
// FILEURL: 'http://139.9.66.234:7072/image/',//三江集团
// UPLOADURL: 'http://182.90.224.147:18170/upload/image',//瑞士恒通
// FILEURL: 'http://182.90.224.147:18170/image/',//瑞士恒通
UPLOADURL: 'http://121.196.214.246/api/upload/image',//金林湾新地址
FILEURL: 'http://121.196.214.246/image/',//金林湾新地址
UPLOADURL: "http://121.196.214.246/api/upload/image", //金林湾新地址
FILEURL: "http://121.196.214.246/image/", //金林湾新地址
ACCOUNTTYPE: [
"系统管理员",

4
src/views/projectAdmin/jlw/components/CountList.vue
View File

@ -23,11 +23,11 @@
<div class="list">
<div
class="list-item"
:class="item.devonline == '0' ? 'online' : 'offline'"
:class="item.devonline == '0' ? 'offline' : 'online'"
v-for="(item, i) in list"
:key="i"
>
<div class="status">{{ item.devonline == '0' ? '在线' : '离线' }}</div>
<div class="status">{{ item.devonline == '0' ? '离线' : '在线' }}</div>
<div class="label">{{ item.devName || item.deviceName }}</div>
<div class="num" v-if="type === 'waring'">
今日报警：{{ item.alarmNum }}

30
src/views/projectAdmin/jlw/digitalSite/centerTop.vue
View File

@ -2833,14 +2833,14 @@ export default {
clearInterval(this.towerInterval)
}
//环境监测
clearInterval(this.plantCapInterval)
if (this.lifterInterval) {
clearInterval(this.lifterInterval)
}
if (this.videoAlarmTimer) {
clearInterval(this.videoAlarmTimer)
}
clearInterval(this.timer1)
// clearInterval(this.plantCapInterval)
// if (this.lifterInterval) {
// clearInterval(this.lifterInterval)
// }
// if (this.videoAlarmTimer) {
// clearInterval(this.videoAlarmTimer)
// }
// clearInterval(this.timer1)
},
methods: {
// 计算点位的缩小比
@ -3058,7 +3058,7 @@ export default {
},
closeInterval() {
this.showEnvironDialog = false
clearInterval(this.plantCapInterval)
// clearInterval(this.plantCapInterval)
},
closeBoltDetails() {
this.showBoltDetails = false
@ -3591,9 +3591,9 @@ export default {
}
})
this.getRealTimeDustNoiseData()
this.realTimeDustNoiseDataTime = setInterval(() => {
this.getRealTimeDustNoiseData()
}, 5000)
// this.realTimeDustNoiseDataTime = setInterval(() => {
// this.getRealTimeDustNoiseData()
// }, 5000)
this.selectDustNoiseData()
} else {
// this.createCenterChart();
@ -3640,9 +3640,9 @@ export default {
if (res.code == 200) {
if (res.result) {
this.plantCap = res.result
this.plantCapInterval = setTimeout(() => {
this.getRealTimeDustNoiseData(deviceId)
}, 5000)
// this.plantCapInterval = setTimeout(() => {
// this.getRealTimeDustNoiseData(deviceId)
// }, 5000)
} else {
this.plantCap = {
crc: '--',

4
src/views/projectAdmin/jlw/digitalSite/index.vue
View File

@ -200,6 +200,8 @@ export default {
// 视频设备数量
selectVideoCountList(data).then((res) => {
if (res.code === 200) {
console.log('获取视频设备信息: ', res)
this.videoCountList = res.result
}
})
@ -217,6 +219,8 @@ export default {
// 获取环境监测信息
selectEnvironmentDevAlaramCountList(data).then((res) => {
if (res.code === 200) {
console.log('获取环境监测信息', res)
this.$set(this.environment, 'list', res.result.devList)
}
})

112
src/views/projectAdmin/jlw/digitalSite/leftBottom.vue
View File

@ -1,16 +1,31 @@
<template>
<Card :title="title">
<DeviceCard
:leftCount="{ value: videoCountList.onlineNum, label: '在线设备', img: 'online' }"
:rightCount="{ value: videoCountList.totalDevNum, label: '离线设备', img: 'offline' }"
:leftCount="{
value: videoCountList.onlineNum,
label: '在线设备',
img: 'online'
}"
:rightCount="{
value: videoCountList.totalDevNum,
label: '离线设备',
img: 'offline'
}"
>
<div class="list">
<div class="list-head">设备名称</div>
<div class="listBox">
<div class="list-item" :class="item.deviceState ==1 ? 'offline' : 'online'" v-for="(item,index) in videoCountList.videoList" :key="index">
<div class="label">{{item.videoName}}</div>
<div class="status">{{item.deviceState ==1 ? '在线' :'离线'}}</div>
</div>
<div
class="list-item"
:class="item.deviceState == 1 ? 'online' : 'offline'"
v-for="(item, index) in videoCountList.videoList"
:key="index"
>
<div class="label">{{ item.videoName }}</div>
<div class="status">
{{ item.deviceState == 1 ? '在线' : '离线' }}
</div>
</div>
</div>
</div>
</DeviceCard>
@ -27,15 +42,15 @@ export default {
type: String,
default: ''
},
videoCountList:{
type:Object,
default:[]
videoCountList: {
type: Object,
default: []
}
},
data() {
return {}
},
mounted(){
mounted() {
// console.log('--------------',this.videoCountList)
}
}
@ -47,7 +62,7 @@ export default {
color: #636364;
}
.list {
.list {
padding: 0 10px;
color: #fff;
.list-head {
@ -55,44 +70,49 @@ export default {
padding-left: 16px;
font-size: 12px;
}
.listBox{
height:120px;
overflow: auto;
.list-item {
margin-bottom: 6px;
padding: 0 16px;
height: 22px;
display: flex;
align-items: center;
&.online {
background-image: linear-gradient(90deg, rgba(23, 54, 74, 1), rgba(23, 54, 74, 0.2));
.listBox {
height: 120px;
overflow: auto;
.list-item {
margin-bottom: 6px;
padding: 0 16px;
height: 22px;
display: flex;
align-items: center;
&.online {
background-image: linear-gradient(
90deg,
rgba(23, 54, 74, 1),
rgba(23, 54, 74, 0.2)
);
.status {
background-color: #3cabfd;
}
}
&.offline {
background-image: linear-gradient(
90deg,
rgba(67, 42, 63, 1),
rgba(67, 42, 63, 0.2)
);
.status {
background-color: #ff6c7f;
}
}
.status {
background-color: #3cabfd;
margin-right: 6px;
width: 36px;
height: 16px;
line-height: 16px;
text-align: center;
font-size: 12px;
border-radius: 9px;
}
.label {
margin-right: auto;
font-size: 14px;
}
}
&.offline {
background-image: linear-gradient(90deg, rgba(67, 42, 63, 1), rgba(67, 42, 63, 0.2));
.status {
background-color: #ff6c7f;
}
}
.status {
margin-right: 6px;
width: 36px;
height: 16px;
line-height: 16px;
text-align: center;
font-size: 12px;
border-radius: 9px;
}
.label {
margin-right: auto;
font-size: 14px;
}
}
}
}
</style>

24
src/views/projectAdmin/jlw/digitalSite/rightTop.vue
View File

@ -1,8 +1,16 @@
<template>
<Card :title="title">
<DeviceCard
:leftCount="{ value: offlineNum, label: '在线设备', img: 'online' }"
:rightCount="{ value: onlineNum, label: '离线设备', img: 'warring2' }"
:leftCount="{
value: ufaceList.totalDevOnlineNum,
label: '在线设备',
img: 'online'
}"
:rightCount="{
value: ufaceList.totalDevNum - ufaceList.totalDevOnlineNum,
label: '离线设备',
img: 'warring2'
}"
>
<div class="list">
<div class="list-head">
@ -13,7 +21,7 @@
<div class="listBox">
<div
class="list-item"
:class="item.deviceState == 1 ? 'offline' : 'online'"
:class="item.deviceState == 1 ? 'online' : 'offline'"
v-for="(item, index) in ufaceList.devList"
:key="index"
>
@ -21,8 +29,10 @@
{{ item.deviceState == 1 ? '在线' : '离线' }}
</div>
<div class="label">{{ item.devName }}</div>
<div class="enter">{{ item.isEnter }}</div>
<div class="outer">{{ item.outTotalNum }}</div>
<div class="enter">{{ item.inTotalNum }}</div>
<div class="outer" style="margin-right: 20px">
{{ item.outTotalNum }}
</div>
</div>
</div>
</div>
@ -95,7 +105,7 @@ export default {
margin-right: auto;
}
.enter {
width: 70px;
width: 120px;
}
.outer {
width: 70px;
@ -145,7 +155,7 @@ export default {
font-size: 14px;
}
.enter {
width: 70px;
width: 80px;
}
.outer {
width: 70px;

165
src/views/projectAdmin/jlw/envirManage/rightCenter.vue
View File

@ -3,16 +3,67 @@
<Card :title="title">
<div class="contentBox">
<div class="myChart" ref="myChart" />
<!-- <vue-scorll style="height: 100px"> -->
<div class="count">
<div class="count-item">
<!-- <div class="count-item">
<div class="label">扬尘噪声报警</div>
<div class="num">{{ alarmData.noiseNum }}</div>
</div>
<div class="count-item">
</div> -->
<!-- <div class="count-item">
<div class="label">PM2.5超标报警</div>
<div class="num">{{ alarmData.pm25Num }}</div>
</div> -->
<div class="left">
<div class="count-item">
<span class="color1"></span>
<div class="label">pm2.5 ug/m3</div>
<div class="num">{{ alarmData.pm25Num }}</div>
</div>
<div class="count-item">
<span class="color2"></span>
<div class="label">pm10 ug/m3</div>
<div class="num">{{ alarmData.pm10Num }}</div>
</div>
<div class="count-item">
<span class="color3"></span>
<div class="label">噪音 dB</div>
<div class="num">{{ alarmData.noiseNum }}</div>
</div>
<!-- <div class="count-item">
<div class="label">夜晚噪音 db</div>
<div class="num">4</div>
</div> -->
<div class="count-item">
<span class="color4"></span>
<div class="label">风速 m/s</div>
<div class="num">{{ alarmData.windspeedNum }}</div>
</div>
</div>
<div class="right">
<div class="count-item">
<span class="color5"></span>
<div class="label">TSP ug/m3</div>
<div class="num">{{ alarmData.tspNum }}</div>
</div>
<div class="count-item">
<span class="color6"></span>
<div class="label">温度 ℃</div>
<div class="num">{{ alarmData.temperatureNum }}</div>
</div>
<div class="count-item">
<span class="color7"></span>
<div class="label">湿度 %RH</div>
<div class="num">{{ alarmData.humidityNum }}</div>
</div>
</div>
</div>
<!-- </vue-scorll> -->
</div>
</Card>
</template>
@ -33,9 +84,14 @@ export default {
data() {
return {
alarmData: {
totalAlarm: '',
noiseNum: '',
pm25Num: ''
totalAlarm: '', //报警数量
noiseNum: '', //扬尘噪声报警
pm25Num: '', //PM2.5超标报警
pm10Num: 0, //PM10
temperatureNum: 0, //温度
tspNum: 0, //tsp
windspeedNum: 0, //风速
humidityNum: 0 //湿度
}
}
},
@ -46,9 +102,9 @@ export default {
countTotal() {
selectEnvironmentAlarmCountTotalApi({
sn: this.$store.state.projectSn
}).then(res => {
}).then((res) => {
this.alarmData = res.result
console.log('报警统计',res.result);
console.log('报警统计', res.result)
this.initMyChart()
})
},
@ -90,7 +146,24 @@ export default {
// fontSize: 16,
// }
// },
color: ['#ff6c7f', '#567cf6'],
// color: [
// '#ff6c7f',
// '#567cf6',
// '#35d17e',
// '#e54948',
// '#49ddb2',
// '#f08456',
// '#3cabfd'
// ],
color: [
'#3cabfd',
'#f08456',
'#49ddb2',
'#e54948',
'#35d17e',
'#567cf6',
'#ff6c7f'
],
series: [
{
type: 'pie',
@ -119,8 +192,13 @@ export default {
show: false
},
data: [
{ value: this.alarmData.noiseNum, name: `扬尘噪声报警` },
{ value: this.alarmData.pm25Num, name: `PM2.5超标报警` }
{ value: this.alarmData.humidityNum, name: `湿度 %RH` },
{ value: this.alarmData.temperatureNum, name: `温度 ℃` },
{ value: this.alarmData.tspNum, name: `TSP ug/m3` },
{ value: this.alarmData.windspeedNum, name: `风速 m/s` },
{ value: this.alarmData.noiseNum, name: `噪音 db` },
{ value: this.alarmData.pm10Num, name: `pm10 ug/m3` },
{ value: this.alarmData.pm25Num, name: `pm2.5 ug/m3` }
]
}
]
@ -148,13 +226,45 @@ export default {
flex: 1;
height: 100%;
display: flex;
box-sizing: border-box;
padding-left: 10%;
flex-direction: column;
justify-content: center;
align-items: flex-start;
// box-sizing: border-box;
// padding-left: 10%;
// flex-direction: column;
// justify-content: center;
// align-items: flex-start;
.count-item {
position: relative;
margin-bottom: 5px;
span {
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
top: 6px;
left: -18px;
position: absolute;
}
.color1 {
background-color: #ff6c7f;
}
.color2 {
background-color: #567cf6;
}
.color3 {
background-color: #35d17e;
}
.color4 {
background-color: #e54948;
}
.color5 {
background-color: #49ddb2;
}
.color6 {
background-color: #f08456;
}
.color7 {
background-color: #3cabfd;
}
&::before {
position: absolute;
left: -16px;
@ -164,17 +274,18 @@ export default {
height: 10px;
border-radius: 50%;
}
&:first-child {
margin-bottom: 20px;
}
&:first-child::before {
background-color: #ff768b;
transform: translateY(-6px);
}
&:last-child::before {
background-color: #3cabfd;
transform: translateY(-6px);
}
// &:first-child {
// margin-bottom: 20px;
// }
// &:first-child::before {
// background-color: #ff768b;
// transform: translateY(-6px);
// }
// &:last-child::before {
// background-color: #3cabfd;
// transform: translateY(-6px);
// }
.label {
margin-bottom: 8px;
font-size: 14px;

3
src/views/projectAdmin/jlw/jChart/pie/JNestedRingChart.vue
View File

@ -122,6 +122,9 @@ export default {
watch: {
series() {
this.createChart()
},
title() {
this.createChart()
}
}
}

37
src/views/projectAdmin/jlw/safeManage/leftCenter.vue
View File

@ -25,9 +25,7 @@ export default {
data() {
return {
totals: {
total: 0,
num: 0,
inspectTypeName: ''
total: 0
},
series: [
{
@ -35,19 +33,13 @@ export default {
startAngle: 90,
radius: ['58%', '54%'],
color: ['#0B1B35', '#244D8F'],
data: [30, 40, 30, 40],
data: [],
hoverAnimation: false
},
{
color: ['#3cabfd', '#58ec72', '#f43a8d', '#f294c6', '#6ee4f0'],
startAngle: 90,
data: [
{ value: 45, name: '文明施工' },
{ value: 5, name: '未分类' },
{ value: 15, name: '安全管理' },
{ value: 10, name: '施工安全' },
{ value: 45, name: '基础工程' }
],
data: [],
hoverAnimation: false
}
]
@ -56,7 +48,7 @@ export default {
mounted() {},
created() {
this.getData()
this.totals.total = JSON.parse(localStorage.getItem('safeTotal'))
// this.totals.total = JSON.parse(localStorage.getItem('safeTotal'))
},
methods: {
getData() {
@ -65,22 +57,17 @@ export default {
projectSn: this.$store.state.projectSn
}).then((res) => {
console.log('问题占比数据', res)
if (res.result.length >= 1) {
that.totals.total = res.result[0].total
}
res.result.forEach((element) => {
that.totals.total = element.total
// that.totals.num = element.num
// that.totals.inspectTypeName = element.inspectTypeName
// that.totals.total = element.total
localStorage.setItem('safeTotal', element.total)
// console.log('bbb', that.series[1].data)
// that.series[index].data = [
// { value: element.num, name: element.inspectTypeName }
// // { value: 1, name: '安全生产' }
// ]
this.series[1].data = [
{
value: element.num,
name: element.inspectTypeName
}
]
that.series[1].data.push({
value: element.num,
name: element.inspectTypeName
})
})
})
}