2024-01-09 18:33:44 +08:00

88 lines
2.5 KiB
Vue

<template>
<warnDetail v-if="showWarnDeatil" @off="showWarnDeatil = false" :data="popData"></warnDetail>
<scrollTable @click="hdClick3" :config="config3" style="width:100%;height:100%" v-if="config3.data.length">
</scrollTable>
</template>
<script setup>
import warnDetail from "@/components/warnDetail.vue"
import scrollTable from "@/components/scrollTable.vue"
import { ref, reactive, onMounted } from "vue"
import { deviceAlarmCountApi } from "@/api.js"
import { areaObj } from "@/store/index.js"
import { globalEventBus } from '@/common/eventBus'
const userInfoStore = areaObj()
const showWarnDeatil = ref(false)
const hdClick3 = (e) => {
if (e.ceil) {
if (e.columnIndex == 3) {
popData.value = data[e.rowIndex]
showWarnDeatil.value = true
}
}
}
const alignFn = (num) => {
let arr = []
for (let i = 0; i < num; i++) {
arr.push('center')
}
return arr
}
const config3 = reactive({
header: ['设备名称', '设备编号', '告警时间', '操作',],
headerBGC: "#092757",
oddRowBGC: "#0C2045",
headerStyle: "background-image: url('/static/index/SBGJBG.png');font-family: FZCYJ;background-size: 100% 100%;",
align: alignFn(4),
data: [
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
// ['行1列1', '行1列2', '行1列3', `<span style="color:#2562AD"> 详情 </span>`,],
]
})
const data = reactive([])
const popData = ref("")
onMounted(() => {
deviceAlarmCountApi(
{
...userInfoStore.userInfo
}
).then(res => {
res.data.list.forEach(item => {
data.push(item)
config3.data.push(
[item.device_name, item.device_code, item.update_time, `<span style="color:#2562AD"> 详情 </span>`,],
)
});
})
})
globalEventBus.on('indexlefttop', data => {
popData.value = data.index
showWarnDeatil.value = true
})
globalEventBus.on('indexlefttop-1', data => {
showWarnDeatil.value = false
})
</script>