优化体验

frontend/src/views/ota/index.vue

@@ -32,6 +32,17 @@
             <el-option label="停用" :value="0" />
           </el-select>
         </el-form-item>
+        <el-form-item label="灰度">
+          <el-select
+            v-model="searchForm.beta"
+            placeholder="全部"
+            clearable
+            style="width: 120px"
+          >
+            <el-option label="是" :value="1" />
+            <el-option label="否" :value="0" />
+          </el-select>
+        </el-form-item>
         <el-form-item label="版本号">
           <el-input-number
             v-model="searchForm.verCode"
@@ -68,7 +79,16 @@
       <el-table :data="tableData" border stripe style="width: 100%">
         <el-table-column prop="id" label="ID" width="70" />
         <el-table-column prop="verCode" label="版本号" width="90" />
-        <el-table-column prop="verName" label="版本名" width="120" show-overflow-tooltip />
+        <el-table-column prop="verName" label="版本名" width="200">
+          <template #default="{ row }">
+            <div class="vername-cell">
+              <span class="vername-text" :title="row.verName">{{ row.verName }}</span>
+              <el-tag v-if="getLatestTag(row)" :type="row.beta === 1 ? 'warning' : 'success'" size="small" class="latest-tag">
+                {{ row.beta === 1 ? 'latest beta' : 'latest' }}
+              </el-tag>
+            </div>
+          </template>
+        </el-table-column>
         <el-table-column prop="model" label="设备型号" width="120" show-overflow-tooltip />
         <el-table-column prop="hw" label="硬件" width="70" />
         <el-table-column prop="url" label="包地址" min-width="160">
@@ -102,6 +122,11 @@
             <el-tag v-else type="info" size="small">停用</el-tag>
           </template>
         </el-table-column>
+        <el-table-column prop="create_at" label="新增时间" width="170">
+          <template #default="{ row }">
+            {{ formatBlackDate(row.create_at) }}
+          </template>
+        </el-table-column>
         <el-table-column label="操作" width="280" fixed="right">
           <template #default="scope">
             <el-button type="primary" size="small" @click="handleEdit(scope.row)">编辑</el-button>
@@ -388,6 +413,7 @@ const searchForm = reactive({
   verName: '',
   model: undefined,
   status: undefined,
+  beta: undefined,
   verCode: null
 })
 
@@ -399,6 +425,23 @@ const pagination = reactive({
 
 const tableData = ref([])
 
+/** 计算每个 (model, beta) 组合下的最大 verCode，用于显示 latest 标签 */
+const latestVersionMap = computed(() => {
+  const map = {}
+  for (const row of tableData.value) {
+    const key = `${row.model || ''}__${row.beta}`
+    if (map[key] === undefined || row.verCode > map[key]) {
+      map[key] = row.verCode
+    }
+  }
+  return map
+})
+
+function getLatestTag(row) {
+  const key = `${row.model || ''}__${row.beta}`
+  return latestVersionMap.value[key] === row.verCode
+}
+
 function emptyForm() {
   return {
     id: null,
@@ -551,6 +594,9 @@ const loadData = async () => {
     if (typeof searchForm.verCode === 'number') {
       params.verCode = searchForm.verCode
     }
+    if (searchForm.beta === 0 || searchForm.beta === 1) {
+      params.beta = searchForm.beta
+    }
     const res = await getOtaList(params)
     if (res.code === 1 && res.data) {
       tableData.value = res.data.items || []
@@ -576,6 +622,7 @@ const handleReset = () => {
   searchForm.verName = ''
   searchForm.model = undefined
   searchForm.status = undefined
+  searchForm.beta = undefined
   searchForm.verCode = null
   pagination.page = 1
   loadData()
@@ -999,4 +1046,22 @@ onMounted(() => {
   flex-shrink: 0;
   margin-left: 12px;
 }
+
+.vername-cell {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.vername-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  flex: 1;
+  min-width: 0;
+}
+
+.latest-tag {
+  flex-shrink: 0;
+}
 </style>