|
|
@@ -0,0 +1,350 @@
|
|
|
+<template>
|
|
|
+ <a-spin tip="Loading..." :spinning="loading">
|
|
|
+ <div class="monitor-container">
|
|
|
+ <div class="lr left-box">
|
|
|
+ <div class="monitor-info item-box">
|
|
|
+ <!-- <ventBox1>
|
|
|
+ <template #title>
|
|
|
+ <div>均压与低氧参数监测与设置</div>
|
|
|
+ </template>
|
|
|
+ <template #container>
|
|
|
+ <div class="vent-flex-row-between auto-control">
|
|
|
+ <div class="title">自动调节：</div>
|
|
|
+ <a-radio-group v-model:value="isAutoControl" name="radioGroup" @change="changeType(isAutoControl)">
|
|
|
+ <a-radio value="1">关闭</a-radio>
|
|
|
+ <a-radio value="2">开启</a-radio>
|
|
|
+ </a-radio-group>
|
|
|
+ </div>
|
|
|
+ <div class="input-box">
|
|
|
+ <div class="divider-line">开始条件</div>
|
|
|
+ <div v-for="(item, index) in settingParam1" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}：</div>
|
|
|
+ <a-input-number class="input-value" v-model:value="formData[item.code]" placeholder="" />
|
|
|
+ <div class="unit">{{ item.unit }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="divider-line">调节参数</div>
|
|
|
+ <div v-for="(item, index) in settingParam2" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}：</div>
|
|
|
+ <a-input-number class="input-value" v-model:value="formData[item.code]" placeholder="" />
|
|
|
+ <div class="unit">{{ item.unit }}</div>
|
|
|
+ </div>
|
|
|
+ <div class="divider-line">结束时间</div>
|
|
|
+ <div v-for="(item, index) in settingParam3" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}：</div>
|
|
|
+ <a-input-number class="input-value" v-model:value="formData[item.code]" placeholder="" />
|
|
|
+ <div class="unit">{{ item.unit }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn-box" style="text-align: center">
|
|
|
+ <div class="btn btn1" @click="onSubmit">提交</div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </ventBox1> -->
|
|
|
+ <ventBox1 class="vent-margin-t-10">
|
|
|
+ <template #title>
|
|
|
+ <div>设备监测详情</div>
|
|
|
+ </template>
|
|
|
+ <template #container>
|
|
|
+ <div class="overflow-y-auto max-h-700px">
|
|
|
+ <template v-for="monitor in windrectMonitorData" :key="monitor.deviceId">
|
|
|
+ <div class="parameter-title group-parameter-title"
|
|
|
+ ><SvgIcon class="icon" size="14" name="fiber-title" />
|
|
|
+ <span>测风装置：{{ monitor.strinstallpos }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="input-box">
|
|
|
+ <div v-for="(item, index) in windrectParam" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}</div>
|
|
|
+ <div class="value">{{ get(monitor, item.code, '-') }}</div>
|
|
|
+ <div class="unit">{{ item.unit }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-for="monitor in windowMonitorData" :key="monitor.deviceId">
|
|
|
+ <div class="parameter-title group-parameter-title"
|
|
|
+ ><SvgIcon class="icon" size="14" name="fiber-title" />
|
|
|
+ <span>风窗：{{ monitor.strinstallpos }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="input-box">
|
|
|
+ <div v-for="(item, index) in windowParam" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}</div>
|
|
|
+ <div class="value">{{ get(monitor, item.code, '-') }}</div>
|
|
|
+ <div class="unit">{{ item.unit }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template v-for="monitor in fanlocalMonitorData" :key="monitor.deviceId">
|
|
|
+ <div class="parameter-title group-parameter-title"
|
|
|
+ ><SvgIcon class="icon" size="14" name="fiber-title" />
|
|
|
+ <span>局扇：{{ monitor.strinstallpos }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="input-box">
|
|
|
+ <div class="input-item">
|
|
|
+ <div class="title">运行风机</div>
|
|
|
+ <div class="value">{{ monitor.FanRun }}</div>
|
|
|
+ </div>
|
|
|
+ <div v-for="(item, index) in fanlocalColumn" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}</div>
|
|
|
+ <div class="value">{{
|
|
|
+ get(
|
|
|
+ monitor,
|
|
|
+ item.dataIndex.startsWith('Fan')
|
|
|
+ ? get(monitor, 'Fan1StartStatus') == 1
|
|
|
+ ? item.dataIndex.replace('Fan', 'Fan1')
|
|
|
+ : item.dataIndex.replace('Fan', 'Fan2')
|
|
|
+ : get(monitor, item.dataIndex),
|
|
|
+ '-'
|
|
|
+ )
|
|
|
+ }}</div>
|
|
|
+ <!-- <div class="unit">{{ item.unit }}</div> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </ventBox1>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="lr right-box ml-5px">
|
|
|
+ <div class="item-box sensor-container">
|
|
|
+ <ventBox1>
|
|
|
+ <template #title>
|
|
|
+ <!-- <div>CO与O2监测</div> -->
|
|
|
+ <div>传感器/安全监控监测</div>
|
|
|
+ </template>
|
|
|
+ <template #container>
|
|
|
+ <div class="overflow-y-auto max-h-700px">
|
|
|
+ <template v-for="monitor in safetyMonitorData" :key="monitor.deviceId">
|
|
|
+ <div class="parameter-title group-parameter-title"
|
|
|
+ ><SvgIcon class="icon" size="14" name="fiber-title" />
|
|
|
+ <span>{{ monitor.strinstallpos }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="input-box">
|
|
|
+ <div v-for="(item, index) in monitorParam" class="input-item" :key="index">
|
|
|
+ <div class="title">{{ item.title }}</div>
|
|
|
+ <div class="value" style="width: 50%">{{ get(monitor, item.code, '-') }}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </ventBox1>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a-spin>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+ import { onBeforeMount, ref, onMounted, onUnmounted, reactive, defineProps, watch } from 'vue';
|
|
|
+ import ventBox1 from '/@/components/vent/ventBox1.vue';
|
|
|
+ import { SvgIcon } from '/@/components/Icon';
|
|
|
+ import { mountedThree, destroy, setModelType, updateText, play } from '../balancePress.threejs';
|
|
|
+ import { settingParam1, settingParam2, settingParam3, windowParam, localFanParam, monitorParam, windrectParam } from '../balancePress.data';
|
|
|
+ import { list } from '../balancePress.api';
|
|
|
+ import { message } from 'ant-design-vue';
|
|
|
+ import { get } from 'lodash-es';
|
|
|
+ import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
|
|
|
+ import { object } from 'vue-types';
|
|
|
+
|
|
|
+ const props = defineProps({
|
|
|
+ deviceId: {
|
|
|
+ type: String,
|
|
|
+ require: true,
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ const loading = ref(false);
|
|
|
+
|
|
|
+ // 默认初始是第一行
|
|
|
+ const isAutoControl = ref('1');
|
|
|
+
|
|
|
+ // 监测数据
|
|
|
+ const selectData = reactive({
|
|
|
+ frontRearDP: '-',
|
|
|
+ sourcePressure: '-',
|
|
|
+ fault: '-',
|
|
|
+ });
|
|
|
+
|
|
|
+ const changeType = (isAutoControl) => {
|
|
|
+ isAutoControl;
|
|
|
+ //
|
|
|
+ };
|
|
|
+
|
|
|
+ // https获取监测数据
|
|
|
+ let timer: any = null;
|
|
|
+ function getMonitor(flag?) {
|
|
|
+ if (Object.prototype.toString.call(timer) === '[object Null]') {
|
|
|
+ timer = setTimeout(
|
|
|
+ async () => {
|
|
|
+ if (props.deviceId) {
|
|
|
+ const data = await getDataSource(props.deviceId);
|
|
|
+ Object.assign(selectData, data);
|
|
|
+ updateText(selectData);
|
|
|
+ }
|
|
|
+ if (timer) {
|
|
|
+ timer = null;
|
|
|
+ }
|
|
|
+ await getMonitor();
|
|
|
+ loading.value = false;
|
|
|
+ },
|
|
|
+ flag ? 0 : 1000
|
|
|
+ );
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const safetyMonitorData = ref<any[]>([]);
|
|
|
+ const fanlocalMonitorData = ref<any[]>([]);
|
|
|
+ const windowMonitorData = ref<any[]>([]);
|
|
|
+ const windrectMonitorData = ref<any[]>([]);
|
|
|
+ const fanlocalColumn = ref<any[]>([]);
|
|
|
+ const windowColumn = ref<any[]>([]);
|
|
|
+
|
|
|
+ async function getDataSource(systemID) {
|
|
|
+ const res = await list({ devicetype: 'sys', systemID });
|
|
|
+ const result = res.msgTxt;
|
|
|
+ safetyMonitorData.value = [];
|
|
|
+ fanlocalMonitorData.value = [];
|
|
|
+ windowMonitorData.value = [];
|
|
|
+ windrectMonitorData.value = [];
|
|
|
+ result.forEach((item) => {
|
|
|
+ if (item.type.startsWith('safetymonitor') || item.type.startsWith('avgpressure_lowoxygen')) {
|
|
|
+ safetyMonitorData.value.push(...item.datalist);
|
|
|
+ }
|
|
|
+ if (item.type.startsWith('fanlocal')) {
|
|
|
+ item.datalist.forEach((e) => {
|
|
|
+ fanlocalColumn.value = getTableHeaderColumns('sys_surface_junya_fanlocal') || localFanParam;
|
|
|
+ Object.assign(e, e.readData);
|
|
|
+ const f1Run = e.readData.Fan1StartStatus == '1';
|
|
|
+ e.FanfHz = f1Run ? e.readData.Fan1_Frequency : e.readData.Fan2_Frequency;
|
|
|
+ e.FanRun = f1Run ? '1#风机' : '2#风机';
|
|
|
+ });
|
|
|
+ fanlocalMonitorData.value.push(...item.datalist);
|
|
|
+ }
|
|
|
+ if (item.type.startsWith('window')) {
|
|
|
+ windowMonitorData.value.push(...item.datalist);
|
|
|
+ }
|
|
|
+ if (item.type.startsWith('windrect')) {
|
|
|
+ windrectMonitorData.value.push(...item.datalist);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ // 喷粉操作
|
|
|
+ function onSubmit() {
|
|
|
+ sessionStorage.setItem('lalance-press-formdata', JSON.stringify(formData.value));
|
|
|
+ message.success('提交成功');
|
|
|
+ }
|
|
|
+
|
|
|
+ // watch(
|
|
|
+ // () => props.deviceId,
|
|
|
+ // (newVal, oldVal) => {
|
|
|
+ // if (newVal && oldVal != undefined) {
|
|
|
+ // setModelType('balancePressBase');
|
|
|
+ // }
|
|
|
+
|
|
|
+ // loading.value = true;
|
|
|
+ // }
|
|
|
+ // );
|
|
|
+
|
|
|
+ const formData = ref({
|
|
|
+ a: 0,
|
|
|
+ b: 0,
|
|
|
+ c: 0,
|
|
|
+ d: 0,
|
|
|
+ e: 0,
|
|
|
+ f: 0,
|
|
|
+ g: 0,
|
|
|
+ h: 0,
|
|
|
+ i: 0,
|
|
|
+ j: 0,
|
|
|
+ k: 0,
|
|
|
+ l: 0,
|
|
|
+ m: 0,
|
|
|
+ });
|
|
|
+
|
|
|
+ onBeforeMount(() => {});
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ // getMonitor()
|
|
|
+ loading.value = true;
|
|
|
+ const storage = sessionStorage.getItem('lalance-press-formdata');
|
|
|
+ if (storage) formData.value = JSON.parse(storage);
|
|
|
+ mountedThree().then(async () => {
|
|
|
+ await setModelType('balancePressTun'); //balancePressBase
|
|
|
+ loading.value = false;
|
|
|
+ timer = null;
|
|
|
+ await getMonitor(true);
|
|
|
+ play('startSmoke', 'top', 30, 'open', 0);
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ onUnmounted(() => {
|
|
|
+ destroy();
|
|
|
+ if (timer) {
|
|
|
+ clearTimeout(timer);
|
|
|
+ }
|
|
|
+ });
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+ @import '/@/design/vent/modal.less';
|
|
|
+ @import '../../comment/less/workFace.less';
|
|
|
+ @ventSpace: zxm;
|
|
|
+ .monitor-container {
|
|
|
+ margin-top: 60px;
|
|
|
+ }
|
|
|
+ .lr {
|
|
|
+ width: 340px !important;
|
|
|
+ }
|
|
|
+ .auto-control {
|
|
|
+ padding: 10px 8px;
|
|
|
+ margin: 0 4px 4px 4px;
|
|
|
+ border-radius: 4px;
|
|
|
+ border: 1px solid #ffffff05;
|
|
|
+ background-image: linear-gradient(to left, #39deff15, #3977e500, #39deff15);
|
|
|
+ }
|
|
|
+ .divider-line {
|
|
|
+ position: relative;
|
|
|
+ color: aqua;
|
|
|
+ padding-left: 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ &::before {
|
|
|
+ position: absolute;
|
|
|
+ content: '';
|
|
|
+ display: block;
|
|
|
+ top: 10px;
|
|
|
+ left: 0;
|
|
|
+ height: 1px;
|
|
|
+ width: 15px;
|
|
|
+ background-color: #ffffff33;
|
|
|
+ }
|
|
|
+ &::after {
|
|
|
+ position: absolute;
|
|
|
+ content: '';
|
|
|
+ display: block;
|
|
|
+ top: 10px;
|
|
|
+ right: 0;
|
|
|
+ height: 1px;
|
|
|
+ width: calc(100% - 85px);
|
|
|
+ background-color: #ffffff33;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .input-value {
|
|
|
+ width: 120px !important;
|
|
|
+ }
|
|
|
+ .unit {
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .btn-box {
|
|
|
+ margin: 10px 4px;
|
|
|
+ .btn1 {
|
|
|
+ padding: 4px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.@{ventSpace}-tabs-tabpane-active) {
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.@{ventSpace}-input-number) {
|
|
|
+ border-color: #ffffff88 !important;
|
|
|
+ }
|
|
|
+</style>
|
