fix:修改数据展示，添加视频

web

9 天以前 3a77d90fc296ac1d45b118f062a5a5a5d1dd0e68

 src/views/screen/pumpInfo/index.vue

@@ -1,8 +1,9 @@
<script setup>
import {computed, onMounted, ref} from 'vue'
import {onMounted, ref, onUnmounted} from 'vue'
import {getPumpData} from '@/api/screen/index.js'

const list = ref([])
let timer = null

const gongdainStatus = (n1, n2, n3) => {
    if ((n1 > 350 && n1 < 400) && (n2 > 350 && n2 < 400) && (n3 > 350 && n3 < 400)) {
@@ -16,11 +17,11 @@
    let newArr = [{}, {}, {}, {}]
    let hasPump = 0; // 最多四个泵，有几个泵就累加数字
    getPumpData().then(res => {
        newArr.forEach(item => {
            item['facilityName'] = res.data[0].facilityName
        newArr.forEach((item, index) => {
            item['facilityName'] = res.data[0].facilityName + (index+1) +'号泵'
        })
        res.data[0].parameterVOList.forEach(el => {
            if(el.parameterType === 0) {
            if(el.parameterType === 0) { //公共数据
                newArr.forEach(item => {
                    item['c'+el.columnsCode] = el.columnValue
                })
@@ -50,130 +51,140 @@

onMounted(() => {
    getData()
    // 定时3秒回调一次，更新数据
    timer = setInterval(() => {
        getData()
    }, 3000)
})

onUnmounted(() => {
    if(timer) {
        clearInterval(timer)
    }
})
</script>

<template>
    <div class="info">
        <div class="item" v-for="(item, index) in list" :key="index">
            <div class="item-t">{{item.facilityName}}</div>
            <div class="item-c">
                <div class="allTime">
                    <div>{{index+1}}号泵总运行时长</div>
                    <div class="val">{{ item[`cB00${index+1}Time`] }}</div>
                </div>
                <div class="pumbVal">
                    <div class="environment">
                        <div class="env-item">
                            <div class="name">水浸状态</div>
                            <div :class="Number(item.cSQ) === 0 ? 'val' : 'error'">{{Number(item.cSQ) === 0 ? '正常' : '异常'}}</div>
                        </div>
                        <div class="env-item">
                            <div class="name">水池液位</div>
                            <div class="val">{{item.c1001}}cm</div>
                        </div>
                        <div class="env-item">
                            <div class="name">供电状态</div>
                            <div :class="gongdainStatus(Number(item.c2001A), Number(item.c2001B), Number(item.c2001C)) ? 'val' : 'error'">{{gongdainStatus(Number(item.c2001A), Number(item.c2001B), Number(item.c2001C)) ? '正常' : '异常'}}</div>
                        </div>
                        <div class="env-item">
                            <div class="name">A相电压</div>
                            <div class="val">{{ item.c2001A }}V</div>
                        </div>
                        <div class="env-item">
                            <div class="name">A相电流</div>
                            <div class="val">{{item.c2002A}}A</div>
                        </div>
                        <div class="env-item">
                            <div class="name">B相电压</div>
                            <div class="val">{{ item.c2001B }}V</div>
                        </div>
                        <div class="env-item">
                            <div class="name">B相电流</div>
                            <div class="val">{{ item.c2002B }}A</div>
                        </div>
                        <div class="env-item">
                            <div class="name">C相电压</div>
                            <div class="val">{{ item.c2001C }}V</div>
                        </div>
                        <div class="env-item">
                            <div class="name">C相电流</div>
                            <div class="val">{{ item.c2002C }}A</div>
                        </div>
                        <div class="env-item">
                            <div class="name">总 电 能</div>
                            <div class="val">{{ item.c2007 }}Kw·h</div>
                        </div>
                <div class="item-t">{{item.facilityName}}</div>
                <div class="item-c">
                    <div class="allTime">
                        <div>{{index+1}}号泵累计运行时长</div>
                        <div class="val">{{ item[`cB00${index+1}TimeSum`] }}</div>
                    </div>
                    <div class="run">
                        <div class="run-item">
                            <div class="name">工作状态</div>
                            <div :class="(item[`cB00${index+1}Start`] || item[`cB00${index+1}Run`]) === '开' ? 'val' : 'error'">{{(item[`cB00${index+1}Start`] || item[`cB00${index+1}Run`]) === '开' ? '启动' : '关闭'}}</div>
                        </div>
                        <div class="run-item">
                            <div class="name">运行状态</div>
                            <div :class="Number(item.c1012) < 0 ? 'error' : 'val'">{{Number(item.c1012) < 0 ? '吸水' : '排水'}}</div>
                        </div>
                        <div class="run-item">
                            <div class="name">瞬时流量</div>
                            <div class="val">{{Number(item.c1012)}}m³/h</div>
                        </div>
                        <div class="run-item">
                            <div class="name">控制状态</div>
                            <div class="val">{{item.cAuto === '关' ? '远程' : '自动'}}</div>
                        </div>
                        <div class="run-item">
                            <div class="name">流   速</div>
                            <div class="val">{{ Number(item.c1011) }}m/s</div>
                        </div>
                        <div class="run-item">
                            <div class="name">启泵次数</div>
                            <div class="val">正常</div>
                        </div>
                        <div class="run-item">
                            <div class="name">1号空开</div>
                            <div class="val">
                                <span style="margin-right: 2rem" :class="item.cQF1 === '开' ? 'val' : 'error'">{{item.cQF1 === '开' ? '开' : '关'}}</span>
                                <span>{{Number(item.cQF1Number) + '次'}}</span>
                    <div class="pumbVal">
                        <div class="environment">
                            <div class="env-item">
                                <div class="name">水浸状态</div>
                                <div :class="Number(item.cSQ) === 0 ? 'val' : 'error'">{{Number(item.cSQ) === 0 ? '正常' : '异常'}}</div>
                            </div>
                            <div class="env-item">
                                <div class="name">水池液位</div>
                                <div class="val">{{item.c1001}}cm</div>
                            </div>
                            <div class="env-item">
                                <div class="name">供电状态</div>
                                <div :class="gongdainStatus(Number(item.c2001A), Number(item.c2001B), Number(item.c2001C)) ? 'val' : 'error'">{{gongdainStatus(Number(item.c2001A), Number(item.c2001B), Number(item.c2001C)) ? '正常' : '异常'}}</div>
                            </div>
                            <div class="env-item">
                                <div class="name">A相电压</div>
                                <div class="val">{{ item.c2001A }}V</div>
                            </div>
                            <div class="env-item">
                                <div class="name">A相电流</div>
                                <div class="val">{{item.c2002A}}A</div>
                            </div>
                            <div class="env-item">
                                <div class="name">B相电压</div>
                                <div class="val">{{ item.c2001B }}V</div>
                            </div>
                            <div class="env-item">
                                <div class="name">B相电流</div>
                                <div class="val">{{ item.c2002B }}A</div>
                            </div>
                            <div class="env-item">
                                <div class="name">C相电压</div>
                                <div class="val">{{ item.c2001C }}V</div>
                            </div>
                            <div class="env-item">
                                <div class="name">C相电流</div>
                                <div class="val">{{ item.c2002C }}A</div>
                            </div>
                            <div class="env-item">
                                <div class="name">总 电 能</div>
                                <div class="val">{{ item.c2007 }}Kw·h</div>
                            </div>
                        </div>
                        <div class="run-item">
                            <div class="name">2号空开</div>
                            <div class="val">
                                <span style="margin-right: 2rem" :class="item.cQF2 === '开' ? 'val' : 'error'">{{item.cQF2 === '开' ? '开' : '关'}}</span>
                                <span>{{Number(item.cQF2Number) + '次'}}</span>
                        <div class="run">
                            <div class="run-item">
                                <div class="name">工作状态</div>
                                <div :class="(item[`cB00${index+1}Start`] || item[`cB00${index+1}Run`]) === '开' ? 'val' : 'error'">{{(item[`cB00${index+1}Start`] || item[`cB00${index+1}Run`]) === '开' ? '启动' : '关闭'}}</div>
                            </div>
                        </div>
                        <div class="run-item">
                            <div class="name">备用空开</div>
                            <div class="val">
                                <span style="margin-right: 2rem" :class="item.cQF3 === '开' ? 'val' : 'error'">{{item.cQF3 === '开' ? '开' : '关'}}</span>
                                <span>{{Number(item.cQF3Number) + '次'}}</span>
                            <div class="run-item">
                                <div class="name">运行状态</div>
                                <div :class="Number(item.c1012) < 0 ? 'error' : 'val'">{{Number(item.c1012) < 0 ? '吸水' : '排水'}}</div>
                            </div>
                        </div>
                        <div class="run-item">
                            <div class="name">备用空开</div>
                            <div class="val">
                                <span style="margin-right: 2rem" :class="item.cQF4 === '开' ? 'val' : 'error'">{{item.cQF4 === '开' ? '开' : '关'}}</span>
                                <span>{{Number(item.cQF4Number) + '次'}}</span>
                            <div class="run-item">
                                <div class="name">瞬时流量</div>
                                <div class="val">{{Number(item.c1012)}}m³/h</div>
                            </div>
                        </div>
                        <div class="run-item">
                            <div class="name">运行时长</div>
                            <div class="val">{{ item[`cB00${index+1}Time`] }}</div>
                        </div>
                        <div class="run-item">
                            <div class="name">正向累计流量</div>
                            <div class="val">{{item.c1013}}m³</div>
                        </div>
                        <div class="run-item">
                            <div class="name">负向累计流量</div>
                            <div class="val">{{ item.c10130 }}m³</div>
                            <div class="run-item">
                                <div class="name">控制状态</div>
                                <div class="val">{{item.cAuto === '关' ? '远程' : '自动'}}</div>
                            </div>
                            <div class="run-item">
                                <div class="name">流   速</div>
                                <div class="val">{{ Number(item.c1011) }}m/s</div>
                            </div>
                            <div class="run-item">
                                <div class="name">启泵次数</div>
                                <div class="val">{{Number(item[`cB00${index+1}StartNumber`]) + '次'}}</div>
                            </div>
                            <div class="run-item">
                                <div class="name">1号空开</div>
                                <div class="val">
                                    <span style="margin-right: 2rem" :class="item.cQF1 === '开' ? 'val' : 'error'">{{item.cQF1 === '开' ? '开' : '关'}}</span>
                                    <span>{{Number(item.cQF1Number) + '次'}}</span>
                                </div>
                            </div>
                            <div class="run-item">
                                <div class="name">2号空开</div>
                                <div class="val">
                                    <span style="margin-right: 2rem" :class="item.cQF2 === '开' ? 'val' : 'error'">{{item.cQF2 === '开' ? '开' : '关'}}</span>
                                    <span>{{Number(item.cQF2Number) + '次'}}</span>
                                </div>
                            </div>
                            <div class="run-item">
                                <div class="name">3号空开</div>
                                <div class="val">
                                    <span style="margin-right: 2rem" :class="item.cQF3 === '开' ? 'val' : 'error'">{{item.cQF3 === '开' ? '开' : '关'}}</span>
                                    <span>{{Number(item.cQF3Number) + '次'}}</span>
                                </div>
                            </div>
                            <div class="run-item">
                                <div class="name">备用空开</div>
                                <div class="val">
                                    <span style="margin-right: 2rem" :class="item.cQF4 === '开' ? 'val' : 'error'">{{item.cQF4 === '开' ? '开' : '关'}}</span>
                                    <span>{{Number(item.cQF4Number) + '次'}}</span>
                                </div>
                            </div>
                            <div class="run-item">
                                <div class="name">单次运行时长</div>
                                <div class="val">{{ item[`cB00${index+1}Time`] }}</div>
                            </div>
                            <div class="run-item">
                                <div class="name">正向累计流量</div>
                                <div class="val">{{item.c1013}}m³</div>
                            </div>
                            <div class="run-item">
                                <div class="name">负向累计流量</div>
                                <div class="val">{{ item.c10130 }}m³</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>