<template>
|
<div class="app-container">
|
<!-- 固件信息 -->
|
<ContentWrap title="固件信息" class="mb-20px">
|
<el-descriptions :column="3" v-loading="firmwareLoading" border>
|
<el-descriptions-item label="固件名称">
|
{{ firmware?.name }}
|
</el-descriptions-item>
|
<el-descriptions-item label="所属产品">
|
{{ firmware?.productName }}
|
</el-descriptions-item>
|
<el-descriptions-item label="固件版本">
|
{{ firmware?.version }}
|
</el-descriptions-item>
|
<el-descriptions-item label="创建时间">
|
{{ firmware?.createTime ? formatDate(firmware.createTime) : '-' }}
|
</el-descriptions-item>
|
<el-descriptions-item label="固件描述" :span="2">
|
{{ firmware?.description }}
|
</el-descriptions-item>
|
</el-descriptions>
|
</ContentWrap>
|
|
<!-- 升级设备统计 -->
|
<ContentWrap title="升级设备统计" class="mb-20px">
|
<el-row :gutter="20" class="py-20px" v-loading="firmwareStatisticsLoading">
|
<el-col :span="6">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-blue-500">
|
{{
|
Object.values(firmwareStatistics).reduce((sum, count) => sum + (count || 0), 0) || 0
|
}}
|
</div>
|
<div class="text-14px text-gray-600">升级设备总数</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-gray-400">
|
{{ firmwareStatistics[IoTOtaTaskRecordStatusEnum.PENDING.value] || 0 }}
|
</div>
|
<div class="text-14px text-gray-600">待推送</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-blue-400">
|
{{ firmwareStatistics[IoTOtaTaskRecordStatusEnum.PUSHED.value] || 0 }}
|
</div>
|
<div class="text-14px text-gray-600">已推送</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-yellow-500">
|
{{ firmwareStatistics[IoTOtaTaskRecordStatusEnum.UPGRADING.value] || 0 }}
|
</div>
|
<div class="text-14px text-gray-600">正在升级</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-green-500">
|
{{ firmwareStatistics[IoTOtaTaskRecordStatusEnum.SUCCESS.value] || 0 }}
|
</div>
|
<div class="text-14px text-gray-600">升级成功</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-red-500">
|
{{ firmwareStatistics[IoTOtaTaskRecordStatusEnum.FAILURE.value] || 0 }}
|
</div>
|
<div class="text-14px text-gray-600">升级失败</div>
|
</div>
|
</el-col>
|
<el-col :span="3">
|
<div class="text-center p-20px border border-solid border-gray-200 rounded bg-gray-50">
|
<div class="text-32px font-bold mb-8px text-gray-400">
|
{{ firmwareStatistics[IoTOtaTaskRecordStatusEnum.CANCELED.value] || 0 }}
|
</div>
|
<div class="text-14px text-gray-600">升级取消</div>
|
</div>
|
</el-col>
|
</el-row>
|
</ContentWrap>
|
|
<!-- 任务管理 -->
|
<OtaTaskList
|
:firmware-id="firmwareId"
|
:product-id="firmware?.productId"
|
@success="getStatistics"
|
/>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { formatDate } from '@/utils/formatTime'
|
import { IoTOtaFirmwareApi, IoTOtaFirmware } from '@/api/iot/ota/firmware'
|
import { IoTOtaTaskRecordApi } from '@/api/iot/ota/task/record'
|
import { IoTOtaTaskRecordStatusEnum } from '@/views/iot/utils/constants'
|
import OtaTaskList from '../../task/OtaTaskList.vue'
|
|
/** IoT OTA 固件详情 */
|
defineOptions({ name: 'IoTOtaFirmwareDetail' })
|
|
const route = useRoute() // 路由
|
|
const firmwareId = ref(Number(route.params.id)) // 固件编号
|
const firmwareLoading = ref(false) // 固件加载状态
|
const firmware = ref<IoTOtaFirmware>({} as IoTOtaFirmware) // 固件信息
|
|
const firmwareStatisticsLoading = ref(false) // 统计信息加载状态
|
const firmwareStatistics = ref<Record<string, number>>({}) // 统计信息
|
|
/** 获取固件信息 */
|
const getFirmwareInfo = async () => {
|
firmwareLoading.value = true
|
try {
|
firmware.value = await IoTOtaFirmwareApi.getOtaFirmware(firmwareId.value)
|
} finally {
|
firmwareLoading.value = false
|
}
|
}
|
|
/** 获取升级统计 */
|
const getStatistics = async () => {
|
firmwareStatisticsLoading.value = true
|
try {
|
firmwareStatistics.value = await IoTOtaTaskRecordApi.getOtaTaskRecordStatusStatistics(
|
firmwareId.value
|
)
|
} finally {
|
firmwareStatisticsLoading.value = false
|
}
|
}
|
|
/** 初始化 */
|
onMounted(() => {
|
getFirmwareInfo()
|
getStatistics()
|
})
|
</script>
|