From 324eed59a668758755219d5cd4e68463a9cc427d Mon Sep 17 00:00:00 2001 From: Admin <978517621@qq.com> Date: 星期三, 14 九月 2022 15:22:36 +0800 Subject: [PATCH] Default Changelist --- src/views/riskWarningSys/warningBigScreen/index.vue | 298 ++++++----------------------------------------------------- 1 files changed, 32 insertions(+), 266 deletions(-) diff --git a/src/views/riskWarningSys/warningBigScreen/index.vue b/src/views/riskWarningSys/warningBigScreen/index.vue index b8cd4d4..d8744f2 100644 --- a/src/views/riskWarningSys/warningBigScreen/index.vue +++ b/src/views/riskWarningSys/warningBigScreen/index.vue @@ -50,51 +50,29 @@ </div> <div class="chart-box"> <span class="train-tip">距上次演练结束 5 天</span> - <training :size="1"></training> + <training class="train-chart" :size="1"></training> </div> </div> <div class="left-bottom"> <dv-border-box-13 :backgroundColor="boxBg" :color="boxColor" class="box-bg"></dv-border-box-13> <div class="part-tit"> <span>| 隐患等级数量分布</span> - <div> - <el-select class="selector" v-model="month" placeholder="Select" :teleported="false" size="default"> - <el-option - v-for="item in optionList" - :key="item.value" - :label="item.label" - :value="item.value" - /> - </el-select> -<!-- <img @click="jumpPage(3)" src="../../../assets/warningScreen/small-full.png">--> - <Switch style="width: 1.2rem;height: 1.2rem;cursor: pointer" @click="jumpPage(3)"/> - </div> - + <Switch style="width: 1.2rem;height: 1.2rem;cursor: pointer" @click="jumpPage(3)"/> </div> <div class="chart-box"> - <risk :size="1" :month="month"></risk> + <risk :size="1" :theme="screenTheme.isDark"></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: 12%;padding: 0 4%"> - <el-cascader - class="spiSe" - :teleported="false" - v-model="spiValue" - :options="spiOptions" - :props="props" - :show-all-levels="false" - @change="handleChange" - /> -<!-- <span>SPI数据分析</span>--> -<!-- <img @click="jumpPage(4)" src="../../../assets/warningScreen/small-full.png">--> + <div class="part-tit" style="position: absolute;top: 8%;padding: 0 4%"> + <div></div> <Switch style="width: 1.2rem;height: 1.2rem;cursor: pointer" @click="jumpPage(4)"/> </div> - <div class="chart-box"> - <spi :size="1"></spi> + <div class="chart-box" style="top: 60px;height: calc(100% - 70px)"> + <spi :size="1" :theme="screenTheme.isDark"></spi> </div> </div> <div class="mid-bottom"> @@ -191,9 +169,7 @@ boxBigColor: Array<string>; isScreenfull: boolean; currentTime: string; - month: number; spiValue: number; - optionList: Array<any>; spiOptions: Array<any> } export default defineComponent({ @@ -224,54 +200,7 @@ boxBigColor: [], isScreenfull: false, currentTime: '', - month: 0, spiValue: 0, - optionList: [ - { - label: '年度', - value: 0 - }, - { - label: '一月', - value: 1 - }, - { - label: '二月', - value: 2 - }, - { - label: '三月', - value: 3 - }, - { - label: '四月', - value: 4 - }, - { - label: '五月', - value: 5 - }, - { - label: '六月', - value: 6 - }, - { - label: '七月', - value: 7 - }, - { - label: '八月', - value: 8 - }, - { - label: '九月', - value: 9 - }, - { - label: '十月', - value: 10 - } - ], spiOptions: [ { value: 0, @@ -555,94 +484,11 @@ justify-content: space-between; align-items: center; z-index: 9999; - div{ - width: 40%; - display: flex; - align-items: center; - justify-content: end; - } + span{ font-size: 1.25rem; font-weight: bolder; color: #11feee; - } - ::v-deep(.el-cascader){ - width: 25% !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; - } - } - .selector{ - width: calc(100% - 1.25rem); - margin-right: 0.8rem; - - ::v-deep(.el-popper){ - background-color: rgba(10,31,92,1); - border: 1px solid rgba(17,254,238,.4); - color: #11FEEE; - .el-select-dropdown__item{ - color: #11FEEE; - } - .el-select-dropdown__item.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){ - box-shadow: none; - border: 1px solid rgba(17,254,238,.2); - background: rgba(10,31,92,.6) !important; - height: 1.5rem; - color: #11FEEE; - - input{ - font-size: 0.8rem; - color: #11FEEE; - } - .el-icon{ - color: #11FEEE; - } - } } img{ @@ -652,24 +498,26 @@ } } .chart-box{ + position: absolute; + top: 40px; + bottom: 0; + left: 0; + right: 0; width: 100%; - height: calc(100% - 20px); - margin-top: 20px; + height: calc(100% - 50px); + z-index: 99999; .train-tip{ display: block; font-size: 0.8rem; - margin-top: 5%; - margin-left: 2%; + margin-top: 2%; + margin-left: 5%; color: #fff; - } - accident{ - width: 100%; - height: 100%; + height: 1rem; } - training{ + .train-chart{ width: 100%; - height: 100%; + height: calc(100% - 1rem); } } } @@ -855,94 +703,10 @@ justify-content: space-between; align-items: center; z-index: 9999; - div{ - width: 40%; - display: flex; - align-items: center; - justify-content: end; - } span{ font-size: 1.25rem; font-weight: bolder; color: #000; - } - ::v-deep(.el-cascader){ - width: 25% !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; - } - } - .selector{ - width: calc(100% - 1.25rem); - margin-right: 0.8rem; - - ::v-deep(.el-popper){ - background-color: rgba(255,255,255,1); - border: 1px solid #ccc; - color: #fff; - .el-select-dropdown__item{ - color: #000; - } - .el-select-dropdown__item.hover{ - background: #ccc; - } - } - ::v-deep(.el-popper__arrow){ - &::before{ - background-color: rgba(255,255,255,.6) !important; - border: 1px solid #ccc; - } - } - ::v-deep(.el-input__wrapper){ - box-shadow: none; - border: 1px solid #ccc; - background: #fff !important; - height: 1.5rem; - color: #fff; - - input{ - font-size: 0.8rem; - color: #000; - } - .el-icon{ - color: #000; - } - } } img{ @@ -952,24 +716,26 @@ } } .chart-box{ + position: absolute; + top: 40px; + bottom: 0; + left: 0; + right: 0; width: 100%; - height: calc(100% - 20px); - margin-top: 20px; + height: calc(100% - 50px); + z-index: 99999; .train-tip{ display: block; font-size: 0.8rem; - margin-top: 5%; - margin-left: 2%; + margin-top: 2%; + margin-left: 5%; color: #333; - } - accident{ - width: 100%; - height: 100%; + height: 1rem; } - training{ + .train-chart{ width: 100%; - height: 100%; + height: calc(100% - 1rem); } } } -- Gitblit v1.9.2