wwf
14 小时以前 a1d7e81859f554f3a53680cc35f0f49bf1f77098
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<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>