|
@@ -10,155 +10,168 @@
|
|
|
</a-table>
|
|
|
</div>
|
|
|
<div class="bot-area">
|
|
|
- <warnZb :widthV="widthV" :heightV="heightV" :coordDw="coordDw" :widthCanvas="widthCanvas" :heightCanvas="heightCanvas" />
|
|
|
+ <warnZb :widthV="widthV" :heightV="heightV" :coordDw="coordDw" :widthCanvas="widthCanvas"
|
|
|
+ :heightCanvas="heightCanvas" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
- import { ref, reactive, watch } from 'vue';
|
|
|
- import { useGlobSetting } from '/@/hooks/setting';
|
|
|
- import warnZb from './warnZb.vue';
|
|
|
- let props = defineProps({
|
|
|
- tableList: {
|
|
|
- type: Array,
|
|
|
- default: () => {
|
|
|
- return [];
|
|
|
- },
|
|
|
+import { ref, reactive, watch } from 'vue';
|
|
|
+import { useGlobSetting } from '/@/hooks/setting';
|
|
|
+import warnZb from './warnZb.vue';
|
|
|
+let props = defineProps({
|
|
|
+ tableList: {
|
|
|
+ type: Array,
|
|
|
+ default: () => {
|
|
|
+ return [];
|
|
|
},
|
|
|
- });
|
|
|
+ },
|
|
|
+});
|
|
|
|
|
|
- let widthV = ref('80%');
|
|
|
- let heightV = ref('80%');
|
|
|
- let coordDw = ref<any[]>([30,56, 119]);
|
|
|
- let widthCanvas = ref(1240);
|
|
|
- let heightCanvas = ref(364);
|
|
|
- let tableData = ref<any[]>([]);
|
|
|
+let widthV = ref('80%');
|
|
|
+let heightV = ref('80%');
|
|
|
+let coordDw = ref<any[]>([30, 56, 119]);
|
|
|
+let widthCanvas = ref(1240);
|
|
|
+let heightCanvas = ref(364);
|
|
|
+let tableData = ref<any[]>([]);
|
|
|
|
|
|
- let columns = reactive([
|
|
|
- {
|
|
|
- title: '序号',
|
|
|
- dataIndex: '',
|
|
|
- key: 'rowIndex',
|
|
|
- width: 80,
|
|
|
- align: 'center',
|
|
|
- customRender: ({ index }) => {
|
|
|
- return `${index + 1}`;
|
|
|
- },
|
|
|
+let columns = reactive([
|
|
|
+ {
|
|
|
+ title: '序号',
|
|
|
+ dataIndex: '',
|
|
|
+ key: 'rowIndex',
|
|
|
+ width: 80,
|
|
|
+ align: 'center',
|
|
|
+ customRender: ({ index }) => {
|
|
|
+ return `${index + 1}`;
|
|
|
},
|
|
|
- {
|
|
|
- title: '预警等级',
|
|
|
- dataIndex: 'level',
|
|
|
- align: 'center',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '煤自燃阶段',
|
|
|
- dataIndex: 'alarmName',
|
|
|
- align: 'center',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '指标气体',
|
|
|
- align: 'center',
|
|
|
- dataIndex: 'alarmInfo',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '指标气体浓度范围',
|
|
|
- align: 'center',
|
|
|
- dataIndex: 'alarmdes',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '温度',
|
|
|
- align: 'center',
|
|
|
- dataIndex: 'temperature',
|
|
|
- },
|
|
|
- ]);
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '预警等级',
|
|
|
+ dataIndex: 'level',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '煤自燃阶段',
|
|
|
+ dataIndex: 'alarmName',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '指标气体',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'alarmInfo',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '指标气体浓度范围',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'alarmdes',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '温度',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'temperature',
|
|
|
+ },
|
|
|
+]);
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => props.tableList,
|
|
|
+ (newV, oldV) => {
|
|
|
+ let { sysOrgCode } = useGlobSetting();
|
|
|
+ if (sysOrgCode == 'A02A02') {
|
|
|
+ tableData.value = [
|
|
|
+ {
|
|
|
+ alarmType: 'fireWarn',
|
|
|
+ alarmdes: '0-13.75ppm',
|
|
|
+ level: '绿色预警',
|
|
|
+ temperature: '0-30℃',
|
|
|
+ alarmName: '潜伏期阶段',
|
|
|
+ id: '1811650465072791911',
|
|
|
+ alarmInfo: 'CO',
|
|
|
+ alarmcode: 'coval,coCo2,',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ alarmType: 'fireWarn',
|
|
|
+ alarmdes: '13.75-67.2ppm,0.036-0.095',
|
|
|
+ level: '黄色预警',
|
|
|
+ temperature: '30-70℃',
|
|
|
+ alarmName: '缓慢氧化升温阶段',
|
|
|
+ id: '1811650534094258912',
|
|
|
+ alarmInfo: 'CO,CO / CO₂',
|
|
|
+ alarmcode: 'coval,coCo2,ch2val,',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ alarmType: 'fireWarn',
|
|
|
+ alarmdes: '67.2-1606.3ppm,0.095-0.322,<2,<1.5',
|
|
|
+ level: '橙色预警',
|
|
|
+ temperature: '70-120℃',
|
|
|
+ alarmName: '加速氧化升温阶段',
|
|
|
+ id: '1811650534094258912',
|
|
|
+ alarmInfo: 'CO,CO / CO₂,C₂H₄,CH₃CH₂CH₃ / CH₃CH₃',
|
|
|
+ alarmcode: 'coval,coCo2,ch2val,',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ alarmType: 'fireWarn',
|
|
|
+ alarmdes: '>1606.3ppm,>0.322,>2,>1.5,>0',
|
|
|
+ level: '红色预警',
|
|
|
+ temperature: '>120℃',
|
|
|
+ alarmName: '剧烈氧化升温阶段',
|
|
|
+ id: '1811650769583423913',
|
|
|
+ alarmInfo: 'CO,CO / CO₂,C₂H₄,CH₃CH₂CH₃ / CH₃CH₃,C₂H₂',
|
|
|
+ alarmcode: 'coval,coCo2,ch2val,chval,',
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ } else {
|
|
|
+ if (newV.length != 0) {
|
|
|
+ tableData.value = newV.map(el => {
|
|
|
+ return {
|
|
|
+ alarmType: el.alarmType,
|
|
|
+ alarmdes: el.sublist[0].alarmdes,
|
|
|
+ level: el.sublist[0].level,
|
|
|
+ temperature: el.sublist[0].temperature,
|
|
|
+ alarmName: el.alarmName,
|
|
|
+ id: el.id,
|
|
|
+ alarmInfo: el.sublist[0].alarmInfo,
|
|
|
+ alarmcode: el.sublist[0].alarmcode,
|
|
|
+ }
|
|
|
+ });
|
|
|
|
|
|
- watch(
|
|
|
- () => props.tableList,
|
|
|
- (newV, oldV) => {
|
|
|
- let { sysOrgCode } = useGlobSetting();
|
|
|
- if (sysOrgCode == 'A02A02') {
|
|
|
- tableData.value = [
|
|
|
- {
|
|
|
- alarmType: 'fireWarn',
|
|
|
- alarmdes: '0-13.75ppm',
|
|
|
- level: '绿色预警',
|
|
|
- temperature: '0-30℃',
|
|
|
- alarmName: '潜伏期阶段',
|
|
|
- id: '1811650465072791911',
|
|
|
- alarmInfo: 'CO',
|
|
|
- alarmcode: 'coval,coCo2,',
|
|
|
- },
|
|
|
- {
|
|
|
- alarmType: 'fireWarn',
|
|
|
- alarmdes: '13.75-67.2ppm,0.036-0.095',
|
|
|
- level: '黄色预警',
|
|
|
- temperature: '30-70℃',
|
|
|
- alarmName: '缓慢氧化升温阶段',
|
|
|
- id: '1811650534094258912',
|
|
|
- alarmInfo: 'CO,CO / CO₂',
|
|
|
- alarmcode: 'coval,coCo2,ch2val,',
|
|
|
- },
|
|
|
- {
|
|
|
- alarmType: 'fireWarn',
|
|
|
- alarmdes: '67.2-1606.3ppm,0.095-0.322,<2,<1.5',
|
|
|
- level: '橙色预警',
|
|
|
- temperature: '70-120℃',
|
|
|
- alarmName: '加速氧化升温阶段',
|
|
|
- id: '1811650534094258912',
|
|
|
- alarmInfo: 'CO,CO / CO₂,C₂H₄,CH₃CH₂CH₃ / CH₃CH₃',
|
|
|
- alarmcode: 'coval,coCo2,ch2val,',
|
|
|
- },
|
|
|
- {
|
|
|
- alarmType: 'fireWarn',
|
|
|
- alarmdes: '>1606.3ppm,>0.322,>2,>1.5,>0',
|
|
|
- level: '红色预警',
|
|
|
- temperature: '>120℃',
|
|
|
- alarmName: '剧烈氧化升温阶段',
|
|
|
- id: '1811650769583423913',
|
|
|
- alarmInfo: 'CO,CO / CO₂,C₂H₄,CH₃CH₂CH₃ / CH₃CH₃,C₂H₂',
|
|
|
- alarmcode: 'coval,coCo2,ch2val,chval,',
|
|
|
- },
|
|
|
- ];
|
|
|
- } else {
|
|
|
- if (newV.length != 0) {
|
|
|
- tableData.value = newV;
|
|
|
- }
|
|
|
}
|
|
|
- },
|
|
|
- { immediate: true, deep: true }
|
|
|
- );
|
|
|
+ }
|
|
|
+ },
|
|
|
+ { immediate: true, }
|
|
|
+);
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
- @import '/@/design/theme.less';
|
|
|
+@import '/@/design/theme.less';
|
|
|
|
|
|
- @{theme-deepblue} {
|
|
|
- .warnTargetFire-brt {
|
|
|
- --image-bj1: url('/@/assets/images/themify/deepblue/fire/bj1.png');
|
|
|
- }
|
|
|
+@{theme-deepblue} {
|
|
|
+ .warnTargetFire-brt {
|
|
|
+ --image-bj1: url('/@/assets/images/themify/deepblue/fire/bj1.png');
|
|
|
}
|
|
|
+}
|
|
|
|
|
|
- .warnTargetFire-brt {
|
|
|
- --image-bj1: url('/@/assets/images/fire/bj1.png');
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- margin: 15px 0px 0px 0px;
|
|
|
- padding: 20px;
|
|
|
- // background: url('../../../../../assets//images/fire/border.png') no-repeat center;
|
|
|
- // background-size: 100% 100%;
|
|
|
- box-sizing: border-box;
|
|
|
+.warnTargetFire-brt {
|
|
|
+ --image-bj1: url('/@/assets/images/fire/bj1.png');
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ margin: 15px 0px 0px 0px;
|
|
|
+ padding: 20px;
|
|
|
+ // background: url('../../../../../assets//images/fire/border.png') no-repeat center;
|
|
|
+ // background-size: 100% 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
|
- .top-area {
|
|
|
- height: 40%;
|
|
|
- margin-bottom: 15px;
|
|
|
- background: var(--image-bj1) no-repeat center;
|
|
|
- background-size: 100% 100%;
|
|
|
- }
|
|
|
+ .top-area {
|
|
|
+ height: 40%;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ background: var(--image-bj1) no-repeat center;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
|
|
|
- .bot-area {
|
|
|
- height: calc(60% - 15px);
|
|
|
- background: var(--image-bj1) no-repeat center;
|
|
|
- background-size: 100% 100%;
|
|
|
- }
|
|
|
+ .bot-area {
|
|
|
+ height: calc(60% - 15px);
|
|
|
+ background: var(--image-bj1) no-repeat center;
|
|
|
+ background-size: 100% 100%;
|
|
|
}
|
|
|
+}
|
|
|
</style>
|