Merge branch 'master' of https://codeup.aliyun.com/645deca397d94d909e439238/iotplatform_sourcecode/screenFront into dismap
This commit is contained in:
commit
270a002a68
@ -264,6 +264,11 @@ export default {
|
||||
'duration':'duration',
|
||||
'IoT_System':'IoT Management System',
|
||||
'environment_dust':'Environment-Dust Real-time Monitoring System',
|
||||
'加载更多':'Load More',
|
||||
'加载更多':'Load More',
|
||||
'已调试':'Debugged',
|
||||
'未调试':'No Debugged',
|
||||
'服务器机房':'server room',
|
||||
'料场':'Raw Material Area',
|
||||
'危废暂存间':'dangerous waste temporary storage room',
|
||||
}
|
||||
}
|
@ -265,5 +265,10 @@ export default {
|
||||
'IoT_System':'物联管理系统',
|
||||
'environment_dust':'环境-粉尘 实时监测系统',
|
||||
'加载更多':'加载更多',
|
||||
'已调试':'已调试',
|
||||
'未调试':'未调试',
|
||||
'服务器机房':'服务器机房',
|
||||
'料场':'料场',
|
||||
'危废暂存间':'危废暂存间',
|
||||
}
|
||||
}
|
@ -11,6 +11,11 @@ import { defineStore } from "pinia";
|
||||
import { Names } from "@/store/storeName";
|
||||
import { development, production } from "@/utils/devSever";
|
||||
import { formatter } from "element-plus";
|
||||
import { getStoredLanguage, saveStoredLanguage } from "@/utils/languageStorage";
|
||||
import zhMessages from "@/locales/lang/zh";
|
||||
import enMessages from "@/locales/lang/en";
|
||||
let language = getStoredLanguage() || "简体中文";
|
||||
let messages = language == "简体中文" ? zhMessages.messages : enMessages.messages;
|
||||
export const useMechanicsStore = defineStore(Names.Mechanics, {
|
||||
// 使用方式
|
||||
// const Index= useIndexStore()
|
||||
@ -28,7 +33,7 @@ export const useMechanicsStore = defineStore(Names.Mechanics, {
|
||||
id: null,
|
||||
index: 1,
|
||||
title: "精加",
|
||||
titleChild: "机械分厂设备物联图-精加车间",
|
||||
titleChild: messages.DevDiagram_JingJia,
|
||||
titleI18n:'messages.DevDiagram_JingJia',
|
||||
type: "精加车间",
|
||||
num: null,
|
||||
@ -41,7 +46,7 @@ export const useMechanicsStore = defineStore(Names.Mechanics, {
|
||||
id: null,
|
||||
index: 2,
|
||||
title: "机加",
|
||||
titleChild: "机械分厂设备物联图-机加车间",
|
||||
titleChild: messages.DevDiagram_JiJia,
|
||||
titleI18n:'messages.DevDiagram_JiJia',
|
||||
type: "机加车间",
|
||||
num: null,
|
||||
@ -54,7 +59,7 @@ export const useMechanicsStore = defineStore(Names.Mechanics, {
|
||||
id: null,
|
||||
index: 3,
|
||||
title: "大件",
|
||||
titleChild: "机械分厂设备物联图-大件车间",
|
||||
titleChild: messages.DevDiagram_DaJian,
|
||||
titleI18n:'messages.DevDiagram_DaJian',
|
||||
type: "大件车间",
|
||||
num: null,
|
||||
@ -67,7 +72,7 @@ export const useMechanicsStore = defineStore(Names.Mechanics, {
|
||||
id: null,
|
||||
index: 4,
|
||||
title: "精饰",
|
||||
titleChild: "机械分厂设备物联图-精饰车间",
|
||||
titleChild: messages.DevDiagram_JingShi,
|
||||
titleI18n:'messages.DevDiagram_JingShi',
|
||||
type: "精饰车间",
|
||||
num: null,
|
||||
@ -80,7 +85,7 @@ export const useMechanicsStore = defineStore(Names.Mechanics, {
|
||||
id: null,
|
||||
index: 5,
|
||||
title: "焊接",
|
||||
titleChild: "机械分厂设备物联图-焊接车间",
|
||||
titleChild: messages.DevDiagram_HanJie,
|
||||
titleI18n:'messages.DevDiagram_HanJie',
|
||||
type: "焊接车间",
|
||||
num: null,
|
||||
|
@ -14,8 +14,8 @@
|
||||
<div class="box" :key="keynum" :style="{width:boxSize.width,height:boxSize.height,position:'relative'}">
|
||||
<div class="type">
|
||||
<ul>
|
||||
<li class="on">已调试</li>
|
||||
<li class="off">未调试</li>
|
||||
<li class="on">{{t('messages.已调试')}}</li>
|
||||
<li class="off">{{t('messages.未调试')}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-for="(res,index) in data" :style="{width:'120px',height:'120px'}" >
|
||||
|
@ -14,8 +14,8 @@
|
||||
<div class="box" :key="keynum" :style="{ width: boxSize.width, height: boxSize.height, position: 'relative' }">
|
||||
<div class="type">
|
||||
<ul>
|
||||
<li class="on">已调试</li>
|
||||
<li class="off">未调试</li>
|
||||
<li class="on">{{t('messages.已调试')}}</li>
|
||||
<li class="off">{{t('messages.未调试')}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-for="(res, index) in data" :style="{ width: '130px', height: '130px' }">
|
||||
|
@ -30,7 +30,7 @@
|
||||
}"
|
||||
:autoplay="{ delay: 3000, disableOnInteraction: false,}"
|
||||
@progress="onProgress"
|
||||
@slidechange="onSlideChange">
|
||||
@slidechange="onSlideChange" style="width: 97%;">
|
||||
<swiper-slide v-for="res in imageList" :key="res.id">
|
||||
<el-image style="width: 100%; height: 100%" :src="res.image" :fit="'scale-down'">
|
||||
</el-image>
|
||||
|
@ -11,27 +11,24 @@
|
||||
<div ref="marginbox">
|
||||
<border6 ref="refborder6">
|
||||
<template v-slot>
|
||||
<div
|
||||
class="box"
|
||||
:key="keynum"
|
||||
:style="{ width: boxWH.width, height: boxWH.height }"
|
||||
>
|
||||
|
||||
<div class="title-box"><h2>{{ props.title }}</h2>
|
||||
<div class="box" :key="keynum" :style="{ width: boxWH.width, height: boxWH.height }">
|
||||
|
||||
<div class="title-box">
|
||||
<h2>{{ props.title }}</h2>
|
||||
<div class="colorTip">
|
||||
<div ><i class="iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan icon-blue"></i> {{t('messages.onLine')}}</div>
|
||||
<div style="color:#e43961"><i class="iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan icon-red"></i> {{t('messages.offline')}}</div>
|
||||
</div>
|
||||
<div><i class="iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan icon-blue"></i>
|
||||
{{ t('messages.onLine') }}</div>
|
||||
<div style="color:#e43961"><i
|
||||
class="iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan icon-red"></i>
|
||||
{{ t('messages.offline') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="gatewaystatus">
|
||||
<li v-for="item in data">
|
||||
<i
|
||||
:class="
|
||||
JSON.parse(item.status)
|
||||
? 'iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan online'
|
||||
: 'iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan noonline'
|
||||
"
|
||||
></i>
|
||||
<i :class="JSON.parse(item.status)
|
||||
? 'iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan online'
|
||||
: 'iconfont icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan noonline'
|
||||
"></i>
|
||||
<h2 class="titlesize-name">{{ item.name }}</h2>
|
||||
</li>
|
||||
</ul>
|
||||
@ -46,7 +43,7 @@ import { getCurrentInstance, onMounted, reactive, ref } from "vue";
|
||||
import { gatewayType } from "@/type/InPlantProducts";
|
||||
import border6 from "@/components/borderBox/border6.vue";
|
||||
import { useI18n } from 'vue-i18n'
|
||||
let {t} = useI18n();
|
||||
let { t } = useI18n();
|
||||
let props = defineProps<{
|
||||
title: string;
|
||||
}>();
|
||||
@ -66,7 +63,7 @@ let boxWH = reactive({
|
||||
});
|
||||
// let gateway=ref()
|
||||
// let fontSize=ref()
|
||||
onMounted(() => {});
|
||||
onMounted(() => { });
|
||||
|
||||
function setchartWH(width: any, height: any) {
|
||||
marginbox.value.style.height = height + "px";
|
||||
@ -76,7 +73,7 @@ function setchartWH(width: any, height: any) {
|
||||
refborder6.value.resetWH();
|
||||
}
|
||||
const setData = (value?: any) => {
|
||||
data=reactive([...value])
|
||||
data = reactive([...value])
|
||||
|
||||
keynum.value++;
|
||||
// data.value='设备名称'
|
||||
@ -91,18 +88,19 @@ defineExpose({
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
h2 {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 10px 0 10px;
|
||||
color: #fff;
|
||||
font-weight: 800;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@ -110,49 +108,59 @@ p {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.gatewaystatus {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.gatewaystatus > li {
|
||||
|
||||
.gatewaystatus>li {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.gatewaystatus > li {
|
||||
|
||||
.gatewaystatus>li {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.noonline {
|
||||
font-size: 8rem;
|
||||
color: rgb(228, 57, 97);
|
||||
position: relative;
|
||||
/* top: -20px; */
|
||||
}
|
||||
|
||||
.online {
|
||||
font-size: 8rem;
|
||||
color: rgb(32, 174, 197);
|
||||
position: relative;
|
||||
/* top: -20px; */
|
||||
}
|
||||
|
||||
.colorTip {
|
||||
width: 30%;
|
||||
width: 35%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.colorTip span {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
.colorTip > div {
|
||||
|
||||
.colorTip>div {
|
||||
margin-right: 1rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.colorTip .icon-red {
|
||||
display: inline-block;
|
||||
/* background-color: #e43961; */
|
||||
@ -161,6 +169,7 @@ p {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
|
||||
.colorTip .icon-blue {
|
||||
display: inline-block;
|
||||
/* background-color: #20aec5; */
|
||||
@ -169,14 +178,16 @@ p {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
}
|
||||
.titlesize-name{
|
||||
font-size: 1.5rem;
|
||||
|
||||
.titlesize-name {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.title-box{
|
||||
|
||||
.title-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.title-box > h2{
|
||||
|
||||
.title-box>h2 {
|
||||
margin-left: 20px;
|
||||
}
|
||||
</style>
|
||||
}</style>
|
||||
|
@ -96,7 +96,7 @@ const threebox=(width:any,height:any)=>{
|
||||
const onebox=(width:any,height:any)=>{
|
||||
let a=calcWH(height,width,3,1,0)
|
||||
//修改高度
|
||||
Refhumiture.value.setchartWH(a.oWidth,a.oHeight*2-40)
|
||||
Refhumiture.value.setchartWH(a.oWidth,a.oHeight*2-49)
|
||||
}
|
||||
watch(
|
||||
() => store.humiture,
|
||||
|
@ -96,7 +96,7 @@ const threebox=(width:any,height:any)=>{
|
||||
const onebox=(width:any,height:any)=>{
|
||||
let a=calcWH(height,width,3,1,0)
|
||||
//修改高度
|
||||
Refhumiture.value.setchartWH(a.oWidth,a.oHeight*2-40)
|
||||
Refhumiture.value.setchartWH(a.oWidth,a.oHeight*2-49)
|
||||
}
|
||||
watch(
|
||||
() => store.humiture,
|
||||
|
@ -12,11 +12,11 @@
|
||||
<PM :title="item.title" :value="item.value"></PM>
|
||||
</Border12>
|
||||
</div>
|
||||
<div class="test" v-for="item in pmData">
|
||||
<!-- <div class="test" v-for="item in pmData">
|
||||
<Border12>
|
||||
<PM :title="item.title" :value="item.value"></PM>
|
||||
</Border12>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -81,6 +81,7 @@ function getWebsocket(val) {
|
||||
|
||||
let data = JSON.parse(val);
|
||||
if (data.type == "dust") {
|
||||
console.log(data.msg, "pm2.5/10");
|
||||
|
||||
let index = pmData.findIndex(item => item.title == data.msg.name + "(PM2.5/PM10)")
|
||||
if (index != -1) {
|
||||
|
Loading…
Reference in New Issue
Block a user