Release v0.2.2

Author: so

Cargo.lock

@@ -1,6 +1,6 @@
 [package]
 name = "emby302gateway-rs"
-version = "0.2.1"
+version = "0.2.2"
 edition = "2024"
 license = "MIT"
 

Cargo.toml

@@ -1,5 +1,29 @@
 # 版本更新日志
 
+## v0.2.2
+
+发布时间：2026-06-15
+
+### 新增
+
+- 无。
+
+### 优化
+
+- 客户端 UA 拦截列表只保留单个记录时间字段，减少创建时间和更新时间并列展示造成的理解成本。
+- 客户端 UA 拦截列表改为单行展示关键词、描述、状态、记录时间和操作，长 UA 自动省略并可悬停查看完整内容。
+- 客户端 UA 拦截列表新增日期说明，明确记录时间表示首次出现或手动添加时间，后台更新时间不会因同 UA 重复请求而每次刷新。
+
+### 修复
+
+- 修复移动端客户端 UA 拦截记录被拆成多行卡片后，同一 UA 记录占用过高、关键词下方显示“其它”等客户端分类信息的问题。
+
+### 验证
+
+- `cargo fmt`
+- `cargo check`
+- `cd frontend && npx vue-tsc -b --noEmit`
+
 ## v0.2.1
 
 发布时间：2026-06-11

docs/changelog.md

@@ -604,7 +604,7 @@ const clientRuleRows = computed(() =>
       if (!keyword) return true
       return record.user_agent.toLowerCase().includes(keyword)
     })
-    .sort((left, right) => Number(right.updated_at) - Number(left.updated_at)),
+    .sort((left, right) => Number(right.created_at) - Number(left.created_at)),
 )
 const blockedClientCount = computed(() => clientControl.records.filter((record) => record.enabled).length)
 const allowedClientCount = computed(() => clientControl.records.length - blockedClientCount.value)
@@ -1972,9 +1972,15 @@ function formatUptime(seconds: number | undefined) {
 }
 
 function formatTimestamp(value: string) {
+  const date = parseUnixTimestamp(value)
+  if (!date) return '--'
+  return date.toLocaleString()
+}
+
+function parseUnixTimestamp(value: string) {
   const timestamp = Number(value)
-  if (!Number.isFinite(timestamp) || timestamp <= 0) return '--'
-  return new Date(timestamp * 1000).toLocaleString()
+  if (!Number.isFinite(timestamp) || timestamp <= 0) return null
+  return new Date(timestamp * 1000)
 }
 
 function formatLogTime(value: number) {
@@ -2059,13 +2065,6 @@ function clientKeyword(record: ClientRuleRecord) {
   return record.user_agent || record.client_name || '--'
 }
 
-function clientSubtext(record: ClientRuleRecord) {
-  const keyword = clientKeyword(record).trim().toLowerCase()
-  const client = record.client_name.trim()
-  if (!client || client.toLowerCase() === keyword) return ''
-  return client
-}
-
 onMounted(bootstrap)
 onBeforeUnmount(stopDashboardPolling)
 </script>
@@ -2864,34 +2863,39 @@ onBeforeUnmount(stopDashboardPolling)
           </section>
 
           <section class="panel client-table-panel">
+            <div class="client-date-note">
+              <strong>日期说明</strong>
+              <span>时间为该 UA 第一次出现或手动添加的时间；后台更新时间只在规则状态、备注或客户端信息变化时刷新，同一 UA 重复请求不会每次刷新。</span>
+            </div>
             <div class="client-table-wrap">
               <table class="client-table">
                 <thead>
                   <tr>
                     <th>关键字</th>
                     <th>描述</th>
                     <th>状态</th>
-                    <th>创建时间</th>
-                    <th>更新时间</th>
+                    <th>记录时间</th>
                     <th>操作</th>
                   </tr>
                 </thead>
                 <tbody>
                   <tr v-for="record in clientRuleRows" :key="record.id">
                     <td>
-                      <strong>{{ clientKeyword(record) }}</strong>
-                      <small v-if="clientSubtext(record)">{{ clientSubtext(record) }}</small>
+                      <strong :title="clientKeyword(record)">{{ clientKeyword(record) }}</strong>
                     </td>
                     <td>
-                      <span>{{ record.note || (record.source === 'auto' ? '自动记录播放设备' : '手动 UA 拦截') }}</span>
+                      <span :title="record.note || (record.source === 'auto' ? '自动记录播放设备' : '手动 UA 拦截')">
+                        {{ record.note || (record.source === 'auto' ? '自动记录播放设备' : '手动 UA 拦截') }}
+                      </span>
                     </td>
                     <td>
                       <span :class="['client-badge', record.enabled ? 'blocked' : 'allowed']">
                         {{ record.enabled ? '已禁用' : '允许播放' }}
                       </span>
                     </td>
-                    <td>{{ formatTimestamp(record.created_at) }}</td>
-                    <td>{{ formatTimestamp(record.updated_at) }}</td>
+                    <td class="client-time-cell">
+                      {{ formatTimestamp(record.created_at) }}
+                    </td>
                     <td>
                       <div class="rule-actions">
                         <button

frontend/src/App.vue

@@ -1680,14 +1680,32 @@ label span {
   overflow: hidden;
 }
 
+.client-date-note {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px 10px;
+  align-items: center;
+  padding: 12px 14px;
+  border-bottom: 1px solid var(--track-bg);
+  background: var(--panel-soft);
+  color: var(--muted);
+  font-size: 12px;
+  line-height: 1.5;
+}
+
+.client-date-note strong {
+  color: var(--text-soft);
+}
+
 .client-table-wrap {
   overflow-x: auto;
 }
 
 .client-table {
   width: 100%;
-  min-width: 900px;
+  min-width: 820px;
   border-collapse: collapse;
+  table-layout: fixed;
 }
 
 .client-table th,
@@ -1713,28 +1731,49 @@ label span {
 .client-table td {
   color: var(--button-text);
   font-size: 13px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .client-table td strong {
   display: block;
-  max-width: 380px;
-  overflow-wrap: anywhere;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   color: var(--text);
   font-size: 13px;
 }
 
-.client-table td small {
-  display: block;
-  max-width: 380px;
-  margin-top: 4px;
-  color: var(--muted);
-  overflow-wrap: anywhere;
+.client-table th:nth-child(1) {
+  width: 28%;
+}
+
+.client-table th:nth-child(2) {
+  width: 24%;
+}
+
+.client-table th:nth-child(3) {
+  width: 96px;
+}
+
+.client-table th:nth-child(4) {
+  width: 170px;
+}
+
+.client-table th:nth-child(5) {
+  width: 150px;
+}
+
+.client-time-cell {
+  white-space: nowrap;
 }
 
 .rule-actions {
   display: flex;
   align-items: center;
   gap: 10px;
+  white-space: nowrap;
 }
 
 .client-badge {
@@ -2290,44 +2329,6 @@ textarea:focus {
     margin-left: 0;
   }
 
-  .client-table {
-    min-width: 0;
-  }
-
-  .client-table thead {
-    display: none;
-  }
-
-  .client-table,
-  .client-table tbody,
-  .client-table tr,
-  .client-table td {
-    display: block;
-    width: 100%;
-  }
-
-  .client-table tr {
-    border-bottom: 1px solid var(--track-bg);
-    padding: 10px 12px;
-  }
-
-  .client-table td {
-    border-bottom: 0;
-    padding: 7px 0;
-  }
-
-  .client-table td:nth-child(3),
-  .client-table td:nth-child(4),
-  .client-table td:nth-child(5) {
-    display: inline-block;
-    width: auto;
-    margin-right: 10px;
-  }
-
-  .client-table td:last-child {
-    width: 100%;
-  }
-
   .rule-actions {
     justify-content: space-between;
   }