修改机械分厂设备三级
This commit is contained in:
hzz
parent
71823c7879
commit
84428dba0a
@ -12,7 +12,11 @@
|
|||||||
<div>
|
<div>
|
||||||
<border6 ref="refborder6">
|
<border6 ref="refborder6">
|
||||||
<template v-slot>
|
<template v-slot>
|
||||||
<div ref="inguagu" class="box"></div>
|
<div ref="inguagu" class="box" v-show="handle == 't'"></div>
|
||||||
|
<div ref="inguagud" v-show="handle == 'f'" class="box empty">
|
||||||
|
<div class="empty-title">{{ props.title }}</div>
|
||||||
|
<el-empty :image-size="120" />
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</border6>
|
</border6>
|
||||||
</div>
|
</div>
|
||||||
@ -23,11 +27,13 @@ import { EDataPerson, EDataPersonItem } from "@/type/Mechanics";
|
|||||||
import border6 from "@/components/borderBox/border6.vue";
|
import border6 from "@/components/borderBox/border6.vue";
|
||||||
const { proxy } = getCurrentInstance() as any;
|
const { proxy } = getCurrentInstance() as any;
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
let {t} = useI18n();
|
let { t } = useI18n();
|
||||||
let props = defineProps<{
|
let props = defineProps<{
|
||||||
title: string;
|
title: string;
|
||||||
|
handle: 't' | 'f'
|
||||||
}>();
|
}>();
|
||||||
let inguagu = ref();
|
let inguagu = ref();
|
||||||
|
let inguagud = ref();
|
||||||
|
|
||||||
let refborder6 = ref();
|
let refborder6 = ref();
|
||||||
|
|
||||||
@ -90,6 +96,9 @@ function setchartWH(width: any, height: any) {
|
|||||||
inguagu.value.style.height = height + "px";
|
inguagu.value.style.height = height + "px";
|
||||||
inguagu.value.style.width = width - 30 + "px";
|
inguagu.value.style.width = width - 30 + "px";
|
||||||
|
|
||||||
|
inguagud.value.style.height = height + "px";
|
||||||
|
inguagud.value.style.width = width - 30 + "px";
|
||||||
|
|
||||||
refborder6.value.resetWH();
|
refborder6.value.resetWH();
|
||||||
if (echartsData.inguagu.box) {
|
if (echartsData.inguagu.box) {
|
||||||
echartsData.inguagu.box.resize();
|
echartsData.inguagu.box.resize();
|
||||||
@ -110,5 +119,24 @@ defineExpose({
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.empty {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.empty-title {
|
||||||
|
position: absolute;
|
||||||
|
top:10px;
|
||||||
|
left: 20px;
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: bolder;
|
||||||
|
color: white;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
@ -8,248 +8,260 @@
|
|||||||
* 版权信息 : 2023 by ${再登软件}, All Rights Reserved.
|
* 版权信息 : 2023 by ${再登软件}, All Rights Reserved.
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div :class="$style['container']">
|
<div :class="$style['container']">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<!-- <div class="title" @click="backrouter"> -->
|
<!-- <div class="title" @click="backrouter"> -->
|
||||||
<div class="title">
|
<div class="title">
|
||||||
<header2 :width="'100%'" :height="'100px'" :title="t('messages.machineryDevStatus')" :titleTip="[]" :typeFun="['comback','time']" :alarmType="['']"></header2>
|
<header2 :width="'100%'" :height="'100px'" :title="t('messages.machineryDevStatus')" :titleTip="[]"
|
||||||
</div>
|
:typeFun="['comback', 'time']" :alarmType="['']"></header2>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="content" ref="Acontent" >
|
|
||||||
<div class="left ">
|
|
||||||
<toptip ref="toptip1ref1" :type="1"> </toptip>
|
|
||||||
<toptip ref="toptip1ref2" :type="1"> </toptip>
|
|
||||||
<toptip ref="toptip1ref3" :type="1"> </toptip>
|
|
||||||
<toptip ref="toptip1ref4" :type="2"> </toptip>
|
|
||||||
<toptip ref="toptip1ref5" :type="2"> </toptip>
|
|
||||||
<toptip ref="toptip1ref6" :type="2"> </toptip>
|
|
||||||
</div>
|
|
||||||
<div class="center ">
|
|
||||||
<TopImg ref="imgRef"></TopImg>
|
|
||||||
<!-- <water1 ref="progressref1" title="MTBF" :data="0"></water1> -->
|
|
||||||
<!-- <water1 ref="progressref2" title="MTTR" :data="0"></water1> -->
|
|
||||||
<MTTF ref="MTTFref" title="MTTF"></MTTF>
|
|
||||||
</div>
|
|
||||||
<div class="right ">
|
|
||||||
<timeguagu ref="timeguaguref" :title="t('messages.TimeUtilizationRate')"></timeguagu>
|
|
||||||
<statuscontrast ref="contrastref" :title="t('messages.DevRunComparison')"></statuscontrast>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
<div class="content" ref="Acontent">
|
||||||
import { onBeforeMount, onMounted, onUnmounted, reactive, ref } from "vue";
|
<div class="left ">
|
||||||
import header2 from '@/components/headerBox/header2.vue'
|
<toptip ref="toptip1ref1" :type="1"> </toptip>
|
||||||
import toptip from './components/toptip1.vue'
|
<toptip ref="toptip1ref2" :type="1"> </toptip>
|
||||||
import timeguagu from './components/timeguagu.vue'
|
<toptip ref="toptip1ref3" :type="1"> </toptip>
|
||||||
import progress from './components/progress.vue'
|
<toptip ref="toptip1ref4" :type="2"> </toptip>
|
||||||
import water1 from './components/water.vue'
|
<toptip ref="toptip1ref5" :type="2"> </toptip>
|
||||||
import TopImg from './components/imageTop.vue'
|
<toptip ref="toptip1ref6" :type="2"> </toptip>
|
||||||
import MTTF from './components/MTTF.vue'
|
</div>
|
||||||
import {imgurlAddXhr} from '@/utils/devSever'
|
<div class="center ">
|
||||||
import statuscontrast from './components/contrast.vue'
|
<TopImg ref="imgRef"></TopImg>
|
||||||
import {calcWH} from '@/components/ts/selfAdaption'
|
<!-- <water1 ref="progressref1" title="MTBF" :data="0"></water1> -->
|
||||||
import { gatdeviceStatusInfoMF } from "@/http/Mechanics";
|
<!-- <water1 ref="progressref2" title="MTTR" :data="0"></water1> -->
|
||||||
import { useRoute,useRouter } from "vue-router";
|
<MTTF ref="MTTFref" title="MTTF"></MTTF>
|
||||||
import {useMechanicsStore} from "@/store/module/Mechanics"
|
</div>
|
||||||
|
<div class="right ">
|
||||||
|
<timeguagu ref="timeguaguref" :title="t('messages.TimeUtilizationRate')" :handle="handle"></timeguagu>
|
||||||
|
<statuscontrast ref="contrastref" :title="t('messages.DevRunComparison')"></statuscontrast>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { onBeforeMount, onMounted, onUnmounted, reactive, ref } from "vue";
|
||||||
|
import header2 from '@/components/headerBox/header2.vue'
|
||||||
|
import toptip from './components/toptip1.vue'
|
||||||
|
import timeguagu from './components/timeguagu.vue'
|
||||||
|
import progress from './components/progress.vue'
|
||||||
|
import water1 from './components/water.vue'
|
||||||
|
import TopImg from './components/imageTop.vue'
|
||||||
|
import MTTF from './components/MTTF.vue'
|
||||||
|
import { imgurlAddXhr } from '@/utils/devSever'
|
||||||
|
import statuscontrast from './components/contrast.vue'
|
||||||
|
import { calcWH } from '@/components/ts/selfAdaption'
|
||||||
|
import { gatdeviceStatusInfoMF } from "@/http/Mechanics";
|
||||||
|
import { useRoute, useRouter } from "vue-router";
|
||||||
|
import { useMechanicsStore } from "@/store/module/Mechanics"
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
let {t} = useI18n();
|
let { t } = useI18n();
|
||||||
const store = useMechanicsStore()
|
const store = useMechanicsStore()
|
||||||
const route=useRoute()
|
const route = useRoute()
|
||||||
const router=useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
let Acontent=ref()
|
let Acontent = ref()
|
||||||
let time=ref(null)
|
let time = ref(null)
|
||||||
let toptip1ref1=ref()
|
let toptip1ref1 = ref()
|
||||||
let toptip1ref2=ref()
|
let toptip1ref2 = ref()
|
||||||
let toptip1ref3=ref()
|
let toptip1ref3 = ref()
|
||||||
let toptip1ref4=ref()
|
let toptip1ref4 = ref()
|
||||||
let toptip1ref5=ref()
|
let toptip1ref5 = ref()
|
||||||
let toptip1ref6=ref()
|
let toptip1ref6 = ref()
|
||||||
let imgRef = ref()
|
let imgRef = ref()
|
||||||
let timeguaguref=ref()
|
let timeguaguref = ref()
|
||||||
// let progressref1=ref()
|
// let progressref1=ref()
|
||||||
// let progressref2=ref()
|
// let progressref2=ref()
|
||||||
let MTTFref=ref()
|
let MTTFref = ref()
|
||||||
let contrastref=ref()
|
let contrastref = ref()
|
||||||
// let {timeHtml}=useNowTime()
|
// let {timeHtml}=useNowTime()
|
||||||
// let arr=reactive(null)
|
// let arr=reactive(null)
|
||||||
let size=reactive({
|
let size = reactive({
|
||||||
oWidth:0,
|
oWidth: 0,
|
||||||
oHeight:0
|
oHeight: 0
|
||||||
});
|
});
|
||||||
function WH(div:HTMLElement){
|
type handleType = 't' | 'f'
|
||||||
let a=calcWH(div.offsetHeight,div.offsetWidth,24,24,0)
|
const handle = ref<handleType>('t');
|
||||||
size.oWidth=a.oWidth
|
function WH(div: HTMLElement) {
|
||||||
size.oHeight=a.oHeight
|
let a = calcWH(div.offsetHeight, div.offsetWidth, 24, 24, 0)
|
||||||
toptip1(a.oWidth*4-50,a.oHeight*8-50)
|
size.oWidth = a.oWidth
|
||||||
|
size.oHeight = a.oHeight
|
||||||
|
toptip1(a.oWidth * 4 - 50, a.oHeight * 8 - 50)
|
||||||
// toptip2(a.oWidth*3,a.oHeight*2)
|
// toptip2(a.oWidth*3,a.oHeight*2)
|
||||||
guagebox(a.oWidth*8-50,a.oHeight*12-50)
|
guagebox(a.oWidth * 8 - 50, a.oHeight * 12 - 50)
|
||||||
contrasttbox(a.oWidth*8-50,a.oHeight*12-50)
|
contrasttbox(a.oWidth * 8 - 50, a.oHeight * 12 - 50)
|
||||||
}
|
|
||||||
function toptip1(width:any,height:any){
|
|
||||||
if(!toptip1ref1.value&&!toptip1ref2.value) return
|
|
||||||
if(!toptip1ref3.value&&!toptip1ref4.value&&!toptip1ref5.value&&!toptip1ref6.value) return
|
|
||||||
toptip1ref1.value.setchartWH(width,height)
|
|
||||||
toptip1ref2.value.setchartWH(width,height)
|
|
||||||
toptip1ref3.value.setchartWH(width,height)
|
|
||||||
toptip1ref4.value.setchartWH(width,height)
|
|
||||||
toptip1ref5.value.setchartWH(width,height)
|
|
||||||
toptip1ref6.value.setchartWH(width,height)
|
|
||||||
}
|
|
||||||
function guagebox(width:any,height:any){
|
|
||||||
if(!MTTFref.value&&!imgRef.value) return
|
|
||||||
imgRef.value.setchartWH(width,height)
|
|
||||||
// progressref1.value.setchartWH(width,height)
|
|
||||||
// progressref2.value.setchartWH(width,height)
|
|
||||||
MTTFref.value.setchartWH(width,height)
|
|
||||||
}
|
|
||||||
function contrasttbox(width:any,height:any){
|
|
||||||
if(!contrastref.value&&!timeguaguref.value) return
|
|
||||||
timeguaguref.value.setchartWH(width,height)
|
|
||||||
contrastref.value.setchartWH(width,height)
|
|
||||||
}
|
|
||||||
async function gatdeviceStatusInfoMFfun(){
|
|
||||||
let result:any = await gatdeviceStatusInfoMF({id:route.params.dev})
|
|
||||||
|
|
||||||
if(result.code==200){
|
|
||||||
setdata(result.data)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function setdata(val:any){
|
|
||||||
|
|
||||||
|
|
||||||
let data={
|
|
||||||
name:val.name, //设备名称
|
|
||||||
status:val.status=='H_E_STOP'?t('messages.STOP'):val.status=='H_OFF'?t('messages.Standby'):val.status=='H_ON'?t('messages.work'):t('messages.halt'), //设备状态
|
|
||||||
starttime:val.ontime,//启动时长
|
|
||||||
endtime:val.offtime,//待机时长
|
|
||||||
stoptime:val.stoptime,//急停时长
|
|
||||||
data:'2020-05-06',//采购日期
|
|
||||||
src:imgurlAddXhr(val.data),//设备图片
|
|
||||||
timeguagu: Math.round(Math.abs((val.ontime)/(val.ontime+val.offtime+val.stoptime)*100)) ||0,//时间稼动率
|
|
||||||
MTBF:2724,//MTBF
|
|
||||||
MTTR:169,//MTTR
|
|
||||||
MTTF:2555,//MTTF
|
|
||||||
}
|
}
|
||||||
toptip1ref1.value.setData({title:t('messages.DevName'),value:data.name})
|
function toptip1(width: any, height: any) {
|
||||||
toptip1ref2.value.setData({title:t('messages.procureDate'),value:data.data})
|
if (!toptip1ref1.value && !toptip1ref2.value) return
|
||||||
toptip1ref3.value.setData({title:t('messages.DevStatus'),value:data.status})
|
if (!toptip1ref3.value && !toptip1ref4.value && !toptip1ref5.value && !toptip1ref6.value) return
|
||||||
toptip1ref4.value.setData({title:t('messages.workTime'),value:data.starttime})
|
toptip1ref1.value.setchartWH(width, height)
|
||||||
toptip1ref5.value.setData({title:t('messages.StandbyTime'),value:data.endtime})
|
toptip1ref2.value.setchartWH(width, height)
|
||||||
toptip1ref6.value.setData({title:t('messages.haltTime'),value:data.stoptime})
|
toptip1ref3.value.setchartWH(width, height)
|
||||||
timeguaguref.value.setData(data.timeguagu)
|
toptip1ref4.value.setchartWH(width, height)
|
||||||
imgRef.value.setData(data.src)
|
toptip1ref5.value.setchartWH(width, height)
|
||||||
// progressref1.value.setData(data.MTBF)
|
toptip1ref6.value.setchartWH(width, height)
|
||||||
// progressref2.value.setData(data.MTTR)
|
}
|
||||||
MTTFref.value.setData({title:data.name,value:{MTTF:data.MTTF,MTBF:data.MTBF,MTTR:data.MTTR}})
|
function guagebox(width: any, height: any) {
|
||||||
contrastref.value.setData({title:[t('messages.firing'),t('messages.Standby'),t('messages.STOP')],value:[data.starttime,data.endtime,data.stoptime]})
|
if (!MTTFref.value && !imgRef.value) return
|
||||||
|
imgRef.value.setchartWH(width, height)
|
||||||
|
// progressref1.value.setchartWH(width,height)
|
||||||
|
// progressref2.value.setchartWH(width,height)
|
||||||
|
MTTFref.value.setchartWH(width, height)
|
||||||
|
}
|
||||||
|
function contrasttbox(width: any, height: any) {
|
||||||
|
if (!contrastref.value && !timeguaguref.value) return
|
||||||
|
timeguaguref.value.setchartWH(width, height)
|
||||||
|
contrastref.value.setchartWH(width, height)
|
||||||
|
}
|
||||||
|
async function gatdeviceStatusInfoMFfun() {
|
||||||
|
let result: any = await gatdeviceStatusInfoMF({ id: route.params.dev })
|
||||||
|
handle.value = result.data.handle
|
||||||
|
if (result.code == 200) {
|
||||||
|
setdata(result.data)
|
||||||
}
|
}
|
||||||
function backrouter(){
|
}
|
||||||
router.push({
|
function setdata(val: any) {
|
||||||
name:'Mechanicschild',
|
|
||||||
params:{
|
|
||||||
id:store.page||route.params.id
|
let data = {
|
||||||
|
name: val.name, //设备名称
|
||||||
|
status: val.status == 'H_E_STOP' ? t('messages.STOP') : val.status == 'H_OFF' ? t('messages.Standby') : val.status == 'H_ON' ? t('messages.work') : t('messages.halt'), //设备状态
|
||||||
|
starttime: val.ontime,//启动时长
|
||||||
|
endtime: val.offtime,//待机时长
|
||||||
|
stoptime: val.stoptime,//急停时长
|
||||||
|
data: '2020-05-06',//采购日期
|
||||||
|
src: imgurlAddXhr(val.data),//设备图片
|
||||||
|
timeguagu: Math.round(Math.abs((val.ontime) / (val.ontime + val.offtime + val.stoptime) * 100)) || 0,//时间稼动率
|
||||||
|
MTBF: 2724,//MTBF
|
||||||
|
MTTR: 169,//MTTR
|
||||||
|
MTTF: 2555,//MTTF
|
||||||
|
}
|
||||||
|
toptip1ref1.value.setData({ title: t('messages.DevName'), value: data.name })
|
||||||
|
toptip1ref2.value.setData({ title: t('messages.procureDate'), value: data.data })
|
||||||
|
toptip1ref3.value.setData({ title: t('messages.DevStatus'), value: data.status })
|
||||||
|
toptip1ref4.value.setData({ title: t('messages.workTime'), value: data.starttime })
|
||||||
|
toptip1ref5.value.setData({ title: t('messages.StandbyTime'), value: data.endtime })
|
||||||
|
toptip1ref6.value.setData({ title: t('messages.haltTime'), value: data.stoptime })
|
||||||
|
timeguaguref.value.setData(data.timeguagu)
|
||||||
|
imgRef.value.setData(data.src)
|
||||||
|
// progressref1.value.setData(data.MTBF)
|
||||||
|
// progressref2.value.setData(data.MTTR)
|
||||||
|
MTTFref.value.setData({ title: data.name, value: { MTTF: data.MTTF, MTBF: data.MTBF, MTTR: data.MTTR } })
|
||||||
|
contrastref.value.setData({ title: [t('messages.firing'), t('messages.Standby'), t('messages.STOP')], value: [data.starttime, data.endtime, data.stoptime] })
|
||||||
|
}
|
||||||
|
function backrouter() {
|
||||||
|
router.push({
|
||||||
|
name: 'Mechanicschild',
|
||||||
|
params: {
|
||||||
|
id: store.page || route.params.id
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
//
|
//
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
let contentBox=Acontent.value
|
let contentBox = Acontent.value
|
||||||
// let Timedombox=Timedom.value
|
// let Timedombox=Timedom.value
|
||||||
window.document.title=t('messages.machineryDevStatus')
|
window.document.title = t('messages.machineryDevStatus')
|
||||||
WH(contentBox)
|
WH(contentBox)
|
||||||
|
|
||||||
window.addEventListener('resize',()=>{
|
window.addEventListener('resize', () => {
|
||||||
if(time.value){
|
if (time.value) {
|
||||||
clearTimeout(time.value)
|
clearTimeout(time.value)
|
||||||
time.value=null
|
time.value = null
|
||||||
}
|
}
|
||||||
time.value = setTimeout(() => {WH(contentBox)
|
time.value = setTimeout(() => {
|
||||||
}, 1000);
|
WH(contentBox)
|
||||||
})
|
}, 1000);
|
||||||
gatdeviceStatusInfoMFfun()
|
|
||||||
})
|
})
|
||||||
|
gatdeviceStatusInfoMFfun()
|
||||||
|
})
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
clearTimeout(time)
|
clearTimeout(time)
|
||||||
})
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style module>
|
<style module>
|
||||||
.container {
|
.container {
|
||||||
height: 1080px;
|
height: 1080px;
|
||||||
width: 1920px;
|
width: 1920px;
|
||||||
color: #20aec5;
|
color: #20aec5;
|
||||||
background-color: #100c2a;
|
background-color: #100c2a;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.title {
|
.title {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
.title > h1 {
|
|
||||||
font-size: 30px;
|
|
||||||
position: absolute;
|
|
||||||
top: 10px;
|
|
||||||
}
|
|
||||||
.header{
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.header p{
|
|
||||||
position: absolute;
|
|
||||||
right: 50px;
|
|
||||||
bottom: 20px;
|
|
||||||
font-size:20px;
|
|
||||||
}
|
|
||||||
.content{
|
|
||||||
width:100%;
|
|
||||||
--header:100px;
|
|
||||||
height:calc(1080px - var(--header));
|
|
||||||
display:flex;
|
|
||||||
}
|
|
||||||
.center{
|
|
||||||
margin: 0 30px;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.left{
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: flex-end;
|
|
||||||
}
|
|
||||||
|
|
||||||
.right{
|
.title>h1 {
|
||||||
margin-right: 30px;
|
font-size: 30px;
|
||||||
display: flex;
|
position: absolute;
|
||||||
flex-wrap: wrap;
|
top: 10px;
|
||||||
justify-content: space-between;
|
}
|
||||||
align-items: flex-end;
|
|
||||||
}
|
.header {
|
||||||
</style>
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header p {
|
||||||
|
position: absolute;
|
||||||
|
right: 50px;
|
||||||
|
bottom: 20px;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: 100%;
|
||||||
|
--header: 100px;
|
||||||
|
height: calc(1080px - var(--header));
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center {
|
||||||
|
margin: 0 30px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
margin-right: 30px;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-end;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
|
|
||||||
/* --content:calc(100vh - var(--header)) */
|
/* --content:calc(100vh - var(--header)) */
|
||||||
overflow: hidden !important;
|
overflow: hidden !important;
|
||||||
-ms-overflow-style: none; /* IE + Edge */
|
-ms-overflow-style: none;
|
||||||
scrollbar-width: none; /* Firefox */
|
/* IE + Edge */
|
||||||
}
|
scrollbar-width: none;
|
||||||
::-webkit-scrollbar {
|
/* Firefox */
|
||||||
display: none;
|
}
|
||||||
}
|
|
||||||
</style>
|
::-webkit-scrollbar {
|
||||||
|
display: none;
|
||||||
|
}</style>
|
||||||
|
|
||||||
@ -171,7 +171,7 @@ async function reqDeviceTotelListMFfun() {
|
|||||||
item.name,
|
item.name,
|
||||||
item.dept,
|
item.dept,
|
||||||
compare[item.status] ? compare[item.status] : '停机',
|
compare[item.status] ? compare[item.status] : '停机',
|
||||||
item.activation + '%',
|
item.activation,
|
||||||
// item.failure + '%'
|
// item.failure + '%'
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user