From e5e9b84b800f1623f85be45a3565689917898c78 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期五, 10 三月 2023 18:12:12 +0800
Subject: [PATCH] Default Changelist
---
src/views/riskWarningSys/warningBigScreen/index.vue | 234 +++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 165 insertions(+), 69 deletions(-)
diff --git a/src/views/riskWarningSys/warningBigScreen/index.vue b/src/views/riskWarningSys/warningBigScreen/index.vue
index 25941cb..53f4a47 100644
--- a/src/views/riskWarningSys/warningBigScreen/index.vue
+++ b/src/views/riskWarningSys/warningBigScreen/index.vue
@@ -69,8 +69,7 @@
<Switch style="width: 1.2rem;height: 1.2rem;cursor: pointer" @click="jumpPage(2)"/>
</div>
<div class="chart-box">
- <span class="train-tip">距上次演练结束 5 天</span>
- <training class="train-chart" :size="1"></training>
+ <training :size="1" :theme="screenTheme.isDark"></training>
</div>
</div>
<div class="left-bottom">
@@ -80,15 +79,25 @@
<Switch style="width: 1.2rem;height: 1.2rem;cursor: pointer" @click="jumpPage(3)"/>
</div>
<div class="chart-box">
- <risk :size="1" :theme="screenTheme.isDark"></risk>
+ <risk :size="1" :theme="screenTheme.isDark" :dep="departList"></risk>
</div>
</div>
</div>
<div class="main-middle">
<div class="mid-top">
<dv-border-box-11 title="SPI数据分析" :backgroundColor="boxBg" :color="boxBigColor" class="box-bg"></dv-border-box-11>
- <div class="part-tit" style="position: absolute;top: 8%;padding: 0 4%">
- <div></div>
+ <div class="part-tit" style="position: absolute;top: 10%;padding: 0 4%;align-items: flex-start;z-index: 10001">
+ <div class="spiChart">
+ <el-cascader
+ class="spiSe"
+ :teleported="false"
+ v-model="depValue"
+ :options="departList"
+ :props="depProps"
+ :show-all-levels="false"
+ @change="depChange"
+ />
+ </div>
<Switch style="width: 1.2rem;height: 1.2rem;cursor: pointer" @click="jumpPage(4)"/>
</div>
<div class="chart-box" style="top: 60px;height: calc(100% - 70px)">
@@ -171,7 +180,17 @@
<script lang="ts">
import screenfull from 'screenfull';
- import { toRefs, reactive, ref, onMounted, defineComponent, defineAsyncComponent, nextTick, onUnmounted } from 'vue';
+ import {
+ toRefs,
+ reactive,
+ ref,
+ onMounted,
+ defineComponent,
+ defineAsyncComponent,
+ nextTick,
+ onUnmounted,
+ onBeforeUnmount
+ } from 'vue';
import { ElTable } from 'element-plus';
import { FormInstance, FormRules, ElMessage } from 'element-plus';
import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent/index.ts';
@@ -181,6 +200,7 @@
import '/@/theme/bigScreen.css'
import {useScreenTheme} from "/@/stores/screenTheme"
import {storeToRefs} from "pinia";
+ import {teamManageApi} from "/@/api/systemManage/basicDateManage/personShiftManage/teamManage";
// 定义接口来定义对象的类型
interface stateType {
@@ -189,10 +209,12 @@
boxBigColor: Array<string>;
isScreenfull: boolean;
currentTime: string;
- spiValue: number;
- spiOptions: Array<any>;
+ depValue: number;
dialogShow: string;
- dialogHide: string
+ dialogHide: string;
+ depProps: object;
+ departList: Array<any>;
+ lastTrain: number | null;
}
export default defineComponent({
name: 'warningScreen',
@@ -218,67 +240,54 @@
}
const state = reactive<stateType>({
boxBg: 'rgba(8, 109, 209, 0.2)',
+ depValue: 1,
boxColor: [],
boxBigColor: [],
+ lastTrain: null,
isScreenfull: false,
currentTime: '',
- spiValue: 0,
dialogShow: 'hide',
dialogHide: 'showup',
- spiOptions: [
- {
- value: 0,
- label: '公司级别SPI'
- },
- {
- value: 1,
- label: 'A事业部SPI',
- children: [
- {
- value: 11,
- label: 'A车间SPI'
- },
- {
- value: 12,
- label: 'B车间SPI'
- },
- {
- value: 13,
- label: 'C车间SPI'
- }
- ]
- },
- {
- value: 2,
- label: 'B事业部SPI',
- children: [
- {
- value: 21,
- label: 'D车间SPI'
- },
- {
- value: 22,
- label: 'E车间SPI'
- },
- {
- value: 23,
- label: 'F车间SPI'
- }
- ]
- }
- ]
+ depProps: {
+ expandTrigger: 'hover',
+ checkStrictly: true,
+ value: 'depId',
+ label: 'depName',
+ emitPath: false
+ },
+ departList: [],
});
-
// 页面载入时执行方法
onMounted(() => {
- getTime()
+ state.depValue = screenTheme.value.depId
+ getTime();
+ getAllDepartment();
+ setInterval(()=>{
+ getTime()
+ },1000)
getTheme()
});
const getTime =()=>{
- setInterval(() => {
- state.currentTime = new Date().toLocaleString();
- }, 1000);
+ state.currentTime = new Date().toLocaleString();
+ }
+
+ // 获取部门列表
+ const getAllDepartment = async () => {
+ let res = await teamManageApi().getAllDepartment();
+ if (res.data.code === '200') {
+ state.departList = JSON.parse(JSON.stringify(res.data.data))
+ } else {
+ ElMessage({
+ type: 'warning',
+ message: res.data.msg
+ });
+ }
+ }
+
+ const depChange = (value)=>{
+ state.depValue = value
+ screenThemes.setDepId(value)
}
const changeTheme = () =>{
@@ -353,6 +362,9 @@
window.history.go(-1);
};
+ onBeforeUnmount(() =>{
+ clearInterval()
+ })
// 隐患状态列表
// const getDeviceRecord = async () => {
// const data = { pageSize: state.pageSize, pageIndex: state.pageIndex};
@@ -375,6 +387,7 @@
closeInfo,
changeTheme,
onScreenfullClick,
+ depChange,
jumpPage,
goBack,
...toRefs(state)
@@ -621,6 +634,52 @@
align-items: center;
z-index: 9999;
+ .spiChart{
+ width: 25% !important;
+
+ ::v-deep(.el-cascader){
+ width: 100% !important;
+ }
+ ::v-deep(.el-popper){
+ background-color: rgba(10,31,92,1);
+ border: 1px solid rgba(17,254,238,.4);
+ color: #11FEEE;
+ .el-cascader-node__label{
+ color: #11FEEE;
+ }
+ .el-icon{
+ color: #11FEEE;
+ }
+ .el-cascader-node{
+ &:hover{
+ background: #0049af;
+ }
+ }
+ }
+ ::v-deep(.el-popper__arrow){
+ &::before{
+ background-color: rgba(10,31,92,.6) !important;
+ border: 1px solid rgba(17,254,238,.4);
+ }
+ }
+ ::v-deep(.el-input__wrapper){
+ width: 20%;
+ box-shadow: none;
+ border: 1px solid rgba(17,254,238,.2);
+ background: rgba(10,31,92,.6) !important;
+ height: 2.5rem;
+ color: #11FEEE;
+
+ input{
+ font-size: 1.25rem;
+ color: #11FEEE;
+ }
+ .el-icon{
+ color: #11FEEE;
+ }
+ }
+ }
+
span{
font-size: 1.25rem;
font-weight: bolder;
@@ -641,7 +700,7 @@
right: 0;
width: 100%;
height: calc(100% - 50px);
- z-index: 99999;
+ z-index: 10000;
.train-tip{
display: block;
font-size: 0.8rem;
@@ -649,11 +708,6 @@
margin-left: 5%;
color: #fff;
height: 1rem;
- }
-
- .train-chart{
- width: 100%;
- height: calc(100% - 1rem);
}
}
}
@@ -931,6 +985,53 @@
justify-content: space-between;
align-items: center;
z-index: 9999;
+
+ .spiChart{
+ width: 25% !important;
+
+ ::v-deep(.el-cascader){
+ width: 100% !important;
+ }
+ ::v-deep(.el-popper){
+ background-color: #fff;
+ border: 1px solid #ccc;
+ color: #000;
+ .el-cascader-node__label{
+ color: #000;
+ }
+ .el-icon{
+ color: #000;
+ }
+ .el-cascader-node{
+ &:hover{
+ background: #ccc;
+ }
+ }
+ }
+ ::v-deep(.el-popper__arrow){
+ &::before{
+ background-color: #fff !important;
+ border: 1px solid #ccc;
+ }
+ }
+ ::v-deep(.el-input__wrapper){
+ width: 20%;
+ box-shadow: none;
+ border: 1px solid #ccc;
+ background: #fff !important;
+ height: 2.5rem;
+ color: #000;
+
+ input{
+ font-size: 1.25rem;
+ color: #000;
+ }
+ .el-icon{
+ color: #000;
+ }
+ }
+ }
+
span{
font-size: 1.25rem;
font-weight: bolder;
@@ -951,7 +1052,7 @@
right: 0;
width: 100%;
height: calc(100% - 50px);
- z-index: 99999;
+ z-index: 10000;
.train-tip{
display: block;
font-size: 0.8rem;
@@ -959,11 +1060,6 @@
margin-left: 5%;
color: #333;
height: 1rem;
- }
-
- .train-chart{
- width: 100%;
- height: calc(100% - 1rem);
}
}
}
--
Gitblit v1.9.2