zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

智能管理表头

This commit is contained in:
shijing 2024-02-28 16:02:08 +08:00
parent beac9f3733
commit 6ca6565791
5 changed files with 339 additions and 328 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/views/bigScreen/enpComponents/smarg_trans.vue
View File

@ -1,6 +1,6 @@
<template>
<el-container>
<el-header>
<el-header class="searchWrap">
<div class="left-panel">
<el-select v-model="query.mgroup" placeholder="工段 " @change="handleQuery" clearable>
<el-option v-for="item in mgroupOptions" :key="item" :label="item.name" :value="item.id"></el-option>
@ -105,7 +105,8 @@ export default {
font-size: 14px;
font-weight: 400;
margin-right: 10px;
display: flex
display: flex;
align-items: center;
}
.radio {

2
src/views/bigScreen/enpComponents/smartg.vue
View File

@ -1,6 +1,6 @@
<template>
<el-container>
<el-header>
<el-header class="panel_title">
<el-menu mode="horizontal" :default-active="activeIndex" :ellipsis="false" @select="handleSelect">
<el-menu-item index="1">厂区环境治理</el-menu-item>
<el-menu-item index="2">生产过程治理</el-menu-item>

8
src/views/bigScreen/enpComponents/smartg_carwash.vue
View File

@ -1,8 +1,8 @@
<template>
<el-container>
<el-aside width="70%">
<el-aside width="69%" style="margin-right:1%;border-right:0">
<el-container>
<el-header>
<el-header class="searchWrap">
<div class="left-panel">
<div class="left-panel">洗车行为统计</div>
</div>
@ -30,12 +30,12 @@
</el-aside>
<el-main class="nopadding">
<el-container>
<el-header>
<el-header class="searchWrap">
<div class="left-panel">环卫车智能调度</div>
</el-header>
<el-main class="nopadding">
<el-container>
<el-header>
<el-header class="">
<div class="left-panel">
<span>厂区环境(PM10):</span>
<span style="color: green"> 36ug/m3</span>

5
src/views/bigScreen/enpComponents/smartg_prod.vue
View File

@ -1,6 +1,6 @@
<template>
<el-container>
<el-header>
<el-header class="searchWrap">
<div class="left-panel">
<el-select v-model="query.mgroup" placeholder="工段 " @change="handleQuery" clearable>
<el-option v-for="item in mgroupOptions" :key="item" :label="item.name" :value="item.id"></el-option>
@ -105,7 +105,8 @@ export default {
font-size: 14px;
font-weight: 400;
margin-right: 10px;
display: flex
display: flex;
align-items: center;
}
.radio {

99
src/views/bigScreen/index_enp_blue.vue
View File

@ -1,16 +1,16 @@
<template>
<div class="dashboard">
<header>
<div class="dashboard" style="height:100%">
<el-container style="height:100%">
<el-header style="height:8vh">
<div class="headerImg">
<img src="img/enp_blue/header_enp.png" style="width:100%;">
<div class="sysName">
水泥有限公司</div>
<img src="img/enp_blue/header_enp.png" style="width:100%;height:100%">
<div class="sysName">{{ this.$TOOL.data.get("BASE_INFO").base.base_name }}</div>
</div>
<div class="login_config" style="z-index:1000;position: absolute;right: 1vw;bottom: 0;">
<!-- <div class="login_config" style="z-index:1000;position: absolute;right: 1vw;bottom: 0;">
<el-button :icon="config.dark ? 'el-icon-sunny' : 'el-icon-moon'" circle type="info"
@click="configDark"></el-button>
</div>
</div> -->
<div style="position: absolute;top:0.7vh;height:6vh">
<div style="display: flex;padding-top: 1vh;margin-left: 1vw;">
<div :class="bindClass(0)" @click="menuClick(0)">
@ -107,19 +107,19 @@
<div class="user_icon" @click="backSystem"></div>
</div>
</div>
</header>
<el-main style="padding:0;overflow: hidden;">
</el-header>
<el-main style="padding:0;">
<div v-show="activeIndex == 0" class="model" style="">
<div id="loadingScreen">
<!-- <div id="loadingScreen">
<el-progress type="circle" :percentage="loadedPercent" :width=220 status="warning">
<template #default="{ percentage }">
<div style="font-size: 30px; color: white; font-weight: bold">{{ percentage }}%</div>
<div style="font-size: 18px; color: white; margin-top: 10px">工厂模型加载中</div>
</template>
</el-progress>
</div>
</div> -->
<Cesium />
<canvas id="renderCanvas"></canvas>
<!-- <canvas id="renderCanvas"></canvas> -->
</div>
<!-- 左侧列表数据 -->
<div v-show="activeIndex == 0" class="left_other animate__animated animate__backInLeft">
@ -139,7 +139,7 @@
<div class="pieDataNumber">{{ wryData.count }}</div>
</div>
<div class="pieDataItem">
<div class="pieDataText">生产工艺过程</div>
<div class="pieDataText">生产工艺</div>
<div class="pieDataNumber">{{ wryData.count_mtrans }}</div>
</div>
<div class="pieDataItem">
@ -160,7 +160,7 @@
<img class="blockTitleImg" src="img/enp_blue/block_title.png">
</div>
<div style="display: flex;padding: 1vh 1vw;">
<div style="width: 50%;">
<div style="width: 50%;height:100%">
<div class="eqItem">
<img class="eqImg" src="img/enp_blue/eq_s.svg">
<div class="eqText">
@ -176,7 +176,7 @@
</div>
</div>
</div>
<div style="width: 50%;">
<div style="width: 50%;height:100%">
<div class="eqItem">
<img class="eqImg " src="img/enp_blue/eq_z.svg">
<div class="eqText">
@ -300,14 +300,14 @@
</div>
</div>
</div>
<div v-show="activeIndex == 0" class="left_border"></div>
<div v-show="activeIndex == 0" class="right_border"></div>
<!-- <div v-show="activeIndex == 0" class="left_border"></div> -->
<!-- <div v-show="activeIndex == 0" class="right_border"></div> -->
<div v-show="activeIndex == 0" class="btns_enp">
<div class="btns" :class="bindBtnClass(0)">生产设备</div>
<div class="btns" :class="bindBtnClass(1)">治理设备</div>
<div class="btns" :class="bindBtnClass(2)">监测设备</div>
<div class="btns" :class="bindBtnClass(3)">监控设备</div>
<div class="btns" :class="bindBtnClass(4)">环境监测</div>
<!-- <div class="btns" :class="bindBtnClass(4)">环境监测</div> -->
</div>
<div v-show="activeIndex == 0" class="bottom_enp"></div>
<div v-if="activeIndex != 0" class="container">
@ -335,6 +335,8 @@
</el-drawer>
</div>
</el-main>
</el-container>
</div>
</template>
<script>
@ -495,20 +497,24 @@ export default {
],
}
},
watch: {
'config.dark'(val) {
if (val) {
// watch: {
// 'config.dark'(val) {
// if (val) {
// document.documentElement.classList.add("dark")
// this.$TOOL.data.set("APP_DARK", val)
// } else {
// document.documentElement.classList.remove("dark")
// this.$TOOL.data.remove("APP_DARK")
// }
// },
// 'config.lang'(val) {
// this.$i18n.locale = val
// this.$TOOL.data.set("APP_LANG", val)
// }
// },
created() {
document.documentElement.classList.add("dark")
this.$TOOL.data.set("APP_DARK", val)
} else {
document.documentElement.classList.remove("dark")
this.$TOOL.data.remove("APP_DARK")
}
},
'config.lang'(val) {
this.$i18n.locale = val
this.$TOOL.data.set("APP_LANG", val)
}
this.$TOOL.data.set("APP_DARK", true)
},
mounted() {
let that = this;
@ -651,8 +657,8 @@ export default {
left_other.style.width = '100%';
right_other.style.position = 'static';
right_other.style.width = '100%';
model.style.position = 'relative';
model.style.height = chartHeight;
// model.style.position = 'relative';
// model.style.height = chartHeight;
var charts = document.getElementsByClassName('chart')
for (var i = 0; i < charts.length; i++) {
var chart = charts[i]
@ -1155,6 +1161,8 @@ export default {
},
unmounted() {
this.close();
document.documentElement.classList.remove("dark");
this.$TOOL.data.remove("APP_DARK")
},
}
</script>
@ -1189,8 +1197,8 @@ header {
.headerImg {
width: 100%;
height: 6.7vh;
line-height: 6.3vh;
height: 6.6vh;
line-height: 6.5vh;
color: #ffffff;
font-size: 1.8vw;
text-align: center;
@ -1310,6 +1318,7 @@ header {
top: 8%;
left: 0;
width: 100%;
height: 100%;
background-image: url('/public/img/enp_blue/bg_enp.png');
background-size: cover;
}
@ -1393,7 +1402,6 @@ header {
.eqItem {
display: flex;
/* height: 9vh; */
flex-direction: row;
justify-content: space-between;
flex-wrap: nowrap;
@ -1414,10 +1422,10 @@ header {
.eqText {
flex: 1;
height: 8vh;
height: 9vh;
font-size: 1.4vh;
padding-left: 0.5vw;
margin-bottom: 1vh;
margin: 0.5vh 0;
background: url('/public/img/enp_blue/eq_border2.svg') no-repeat;
background-size: 100% 100%;
background-size: contain;
@ -1441,7 +1449,7 @@ header {
.eqNumWrap {
font-size: 1.2vh;
line-height: 2.5vh;
line-height: 3.5vh;
}
.eqNum {
@ -1462,24 +1470,25 @@ header {
.pieDataItem {
width: 50%;
height: 35%;
height: 49%;
position: relative;
display: inline-block;
margin-top: 10%;
padding-left: 0.5vw;
/* border-left: 1px solid #0070FF; */
}
.pieDataText {
height: 2vh;
line-height: 1.9vh;
font-size: 1.1vh;
font-size: 1.5vh;
color: #ffffff;
padding-left: 0.2vw;
}
.pieDataItem:nth-of-type(1) {
.pieDataText {
border-left: 0.3vh solid #0091ff;
border-left: 0.5vh solid #0091ff;
}
.pieDataNumber {
@ -1489,7 +1498,7 @@ header {
.pieDataItem:nth-of-type(2) {
.pieDataText {
border-left: 0.3vh solid #0Ed877;
border-left: 0.5vh solid #0Ed877;
}
.pieDataNumber {
@ -1499,7 +1508,7 @@ header {
.pieDataItem:nth-of-type(3) {
.pieDataText {
border-left: 0.3vh solid #ffbf60;
border-left: 0.5vh solid #ffbf60;
}
.pieDataNumber {
@ -1509,7 +1518,7 @@ header {
.pieDataItem:nth-of-type(4) {
.pieDataText {
border-left: 0.3vh solid #67dbff;
border-left: 0.5vh solid #67dbff;
}
.pieDataNumber {