机械分厂设备大屏 隐藏故障率
This commit is contained in:
hzz 2023-08-07 15:34:23 +08:00
parent 44fa4b00fe
commit c4d68a6771
3 changed files with 206 additions and 201 deletions

View File

@ -2,214 +2,214 @@ import { ref, computed } from 'vue'
import { Names } from "@/store/storeName";
import { defineStore } from 'pinia'
// import { sensor, shuiyaData } from '@/utils/sensor'
import {newPoint} from '@/mock/newPoint'
import { newPoint } from '@/mock/newPoint'
export const useFactoryStore = defineStore(Names.Factory, () => {
const sensorList =ref<any>([]) //ref<any>(JSON.parse(localStorage.getItem('sensorList') || '[]'))
const objSensor = {}
const devdataList = ref<any>([])
//要更新的传感器数据
const updateSensorData= ref<any>({})
//传感器数量列表
const temp_iconList = [
{
id: 1,
name: "icon-icon-temperature",
i18n:'messages.humitureSensor',
value: "温湿度传感器",
iconType:"温湿度",
counts: 0,
allnum: 0,
},
{
id: 2,
name: "icon-shengyin",
i18n:'messages.noiseSensor',
value: "噪音传感器",
iconType:"噪音",
counts: 0,
allnum: 0,
},
{
id: 3,
name: "icon-dianliu",
i18n:'messages.powerSensor',
value: "电力传感器",
iconType:"电力",
counts: 0,
allnum: 0,
},
{
id: 4,
name: "icon-weibiaoti1",
i18n:'messages.sparkSensor',
value: "火花传感器",
iconType:"火花",
counts: 0,
allnum: 0,
},
{
id: 5,
name: "icon-fenchen",
i18n:'messages.dustSensor',
value: "粉尘传感器",
iconType:"粉尘",
counts: 0,
allnum: 0,
},
{
id: 6,
name: "icon-app_icons--",
i18n:'messages.TVOC_CH2OSensor',
value: "TVOC/甲醛传感器",
iconType:"TVOC/甲醛",
counts: 0,
allnum: 0,
},
{
id: 7,
name: "icon-yanwubaojingqi",
i18n:'messages.smokeSensor',
value: "烟雾传感器",
iconType:"烟雾",
counts: 0,
allnum: 0,
},
{
id: 8,
name: "icon-ranqi",
i18n:'messages.gasSensor',
value: "燃气传感器",
iconType:"燃气",
counts: 0,
allnum: 0,
},
{
id: 9,
name: "icon-shuiya",
i18n:'messages.waterPressureSensor',
value: "水压传感器",
iconType:"水压",
counts: 0,
allnum: 0,
},{
id: 10,
name: "icon-qiya",
i18n:'messages.gasPressureSensor',
value: "气压传感器",
iconType:"气压",
counts: 0,
allnum: 0,
},
{
id: 11,
name: "icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan",
i18n:'messages.gateway',
value: "网关",
iconType:"网关",
counts: 0,
allnum: 0,
},
]
const temp_devList = [ {
const sensorList = ref<any>([]) //ref<any>(JSON.parse(localStorage.getItem('sensorList') || '[]'))
const objSensor = {}
const devdataList = ref<any>([])
//要更新的传感器数据
const updateSensorData = ref<any>({})
//传感器数量列表
const temp_iconList = [
{
id: 1,
name: "icon-shebeiditu",
i18n:'messages.Dev',
value: "设备",
name: "icon-icon-temperature",
i18n: 'messages.humitureSensor',
value: "温湿度传感器",
iconType: "温湿度",
counts: 0,
allnum: 0,
},]
const iconList = ref(JSON.parse(JSON.stringify(temp_iconList)))
//设备数量列表
const devList = ref(JSON.parse(JSON.stringify(temp_devList)))
},
{
id: 2,
name: "icon-shengyin",
i18n: 'messages.noiseSensor',
value: "噪音传感器",
iconType: "噪音",
counts: 0,
allnum: 0,
},
{
id: 3,
name: "icon-dianliu",
i18n: 'messages.powerSensor',
value: "电力传感器",
iconType: "电力",
counts: 0,
allnum: 0,
},
{
id: 4,
name: "icon-weibiaoti1",
i18n: 'messages.sparkSensor',
value: "火花传感器",
iconType: "火花",
counts: 0,
allnum: 0,
},
{
id: 5,
name: "icon-fenchen",
i18n: 'messages.dustSensor',
value: "粉尘传感器",
iconType: "粉尘",
counts: 0,
allnum: 0,
},
{
id: 6,
name: "icon-app_icons--",
i18n: 'messages.TVOC_CH2OSensor',
value: "TVOC/甲醛传感器",
iconType: "TVOC/甲醛",
counts: 0,
allnum: 0,
},
{
id: 7,
name: "icon-yanwubaojingqi",
i18n: 'messages.smokeSensor',
value: "烟雾传感器",
iconType: "烟雾",
counts: 0,
allnum: 0,
},
{
id: 8,
name: "icon-ranqi",
i18n: 'messages.gasSensor',
value: "燃气传感器",
iconType: "燃气",
counts: 0,
allnum: 0,
},
{
id: 9,
name: "icon-shuiya",
i18n: 'messages.waterPressureSensor',
value: "水压传感器",
iconType: "水压",
counts: 0,
allnum: 0,
}, {
id: 10,
name: "icon-qiya",
i18n: 'messages.gasPressureSensor',
value: "气压传感器",
iconType: "气压",
counts: 0,
allnum: 0,
},
{
id: 11,
name: "icon-beikongshuiwupingtaimenhu-tubiao_zhinengwangguan",
i18n: 'messages.gateway',
value: "网关",
iconType: "网关",
counts: 0,
allnum: 0,
},
]
const temp_devList = [{
id: 1,
name: "icon-shebeiditu",
i18n: 'messages.Dev',
value: "设备",
counts: 0,
allnum: 0,
},]
const iconList = ref(JSON.parse(JSON.stringify(temp_iconList)))
//设备数量列表
const devList = ref(JSON.parse(JSON.stringify(temp_devList)))
//更新传感器数据方法
const updateSensorList= (data:any) => {
// console.log(objSensor,'updateSensorList');
// objSensor.hasOwnProperty(data.id) && (objSensor[data.id].status = data.status)
data.status = data.status === 'true' ? true : false
if (objSensor.hasOwnProperty(data.id)&&objSensor[data.id].status != data.status) {
objSensor[data.id].status = data.status
updateSensorData.value[data.id] = objSensor[data.id]
//更新传感器数据方法
const updateSensorList = (data: any) => {
// console.log(objSensor,'updateSensorList');
// objSensor.hasOwnProperty(data.id) && (objSensor[data.id].status = data.status)
data.status = data.status === 'true' ? true : false
if (objSensor.hasOwnProperty(data.id) && objSensor[data.id].status != data.status) {
objSensor[data.id].status = data.status
updateSensorData.value[data.id] = objSensor[data.id]
}
// updateSensorData.value[data.id] = data
}
//更新后清除 更新传感器数据
const clearupdateSensorData = () => {
updateSensorData.value = {}
}
const setDataList = (sensor: any) => {
const data: any[] = []
sensorList.value = []
iconList.value = JSON.parse(JSON.stringify(temp_iconList))
for (let i in sensor) {
let iconListKey = iconList.value.findIndex(item => item.iconType == i)
let items = sensor[i].map((item: any) => {
item.icon = i
//传感器数量
iconList.value[iconListKey].allnum++
//在线传感器数量
if (item.status == "true") {
iconList.value[iconListKey].counts++
}
// updateSensorData.value[data.id] = data
return item
})
data.push(...items)
}
//更新后清除 更新传感器数据
const clearupdateSensorData= () => {
updateSensorData.value = {}
}
const setDataList = (sensor:any) => {
const data:any[] = []
sensorList.value = []
iconList.value = JSON.parse(JSON.stringify(temp_iconList))
for(let i in sensor) {
let iconListKey = iconList.value.findIndex(item=>item.iconType == i)
let items = sensor[i].map((item:any)=>{
item.icon = i
//传感器数量
iconList.value[iconListKey].allnum++
//在线传感器数量
if (item.status == "true") {
iconList.value[iconListKey].counts++
}
return item
})
data.push(...items)
let newData: object[] = []
data.forEach(item => {
let { id, x, y, name, status, icon } = item
if (x !== 0 && y !== 0) {
const listItem = {
id,
x,
y,
name,
status: status === 'true' ? true : false,
icon
}
let newData:object[] = []
data.forEach(item => {
let {id, x, y, name, status,icon } = item
if (x !== 0 && y !== 0) {
const listItem = {
id,
x,
y,
name,
status: status === 'true' ? true : false,
icon
}
// if (newPoint.hasOwnProperty(id)) {
// listItem.x = newPoint[id].x
// listItem.y = newPoint[id].y
// }
newData.push(listItem)
objSensor[id] = listItem
}
})
//localStorage.setItem('sensorList', JSON.stringify(newData))
sensorList.value = newData;
}
const setdevList = (data:any) => {
devList.value = JSON.parse(JSON.stringify(temp_devList))
devdataList.value = []
for(let i in data) {
data[i].forEach(element => {
element.icon = '设备'
element.status = element.status === 'true' ? true : false
// if (newPoint.hasOwnProperty(element.id)) {
// element.x = newPoint[element.id].x
// element.y = newPoint[element.id].y
// }
devdataList.value.push(element)
objSensor[element['id']] = element
//设备数量
devList.value[0].allnum++
if (element.status) {
// 在线设备数量
devList.value[0].counts++
}
});
// if (newPoint.hasOwnProperty(id)) {
// listItem.x = newPoint[id].x
// listItem.y = newPoint[id].y
// }
newData.push(listItem)
objSensor[id] = listItem
}
})
//localStorage.setItem('sensorList', JSON.stringify(newData))
sensorList.value = newData;
}
const setdevList = (data: any) => {
devList.value = JSON.parse(JSON.stringify(temp_devList))
devdataList.value = []
for (let i in data) {
data[i].forEach(element => {
element.icon = '设备'
element.status = element.status === 'true' ? true : false
// if (newPoint.hasOwnProperty(element.id)) {
// element.x = newPoint[element.id].x
// element.y = newPoint[element.id].y
// }
devdataList.value.push(element)
objSensor[element['id']] = element
//设备数量
devList.value[0].allnum++
if (element.status) {
// 在线设备数量
devList.value[0].counts++
}
});
}
//保存新点位坐标
function saveNewPoint(id:string,x:number,y:number) {
newPoint.value[id] = {x,y}
}
return { sensorList,devdataList,devList,iconList,updateSensorData,updateSensorList,clearupdateSensorData,setDataList,setdevList,saveNewPoint }
}
//保存新点位坐标
function saveNewPoint(id: string, x: number, y: number) {
newPoint.value[id] = { x, y }
}
return { sensorList, devdataList, devList, iconList, updateSensorData, updateSensorList, clearupdateSensorData, setDataList, setdevList, saveNewPoint }
})

View File

@ -92,7 +92,7 @@ let devFaultTipData = ref([])
let devStatusTipData = ref([])
let ringData = ref([])
let scrollBoardConfig = reactive({
header: ['序号', '设备名称', '所属车间', '设备状态', '稼动率', '故障率'],
header: ['序号', '设备名称', '所属车间', '设备状态', '稼动率'],//, ''
headerBGC: 'rgb(52, 105, 243)',
oddRowBGC: '#100c2a',
evenRowBGC: '#100c2a',
@ -172,7 +172,7 @@ async function reqDeviceTotelListMFfun() {
item.dept,
compare[item.status] ? compare[item.status] : '停机',
item.activation + '%',
item.failure + '%'
// item.failure + '%'
]
})
scrollBoardConfig.rawData = result.data;

View File

@ -2,7 +2,7 @@
<div class="container">
<dv-border-box-6 :color="['#20aec5', '#20aec5']">
<div class="content">
<div class="status online">{{ prop.data.status }}</div>
<div class="status" :class="statusClass">{{ prop.data.status }}</div>
<div class="right-top">
<div class="num">{{ prop.data.count }}</div>
<div class="name">当日总针数</div>
@ -19,7 +19,7 @@
</template>
<script setup lang='ts'>
import { getCurrentInstance, ref, onMounted,watch } from 'vue';
import { getCurrentInstance, ref, onMounted,watch, computed } from 'vue';
const { proxy } = getCurrentInstance()! as any;
const chart = ref(null);
let myChart: any = null;
@ -41,6 +41,11 @@ const prop = defineProps({
}
}
})
let statusClass = computed(() => {
return prop.data.status == '在线' ? 'online' : 'outline'
})
const init = () => {
if (!myChart) {
myChart = proxy.$echarts.init(chart.value);