From f9fe76ff997d28e7255532da72a03a18d4f758e1 Mon Sep 17 00:00:00 2001
From: sexygoat <1538832180@qq.com>
Date: Thu, 14 May 2026 09:50:34 +0800
Subject: [PATCH] fix:bug

---
 check-tags.cjs                                |    2 +-
 docs/权限按钮.md                              |   21 +
 docs/资产详情流量-spec.md                     |    6 +-
 env/.env.production                           |    2 +-
 env/.env.test                                 |    2 +-
 .../proposal.md                               |   25 +
 .../specs/agent-asset-list/spec.md            |   46 +
 .../tasks.md                                  |   16 +
 .../proposal.md                               |    1 -
 openspec/project.md                           |    3 +-
 src/api/auth.ts                               |   10 +-
 src/pages.json                                |   40 -
 src/pages/agent-system/asset-detail/index.vue | 1881 +++++++++++------
 src/pages/agent-system/asset-search/index.vue | 1391 ------------
 src/pages/agent-system/assets/index.vue       |   87 +-
 .../agent-system/commission-center/index.vue  |    1 -
 src/pages/agent-system/commission/index.vue   |   16 -
 .../agent-system/enterprise-cards/index.vue   |    4 +-
 .../agent-system/enterprise-devices/index.vue |    2 +-
 src/pages/agent-system/home/index.vue         |    2 -
 src/pages/agent-system/my-packages/index.vue  |   23 -
 src/pages/agent-system/packages/index.vue     |  245 ---
 src/pages/agent-system/tags/index.vue         |   23 -
 src/pages/agent-system/user-info/index.vue    |    1 -
 src/pages/agent-system/utils.ts               |   77 -
 src/pages/common/login/index.vue              |   15 +-
 src/store/modules/user/index.ts               |   14 +-
 src/utils/request/index.ts                    |    2 +-
 28 files changed, 1440 insertions(+), 2518 deletions(-)
 create mode 100644 docs/权限按钮.md
 create mode 100644 openspec/changes/update-agent-asset-action-button-permissions/proposal.md
 create mode 100644 openspec/changes/update-agent-asset-action-button-permissions/specs/agent-asset-list/spec.md
 create mode 100644 openspec/changes/update-agent-asset-action-button-permissions/tasks.md
 delete mode 100644 src/pages/agent-system/asset-search/index.vue
 delete mode 100644 src/pages/agent-system/commission/index.vue
 delete mode 100644 src/pages/agent-system/my-packages/index.vue
 delete mode 100644 src/pages/agent-system/packages/index.vue
 delete mode 100644 src/pages/agent-system/tags/index.vue
 delete mode 100644 src/pages/agent-system/utils.ts

diff --git a/check-tags.cjs b/check-tags.cjs
index 6716c0f..0f4189f 100644
--- a/check-tags.cjs
+++ b/check-tags.cjs
@@ -1,5 +1,5 @@
 const fs = require('fs')
-const content = fs.readFileSync('src/pages/agent-system/asset-search/index.vue', 'utf8')
+const content = fs.readFileSync('src/pages/agent-system/asset-detail/index.vue', 'utf8')
 const lines = content.split('\n')
 
 let depth = 0
diff --git a/docs/权限按钮.md b/docs/权限按钮.md
new file mode 100644
index 0000000..38eda99
--- /dev/null
+++ b/docs/权限按钮.md
@@ -0,0 +1,21 @@
+/api/auth/login 登录接口返回了权限按钮
+user:{
+  "id": 144,
+  "username": "MLLxp",
+  "phone": "15571055000",
+  "user_type": 3,
+  "user_type_name": "代理账号",
+  "shop_id": 1
+},
+
+"buttons": [
+            "device:clear_series",
+]
+
+这个地方有返回按钮的权限
+
+<!-- IoT卡操作按钮 -->
+
+<!-- 设备操作按钮 -->
+
+资产列表里面要加这个权限编码，然后判断按钮是否显示
\ No newline at end of file
diff --git a/docs/资产详情流量-spec.md b/docs/资产详情流量-spec.md
index 4157b1b..722d353 100644
--- a/docs/资产详情流量-spec.md
+++ b/docs/资产详情流量-spec.md
@@ -18,7 +18,7 @@
 
 ### 联动范围
 
-- 资产搜索页中的同类套餐展示：`src/pages/agent-system/asset-search/index.vue`
+- 资产详情页中的同类套餐展示：`src/pages/agent-system/asset-detail/index.vue`
 
 ### 本次覆盖的 UI 区块
 
@@ -140,7 +140,7 @@
 ### 关键实现要求
 
 - `getPackageRemainMb` 必须改为基于“当前展示的已使用值”计算
-- `asset-detail` 与 `asset-search` 不允许维护不同口径的同名逻辑
+- `asset-detail` 页面内不同区块不允许维护不同口径的同名逻辑
 - 格式化继续沿用现有 `formatDataSize`，本次不单独引入新的单位换算规则
 
 ---
@@ -213,7 +213,7 @@
 
 ### 验收用例 4：跨页面一致性
 
-- 同一套餐数据在 `asset-detail` 与 `asset-search` 中展示结果一致
+- 同一套餐数据在 `asset-detail` 页面各区块中的展示结果一致
 - 当前生效套餐卡片与套餐列表摘要使用同一套字段口径
 
 ---
diff --git a/env/.env.production b/env/.env.production
index 7329d43..0d916b3 100644
--- a/env/.env.production
+++ b/env/.env.production
@@ -2,7 +2,7 @@
 VITE_APP_ENV=production
 
 # 接口地址
-VITE_API_BASE_URL=https://cmp-api.boss160.cn
+VITE_API_BASE_URL=https://cmp-api.xm-iot.cn
 
 # 是否使用代理 (生产环境不使用代理)
 VITE_APP_PROXY=false
diff --git a/env/.env.test b/env/.env.test
index 14407bd..9faf8cd 100644
--- a/env/.env.test
+++ b/env/.env.test
@@ -2,7 +2,7 @@
 VITE_APP_ENV=staging
 
 # 接口地址
-VITE_API_BASE_URL=https://cmp-api.boss160.cn
+VITE_API_BASE_URL=https://cmp-api.xm-iot.cn
 
 # 是否使用代理 (测试环境不使用代理)
 VITE_APP_PROXY=false
diff --git a/openspec/changes/update-agent-asset-action-button-permissions/proposal.md b/openspec/changes/update-agent-asset-action-button-permissions/proposal.md
new file mode 100644
index 0000000..7403f75
--- /dev/null
+++ b/openspec/changes/update-agent-asset-action-button-permissions/proposal.md
@@ -0,0 +1,25 @@
+# Change: Update agent asset action button permissions
+
+## Why
+
+The login response already returns button-level permission codes, but the agent asset list still renders IoT card and device action buttons without using those codes. This leaves action visibility disconnected from backend authorization and makes button exposure inconsistent with the authenticated session.
+
+## What Changes
+
+- Define agent asset-list behavior for consuming button permission codes returned from `POST /api/auth/login`
+- Require each IoT card action button and device action button in the agent asset list to be bound to an explicit H5 permission code:
+  - IoT卡停机：`asset:card_stop_h5`
+  - IoT卡复机：`asset:card_start_h5`
+  - 设备停机：`asset:device_stop_h5`
+  - 设备复机：`asset:device_start_h5`
+- Hide action buttons when the current session does not contain the corresponding permission code
+- Keep asset status text and detail-page entry visible even when action buttons are hidden
+
+## Impact
+
+- Affected specs:
+  - `agent-asset-list`
+- Affected code:
+  - `src/api/auth.ts`
+  - `src/pages/common/login/index.vue`
+  - `src/pages/agent-system/assets/index.vue`
diff --git a/openspec/changes/update-agent-asset-action-button-permissions/specs/agent-asset-list/spec.md b/openspec/changes/update-agent-asset-action-button-permissions/specs/agent-asset-list/spec.md
new file mode 100644
index 0000000..e5a05b9
--- /dev/null
+++ b/openspec/changes/update-agent-asset-action-button-permissions/specs/agent-asset-list/spec.md
@@ -0,0 +1,46 @@
+## ADDED Requirements
+
+### Requirement: Agent Asset Action Buttons SHALL Respect Session Button Permissions
+
+The agent asset list SHALL use the backend-provided button permission codes from the authenticated session to determine whether IoT card and device action buttons are rendered. The page SHALL use the following H5-specific permission-code mapping:
+
+- IoT卡停机：`asset:card_stop_h5`
+- IoT卡复机：`asset:card_start_h5`
+- 设备停机：`asset:device_stop_h5`
+- 设备复机：`asset:device_start_h5`
+
+#### Scenario: Login response returns button permission codes
+
+- **WHEN** `POST /api/auth/login` succeeds
+- **THEN** the frontend SHALL treat the response `buttons` array as the source of button-level permissions for the authenticated session
+- **AND** the session data used by the agent asset list SHALL preserve those button permission codes
+
+#### Scenario: Asset action has its mapped H5 permission code and the code is present
+
+- **WHEN** an IoT card or device action button in the agent asset list has one of the mapped H5 permission codes
+- **AND** that permission code exists in the current session `buttons` array
+- **THEN** the corresponding action button SHALL be rendered
+
+#### Scenario: Asset action has its mapped H5 permission code and the code is absent
+
+- **WHEN** an IoT card or device action button in the agent asset list has one of the mapped H5 permission codes
+- **AND** that permission code does not exist in the current session `buttons` array
+- **THEN** the corresponding action button SHALL NOT be rendered
+
+#### Scenario: Session includes only a subset of asset action permissions
+
+- **WHEN** the current session `buttons` array contains permission codes for only some of the asset actions
+- **THEN** only the matching asset action buttons SHALL be shown
+- **AND** non-matching asset action buttons SHALL remain hidden
+
+#### Scenario: Session includes unrelated button codes
+
+- **WHEN** the current session `buttons` array includes unrelated button codes such as `device:clear_series`
+- **THEN** no asset action button SHALL become visible unless its own mapped H5 permission code is also present
+
+#### Scenario: Action permissions are absent but the list item remains accessible
+
+- **WHEN** the current session does not grant any asset action button permissions for a list item
+- **THEN** the asset status text SHALL still be shown
+- **AND** the detail-page entry affordance for the list item SHALL remain available
+- **AND** the page SHALL NOT render placeholder or disabled action buttons in place of the hidden ones
diff --git a/openspec/changes/update-agent-asset-action-button-permissions/tasks.md b/openspec/changes/update-agent-asset-action-button-permissions/tasks.md
new file mode 100644
index 0000000..a888691
--- /dev/null
+++ b/openspec/changes/update-agent-asset-action-button-permissions/tasks.md
@@ -0,0 +1,16 @@
+## 1. Spec
+
+- [x] 1.1 Review `docs/权限按钮.md` and confirm the login response is the source of button permission codes
+- [x] 1.2 Add OpenSpec proposal, tasks, and `agent-asset-list` delta spec for action-button permissions
+- [x] 1.3 Validate the new change with strict OpenSpec validation
+
+## 2. Implementation
+
+- [x] 2.1 Extend login response typing and session persistence for the backend-provided `buttons` array
+- [x] 2.2 Define explicit H5 permission-code mapping for agent asset-list IoT card and device action buttons:
+  - `asset:card_stop_h5`
+  - `asset:card_start_h5`
+  - `asset:device_stop_h5`
+  - `asset:device_start_h5`
+- [x] 2.3 Gate asset-list action-button rendering by the current session button permissions
+- [x] 2.4 Verify card and device action visibility for sessions with and without matching button permission codes
diff --git a/openspec/changes/update-agent-asset-list-and-detail-display/proposal.md b/openspec/changes/update-agent-asset-list-and-detail-display/proposal.md
index 4fd4bc8..4da45e4 100644
--- a/openspec/changes/update-agent-asset-list-and-detail-display/proposal.md
+++ b/openspec/changes/update-agent-asset-list-and-detail-display/proposal.md
@@ -29,6 +29,5 @@ The current agent-side asset experience exposes too much low-value information,
   - `agent-asset-detail`
 - Affected code:
   - `src/pages/agent-system/assets/index.vue`
-  - `src/pages/agent-system/asset-search/index.vue`
   - `src/pages/agent-system/asset-detail/index.vue`
   - `src/api/assets.ts`
diff --git a/openspec/project.md b/openspec/project.md
index 0837ee2..0edb18c 100644
--- a/openspec/project.md
+++ b/openspec/project.md
@@ -49,8 +49,7 @@ This project is a Uni-app based agent and enterprise management frontend for IoT
 - Asset identifiers may be ICCID or VirtualNo depending on the resource and entry point.
 - Agent-side pages currently include:
   - asset list: `src/pages/agent-system/assets/index.vue`
-  - asset search/detail: `src/pages/agent-system/asset-search/index.vue`
-  - secondary asset detail page: `src/pages/agent-system/asset-detail/index.vue`
+  - asset detail: `src/pages/agent-system/asset-detail/index.vue`
 - Package display and realtime status are important parts of the asset detail experience.
 
 ## Important Constraints
diff --git a/src/api/auth.ts b/src/api/auth.ts
index 20c7b33..0135600 100644
--- a/src/api/auth.ts
+++ b/src/api/auth.ts
@@ -9,6 +9,7 @@ import { get, post, put } from '@/utils/request'
 export interface LoginParams {
   username: string
   password: string
+  device?: 'h5'
 }
 
 /**
@@ -18,6 +19,7 @@ export interface LoginResponse {
   access_token: string
   refresh_token: string
   expires_in: number
+  buttons?: string[]
   user: {
     id: number
     username: string
@@ -47,6 +49,7 @@ export interface UserInfo {
   status?: 'active' | 'inactive'
   create_time?: string
   last_login_time?: string
+  buttons?: string[]
 }
 
 /**
@@ -62,7 +65,12 @@ export interface ChangePasswordParams {
  * POST /api/auth/login
  */
 export function login(data: LoginParams) {
-  return post<LoginResponse>('/api/auth/login', { data })
+  return post<LoginResponse>('/api/auth/login', {
+    data: {
+      ...data,
+      device: data.device ?? 'h5',
+    },
+  })
 }
 
 /**
diff --git a/src/pages.json b/src/pages.json
index 03fb232..0dcf042 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -15,30 +15,6 @@
         "navigationStyle": "custom"
       }
     },
-    {
-      "path": "pages/agent-system/my-packages/index",
-      "style": {
-        "navigationBarTitleText": "我的套餐",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/agent-system/commission/index",
-      "style": {
-        "navigationBarTitleText": "我的佣金",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/agent-system/packages/index",
-      "style": {
-        "navigationBarTitleText": "套餐列表",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
     {
       "path": "pages/agent-system/assets/index",
       "style": {
@@ -47,22 +23,6 @@
         "navigationBarTextStyle": "black"
       }
     },
-    {
-      "path": "pages/agent-system/tags/index",
-      "style": {
-        "navigationBarTitleText": "标签管理",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
-    {
-      "path": "pages/agent-system/asset-search/index",
-      "style": {
-        "navigationBarTitleText": "资产详情",
-        "navigationBarBackgroundColor": "#ffffff",
-        "navigationBarTextStyle": "black"
-      }
-    },
     {
       "path": "pages/agent-system/asset-detail/index",
       "style": {
diff --git a/src/pages/agent-system/asset-detail/index.vue b/src/pages/agent-system/asset-detail/index.vue
index 3970094..9554d21 100644
--- a/src/pages/agent-system/asset-detail/index.vue
+++ b/src/pages/agent-system/asset-detail/index.vue
@@ -1,514 +1,486 @@
 <script setup lang="ts">
-import { ref, computed, onMounted } from 'vue'
-import { getAssetDetail, getAssetPackages, getCurrentPackage, getAssetHistory, stopAsset, startAsset, getAssetRealtimeStatus } from '@/api/assets'
-import type { AssetType, CardInfo, DeviceInfo, AssetPackage, HistoryRecord } from '@/api/assets'
-import { formatTime } from '@/utils/format'
-import { formatPackageDataSize, formatPackagePrice, getPackageRemainMb, getPackageTotalMb, getPackageUsagePercent, getPackageUsedMb } from '../package-display'
+  import { ref, computed, onMounted } from 'vue'
+  import { resolveAsset, getAssetRealtimeStatus, getCurrentPackage, getAssetPackages } from '@/api/assets'
+  import type { AssetRealtimeStatus, AssetPackage } from '@/api/assets'
+  import { formatTime, formatDataSize } from '@/utils/format'
+  import { formatPackageDataSize, formatPackagePrice, getPackageRemainMb, getPackageTotalMb, getPackageUsagePercent, getPackageUsedMb } from '../package-display'
 
-// 资产类型
-const assetType = ref<AssetType>('card')
+  // 搜索关键词
+  const searchKeyword = ref('')
+  // 资产类型
+  const assetType = ref<'card' | 'device' | null>(null)
+  // 资产信息
+  const assetInfo = ref<any>(null)
+  // 资产实时状态
+  const realtimeStatus = ref<AssetRealtimeStatus | null>(null)
+  // 当前套餐
+  const currentPackage = ref<AssetPackage | null>(null)
+  const packageList = ref<AssetPackage[]>([])
+  const showPackageList = ref(true)
+  // 套餐列表
+  // 是否展开套餐列表
 
-// 资产标识符 (ICCID 或 VirtualNo)
-const assetIdentifier = ref('')
+  // 是否为卡片
+  const isCard = computed(() => assetType.value === 'card')
+  // 是否为设备
+  const isDevice = computed(() => assetType.value === 'device')
+  // 卡片信息
+  const cardInfo = computed(() => isCard.value ? assetInfo.value : null)
+  // 设备信息
+  const deviceInfo = computed(() => isDevice.value ? assetInfo.value : null)
 
-// 资产详情数据
-const assetDetail = ref<CardInfo | DeviceInfo | null>(null)
+  // 搜索资产
+  async function handleSearch() {
+    if (!searchKeyword.value.trim()) {
+      return
+    }
 
-// 实时状态数据
-const realtimeStatus = ref<any>(null)
+    try {
+      const result = await resolveAsset(searchKeyword.value.trim())
+      assetType.value = result.asset_type
+      assetInfo.value = result
 
-// 套餐列表
-const packageList = ref<AssetPackage[]>([])
-
-// 历史记录列表
-const historyList = ref<HistoryRecord[]>([])
-
-// 当前套餐
-const currentPackage = ref<AssetPackage | null>(null)
-
-// 加载状态
-const loading = ref(false)
-const refreshing = ref(false)
-const operating = ref(false)
-
-// 当前Tab
-const activeTab = ref<'info' | 'package' | 'history'>('info')
-
-// Tab选项
-const tabs = [
-  { key: 'info', label: '基本信息', icon: 'i-mdi-information' },
-  { key: 'package', label: '套餐信息', icon: 'i-mdi-package-variant' },
-  { key: 'history', label: '操作历史', icon: 'i-mdi-history' },
-]
-
-// 状态文本
-const statusText = computed(() => {
-  if (!realtimeStatus.value)
-    return '未知'
-  return realtimeStatus.value.status === 'active' ? '正常' : '停机'
-})
-
-// 状态颜色
-const statusColor = computed(() => {
-  if (!realtimeStatus.value)
-    return { bg: '#f5f5f5', text: '#999' }
-  return realtimeStatus.value.status === 'active'
-    ? { bg: '#e8f5e9', text: '#2e7d32' }
-    : { bg: '#ffebee', text: '#c62828' }
-})
-
-function getPackageStatusColor(status?: number) {
-  const map: Record<number, { bg: string, text: string }> = {
-    0: { bg: '#fff3e0', text: '#e65100' },
-    1: { bg: '#e8f5e9', text: '#2e7d32' },
-    2: { bg: '#f5f5f5', text: '#999' },
-    3: { bg: '#ffebee', text: '#c62828' },
-    4: { bg: '#f5f5f5', text: '#999' },
-  }
-  return status !== undefined ? map[status] || { bg: '#f5f5f5', text: '#999' } : { bg: '#f5f5f5', text: '#999' }
-}
-
-function getPackageTypeText(type?: AssetPackage['package_type']) {
-  const map: Record<string, string> = {
-    formal: '正式套餐',
-    addon: '加油包',
-  }
-  return type ? map[type] || type : '-'
-}
-
-function formatPackageEffectivePeriod(activatedAt?: string | null, expiresAt?: string | null) {
-  return `生效期：${formatTime(activatedAt || undefined, 'date')} 至 ${formatTime(expiresAt || undefined, 'date')}`
-}
-
-function formatCurrentPackagePeriodRange(activatedAt?: string | null, expiresAt?: string | null) {
-  return `生效期：${formatTime(activatedAt || undefined, 'date')} - ${formatTime(expiresAt || undefined, 'date')}`
-}
-
-// 页面加载
-onMounted(() => {
-  // 从路由参数获取 assetType 和 assetIdentifier
-  const pages = getCurrentPages()
-  const currentPage = pages[pages.length - 1] as any
-  assetType.value = currentPage.options.type as AssetType
-  assetIdentifier.value = currentPage.options.id
-
-  loadAssetDetail()
-})
-
-// 加载资产详情
-async function loadAssetDetail() {
-  loading.value = true
-
-  try {
-    // 调用资产详情接口
-    const detailData = await getAssetDetail(assetType.value, assetIdentifier.value)
-
-    // 根据类型提取详情
-    if (assetType.value === 'card' && detailData.card) {
-      assetDetail.value = detailData.card
-      realtimeStatus.value = {
-        status: detailData.card.status,
-        data_usage: detailData.card.data_usage,
-        data_total: detailData.card.data_total,
-        last_update: new Date().toLocaleString('zh-CN'),
+      // 加载实时状态和当前套餐 (使用 identifier)
+      if (searchKeyword.value.trim()) {
+        loadRealtimeStatus(searchKeyword.value.trim())
+        loadCurrentPackage(searchKeyword.value.trim())
+        loadPackageList(searchKeyword.value.trim())
       }
-    }
-    else if (assetType.value === 'device' && detailData.device) {
-      assetDetail.value = detailData.device
-      realtimeStatus.value = {
-        status: detailData.device.status,
-        card_count: detailData.device.card_count,
-        last_online_time: detailData.device.last_online_time,
-        last_update: new Date().toLocaleString('zh-CN'),
-      }
-    }
-
-    console.log('准备调用 loadRealtimeStatus, assetIdentifier:', assetIdentifier.value)
-
-    // 获取实时状态 (包含信号质量和信号差的原因)
-    await loadRealtimeStatus()
-
-    console.log('loadRealtimeStatus 调用完成')
-
-    // 加载套餐列表
-    await loadPackages()
-
-    // 加载历史记录
-    if (activeTab.value === 'history') {
-      await loadHistory()
+    } catch (error : any) {
+      console.error('查询失败:', error)
+      assetType.value = null
+      assetInfo.value = null
+      realtimeStatus.value = null
+      currentPackage.value = null
+      packageList.value = []
     }
   }
-  catch (error: any) {
-    console.error('加载资产详情失败:', error)
-    // 如果是前端逻辑错误（非 API 错误），需要手动显示提示
-    if (error instanceof Error && error.message && !error.statusCode) {
-      uni.$u.toast(error.message)
+
+  // 加载实时状态
+  async function loadRealtimeStatus(identifier : string) {
+    try {
+      const status = await getAssetRealtimeStatus(identifier)
+      realtimeStatus.value = status
+    } catch (error : any) {
+      console.error('加载实时状态失败:', error)
     }
-    // API 请求错误已由拦截器统一处理
   }
-  finally {
-    loading.value = false
+
+  // 加载当前套餐
+  async function loadCurrentPackage(identifier : string) {
+    try {
+      console.log('开始加载当前套餐:', identifier)
+      const pkg = await getCurrentPackage(identifier)
+      console.log('当前套餐数据:', pkg)
+      currentPackage.value = pkg
+    } catch (error : any) {
+      console.error('加载当前套餐失败:', error)
+      // 如果没有当前套餐（404），这是正常的，不需要提示用户
+      currentPackage.value = null
+    }
   }
-}
 
-// 加载实时状态
-async function loadRealtimeStatus() {
-  try {
-    const realtimeData = await getAssetRealtimeStatus(assetIdentifier.value)
+  // 加载套餐列表
+  async function loadPackageList(identifier : string) {
+    try {
+      console.log('开始加载套餐列表:', identifier)
+      const response = await getAssetPackages(identifier, { page: 1, page_size: 50 })
+      console.log('套餐列表数据:', response)
+      packageList.value = response?.items || []
+    } catch (error : any) {
+      console.error('加载套餐列表失败:', error)
+      packageList.value = []
+    }
+  }
 
-    console.log('=== 实时状态接口返回 ===', realtimeData)
-    console.log('device_realtime:', realtimeData.device_realtime)
-    console.log('signal_quality:', realtimeData.device_realtime?.signal_quality)
-    console.log('signal_bad_reason:', realtimeData.device_realtime?.signal_bad_reason)
+  // 切换套餐列表显示
+  async function togglePackageList() {
+    showPackageList.value = !showPackageList.value
+    // 第一次展开时加载套餐列表
+    if (showPackageList.value && packageList.value.length === 0 && searchKeyword.value.trim()) {
+      await loadPackageList(searchKeyword.value.trim())
+    }
+  }
 
-    // 更新实时状态数据,包含信号质量和信号差的原因
-    if (realtimeData.device_realtime) {
-      // 使用对象展开确保响应式更新
-      realtimeStatus.value = {
-        ...realtimeStatus.value,
-        signal_quality: realtimeData.device_realtime.signal_quality,
-        signal_bad_reason: realtimeData.device_realtime.signal_bad_reason,
-      }
+  // 获取卡片状态文本
+  function getCardStatusText(status ?: number) {
+    const map : Record<number, string> = {
+      0: '未激活',
+      1: '正常',
+      2: '停机',
+      3: '已停用',
+    }
+    return status !== undefined ? map[status] || '未知' : '未知'
+  }
 
-      console.log('=== 更新后的 realtimeStatus ===', realtimeStatus.value)
+  // 获取实名状态文本
+  function getRealNameStatusText(status ?: number) {
+    const map : Record<number, string> = {
+      0: '未实名',
+      1: '已实名',
+    }
+    return status !== undefined ? map[status] || '未知' : '未知'
+  }
+
+  function getRealNameStatusTagClass(status ?: number | null) {
+    return status === 1
+      ? 'bg-[#e8f5e9] text-[#2e7d32]'
+      : 'bg-[#fff1f0] text-[#cf1322]'
+  }
+
+  // 获取网络状态文本 (卡片)
+  function getNetworkStatusText(status ?: number) {
+    const map : Record<number, string> = {
+      0: '停机',
+      1: '正常',
+    }
+    return status !== undefined ? map[status] || '未知' : '未知'
+  }
+
+  // 格式化字节数
+  function formatBytes(bytes ?: string | number | null) {
+    if (!bytes) return '0B'
+    const num = typeof bytes === 'string' ? parseInt(bytes) : bytes
+    if (num < 1024) return `${num}B`
+    if (num < 1024 * 1024) return `${(num / 1024).toFixed(2)}KB`
+    if (num < 1024 * 1024 * 1024) return `${(num / 1024 / 1024).toFixed(2)}MB`
+    return `${(num / 1024 / 1024 / 1024).toFixed(2)}GB`
+  }
+
+  function isEmptyDisplayValue(value ?: string | number | null) {
+    return value === null || value === undefined || (typeof value === 'string' && value.trim() === '')
+  }
+
+  function getDisplayValue(value ?: string | number | null) {
+    return isEmptyDisplayValue(value) ? '-' : String(value)
+  }
+
+  function formatBytesDisplay(bytes ?: string | number | null) {
+    return isEmptyDisplayValue(bytes) ? '-' : formatBytes(bytes)
+  }
+
+  // 格式化时长（秒）
+  function formatDuration(seconds ?: string | number) {
+    if (!seconds) return '0秒'
+    const num = typeof seconds === 'string' ? parseInt(seconds) : seconds
+    const hours = Math.floor(num / 3600)
+    const minutes = Math.floor((num % 3600) / 60)
+    const secs = num % 60
+    if (hours > 0) return `${hours}小时${minutes}分钟`
+    if (minutes > 0) return `${minutes}分钟${secs}秒`
+    return `${secs}秒`
+  }
+
+  // 获取在线状态文本
+  function getOnlineStatusText(status ?: number) {
+    return status === 1 ? '在线' : '离线'
+  }
+
+  // 获取套餐状态颜色
+  function getPackageStatusColor(status : number) {
+    const map : Record<number, { bg : string, text : string }> = {
+      0: { bg: '#fff3e0', text: '#e65100' }, // 待生效
+      1: { bg: '#e8f5e9', text: '#2e7d32' }, // 生效中
+      2: { bg: '#f5f5f5', text: '#999' }, // 已用完
+      3: { bg: '#ffebee', text: '#c62828' }, // 已过期
+      4: { bg: '#f5f5f5', text: '#999' }, // 已失效
+    }
+    return map[status] || { bg: '#f5f5f5', text: '#999' }
+  }
+
+  function getPackageTypeText(type ?: AssetPackage['package_type']) {
+    const map : Record<string, string> = {
+      formal: '正式套餐',
+      addon: '加油包',
+    }
+    return type ? map[type] || type : '-'
+  }
+
+  function formatPackageEffectivePeriod(activatedAt ?: string | null, expiresAt ?: string | null) {
+    return `生效期：${formatTime(activatedAt || undefined, 'date')} 至 ${formatTime(expiresAt || undefined, 'date')}`
+  }
+
+  function formatCurrentPackagePeriodRange(activatedAt ?: string | null, expiresAt ?: string | null) {
+    return `生效期：${formatTime(activatedAt || undefined, 'date')} - ${formatTime(expiresAt || undefined, 'date')}`
+  }
+
+  function getDeviceLastOnlineTime() {
+    const lastOnlineTime = realtimeStatus.value?.device_realtime?.last_online_time || deviceInfo.value?.last_online_time
+    return lastOnlineTime ? formatTime(lastOnlineTime) : '-'
+  }
+
+  // 获取信号质量等级 (基于 RSRP)
+  function getSignalQuality(rsrp ?: number) {
+    if (rsrp === undefined) return { level: '未知', text: '无信号', color: '#999' }
+
+    if (rsrp >= -80) {
+      return { level: '优秀', text: '信号极好', color: '#2e7d32' }
+    } else if (rsrp >= -90) {
+      return { level: '良好', text: '信号良好', color: '#66bb6a' }
+    } else if (rsrp >= -100) {
+      return { level: '一般', text: '信号一般', color: '#ffa726' }
+    } else if (rsrp >= -110) {
+      return { level: '较差', text: '信号较差', color: '#ff6b6b' }
     } else {
-      console.log('device_realtime 为空')
+      return { level: '很差', text: '信号很差', color: '#d32f2f' }
     }
   }
-  catch (error: any) {
-    console.error('加载实时状态失败:', error)
-  }
-}
 
-// 加载套餐列表
-async function loadPackages() {
-  try {
-    currentPackage.value = await getCurrentPackage(assetIdentifier.value)
-    const packagesData = await getAssetPackages(assetIdentifier.value, {
-      page: 1,
-      page_size: 50
-    })
-    packageList.value = packagesData.items || []
+  // 获取信号条数（1-5条）
+  function getSignalBars(rsrp ?: number) {
+    if (rsrp === undefined || rsrp < -110) return 0
+    if (rsrp >= -80) return 5
+    if (rsrp >= -90) return 4
+    if (rsrp >= -100) return 3
+    if (rsrp >= -110) return 2
+    return 1
   }
-  catch (error: any) {
-    console.error('加载套餐列表失败:', error)
-    packageList.value = []
-  }
-}
 
-// 加载历史记录
-async function loadHistory() {
-  try {
-    const historyData = await getAssetHistory(assetIdentifier.value, {
-      page: 1,
-      pageSize: 20,
-    })
-    historyList.value = historyData.list
-  }
-  catch (error: any) {
-    console.error('加载历史记录失败:', error)
-  }
-}
-
-// 刷新状态
-async function refreshStatus() {
-  refreshing.value = true
-
-  try {
-    // 重新加载数据
-    await loadAssetDetail()
-
-    uni.showToast({
-      title: '刷新成功',
-      icon: 'success',
-    })
-  }
-  catch (error: any) {
-    // 如果是前端逻辑错误（非 API 错误），需要手动显示提示
-    if (error instanceof Error && error.message && !error.statusCode) {
-      uni.$u.toast(error.message)
+  // 获取卡片状态颜色
+  function getCardStatusColor(status ?: number) {
+    const map : Record<number, { bg : string, text : string }> = {
+      0: { bg: '#f5f5f5', text: '#999' },
+      1: { bg: '#e8f5e9', text: '#2e7d32' },
+      2: { bg: '#ffebee', text: '#c62828' },
+      3: { bg: '#f5f5f5', text: '#999' },
     }
-    // API 请求错误已由拦截器统一处理
+    return status !== undefined ? map[status] : { bg: '#f5f5f5', text: '#999' }
   }
-  finally {
-    refreshing.value = false
+
+
+  // 获取设备状态文本
+  function getDeviceStatusText(status ?: number) {
+    const map : Record<number, string> = {
+      0: '未激活',
+      1: '正常',
+      2: '停机',
+      3: '已停用',
+    }
+    return status !== undefined ? map[status] || '未知' : '未知'
   }
-}
 
-// 切换Tab时加载对应数据
-async function handleTabChange(tab: 'info' | 'package' | 'history') {
-  activeTab.value = tab
-
-  if (tab === 'history' && historyList.value.length === 0) {
-    await loadHistory()
+  // 获取设备状态颜色
+  function getDeviceStatusColor(status ?: number) {
+    const map : Record<number, { bg : string, text : string }> = {
+      0: { bg: '#f5f5f5', text: '#999' },
+      1: { bg: '#e8f5e9', text: '#2e7d32' },
+      2: { bg: '#ffebee', text: '#c62828' },
+      3: { bg: '#f5f5f5', text: '#999' },
+    }
+    return status !== undefined ? map[status] : { bg: '#f5f5f5', text: '#999' }
   }
-}
 
-// 停机
-async function handleStopAsset() {
-  uni.showModal({
-    title: '确认停机',
-    content: '停机后将无法使用网络服务，确定要停机吗？',
-    success: async (res) => {
-      if (res.confirm) {
-        operating.value = true
-        try {
-          // 调用统一停机接口
-          await stopAsset(assetIdentifier.value)
+  onMounted(() => {
+    const pages = getCurrentPages()
+    const currentPage = pages[pages.length - 1] as any
+    const options = currentPage.options || {}
 
-          uni.showToast({
-            title: '停机成功',
-            icon: 'success',
-          })
-
-          await loadAssetDetail()
-        }
-        catch (error: any) {
-          console.error('停机失败:', error)
-          uni.showToast({
-            title: error.msg || '停机失败',
-            icon: 'none',
-          })
-        }
-        finally {
-          operating.value = false
-        }
-      }
-    },
+    // 如果有 iccid 或 virtual_no 参数,自动搜索
+    if (options.iccid) {
+      searchKeyword.value = options.iccid
+      handleSearch()
+    } else if (options.virtual_no) {
+      searchKeyword.value = options.virtual_no
+      handleSearch()
+    }
   })
-}
-
-// 复机
-async function handleStartAsset() {
-  uni.showModal({
-    title: '确认复机',
-    content: '复机后将恢复网络服务，确定要复机吗？',
-    success: async (res) => {
-      if (res.confirm) {
-        operating.value = true
-        try {
-          // 调用统一复机接口
-          await startAsset(assetIdentifier.value)
-
-          uni.showToast({
-            title: '复机成功',
-            icon: 'success',
-          })
-
-          await loadAssetDetail()
-        }
-        catch (error: any) {
-          console.error('复机失败:', error)
-          uni.showToast({
-            title: error.msg || '复机失败',
-            icon: 'none',
-          })
-        }
-        finally {
-          operating.value = false
-        }
-      }
-    },
-  })
-}
-
-// 查看钱包 (仅代理端)
-function viewWallet() {
-  // 跳转到钱包页面
-  uni.navigateTo({
-    url: `/pages/agent-system/asset-wallet/index?type=${assetType.value}&id=${assetIdentifier.value}`,
-  })
-}
 </script>
 
 <template>
-  <view class="bg-[#fafafa] min-h-screen pb-safe">
-    <!-- 加载中 -->
-    <view v-if="loading" class="pt-20 center">
-      <i class="i-mdi-loading animate-spin text-40px text-[#999]" />
-    </view>
-
-    <!-- 内容区域 -->
-    <view v-else-if="assetDetail" class="px-4 pt-4">
-      <!-- 状态卡片 -->
-      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mb-3">
-        <!-- 顶部信息 -->
+  <view class="bg-page min-h-screen pb-safe">
+    <!-- IoT卡详情 -->
+    <view v-if="isCard && cardInfo" class="px-4 pt-4 pb-4">
+      <!-- 卡片基本信息卡 -->
+      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden">
+        <!-- 顶部状态栏 -->
         <view class="px-4 pt-4 pb-3 border-b-1px border-[#f5f5f5]">
-          <view v-if="false" class="flex items-center justify-between mb-3">
+          <view v-if="false" class="flex items-center justify-between mb-2">
             <view class="flex items-center gap-2">
-              <i
-                :class="[
-                  'text-28px',
-                  assetType === 'card' ? 'i-mdi-sim' : 'i-mdi-devices',
-                  'text-[#212121]',
-                ]"
-              />
-              <view>
-                <text class="text-18px font-700 text-[#212121] block">
-                  {{ assetType === 'card' ? '物联网卡' : '物联网设备' }}
-                </text>
-                <text class="text-12px text-[#999]">
-                  ID: {{ assetDetail.id || '-' }}
-                </text>
+              <text class="text-16px font-700 text-[#212121]">
+                IoT卡
+              </text>
+            </view>
+            <view :style="{
+                backgroundColor: getCardStatusColor(cardInfo.status).bg,
+                color: getCardStatusColor(cardInfo.status).text,
+              }" class="px-3 py-1 rounded-8px text-12px font-600">
+              {{ getCardStatusText(cardInfo.status) }}
+            </view>
+          </view>
+
+          <text class="text-12px text-[#999]">
+            {{ cardInfo.current_package || '无套餐' }}
+          </text>
+        </view>
+
+        <!-- 卡片信息 -->
+        <view class="px-4 py-3">
+          <view class="space-y-2">
+            <!-- ICCID -->
+            <view class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">ICCID</text>
+              <text class="flex-1 text-13px text-[#212121] text-right break-all">
+                {{ cardInfo.iccid }}
+              </text>
+            </view>
+
+            <!-- 虚拟号 -->
+            <view v-if="cardInfo.virtual_no" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">虚拟号</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ cardInfo.virtual_no }}
+              </text>
+            </view>
+
+            <!-- msisdn -->
+            <view v-if="cardInfo.msisdn" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">msisdn</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ cardInfo.msisdn }}
+              </text>
+            </view>
+
+            <!-- 卡类型 -->
+            <view v-if="cardInfo.card_category" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">卡类型</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ cardInfo.card_category === 'normal' ? '普通卡' : cardInfo.card_category }}
+              </text>
+            </view>
+
+            <!-- 网络状态 -->
+            <view v-if="cardInfo.network_status !== undefined" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">网络状态</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ getNetworkStatusText(cardInfo.network_status) }}
+              </text>
+            </view>
+
+            <!-- 实名状态 -->
+            <view v-if="cardInfo.real_name_status !== undefined" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">实名状态</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ getRealNameStatusText(cardInfo.real_name_status) }}
+              </text>
+            </view>
+
+            <!-- 累计充值 -->
+            <view v-if="cardInfo.accumulated_recharge !== undefined" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-70px">累计充值</text>
+              <text class="flex-1 text-13px font-600 text-[var(--brand-primary)] text-right">
+                ¥{{ cardInfo.accumulated_recharge }}
+              </text>
+            </view>
+          </view>
+        </view>
+
+        <!-- 套餐使用情况 -->
+        <view v-if="cardInfo.package_total_mb !== undefined && cardInfo.package_total_mb > 0" class="px-4 pb-4">
+          <view class="bg-[#f5f5f5] rounded-12px p-3">
+            <view class="flex items-center justify-between mb-2">
+              <text class="text-12px text-[#999]">
+                套餐流量
+              </text>
+              <text class="text-12px font-600 text-[#212121]">
+                {{ formatDataSize(cardInfo.package_used_mb) }} / {{ formatDataSize(cardInfo.package_total_mb) }}
+              </text>
+            </view>
+
+            <!-- 进度条 -->
+            <view class="h-6px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{
+                  width: `${((cardInfo.package_used_mb || 0) / cardInfo.package_total_mb) * 100}%`,
+                }" :class="[
+                  'h-full rounded-full transition-all duration-300',
+                  ((cardInfo.package_used_mb || 0) / cardInfo.package_total_mb) > 0.9
+                    ? 'bg-[#ff6b6b]'
+                    : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+          <view class="flex items-center justify-between mt-2">
+            <text class="text-11px text-[#999]">
+              剩余: {{ formatDataSize(cardInfo.package_remain_mb) }}
+            </text>
+          </view>
+        </view>
+      </view>
+
+      <!-- 实时状态 -->
+      <view v-if="realtimeStatus && isCard" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
+        <text class="text-13px font-600 text-[#212121] block mb-2">实时状态</text>
+        <view class="bg-[#f5f5f5] rounded-12px p-3">
+          <view class="space-y-2">
+            <!-- 本月用量 -->
+            <view class="flex items-center justify-between">
+              <text class="text-12px text-[#666]">本月用量</text>
+              <text class="text-13px font-600 text-[var(--brand-primary)]">
+                {{
+                  realtimeStatus.current_month_usage_mb !== null && realtimeStatus.current_month_usage_mb !== undefined
+                    ? formatDataSize(realtimeStatus.current_month_usage_mb)
+                    : '0MB'
+                }}
+              </text>
+            </view>
+
+            <!-- 实时网络状态 -->
+            <view class="flex items-center justify-between">
+              <text class="text-12px text-[#666]">实时网络</text>
+              <view :class="[
+                  'px-2 py-0.5 rounded text-11px font-600',
+                  realtimeStatus.network_status === 1
+                    ? 'bg-[#e8f5e9] text-[#2e7d32]'
+                    : 'bg-[#ffebee] text-[#c62828]',
+                ]">
+                {{
+                  realtimeStatus.network_status !== null && realtimeStatus.network_status !== undefined
+                    ? getNetworkStatusText(realtimeStatus.network_status)
+                    : '未知'
+                }}
               </view>
             </view>
-            <view
-              :style="{
-                backgroundColor: statusColor.bg,
-                color: statusColor.text,
-              }"
-              class="px-3 py-1 rounded-8px text-13px font-600"
-            >
-              {{ statusText }}
+
+            <!-- 实名状态 -->
+            <view class="flex items-center justify-between">
+              <text class="text-12px text-[#666]">实名状态</text>
+              <text class="text-13px text-[#212121]">
+                {{
+                  realtimeStatus.real_name_status !== null && realtimeStatus.real_name_status !== undefined
+                    ? getRealNameStatusText(realtimeStatus.real_name_status)
+                    : '未知'
+                }}
+              </text>
             </view>
-          </view>
 
-          <text class="text-13px text-[#999]">
-            {{ assetDetail.operator || '-' }}
-          </text>
-        </view>
-
-        <!-- 实时状态 -->
-        <view class="px-4 py-4">
-          <text class="text-14px font-600 text-[#212121] block mb-3">
-            实时状态
-          </text>
-
-          <view class="grid grid-cols-2 gap-3">
-            <!-- 流量使用 -->
-            <view class="bg-[#f5f5f5] rounded-12px p-3">
-              <text class="text-12px text-[#999] block mb-1">
-                流量使用
-              </text>
-              <text class="text-16px font-700 text-[#212121] block">
-                {{ realtimeStatus?.data_usage || '-' }}
-              </text>
+            <!-- 最后同步时间 -->
+            <view v-if="realtimeStatus.last_sync_time"
+              class="flex items-center justify-between pt-1 border-t-1px border-[#e5e7eb]">
+              <text class="text-11px text-[#999]">最后同步</text>
               <text class="text-11px text-[#999]">
-                / {{ realtimeStatus?.data_total || '-' }}
-              </text>
-            </view>
-
-            <!-- 语音使用 -->
-            <view class="bg-[#f5f5f5] rounded-12px p-3">
-              <text class="text-12px text-[#999] block mb-1">
-                语音使用
-              </text>
-              <text class="text-16px font-700 text-[#212121] block">
-                {{ realtimeStatus?.voice_usage || '-' }}
-              </text>
-              <text class="text-11px text-[#999]">
-                / {{ realtimeStatus?.voice_total || '-' }}
-              </text>
-            </view>
-
-            <!-- 信号 (仅设备类型) -->
-            <view v-if="assetType === 'device'" class="bg-[#f5f5f5] rounded-12px p-3">
-              <text class="text-12px text-[#999] block mb-1">
-                信号
-              </text>
-              <text class="text-16px font-700 text-[#212121] block">
-                {{ realtimeStatus?.signal_quality || '-' }}
-              </text>
-            </view>
-
-            <!-- 信号差的原因 (仅设备类型) -->
-            <view v-if="assetType === 'device'" class="bg-[#f5f5f5] rounded-12px p-3">
-              <text class="text-12px text-[#999] block mb-1">
-                信号差的原因
-              </text>
-              <text class="text-16px font-700 text-[#212121] block">
-                {{ realtimeStatus?.signal_bad_reason || '-' }}
+                {{ formatTime(realtimeStatus.last_sync_time) }}
               </text>
             </view>
           </view>
-
-          <text class="text-11px text-[#999] block mt-3">
-            最后更新: {{ realtimeStatus?.last_update || '-' }}
-          </text>
-        </view>
-      </view>
-
-      <!-- Tab切换 -->
-      <view class="flex items-center gap-2 mb-3">
-        <view
-          v-for="tab in tabs"
-          :key="tab.key"
-          :class="[
-            'flex-1 py-3 rounded-12px center flex-col gap-1',
-            'transition-all duration-200',
-            activeTab === tab.key
-              ? 'bg-[#212121] shadow-[0_2px_12px_rgba(0,0,0,0.1)]'
-              : 'bg-white shadow-[0_2px_12px_rgba(0,0,0,0.06)]',
-          ]"
-          @click="handleTabChange(tab.key)"
-        >
-          <i
-            :class="[
-              tab.icon,
-              'text-20px',
-              activeTab === tab.key ? 'text-white' : 'text-[#666]',
-            ]"
-          />
-          <text
-            :class="[
-              'text-12px font-600',
-              activeTab === tab.key ? 'text-white' : 'text-[#666]',
-            ]"
-          >
-            {{ tab.label }}
-          </text>
-        </view>
-      </view>
-
-      <!-- 基本信息 -->
-      <view v-if="activeTab === 'info'" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] p-4 space-y-3">
-        <view class="flex items-start justify-between">
-          <text class="text-13px text-[#999] w-90px">ICCID</text>
-          <text class="flex-1 text-14px text-[#212121] text-right break-all">
-            {{ assetDetail.iccid || '-' }}
-          </text>
-        </view>
-
-        <view class="flex items-start justify-between">
-          <text class="text-13px text-[#999] w-90px">虚拟号</text>
-          <text class="flex-1 text-14px text-[#212121] text-right">
-            {{ assetDetail.virtual_number || '-' }}
-          </text>
-        </view>
-
-        <view class="flex items-start justify-between">
-          <text class="text-13px text-[#999] w-90px">IMEI</text>
-          <text class="flex-1 text-14px text-[#212121] text-right break-all">
-            {{ assetDetail.imei || '-' }}
-          </text>
-        </view>
-
-        <view class="flex items-start justify-between">
-          <text class="text-13px text-[#999] w-90px">运营商</text>
-          <text class="flex-1 text-14px text-[#212121] text-right">
-            {{ assetDetail.operator || '-' }}
-          </text>
-        </view>
-
-        <view class="flex items-start justify-between">
-          <text class="text-13px text-[#999] w-90px">创建时间</text>
-          <text class="flex-1 text-14px text-[#212121] text-right">
-            {{ assetDetail.create_time || '-' }}
-          </text>
-        </view>
-
-        <view class="flex items-start justify-between">
-          <text class="text-13px text-[#999] w-90px">激活时间</text>
-          <text class="flex-1 text-14px text-[#212121] text-right">
-            {{ assetDetail.activate_time || '-' }}
-          </text>
         </view>
       </view>
 
       <!-- 套餐信息 -->
-      <view v-if="activeTab === 'package'" class="space-y-3">
+      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
+        <view class="flex items-center justify-between mb-2">
+          <text class="text-13px font-600 text-[#212121]">当前生效套餐</text>
+          <view v-if="false && currentPackage" class="flex items-center gap-1 px-2 py-1 rounded-8px bg-[#f5f5f5]"
+            @click="togglePackageList">
+            <text class="text-11px text-[#666]">全部套餐</text>
+            <i :class="[
+                'text-14px text-[#999] transition-transform',
+                showPackageList ? 'i-mdi-chevron-up' : 'i-mdi-chevron-down',
+              ]" />
+          </view>
+        </view>
+
         <!-- 当前套餐 -->
-        <view v-if="currentPackage" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] p-4">
+        <view v-if="currentPackage" class="bg-[#f5f5f5] rounded-12px p-3">
           <view class="flex items-start justify-between gap-3 mb-3">
             <view class="min-w-0 flex-1">
               <text class="text-14px font-600 text-[#212121] block break-all">
@@ -518,33 +490,30 @@ function viewWallet() {
                 {{ formatCurrentPackagePeriodRange(currentPackage.activated_at, currentPackage.expires_at) }}
               </text>
             </view>
-            <view
-              :style="{
+            <view :style="{
                 backgroundColor: getPackageStatusColor(currentPackage.status).bg,
                 color: getPackageStatusColor(currentPackage.status).text,
-              }"
-              class="px-2 py-0.5 rounded text-10px font-600"
-            >
+              }" class="px-2 py-0.5 rounded text-10px font-600">
               {{ currentPackage.status_name || '-' }}
             </view>
           </view>
 
           <view class="grid grid-cols-3 gap-2 mb-3">
-            <view class="bg-[#f5f5f5] rounded-8px p-2 text-center">
+            <view class="bg-white rounded-8px p-2 text-center">
               <text class="text-10px text-[#999] block mb-1">总量</text>
               <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
             </view>
-            <view class="bg-[#f5f5f5] rounded-8px p-2 text-center">
+            <view class="bg-white rounded-8px p-2 text-center">
               <text class="text-10px text-[#999] block mb-1">已使用</text>
               <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
             </view>
-            <view class="bg-[#f5f5f5] rounded-8px p-2 text-center">
+            <view class="bg-white rounded-8px p-2 text-center">
               <text class="text-10px text-[#999] block mb-1">剩余</text>
               <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
             </view>
           </view>
 
-          <view class="bg-[#f5f5f5] rounded-8px p-2 mb-3">
+          <view class="bg-white rounded-8px p-2 mb-3">
             <view class="flex items-center justify-between mb-1">
               <text class="text-11px text-[#666]">已使用</text>
               <text class="text-11px font-600 text-[#212121]">
@@ -553,211 +522,837 @@ function viewWallet() {
               </text>
             </view>
             <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view
-                :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }"
-                :class="[
+              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
                   'h-full rounded-full transition-all',
                   getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]"
-              />
+                ]" />
             </view>
           </view>
 
-          <view class="space-y-2 mb-1">
-            <view class="flex items-center justify-between text-12px">
+          <view class="space-y-1 mb-1">
+            <view class="flex items-center justify-between text-11px">
               <text class="text-[#666]">套餐价格</text>
               <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
             </view>
-            <view class="flex items-center justify-between text-12px">
+            <view class="flex items-center justify-between text-11px">
               <text class="text-[#666]">套餐类型</text>
               <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
             </view>
-            <view class="flex items-center justify-between text-12px">
+            <view class="flex items-center justify-between text-11px">
               <text class="text-[#666]">下单时间</text>
               <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
             </view>
           </view>
-          <view v-if="false" class="flex items-center justify-between mb-3">
-            <text class="text-14px font-600 text-[#212121]">
-              当前套餐
-            </text>
-            <view class="px-3 py-1 rounded-8px bg-[#e8f5e9] text-12px font-600 text-[#2e7d32]">
+          <view v-if="false" class="flex items-start justify-between gap-3 mb-3">
+            <view class="min-w-0 flex-1">
+              <text class="text-14px font-600 text-[#212121] block break-all">
+                {{ currentPackage.package_name || '-' }}
+              </text>
+              <text class="text-11px text-[#999] block mt-1 break-all">
+                订单号：{{ currentPackage.order_no || '-' }}
+              </text>
+            </view>
+            <view :style="{
+                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
+                color: getPackageStatusColor(currentPackage.status).text,
+              }" class="px-2 py-0.5 rounded text-10px font-600">
               {{ currentPackage.status_name || '-' }}
             </view>
           </view>
 
-          <text v-if="false" class="text-16px font-700 text-[#212121] block mb-2">
-            {{ currentPackage.package_name || '-' }}
-          </text>
-          <text v-if="false" class="text-14px text-[var(--brand-primary)] font-600 block mb-3">
-            已用: {{ currentPackage.virtual_used_mb || 0 }}MB / 总量: {{ currentPackage.virtual_limit_mb || 0 }}MB
-          </text>
-
-          <view v-if="false" class="flex items-center justify-between text-12px text-[#999]">
-            <text v-if="currentPackage.activated_at && currentPackage.expires_at">
-              {{ currentPackage.activated_at }} ~ {{ currentPackage.expires_at }}
-            </text>
-            <text v-else>-</text>
+          <view v-if="false" class="grid grid-cols-3 gap-2 mb-3">
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">总量</text>
+              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
+            </view>
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">已使用</text>
+              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
+            </view>
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">剩余</text>
+              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
+            </view>
           </view>
+
+          <view v-if="false" class="bg-white rounded-8px p-2 mb-3">
+            <view class="flex items-center justify-between mb-1">
+              <text class="text-11px text-[#666]">已使用</text>
+              <text class="text-11px font-600 text-[#212121]">
+                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
+                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
+              </text>
+            </view>
+            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
+                  'h-full rounded-full transition-all',
+                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+          <view v-if="false" class="space-y-1 mb-1">
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">套餐价格</text>
+              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">套餐类型</text>
+              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">开始时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.activated_at) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">到期时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.expires_at) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">下单时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
+            </view>
+          </view>
+          <view v-if="false" class="flex items-start justify-between gap-3 mb-3">
+            <view class="min-w-0 flex-1">
+              <text class="text-14px font-600 text-[#212121] block break-all">
+                {{ currentPackage.package_name || '-' }}
+              </text>
+              <text class="text-11px text-[#999] block mt-1 break-all">
+                订单号：{{ currentPackage.order_no || '-' }}
+              </text>
+            </view>
+            <view :style="{
+                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
+                color: getPackageStatusColor(currentPackage.status).text,
+              }" class="px-2 py-0.5 rounded text-10px font-600">
+              {{ currentPackage.status_name || '-' }}
+            </view>
+          </view>
+
+          <view v-if="false" class="grid grid-cols-3 gap-2 mb-3">
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">总量</text>
+              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
+            </view>
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">已使用</text>
+              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
+            </view>
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">剩余</text>
+              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
+            </view>
+          </view>
+
+          <view v-if="false" class="bg-white rounded-8px p-2 mb-3">
+            <view class="flex items-center justify-between mb-1">
+              <text class="text-11px text-[#666]">已使用</text>
+              <text class="text-11px font-600 text-[#212121]">
+                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
+                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
+              </text>
+            </view>
+            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
+                  'h-full rounded-full transition-all',
+                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+          <view v-if="false" class="space-y-1 mb-1">
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">套餐价格</text>
+              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">套餐类型</text>
+              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">开始时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.activated_at) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">到期时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.expires_at) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">下单时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
+            </view>
+          </view>
+          <!-- 套餐名称和状态 -->
+          <view v-if="false" class="flex items-center justify-between mb-2">
+            <view class="flex items-center gap-2">
+              <i :class="[
+                  'text-16px',
+                  currentPackage.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
+                ]" />
+              <text class="text-14px font-600 text-[#212121]">
+                {{ currentPackage.package_name }}
+              </text>
+            </view>
+            <view :style="{
+                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
+                color: getPackageStatusColor(currentPackage.status).text,
+              }" class="px-2 py-0.5 rounded text-10px font-600">
+              {{ currentPackage.status_name }}
+            </view>
+          </view>
+
+          <!-- 流量使用进度 -->
+          <view v-if="false" class="bg-white rounded-8px p-2 mb-2">
+            <view class="flex items-center justify-between mb-1">
+              <text class="text-11px text-[#666]">虚拟流量</text>
+              <text class="text-11px font-600 text-[#212121]">
+                {{ formatDataSize(currentPackage.virtual_used_mb) }} /
+                {{ formatDataSize(currentPackage.virtual_limit_mb) }}
+              </text>
+            </view>
+            <!-- 进度条 -->
+            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
+                  'h-full rounded-full transition-all',
+                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+
         </view>
 
-        <!-- 所有套餐列表 -->
-        <view v-if="packageList.length > 0" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] p-4">
-          <text class="text-14px font-600 text-[#212121] block mb-3">
-            套餐列表
-          </text>
+        <!-- 无套餐提示 -->
+        <view v-else class="bg-[#f5f5f5] rounded-12px p-4 flex flex-col items-center">
+          <i class="i-mdi-package-variant-closed text-40px text-[#ddd] mb-2" />
+          <text class="text-12px text-[#999]">暂无生效套餐</text>
+        </view>
 
-          <view
-            v-for="pkg in packageList"
-            :key="pkg.package_usage_id"
-            class="py-3 border-t-1px border-[#f5f5f5] first:border-t-0 first:pt-0"
-          >
-            <view class="flex items-center justify-between mb-2">
-              <text class="text-15px font-600 text-[#212121]">
-                {{ pkg.package_name || '-' }}
-              </text>
-              <view
-                class="px-2 py-0.5 rounded text-11px"
-                :style="{
-                  backgroundColor: pkg.status === 1 ? '#e8f5e9' : '#f5f5f5',
-                  color: pkg.status === 1 ? '#2e7d32' : '#999'
-                }"
-              >
-                {{ pkg.status_name || '-' }}
+        <!-- 套餐列表 -->
+        <view v-if="packageList.length > 0" class="mt-3">
+          <text class="text-13px font-600 text-[#212121] block mb-2">套餐列表 ({{ packageList.length }})</text>
+          <view class="space-y-2">
+            <view v-for="pkg in packageList" :key="pkg.package_usage_id" class="bg-[#f5f5f5] rounded-12px p-3">
+              <!-- 套餐头部 -->
+              <view class="flex items-center justify-between mb-2">
+                <view class="flex items-center gap-1.5">
+                  <i :class="[
+                      'text-14px',
+                      pkg.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
+                    ]" />
+                  <text class="text-13px font-600 text-[#212121]">{{ pkg.package_name }}</text>
+                  <text v-if="pkg.master_usage_id" class="text-10px text-[#999]">(加油包)</text>
+                </view>
+                <view :style="{
+                    backgroundColor: getPackageStatusColor(pkg.status).bg,
+                    color: getPackageStatusColor(pkg.status).text,
+                  }" class="px-2 py-0.5 rounded text-10px font-600">
+                  {{ pkg.status_name }}
+                </view>
+              </view>
+
+              <!-- 流量信息 -->
+              <view class="space-y-0.5">
+                <view class="flex items-center justify-between text-11px">
+                  <text class="text-[#666]">已使用</text>
+                  <text class="text-[#212121]">
+                    {{ formatPackageDataSize(getPackageUsedMb(pkg)) }} / {{ formatPackageDataSize(getPackageTotalMb(pkg)) }}
+                  </text>
+                </view>
+                <view class="flex items-center justify-between text-11px">
+                  <text class="text-[#666]">剩余</text>
+                  <text class="text-[#212121]">{{ formatPackageDataSize(getPackageRemainMb(pkg)) }}</text>
+                </view>
+                <view class="flex items-center justify-between text-11px">
+                  <text class="text-[#666]">金额</text>
+                  <text class="text-[#212121]">{{ formatPackagePrice(pkg.paid_amount) }}</text>
+                </view>
+                <view
+                  v-if="pkg.status === 1"
+                  class="mt-2 flex items-start gap-2 rounded-10px border border-[#ffd591] bg-[#fff7e6] px-3 py-2"
+                >
+                  <i class="i-mdi-calendar-clock mt-2px shrink-0 text-14px text-[#d46b08]" />
+                  <text class="text-12px font-700 leading-5 text-[#ad4e00]">
+                    {{ formatPackageEffectivePeriod(pkg.activated_at, pkg.expires_at) }}
+                  </text>
+                </view>
               </view>
             </view>
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-12px text-[#666]">
-                已用: {{ formatPackageDataSize(getPackageUsedMb(pkg)) }} / {{ formatPackageDataSize(getPackageTotalMb(pkg)) }}
-              </text>
-              <text class="text-11px text-[#999]">
-                优先级: {{ pkg.priority || '-' }}
-              </text>
-            </view>
-            <view class="flex items-center justify-between mb-1 text-12px">
-              <text class="text-[#666]">剩余</text>
-              <text class="text-[#212121]">{{ formatPackageDataSize(getPackageRemainMb(pkg)) }}</text>
-            </view>
-            <view class="flex items-center justify-between mb-1 text-12px">
-              <text class="text-[#666]">金额</text>
-              <text class="text-[#212121]">{{ formatPackagePrice(pkg.paid_amount) }}</text>
-            </view>
-            <view v-if="pkg.status === 1" class="mt-2 bg-[#f8fafc] rounded-8px px-2.5 py-2">
-              <text class="text-11px font-600 text-[#475569]">
-                {{ formatPackageEffectivePeriod(pkg.activated_at, pkg.expires_at) }}
-              </text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 暂无套餐 -->
-        <view v-if="!currentPackage" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] p-4 py-12 center flex-col">
-          <i class="i-mdi-package-variant-closed text-60px text-[#ddd] mb-2" />
-          <text class="text-13px text-[#999]">
-            暂无生效套餐
-          </text>
-        </view>
-      </view>
-
-      <!-- 操作历史 -->
-      <view v-if="activeTab === 'history'" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] p-4">
-        <text class="text-14px font-600 text-[#212121] block mb-3">
-          操作记录
-        </text>
-
-        <!-- 暂无数据 -->
-        <view class="py-8 center flex-col">
-          <i class="i-mdi-history text-60px text-[#ddd] mb-2" />
-          <text class="text-13px text-[#999]">
-            暂无操作记录
-          </text>
-        </view>
-      </view>
-
-      <!-- 操作按钮区 -->
-      <view class="mt-4 space-y-3">
-        <!-- 停复机按钮 -->
-        <view class="flex gap-3">
-          <view
-            v-if="realtimeStatus.status === 'active'"
-            class="
-              flex-1 py-3 rounded-12px center
-              bg-[#ffebee]
-              transition-all duration-200
-              active:opacity-80
-            "
-            @click="handleStopAsset"
-          >
-            <i class="i-mdi-pause-circle text-18px text-[#c62828] mr-1" />
-            <text class="text-15px font-600 text-[#c62828]">
-              停机
-            </text>
-          </view>
-
-          <view
-            v-else
-            class="
-              flex-1 py-3 rounded-12px center
-              bg-[#e8f5e9]
-              transition-all duration-200
-              active:opacity-80
-            "
-            @click="handleStartAsset"
-          >
-            <i class="i-mdi-play-circle text-18px text-[#2e7d32] mr-1" />
-            <text class="text-15px font-600 text-[#2e7d32]">
-              复机
-            </text>
-          </view>
-
-          <view
-            class="
-              flex-1 py-3 rounded-12px center
-              bg-[#212121]
-              transition-all duration-200
-              active:bg-[#000]
-            "
-            @click="viewWallet"
-          >
-            <i class="i-mdi-wallet text-18px text-white mr-1" />
-            <text class="text-15px font-600 text-white">
-              查看钱包
-            </text>
           </view>
         </view>
       </view>
 
-      <!-- 底部留白 -->
-      <view class="h-8" />
     </view>
+
+    <!-- 设备详情 -->
+    <view v-else-if="isDevice && deviceInfo" class="px-4 pt-4 pb-4">
+      <!-- 设备基本信息卡 -->
+      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden">
+        <!-- 顶部状态栏 -->
+        <view class="px-4 pt-4 pb-3 border-b-1px border-[#f5f5f5]">
+          <view v-if="false" class="flex items-center justify-between mb-2">
+            <view class="flex items-center gap-2">
+              <view>
+                <text class="text-16px font-700 text-[#212121] block mb-0.5">
+                  {{ deviceInfo.device_name }}
+                </text>
+                <!-- 信号条和信号质量 -->
+                <view v-if="realtimeStatus?.device_realtime?.rsrp !== undefined" class="flex items-center gap-1.5">
+                  <view class="flex items-end gap-0.5">
+                    <view v-for="i in 5" :key="i" class="w-3px rounded-full transition-all"
+                      :class="i <= getSignalBars(realtimeStatus.device_realtime.rsrp) ? 'opacity-100' : 'opacity-20'"
+                      :style="{
+                        height: `${i * 2 + 4}px`,
+                        backgroundColor:
+                          i <= getSignalBars(realtimeStatus.device_realtime.rsrp)
+                            ? getSignalQuality(realtimeStatus.device_realtime.rsrp).color
+                            : '#ddd',
+                      }" />
+                  </view>
+                  <text class="text-11px font-600"
+                    :style="{ color: getSignalQuality(realtimeStatus.device_realtime.rsrp).color }">
+                    {{ getSignalQuality(realtimeStatus.device_realtime.rsrp).level }}
+                  </text>
+                </view>
+              </view>
+            </view>
+            <view :style="{
+                backgroundColor: getDeviceStatusColor(deviceInfo.status).bg,
+                color: getDeviceStatusColor(deviceInfo.status).text,
+              }" class="px-3 py-1 rounded-8px text-12px font-600">
+              {{ getDeviceStatusText(deviceInfo.status) }}
+            </view>
+          </view>
+
+          <text class="text-12px text-[#999]">
+            {{ deviceInfo.current_package || '无套餐' }}
+          </text>
+        </view>
+
+        <!-- 设备基本信息 -->
+        <view class="px-4 py-3">
+          <view class="space-y-2">
+            <!-- 虚拟号 -->
+            <view v-if="deviceInfo.virtual_no" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">虚拟号</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ deviceInfo.virtual_no }}
+              </text>
+            </view>
+
+            <!-- IMEI -->
+            <view v-if="deviceInfo.imei" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">IMEI</text>
+              <text class="flex-1 text-13px text-[#212121] text-right break-all">
+                {{ deviceInfo.imei }}
+              </text>
+            </view>
+
+            <!-- 设备型号 -->
+            <view v-if="deviceInfo.device_model" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">设备型号</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ deviceInfo.device_model }}
+              </text>
+            </view>
+
+            <!-- 最大卡槽数 -->
+            <view v-if="deviceInfo.max_sim_slots" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">最大卡槽</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ deviceInfo.max_sim_slots }} 个
+              </text>
+            </view>
+
+            <!-- 绑定卡数 -->
+            <view v-if="deviceInfo.bound_card_count !== undefined" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">绑定卡数</text>
+              <text class="flex-1 text-13px font-600 text-[var(--brand-primary)] text-right">
+                {{ deviceInfo.bound_card_count }} 张
+              </text>
+            </view>
+
+            <!-- 店铺信息 -->
+            <view v-if="deviceInfo.shop_name" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">所属店铺</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ deviceInfo.shop_name }}
+              </text>
+            </view>
+
+            <!-- 套餐系列 -->
+            <view v-if="deviceInfo.series_name" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">套餐系列</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ deviceInfo.series_name }}
+              </text>
+            </view>
+
+            <!-- 实名状态 -->
+            <view v-if="deviceInfo.real_name_status !== undefined" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">实名状态</text>
+              <text class="flex-1 text-13px text-[#212121] text-right">
+                {{ getRealNameStatusText(deviceInfo.real_name_status) }}
+              </text>
+            </view>
+
+            <!-- 累计充值 -->
+            <view v-if="deviceInfo.accumulated_recharge !== undefined" class="flex items-start justify-between">
+              <text class="text-12px text-[#999] w-80px">累计充值</text>
+              <text class="flex-1 text-13px font-600 text-[var(--brand-primary)] text-right">
+                ¥{{ deviceInfo.accumulated_recharge }}
+              </text>
+            </view>
+          </view>
+        </view>
+
+        <!-- 套餐使用情况 -->
+        <view v-if="deviceInfo.package_total_mb !== undefined && deviceInfo.package_total_mb > 0" class="px-4 pb-4">
+          <view class="bg-[#f5f5f5] rounded-12px p-3">
+            <view class="flex items-center justify-between mb-2">
+              <text class="text-12px text-[#999]">
+                套餐流量
+              </text>
+              <text class="text-12px font-600 text-[#212121]">
+                {{ formatDataSize(deviceInfo.package_used_mb) }} / {{ formatDataSize(deviceInfo.package_total_mb) }}
+              </text>
+            </view>
+
+            <!-- 进度条 -->
+            <view class="h-6px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{
+                  width: `${((deviceInfo.package_used_mb || 0) / deviceInfo.package_total_mb) * 100}%`,
+                }" :class="[
+                  'h-full rounded-full transition-all duration-300',
+                  ((deviceInfo.package_used_mb || 0) / deviceInfo.package_total_mb) > 0.9
+                    ? 'bg-[#ff6b6b]'
+                    : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+          <view class="flex items-center justify-between mt-2">
+            <text class="text-11px text-[#999]">
+              剩余: {{ formatDataSize(deviceInfo.package_remain_mb) }}
+            </text>
+          </view>
+        </view>
+      </view>
+
+      <!-- 绑定卡片列表 -->
+      <view v-if="deviceInfo.cards && deviceInfo.cards.length > 0" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
+        <text class="text-13px font-600 text-[#212121] block mb-2">绑定IoT卡</text>
+        <view class="space-y-2">
+          <view v-for="card in deviceInfo.cards" :key="card.card_id" class="bg-[#f5f5f5] rounded-12px p-3">
+            <view class="flex items-center justify-between mb-1">
+              <view class="flex items-center gap-2 min-w-0">
+                <text class="text-12px text-[#212121]">卡槽 {{ card.slot_position }}</text>
+                <text :class="[
+                    'px-2 py-0.5 rounded-full text-11px font-600',
+                    getRealNameStatusTagClass(card.real_name_status),
+                  ]">
+                  {{ getRealNameStatusText(card.real_name_status) }}
+                </text>
+              </view>
+              <text v-if="card.is_current" class="text-11px text-white bg-[#3ed268] px-2 py-0.5 rounded">
+                当前
+              </text>
+            </view>
+            <view class="space-y-1">
+              <text class="text-11px text-[#666] block">ICCID: {{ card.iccid }}</text>
+              <text class="text-11px text-[#666] block">MSISDN: {{ card.msisdn || '-' }}</text>
+              <text class="text-11px text-[#666] block">运营商: {{ card.carrier_name || '-' }}</text>
+              <view class="flex items-center justify-between">
+                <text class="text-11px text-[#666]">
+                  网络: {{ getNetworkStatusText(card.network_status) }}
+                </text>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 设备实时状态 -->
+      <view v-if="realtimeStatus?.device_realtime" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
+        <text class="text-13px font-600 text-[#212121] block mb-2">设备实时状态</text>
+
+        <!-- 在线状态 -->
+        <view class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
+          <view class="flex items-center justify-between mb-2">
+            <text class="text-12px text-[#666]">在线状态</text>
+            <view :class="[
+                'px-2 py-0.5 rounded text-11px font-600',
+                realtimeStatus.device_realtime.online_status === 1 ? 'bg-[#e8f5e9] text-[#2e7d32]' : 'bg-[#f5f5f5] text-[#999]',
+              ]">
+              {{ getOnlineStatusText(realtimeStatus.device_realtime.online_status) }}
+            </view>
+          </view>
+
+          <view class="space-y-1">
+            <!-- 电池电量 -->
+            <view v-if="realtimeStatus.device_realtime.battery_level !== undefined"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">电池电量</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.battery_level }}%</text>
+            </view>
+
+            <!-- 连接客户端 -->
+            <view v-if="realtimeStatus.device_realtime.client_number !== undefined"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">连接客户端</text>
+              <text class="text-[#212121]">
+                {{ realtimeStatus.device_realtime.client_number }} /
+                {{ realtimeStatus.device_realtime.max_clients }}
+              </text>
+            </view>
+
+            <!-- 连接时长 -->
+            <view v-if="realtimeStatus.device_realtime.connect_time"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">连接时长</text>
+              <text class="text-[#212121]">{{ formatDuration(realtimeStatus.device_realtime.connect_time) }}</text>
+            </view>
+
+            <!-- 运行时长 -->
+            <view v-if="realtimeStatus.device_realtime.run_time" class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">运行时长</text>
+              <text class="text-[#212121]">{{ formatDuration(realtimeStatus.device_realtime.run_time) }}</text>
+            </view>
+
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">最后上线时间</text>
+              <text class="text-[#212121]">{{ getDeviceLastOnlineTime() }}</text>
+            </view>
+
+            <!-- 信号 -->
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">信号</text>
+              <text class="text-[#212121]">{{ getDisplayValue(realtimeStatus.device_realtime.signal_quality) }}</text>
+            </view>
+
+            <!-- 信号差原因 -->
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">信号差原因</text>
+              <text class="text-[#212121]">{{ getDisplayValue(realtimeStatus.device_realtime.signal_bad_reason) }}</text>
+            </view>
+          </view>
+        </view>
+
+        <!-- 流量统计 -->
+        <view class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
+          <text class="text-12px text-[#666] block mb-2">流量统计</text>
+          <view class="space-y-1">
+            <!-- 今日用量 -->
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">今日用量</text>
+              <text class="text-[var(--brand-primary)] font-600">{{ formatBytesDisplay(realtimeStatus.device_realtime.daily_usage) }}</text>
+            </view>
+
+            <!-- 限速 -->
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">限速</text>
+              <text class="text-[#212121]">
+                {{ isEmptyDisplayValue(realtimeStatus.device_realtime.limit_speed) ? '-' : `${realtimeStatus.device_realtime.limit_speed} Mbps` }}
+              </text>
+            </view>
+          </view>
+        </view>
+
+        <!-- 网络信息 -->
+        <view class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
+          <text class="text-12px text-[#666] block mb-2">网络信息</text>
+          <view class="space-y-1">
+            <!-- IP地址 -->
+            <view v-if="realtimeStatus.device_realtime.ip_address" class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">IP地址</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.ip_address }}</text>
+            </view>
+
+            <!-- LAN IP -->
+            <view v-if="realtimeStatus.device_realtime.lan_ip" class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">LAN IP</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.lan_ip }}</text>
+            </view>
+
+            <!-- WAN IP -->
+            <view v-if="realtimeStatus.device_realtime.wan_ip" class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">WAN IP</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.wan_ip }}</text>
+            </view>
+
+            <!-- MAC地址 -->
+            <view v-if="realtimeStatus.device_realtime.mac_address" class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">MAC地址</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.mac_address }}</text>
+            </view>
+          </view>
+        </view>
+
+        <!-- WiFi信息 -->
+        <view v-if="realtimeStatus.device_realtime.ssid" class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
+          <text class="text-12px text-[#666] block mb-2">WiFi信息</text>
+          <view class="space-y-1">
+            <!-- WiFi名称 -->
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">WiFi名称</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.ssid }}</text>
+            </view>
+
+            <!-- WiFi状态 -->
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">WiFi状态</text>
+              <text :class="realtimeStatus.device_realtime.wifi_enabled ? 'text-[#2e7d32]' : 'text-[#999]'">
+                {{ realtimeStatus.device_realtime.wifi_enabled ? '已开启' : '已关闭' }}
+              </text>
+            </view>
+
+            <!-- WiFi密码 -->
+            <view v-if="realtimeStatus.device_realtime.wifi_password"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">WiFi密码</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.wifi_password }}</text>
+            </view>
+          </view>
+        </view>
+
+        <!-- 其他信息 -->
+        <view class="bg-[#f5f5f5] rounded-12px p-3">
+          <view class="space-y-1">
+            <!-- 软件版本 -->
+            <view v-if="realtimeStatus.device_realtime.software_version"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">软件版本</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.software_version }}</text>
+            </view>
+
+            <!-- IMSI -->
+            <view v-if="realtimeStatus.device_realtime.imsi" class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">IMSI</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.imsi }}</text>
+            </view>
+
+            <!-- 当前ICCID -->
+            <view v-if="realtimeStatus.device_realtime.current_iccid"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">当前ICCID</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.current_iccid }}</text>
+            </view>
+
+            <!-- 同步间隔 -->
+            <view v-if="realtimeStatus.device_realtime.sync_interval"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">同步间隔</text>
+              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.sync_interval }}秒</text>
+            </view>
+
+            <!-- 最后更新 -->
+            <view v-if="realtimeStatus.device_realtime.last_update_time"
+              class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">最后更新</text>
+              <text class="text-[#999]">{{ formatTime(realtimeStatus.device_realtime.last_update_time) }}</text>
+            </view>
+          </view>
+        </view>
+      </view>
+
+      <!-- 套餐信息 -->
+      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
+        <view class="flex items-center justify-between mb-2">
+          <text class="text-13px font-600 text-[#212121]">当前生效套餐</text>
+          <view v-if="false && currentPackage" class="flex items-center gap-1 px-2 py-1 rounded-8px bg-[#f5f5f5]"
+            @click="togglePackageList">
+            <text class="text-11px text-[#666]">全部套餐</text>
+            <i :class="[
+                'text-14px text-[#999] transition-transform',
+                showPackageList ? 'i-mdi-chevron-up' : 'i-mdi-chevron-down',
+              ]" />
+          </view>
+        </view>
+
+        <!-- 当前套餐 -->
+        <view v-if="currentPackage" class="bg-[#f5f5f5] rounded-12px p-3">
+          <view class="flex items-start justify-between gap-3 mb-3">
+            <view class="min-w-0 flex-1">
+              <text class="text-14px font-600 text-[#212121] block break-all">
+                {{ currentPackage.package_name || '-' }}
+              </text>
+              <text class="text-11px text-[#64748b] block mt-1 break-all">
+                {{ formatCurrentPackagePeriodRange(currentPackage.activated_at, currentPackage.expires_at) }}
+              </text>
+            </view>
+            <view :style="{
+                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
+                color: getPackageStatusColor(currentPackage.status).text,
+              }" class="px-2 py-0.5 rounded text-10px font-600">
+              {{ currentPackage.status_name || '-' }}
+            </view>
+          </view>
+
+          <view class="grid grid-cols-3 gap-2 mb-3">
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">总量</text>
+              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
+            </view>
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">已使用</text>
+              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
+            </view>
+            <view class="bg-white rounded-8px p-2 text-center">
+              <text class="text-10px text-[#999] block mb-1">剩余</text>
+              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
+            </view>
+          </view>
+
+          <view class="bg-white rounded-8px p-2 mb-3">
+            <view class="flex items-center justify-between mb-1">
+              <text class="text-11px text-[#666]">已使用</text>
+              <text class="text-11px font-600 text-[#212121]">
+                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
+                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
+              </text>
+            </view>
+            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
+                  'h-full rounded-full transition-all',
+                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+          <view class="space-y-1 mb-1">
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">套餐价格</text>
+              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">套餐类型</text>
+              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
+            </view>
+            <view class="flex items-center justify-between text-11px">
+              <text class="text-[#666]">下单时间</text>
+              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
+            </view>
+          </view>
+
+          <!-- 套餐名称和状态 -->
+          <view v-if="false" class="flex items-center justify-between mb-2">
+            <view class="flex items-center gap-2">
+              <i :class="[
+                  'text-16px',
+                  currentPackage.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
+                ]" />
+              <text class="text-14px font-600 text-[#212121]">
+                {{ currentPackage.package_name }}
+              </text>
+            </view>
+            <view :style="{
+                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
+                color: getPackageStatusColor(currentPackage.status).text,
+              }" class="px-2 py-0.5 rounded text-10px font-600">
+              {{ currentPackage.status_name }}
+            </view>
+          </view>
+
+          <!-- 流量使用进度 -->
+          <view v-if="false" class="bg-white rounded-8px p-2 mb-2">
+            <view class="flex items-center justify-between mb-1">
+              <text class="text-11px text-[#666]">虚拟流量</text>
+              <text class="text-11px font-600 text-[#212121]">
+                {{ formatDataSize(currentPackage.virtual_used_mb) }} /
+                {{ formatDataSize(currentPackage.virtual_limit_mb) }}
+              </text>
+            </view>
+            <!-- 进度条 -->
+            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
+              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
+                  'h-full rounded-full transition-all',
+                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
+                ]" />
+            </view>
+          </view>
+
+
+        </view>
+
+        <!-- 无套餐提示 -->
+        <view v-else class="bg-[#f5f5f5] rounded-12px p-4 flex flex-col items-center">
+          <i class="i-mdi-package-variant-closed text-40px text-[#ddd] mb-2" />
+          <text class="text-12px text-[#999]">暂无生效套餐</text>
+        </view>
+
+        <!-- 套餐列表 -->
+        <view v-if="packageList.length > 0" class="mt-3">
+          <text class="text-13px font-600 text-[#212121] block mb-2">套餐列表 ({{ packageList.length }})</text>
+          <view class="space-y-2">
+            <view v-for="pkg in packageList" :key="pkg.package_usage_id" class="bg-[#f5f5f5] rounded-12px p-3">
+              <!-- 套餐头部 -->
+              <view class="flex items-center justify-between mb-2">
+                <view class="flex items-center gap-1.5">
+                  <i :class="[
+                      'text-14px',
+                      pkg.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
+                    ]" />
+                  <text class="text-13px font-600 text-[#212121]">{{ pkg.package_name }}</text>
+                  <text v-if="pkg.master_usage_id" class="text-10px text-[#999]">(加油包)</text>
+                </view>
+                <view :style="{
+                    backgroundColor: getPackageStatusColor(pkg.status).bg,
+                    color: getPackageStatusColor(pkg.status).text,
+                  }" class="px-2 py-0.5 rounded text-10px font-600">
+                  {{ pkg.status_name }}
+                </view>
+              </view>
+
+              <!-- 流量信息 -->
+              <view class="space-y-0.5">
+                <view class="flex items-center justify-between text-11px">
+                  <text class="text-[#666]">已使用</text>
+                  <text class="text-[#212121]">
+                    {{ formatPackageDataSize(getPackageUsedMb(pkg)) }} / {{ formatPackageDataSize(getPackageTotalMb(pkg)) }}
+                  </text>
+                </view>
+                <view class="flex items-center justify-between text-11px">
+                  <text class="text-[#666]">剩余</text>
+                  <text class="text-[#212121]">{{ formatPackageDataSize(getPackageRemainMb(pkg)) }}</text>
+                </view>
+                <view class="flex items-center justify-between text-11px">
+                  <text class="text-[#666]">金额</text>
+                  <text class="text-[#212121]">{{ formatPackagePrice(pkg.paid_amount) }}</text>
+                </view>
+                <view
+                  v-if="pkg.status === 1"
+                  class="mt-2 flex items-start gap-2 rounded-10px border border-[#ffd591] bg-[#fff7e6] px-3 py-2"
+                >
+                  <i class="i-mdi-calendar-clock mt-2px shrink-0 text-14px text-[#d46b08]" />
+                  <text class="text-12px font-700 leading-5 text-[#ad4e00]">
+                    {{ formatPackageEffectivePeriod(pkg.activated_at, pkg.expires_at) }}
+                  </text>
+                </view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <!-- 空状态 -->
+    <view v-else class="px-4 pt-20 flex flex-col items-center">
+      <i class="i-mdi-package-variant-closed text-6xl text-[#cbd5e1] mb-3" />
+      <text class="text-base text-[#64748b]">暂无数据</text>
+    </view>
+
+    <!-- 底部留白 -->
+    <view class="h-8" />
   </view>
 </template>
 
 <style scoped>
-.center {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.space-y-3 > view:not(:last-child) {
-  margin-bottom: 12px;
-}
-
-.break-all {
-  word-break: break-all;
-}
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
+  .space-y-2>view:not(:last-child) {
+    margin-bottom: 8px;
   }
-  to {
-    transform: rotate(360deg);
-  }
-}
 
-.animate-spin {
-  animation: spin 1s linear infinite;
-}
+  .break-all {
+    word-break: break-all;
+  }
 </style>
diff --git a/src/pages/agent-system/asset-search/index.vue b/src/pages/agent-system/asset-search/index.vue
deleted file mode 100644
index 5df940f..0000000
--- a/src/pages/agent-system/asset-search/index.vue
+++ /dev/null
@@ -1,1391 +0,0 @@
-<script setup lang="ts">
-  import { ref, computed, onMounted } from 'vue'
-  import { resolveAsset, getAssetRealtimeStatus, getCurrentPackage, getAssetPackages } from '@/api/assets'
-  import type { AssetRealtimeStatus, AssetPackage } from '@/api/assets'
-  import { formatTime, formatDataSize } from '@/utils/format'
-  import { formatPackageDataSize, formatPackagePrice, getPackageRemainMb, getPackageTotalMb, getPackageUsagePercent, getPackageUsedMb } from '../package-display'
-
-  // 搜索关键词
-  const searchKeyword = ref('')
-  // 资产类型
-  const assetType = ref<'card' | 'device' | null>(null)
-  // 资产信息
-  const assetInfo = ref<any>(null)
-  // 资产实时状态
-  const realtimeStatus = ref<AssetRealtimeStatus | null>(null)
-  // 当前套餐
-  const currentPackage = ref<AssetPackage | null>(null)
-  const packageList = ref<AssetPackage[]>([])
-  const showPackageList = ref(true)
-  // 套餐列表
-  // 是否展开套餐列表
-
-  // 是否为卡片
-  const isCard = computed(() => assetType.value === 'card')
-  // 是否为设备
-  const isDevice = computed(() => assetType.value === 'device')
-  // 卡片信息
-  const cardInfo = computed(() => isCard.value ? assetInfo.value : null)
-  // 设备信息
-  const deviceInfo = computed(() => isDevice.value ? assetInfo.value : null)
-
-  // 搜索资产
-  async function handleSearch() {
-    if (!searchKeyword.value.trim()) {
-      return
-    }
-
-    try {
-      const result = await resolveAsset(searchKeyword.value.trim())
-      assetType.value = result.asset_type
-      assetInfo.value = result
-
-      // 加载实时状态和当前套餐 (使用 identifier)
-      if (searchKeyword.value.trim()) {
-        loadRealtimeStatus(searchKeyword.value.trim())
-        loadCurrentPackage(searchKeyword.value.trim())
-        loadPackageList(searchKeyword.value.trim())
-      }
-    } catch (error : any) {
-      console.error('查询失败:', error)
-      assetType.value = null
-      assetInfo.value = null
-      realtimeStatus.value = null
-      currentPackage.value = null
-      packageList.value = []
-    }
-  }
-
-  // 加载实时状态
-  async function loadRealtimeStatus(identifier : string) {
-    try {
-      const status = await getAssetRealtimeStatus(identifier)
-      realtimeStatus.value = status
-    } catch (error : any) {
-      console.error('加载实时状态失败:', error)
-    }
-  }
-
-  // 加载当前套餐
-  async function loadCurrentPackage(identifier : string) {
-    try {
-      console.log('开始加载当前套餐:', identifier)
-      const pkg = await getCurrentPackage(identifier)
-      console.log('当前套餐数据:', pkg)
-      currentPackage.value = pkg
-    } catch (error : any) {
-      console.error('加载当前套餐失败:', error)
-      // 如果没有当前套餐（404），这是正常的，不需要提示用户
-      currentPackage.value = null
-    }
-  }
-
-  // 加载套餐列表
-  async function loadPackageList(identifier : string) {
-    try {
-      console.log('开始加载套餐列表:', identifier)
-      const response = await getAssetPackages(identifier, { page: 1, page_size: 50 })
-      console.log('套餐列表数据:', response)
-      packageList.value = response?.items || []
-    } catch (error : any) {
-      console.error('加载套餐列表失败:', error)
-      packageList.value = []
-    }
-  }
-
-  // 切换套餐列表显示
-  async function togglePackageList() {
-    showPackageList.value = !showPackageList.value
-    // 第一次展开时加载套餐列表
-    if (showPackageList.value && packageList.value.length === 0 && searchKeyword.value.trim()) {
-      await loadPackageList(searchKeyword.value.trim())
-    }
-  }
-
-  // 获取卡片状态文本
-  function getCardStatusText(status ?: number) {
-    const map : Record<number, string> = {
-      0: '未激活',
-      1: '正常',
-      2: '停机',
-      3: '已停用',
-    }
-    return status !== undefined ? map[status] || '未知' : '未知'
-  }
-
-  // 获取实名状态文本
-  function getRealNameStatusText(status ?: number) {
-    const map : Record<number, string> = {
-      0: '未实名',
-      1: '已实名',
-    }
-    return status !== undefined ? map[status] || '未知' : '未知'
-  }
-
-  function getRealNameStatusTagClass(status ?: number | null) {
-    return status === 1
-      ? 'bg-[#e8f5e9] text-[#2e7d32]'
-      : 'bg-[#fff1f0] text-[#cf1322]'
-  }
-
-  // 获取网络状态文本 (卡片)
-  function getNetworkStatusText(status ?: number) {
-    const map : Record<number, string> = {
-      0: '停机',
-      1: '正常',
-    }
-    return status !== undefined ? map[status] || '未知' : '未知'
-  }
-
-  // 格式化字节数
-  function formatBytes(bytes ?: string | number | null) {
-    if (!bytes) return '0B'
-    const num = typeof bytes === 'string' ? parseInt(bytes) : bytes
-    if (num < 1024) return `${num}B`
-    if (num < 1024 * 1024) return `${(num / 1024).toFixed(2)}KB`
-    if (num < 1024 * 1024 * 1024) return `${(num / 1024 / 1024).toFixed(2)}MB`
-    return `${(num / 1024 / 1024 / 1024).toFixed(2)}GB`
-  }
-
-  function isEmptyDisplayValue(value ?: string | number | null) {
-    return value === null || value === undefined || (typeof value === 'string' && value.trim() === '')
-  }
-
-  function getDisplayValue(value ?: string | number | null) {
-    return isEmptyDisplayValue(value) ? '-' : String(value)
-  }
-
-  function formatBytesDisplay(bytes ?: string | number | null) {
-    return isEmptyDisplayValue(bytes) ? '-' : formatBytes(bytes)
-  }
-
-  // 格式化时长（秒）
-  function formatDuration(seconds ?: string | number) {
-    if (!seconds) return '0秒'
-    const num = typeof seconds === 'string' ? parseInt(seconds) : seconds
-    const hours = Math.floor(num / 3600)
-    const minutes = Math.floor((num % 3600) / 60)
-    const secs = num % 60
-    if (hours > 0) return `${hours}小时${minutes}分钟`
-    if (minutes > 0) return `${minutes}分钟${secs}秒`
-    return `${secs}秒`
-  }
-
-  // 获取在线状态文本
-  function getOnlineStatusText(status ?: number) {
-    return status === 1 ? '在线' : '离线'
-  }
-
-  // 获取套餐状态颜色
-  function getPackageStatusColor(status : number) {
-    const map : Record<number, { bg : string, text : string }> = {
-      0: { bg: '#fff3e0', text: '#e65100' }, // 待生效
-      1: { bg: '#e8f5e9', text: '#2e7d32' }, // 生效中
-      2: { bg: '#f5f5f5', text: '#999' }, // 已用完
-      3: { bg: '#ffebee', text: '#c62828' }, // 已过期
-      4: { bg: '#f5f5f5', text: '#999' }, // 已失效
-    }
-    return map[status] || { bg: '#f5f5f5', text: '#999' }
-  }
-
-  function getPackageTypeText(type ?: AssetPackage['package_type']) {
-    const map : Record<string, string> = {
-      formal: '正式套餐',
-      addon: '加油包',
-    }
-    return type ? map[type] || type : '-'
-  }
-
-  function formatPackageEffectivePeriod(activatedAt ?: string | null, expiresAt ?: string | null) {
-    return `生效期：${formatTime(activatedAt || undefined, 'date')} 至 ${formatTime(expiresAt || undefined, 'date')}`
-  }
-
-  function formatCurrentPackagePeriodRange(activatedAt ?: string | null, expiresAt ?: string | null) {
-    return `生效期：${formatTime(activatedAt || undefined, 'date')} - ${formatTime(expiresAt || undefined, 'date')}`
-  }
-
-  function getDeviceLastOnlineTime() {
-    const lastOnlineTime = realtimeStatus.value?.device_realtime?.last_online_time || deviceInfo.value?.last_online_time
-    return lastOnlineTime ? formatTime(lastOnlineTime) : '-'
-  }
-
-  // 获取信号质量等级 (基于 RSRP)
-  function getSignalQuality(rsrp ?: number) {
-    if (rsrp === undefined) return { level: '未知', text: '无信号', color: '#999' }
-
-    if (rsrp >= -80) {
-      return { level: '优秀', text: '信号极好', color: '#2e7d32' }
-    } else if (rsrp >= -90) {
-      return { level: '良好', text: '信号良好', color: '#66bb6a' }
-    } else if (rsrp >= -100) {
-      return { level: '一般', text: '信号一般', color: '#ffa726' }
-    } else if (rsrp >= -110) {
-      return { level: '较差', text: '信号较差', color: '#ff6b6b' }
-    } else {
-      return { level: '很差', text: '信号很差', color: '#d32f2f' }
-    }
-  }
-
-  // 获取信号条数（1-5条）
-  function getSignalBars(rsrp ?: number) {
-    if (rsrp === undefined || rsrp < -110) return 0
-    if (rsrp >= -80) return 5
-    if (rsrp >= -90) return 4
-    if (rsrp >= -100) return 3
-    if (rsrp >= -110) return 2
-    return 1
-  }
-
-  // 获取卡片状态颜色
-  function getCardStatusColor(status ?: number) {
-    const map : Record<number, { bg : string, text : string }> = {
-      0: { bg: '#f5f5f5', text: '#999' },
-      1: { bg: '#e8f5e9', text: '#2e7d32' },
-      2: { bg: '#ffebee', text: '#c62828' },
-      3: { bg: '#f5f5f5', text: '#999' },
-    }
-    return status !== undefined ? map[status] : { bg: '#f5f5f5', text: '#999' }
-  }
-
-
-  // 获取设备状态文本
-  function getDeviceStatusText(status ?: number) {
-    const map : Record<number, string> = {
-      0: '未激活',
-      1: '正常',
-      2: '停机',
-      3: '已停用',
-    }
-    return status !== undefined ? map[status] || '未知' : '未知'
-  }
-
-  // 获取设备状态颜色
-  function getDeviceStatusColor(status ?: number) {
-    const map : Record<number, { bg : string, text : string }> = {
-      0: { bg: '#f5f5f5', text: '#999' },
-      1: { bg: '#e8f5e9', text: '#2e7d32' },
-      2: { bg: '#ffebee', text: '#c62828' },
-      3: { bg: '#f5f5f5', text: '#999' },
-    }
-    return status !== undefined ? map[status] : { bg: '#f5f5f5', text: '#999' }
-  }
-
-  onMounted(() => {
-    const pages = getCurrentPages()
-    const currentPage = pages[pages.length - 1] as any
-    const options = currentPage.options || {}
-
-    // 如果有 iccid 或 virtual_no 参数,自动搜索
-    if (options.iccid) {
-      searchKeyword.value = options.iccid
-      handleSearch()
-    } else if (options.virtual_no) {
-      searchKeyword.value = options.virtual_no
-      handleSearch()
-    }
-  })
-</script>
-
-<template>
-  <view class="bg-page min-h-screen pb-safe">
-    <!-- IoT卡详情 -->
-    <view v-if="isCard && cardInfo" class="px-4 pt-4 pb-4">
-      <!-- 卡片基本信息卡 -->
-      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden">
-        <!-- 顶部状态栏 -->
-        <view class="px-4 pt-4 pb-3 border-b-1px border-[#f5f5f5]">
-          <view v-if="false" class="flex items-center justify-between mb-2">
-            <view class="flex items-center gap-2">
-              <text class="text-16px font-700 text-[#212121]">
-                IoT卡
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getCardStatusColor(cardInfo.status).bg,
-                color: getCardStatusColor(cardInfo.status).text,
-              }" class="px-3 py-1 rounded-8px text-12px font-600">
-              {{ getCardStatusText(cardInfo.status) }}
-            </view>
-          </view>
-
-          <text class="text-12px text-[#999]">
-            {{ cardInfo.current_package || '无套餐' }}
-          </text>
-        </view>
-
-        <!-- 卡片信息 -->
-        <view class="px-4 py-3">
-          <view class="space-y-2">
-            <!-- ICCID -->
-            <view class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">ICCID</text>
-              <text class="flex-1 text-13px text-[#212121] text-right break-all">
-                {{ cardInfo.iccid }}
-              </text>
-            </view>
-
-            <!-- 虚拟号 -->
-            <view v-if="cardInfo.virtual_no" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">虚拟号</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ cardInfo.virtual_no }}
-              </text>
-            </view>
-
-            <!-- msisdn -->
-            <view v-if="cardInfo.msisdn" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">msisdn</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ cardInfo.msisdn }}
-              </text>
-            </view>
-
-            <!-- 卡类型 -->
-            <view v-if="cardInfo.card_category" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">卡类型</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ cardInfo.card_category === 'normal' ? '普通卡' : cardInfo.card_category }}
-              </text>
-            </view>
-
-            <!-- 网络状态 -->
-            <view v-if="cardInfo.network_status !== undefined" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">网络状态</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ getNetworkStatusText(cardInfo.network_status) }}
-              </text>
-            </view>
-
-            <!-- 实名状态 -->
-            <view v-if="cardInfo.real_name_status !== undefined" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">实名状态</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ getRealNameStatusText(cardInfo.real_name_status) }}
-              </text>
-            </view>
-
-            <!-- 累计充值 -->
-            <view v-if="cardInfo.accumulated_recharge !== undefined" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-70px">累计充值</text>
-              <text class="flex-1 text-13px font-600 text-[var(--brand-primary)] text-right">
-                ¥{{ cardInfo.accumulated_recharge }}
-              </text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 套餐使用情况 -->
-        <view v-if="cardInfo.package_total_mb !== undefined && cardInfo.package_total_mb > 0" class="px-4 pb-4">
-          <view class="bg-[#f5f5f5] rounded-12px p-3">
-            <view class="flex items-center justify-between mb-2">
-              <text class="text-12px text-[#999]">
-                套餐流量
-              </text>
-              <text class="text-12px font-600 text-[#212121]">
-                {{ formatDataSize(cardInfo.package_used_mb) }} / {{ formatDataSize(cardInfo.package_total_mb) }}
-              </text>
-            </view>
-
-            <!-- 进度条 -->
-            <view class="h-6px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{
-                  width: `${((cardInfo.package_used_mb || 0) / cardInfo.package_total_mb) * 100}%`,
-                }" :class="[
-                  'h-full rounded-full transition-all duration-300',
-                  ((cardInfo.package_used_mb || 0) / cardInfo.package_total_mb) > 0.9
-                    ? 'bg-[#ff6b6b]'
-                    : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <view class="flex items-center justify-between mt-2">
-            <text class="text-11px text-[#999]">
-              剩余: {{ formatDataSize(cardInfo.package_remain_mb) }}
-            </text>
-          </view>
-        </view>
-      </view>
-
-      <!-- 实时状态 -->
-      <view v-if="realtimeStatus && isCard" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
-        <text class="text-13px font-600 text-[#212121] block mb-2">实时状态</text>
-        <view class="bg-[#f5f5f5] rounded-12px p-3">
-          <view class="space-y-2">
-            <!-- 本月用量 -->
-            <view class="flex items-center justify-between">
-              <text class="text-12px text-[#666]">本月用量</text>
-              <text class="text-13px font-600 text-[var(--brand-primary)]">
-                {{
-                  realtimeStatus.current_month_usage_mb !== null && realtimeStatus.current_month_usage_mb !== undefined
-                    ? formatDataSize(realtimeStatus.current_month_usage_mb)
-                    : '0MB'
-                }}
-              </text>
-            </view>
-
-            <!-- 实时网络状态 -->
-            <view class="flex items-center justify-between">
-              <text class="text-12px text-[#666]">实时网络</text>
-              <view :class="[
-                  'px-2 py-0.5 rounded text-11px font-600',
-                  realtimeStatus.network_status === 1
-                    ? 'bg-[#e8f5e9] text-[#2e7d32]'
-                    : 'bg-[#ffebee] text-[#c62828]',
-                ]">
-                {{
-                  realtimeStatus.network_status !== null && realtimeStatus.network_status !== undefined
-                    ? getNetworkStatusText(realtimeStatus.network_status)
-                    : '未知'
-                }}
-              </view>
-            </view>
-
-            <!-- 实名状态 -->
-            <view class="flex items-center justify-between">
-              <text class="text-12px text-[#666]">实名状态</text>
-              <text class="text-13px text-[#212121]">
-                {{
-                  realtimeStatus.real_name_status !== null && realtimeStatus.real_name_status !== undefined
-                    ? getRealNameStatusText(realtimeStatus.real_name_status)
-                    : '未知'
-                }}
-              </text>
-            </view>
-
-            <!-- 最后同步时间 -->
-            <view v-if="realtimeStatus.last_sync_time"
-              class="flex items-center justify-between pt-1 border-t-1px border-[#e5e7eb]">
-              <text class="text-11px text-[#999]">最后同步</text>
-              <text class="text-11px text-[#999]">
-                {{ formatTime(realtimeStatus.last_sync_time) }}
-              </text>
-            </view>
-          </view>
-        </view>
-      </view>
-
-      <!-- 套餐信息 -->
-      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
-        <view class="flex items-center justify-between mb-2">
-          <text class="text-13px font-600 text-[#212121]">当前生效套餐</text>
-          <view v-if="false && currentPackage" class="flex items-center gap-1 px-2 py-1 rounded-8px bg-[#f5f5f5]"
-            @click="togglePackageList">
-            <text class="text-11px text-[#666]">全部套餐</text>
-            <i :class="[
-                'text-14px text-[#999] transition-transform',
-                showPackageList ? 'i-mdi-chevron-up' : 'i-mdi-chevron-down',
-              ]" />
-          </view>
-        </view>
-
-        <!-- 当前套餐 -->
-        <view v-if="currentPackage" class="bg-[#f5f5f5] rounded-12px p-3">
-          <view class="flex items-start justify-between gap-3 mb-3">
-            <view class="min-w-0 flex-1">
-              <text class="text-14px font-600 text-[#212121] block break-all">
-                {{ currentPackage.package_name || '-' }}
-              </text>
-              <text class="text-11px text-[#64748b] block mt-1 break-all">
-                {{ formatCurrentPackagePeriodRange(currentPackage.activated_at, currentPackage.expires_at) }}
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
-                color: getPackageStatusColor(currentPackage.status).text,
-              }" class="px-2 py-0.5 rounded text-10px font-600">
-              {{ currentPackage.status_name || '-' }}
-            </view>
-          </view>
-
-          <view class="grid grid-cols-3 gap-2 mb-3">
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">总量</text>
-              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">已使用</text>
-              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">剩余</text>
-              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
-            </view>
-          </view>
-
-          <view class="bg-white rounded-8px p-2 mb-3">
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-11px text-[#666]">已使用</text>
-              <text class="text-11px font-600 text-[#212121]">
-                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
-                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
-              </text>
-            </view>
-            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
-                  'h-full rounded-full transition-all',
-                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <view class="space-y-1 mb-1">
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐价格</text>
-              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐类型</text>
-              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">下单时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
-            </view>
-          </view>
-          <view v-if="false" class="flex items-start justify-between gap-3 mb-3">
-            <view class="min-w-0 flex-1">
-              <text class="text-14px font-600 text-[#212121] block break-all">
-                {{ currentPackage.package_name || '-' }}
-              </text>
-              <text class="text-11px text-[#999] block mt-1 break-all">
-                订单号：{{ currentPackage.order_no || '-' }}
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
-                color: getPackageStatusColor(currentPackage.status).text,
-              }" class="px-2 py-0.5 rounded text-10px font-600">
-              {{ currentPackage.status_name || '-' }}
-            </view>
-          </view>
-
-          <view v-if="false" class="grid grid-cols-3 gap-2 mb-3">
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">总量</text>
-              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">已使用</text>
-              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">剩余</text>
-              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
-            </view>
-          </view>
-
-          <view v-if="false" class="bg-white rounded-8px p-2 mb-3">
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-11px text-[#666]">已使用</text>
-              <text class="text-11px font-600 text-[#212121]">
-                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
-                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
-              </text>
-            </view>
-            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
-                  'h-full rounded-full transition-all',
-                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <view v-if="false" class="space-y-1 mb-1">
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐价格</text>
-              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐类型</text>
-              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">开始时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.activated_at) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">到期时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.expires_at) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">下单时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
-            </view>
-          </view>
-          <view v-if="false" class="flex items-start justify-between gap-3 mb-3">
-            <view class="min-w-0 flex-1">
-              <text class="text-14px font-600 text-[#212121] block break-all">
-                {{ currentPackage.package_name || '-' }}
-              </text>
-              <text class="text-11px text-[#999] block mt-1 break-all">
-                订单号：{{ currentPackage.order_no || '-' }}
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
-                color: getPackageStatusColor(currentPackage.status).text,
-              }" class="px-2 py-0.5 rounded text-10px font-600">
-              {{ currentPackage.status_name || '-' }}
-            </view>
-          </view>
-
-          <view v-if="false" class="grid grid-cols-3 gap-2 mb-3">
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">总量</text>
-              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">已使用</text>
-              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">剩余</text>
-              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
-            </view>
-          </view>
-
-          <view v-if="false" class="bg-white rounded-8px p-2 mb-3">
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-11px text-[#666]">已使用</text>
-              <text class="text-11px font-600 text-[#212121]">
-                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
-                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
-              </text>
-            </view>
-            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
-                  'h-full rounded-full transition-all',
-                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <view v-if="false" class="space-y-1 mb-1">
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐价格</text>
-              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐类型</text>
-              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">开始时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.activated_at) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">到期时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.expires_at) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">下单时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
-            </view>
-          </view>
-          <!-- 套餐名称和状态 -->
-          <view v-if="false" class="flex items-center justify-between mb-2">
-            <view class="flex items-center gap-2">
-              <i :class="[
-                  'text-16px',
-                  currentPackage.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
-                ]" />
-              <text class="text-14px font-600 text-[#212121]">
-                {{ currentPackage.package_name }}
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
-                color: getPackageStatusColor(currentPackage.status).text,
-              }" class="px-2 py-0.5 rounded text-10px font-600">
-              {{ currentPackage.status_name }}
-            </view>
-          </view>
-
-          <!-- 流量使用进度 -->
-          <view v-if="false" class="bg-white rounded-8px p-2 mb-2">
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-11px text-[#666]">虚拟流量</text>
-              <text class="text-11px font-600 text-[#212121]">
-                {{ formatDataSize(currentPackage.virtual_used_mb) }} /
-                {{ formatDataSize(currentPackage.virtual_limit_mb) }}
-              </text>
-            </view>
-            <!-- 进度条 -->
-            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
-                  'h-full rounded-full transition-all',
-                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <!-- 套餐详情 -->
-          <view v-if="false" class="space-y-1">
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">真实流量</text>
-              <text class="text-[#212121]">
-                {{ formatDataSize(currentPackage.data_usage_mb) }} /
-                {{ formatDataSize(currentPackage.data_limit_mb) }}
-              </text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">流量比例</text>
-              <text class="text-[#212121]">1 : {{ currentPackage.virtual_ratio }}</text>
-            </view>
-            <view v-if="currentPackage.expires_at"
-              class="flex items-center justify-between text-11px pt-1 border-t-1px border-[#e5e7eb]">
-              <text class="text-[#999]">到期时间</text>
-              <text class="text-[#999]">{{ formatTime(currentPackage.expires_at) }}</text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 无套餐提示 -->
-        <view v-else class="bg-[#f5f5f5] rounded-12px p-4 flex flex-col items-center">
-          <i class="i-mdi-package-variant-closed text-40px text-[#ddd] mb-2" />
-          <text class="text-12px text-[#999]">暂无生效套餐</text>
-        </view>
-
-        <!-- 套餐列表 -->
-        <view v-if="packageList.length > 0" class="mt-3">
-          <text class="text-13px font-600 text-[#212121] block mb-2">套餐列表 ({{ packageList.length }})</text>
-          <view class="space-y-2">
-            <view v-for="pkg in packageList" :key="pkg.package_usage_id" class="bg-[#f5f5f5] rounded-12px p-3">
-              <!-- 套餐头部 -->
-              <view class="flex items-center justify-between mb-2">
-                <view class="flex items-center gap-1.5">
-                  <i :class="[
-                      'text-14px',
-                      pkg.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
-                    ]" />
-                  <text class="text-13px font-600 text-[#212121]">{{ pkg.package_name }}</text>
-                  <text v-if="pkg.master_usage_id" class="text-10px text-[#999]">(加油包)</text>
-                </view>
-                <view :style="{
-                    backgroundColor: getPackageStatusColor(pkg.status).bg,
-                    color: getPackageStatusColor(pkg.status).text,
-                  }" class="px-2 py-0.5 rounded text-10px font-600">
-                  {{ pkg.status_name }}
-                </view>
-              </view>
-
-              <!-- 流量信息 -->
-              <view class="space-y-0.5">
-                <view class="flex items-center justify-between text-11px">
-                  <text class="text-[#666]">已使用</text>
-                  <text class="text-[#212121]">
-                    {{ formatPackageDataSize(getPackageUsedMb(pkg)) }} / {{ formatPackageDataSize(getPackageTotalMb(pkg)) }}
-                  </text>
-                </view>
-                <view class="flex items-center justify-between text-11px">
-                  <text class="text-[#666]">剩余</text>
-                  <text class="text-[#212121]">{{ formatPackageDataSize(getPackageRemainMb(pkg)) }}</text>
-                </view>
-                <view class="flex items-center justify-between text-11px">
-                  <text class="text-[#666]">金额</text>
-                  <text class="text-[#212121]">{{ formatPackagePrice(pkg.paid_amount) }}</text>
-                </view>
-                <view v-if="pkg.activated_at" class="flex items-center justify-between text-10px">
-                  <text class="text-[#999]">{{ formatTime(pkg.activated_at, 'date') }}</text>
-                  <text v-if="pkg.expires_at" class="text-[#999]">至 {{ formatTime(pkg.expires_at, 'date') }}</text>
-                </view>
-              </view>
-            </view>
-          </view>
-        </view>
-      </view>
-
-      <!-- 时间信息 -->
-      <view v-if="cardInfo.created_at" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-4">
-        <view class="bg-[#f5f5f5] rounded-12px p-3">
-          <view class="flex items-center justify-between text-11px text-[#999]">
-            <text>创建时间: {{ formatTime(cardInfo.created_at) }}</text>
-          </view>
-        </view>
-      </view>
-    </view>
-
-    <!-- 设备详情 -->
-    <view v-else-if="isDevice && deviceInfo" class="px-4 pt-4 pb-4">
-      <!-- 设备基本信息卡 -->
-      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden">
-        <!-- 顶部状态栏 -->
-        <view class="px-4 pt-4 pb-3 border-b-1px border-[#f5f5f5]">
-          <view v-if="false" class="flex items-center justify-between mb-2">
-            <view class="flex items-center gap-2">
-              <view>
-                <text class="text-16px font-700 text-[#212121] block mb-0.5">
-                  {{ deviceInfo.device_name }}
-                </text>
-                <!-- 信号条和信号质量 -->
-                <view v-if="realtimeStatus?.device_realtime?.rsrp !== undefined" class="flex items-center gap-1.5">
-                  <view class="flex items-end gap-0.5">
-                    <view v-for="i in 5" :key="i" class="w-3px rounded-full transition-all"
-                      :class="i <= getSignalBars(realtimeStatus.device_realtime.rsrp) ? 'opacity-100' : 'opacity-20'"
-                      :style="{
-                        height: `${i * 2 + 4}px`,
-                        backgroundColor:
-                          i <= getSignalBars(realtimeStatus.device_realtime.rsrp)
-                            ? getSignalQuality(realtimeStatus.device_realtime.rsrp).color
-                            : '#ddd',
-                      }" />
-                  </view>
-                  <text class="text-11px font-600"
-                    :style="{ color: getSignalQuality(realtimeStatus.device_realtime.rsrp).color }">
-                    {{ getSignalQuality(realtimeStatus.device_realtime.rsrp).level }}
-                  </text>
-                </view>
-              </view>
-            </view>
-            <view :style="{
-                backgroundColor: getDeviceStatusColor(deviceInfo.status).bg,
-                color: getDeviceStatusColor(deviceInfo.status).text,
-              }" class="px-3 py-1 rounded-8px text-12px font-600">
-              {{ getDeviceStatusText(deviceInfo.status) }}
-            </view>
-          </view>
-
-          <text class="text-12px text-[#999]">
-            {{ deviceInfo.current_package || '无套餐' }}
-          </text>
-        </view>
-
-        <!-- 设备基本信息 -->
-        <view class="px-4 py-3">
-          <view class="space-y-2">
-            <!-- 虚拟号 -->
-            <view v-if="deviceInfo.virtual_no" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">虚拟号</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ deviceInfo.virtual_no }}
-              </text>
-            </view>
-
-            <!-- IMEI -->
-            <view v-if="deviceInfo.imei" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">IMEI</text>
-              <text class="flex-1 text-13px text-[#212121] text-right break-all">
-                {{ deviceInfo.imei }}
-              </text>
-            </view>
-
-            <!-- 设备型号 -->
-            <view v-if="deviceInfo.device_model" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">设备型号</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ deviceInfo.device_model }}
-              </text>
-            </view>
-
-            <!-- 最大卡槽数 -->
-            <view v-if="deviceInfo.max_sim_slots" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">最大卡槽</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ deviceInfo.max_sim_slots }} 个
-              </text>
-            </view>
-
-            <!-- 绑定卡数 -->
-            <view v-if="deviceInfo.bound_card_count !== undefined" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">绑定卡数</text>
-              <text class="flex-1 text-13px font-600 text-[var(--brand-primary)] text-right">
-                {{ deviceInfo.bound_card_count }} 张
-              </text>
-            </view>
-
-            <!-- 店铺信息 -->
-            <view v-if="deviceInfo.shop_name" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">所属店铺</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ deviceInfo.shop_name }}
-              </text>
-            </view>
-
-            <!-- 套餐系列 -->
-            <view v-if="deviceInfo.series_name" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">套餐系列</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ deviceInfo.series_name }}
-              </text>
-            </view>
-
-            <!-- 实名状态 -->
-            <view v-if="deviceInfo.real_name_status !== undefined" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">实名状态</text>
-              <text class="flex-1 text-13px text-[#212121] text-right">
-                {{ getRealNameStatusText(deviceInfo.real_name_status) }}
-              </text>
-            </view>
-
-            <!-- 累计充值 -->
-            <view v-if="deviceInfo.accumulated_recharge !== undefined" class="flex items-start justify-between">
-              <text class="text-12px text-[#999] w-80px">累计充值</text>
-              <text class="flex-1 text-13px font-600 text-[var(--brand-primary)] text-right">
-                ¥{{ deviceInfo.accumulated_recharge }}
-              </text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 套餐使用情况 -->
-        <view v-if="deviceInfo.package_total_mb !== undefined && deviceInfo.package_total_mb > 0" class="px-4 pb-4">
-          <view class="bg-[#f5f5f5] rounded-12px p-3">
-            <view class="flex items-center justify-between mb-2">
-              <text class="text-12px text-[#999]">
-                套餐流量
-              </text>
-              <text class="text-12px font-600 text-[#212121]">
-                {{ formatDataSize(deviceInfo.package_used_mb) }} / {{ formatDataSize(deviceInfo.package_total_mb) }}
-              </text>
-            </view>
-
-            <!-- 进度条 -->
-            <view class="h-6px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{
-                  width: `${((deviceInfo.package_used_mb || 0) / deviceInfo.package_total_mb) * 100}%`,
-                }" :class="[
-                  'h-full rounded-full transition-all duration-300',
-                  ((deviceInfo.package_used_mb || 0) / deviceInfo.package_total_mb) > 0.9
-                    ? 'bg-[#ff6b6b]'
-                    : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <view class="flex items-center justify-between mt-2">
-            <text class="text-11px text-[#999]">
-              剩余: {{ formatDataSize(deviceInfo.package_remain_mb) }}
-            </text>
-          </view>
-        </view>
-      </view>
-
-      <!-- 绑定卡片列表 -->
-      <view v-if="deviceInfo.cards && deviceInfo.cards.length > 0" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
-        <text class="text-13px font-600 text-[#212121] block mb-2">绑定IoT卡</text>
-        <view class="space-y-2">
-          <view v-for="card in deviceInfo.cards" :key="card.card_id" class="bg-[#f5f5f5] rounded-12px p-3">
-            <view class="flex items-center justify-between mb-1">
-              <view class="flex items-center gap-2 min-w-0">
-                <text class="text-12px text-[#212121]">卡槽 {{ card.slot_position }}</text>
-                <text :class="[
-                    'px-2 py-0.5 rounded-full text-11px font-600',
-                    getRealNameStatusTagClass(card.real_name_status),
-                  ]">
-                  {{ getRealNameStatusText(card.real_name_status) }}
-                </text>
-              </view>
-              <text v-if="card.is_current" class="text-11px text-white bg-[#3ed268] px-2 py-0.5 rounded">
-                当前
-              </text>
-            </view>
-            <view class="space-y-1">
-              <text class="text-11px text-[#666] block">ICCID: {{ card.iccid }}</text>
-              <text class="text-11px text-[#666] block">MSISDN: {{ card.msisdn || '-' }}</text>
-              <text class="text-11px text-[#666] block">运营商: {{ card.carrier_name || '-' }}</text>
-              <view class="flex items-center justify-between">
-                <text class="text-11px text-[#666]">
-                  网络: {{ getNetworkStatusText(card.network_status) }}
-                </text>
-              </view>
-            </view>
-          </view>
-        </view>
-      </view>
-
-      <!-- 设备实时状态 -->
-      <view v-if="realtimeStatus?.device_realtime" class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
-        <text class="text-13px font-600 text-[#212121] block mb-2">设备实时状态</text>
-
-        <!-- 在线状态 -->
-        <view class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
-          <view class="flex items-center justify-between mb-2">
-            <text class="text-12px text-[#666]">在线状态</text>
-            <view :class="[
-                'px-2 py-0.5 rounded text-11px font-600',
-                realtimeStatus.device_realtime.online_status === 1 ? 'bg-[#e8f5e9] text-[#2e7d32]' : 'bg-[#f5f5f5] text-[#999]',
-              ]">
-              {{ getOnlineStatusText(realtimeStatus.device_realtime.online_status) }}
-            </view>
-          </view>
-
-          <view class="space-y-1">
-            <!-- 电池电量 -->
-            <view v-if="realtimeStatus.device_realtime.battery_level !== undefined"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">电池电量</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.battery_level }}%</text>
-            </view>
-
-            <!-- 连接客户端 -->
-            <view v-if="realtimeStatus.device_realtime.client_number !== undefined"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">连接客户端</text>
-              <text class="text-[#212121]">
-                {{ realtimeStatus.device_realtime.client_number }} /
-                {{ realtimeStatus.device_realtime.max_clients }}
-              </text>
-            </view>
-
-            <!-- 连接时长 -->
-            <view v-if="realtimeStatus.device_realtime.connect_time"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">连接时长</text>
-              <text class="text-[#212121]">{{ formatDuration(realtimeStatus.device_realtime.connect_time) }}</text>
-            </view>
-
-            <!-- 运行时长 -->
-            <view v-if="realtimeStatus.device_realtime.run_time" class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">运行时长</text>
-              <text class="text-[#212121]">{{ formatDuration(realtimeStatus.device_realtime.run_time) }}</text>
-            </view>
-
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">最后上线时间</text>
-              <text class="text-[#212121]">{{ getDeviceLastOnlineTime() }}</text>
-            </view>
-
-            <!-- 信号 -->
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">信号</text>
-              <text class="text-[#212121]">{{ getDisplayValue(realtimeStatus.device_realtime.signal_quality) }}</text>
-            </view>
-
-            <!-- 信号差原因 -->
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">信号差原因</text>
-              <text class="text-[#212121]">{{ getDisplayValue(realtimeStatus.device_realtime.signal_bad_reason) }}</text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 流量统计 -->
-        <view class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
-          <text class="text-12px text-[#666] block mb-2">流量统计</text>
-          <view class="space-y-1">
-            <!-- 今日用量 -->
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">今日用量</text>
-              <text class="text-[var(--brand-primary)] font-600">{{ formatBytesDisplay(realtimeStatus.device_realtime.daily_usage) }}</text>
-            </view>
-
-            <!-- 限速 -->
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">限速</text>
-              <text class="text-[#212121]">
-                {{ isEmptyDisplayValue(realtimeStatus.device_realtime.limit_speed) ? '-' : `${realtimeStatus.device_realtime.limit_speed} Mbps` }}
-              </text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 网络信息 -->
-        <view class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
-          <text class="text-12px text-[#666] block mb-2">网络信息</text>
-          <view class="space-y-1">
-            <!-- IP地址 -->
-            <view v-if="realtimeStatus.device_realtime.ip_address" class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">IP地址</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.ip_address }}</text>
-            </view>
-
-            <!-- LAN IP -->
-            <view v-if="realtimeStatus.device_realtime.lan_ip" class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">LAN IP</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.lan_ip }}</text>
-            </view>
-
-            <!-- WAN IP -->
-            <view v-if="realtimeStatus.device_realtime.wan_ip" class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">WAN IP</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.wan_ip }}</text>
-            </view>
-
-            <!-- MAC地址 -->
-            <view v-if="realtimeStatus.device_realtime.mac_address" class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">MAC地址</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.mac_address }}</text>
-            </view>
-          </view>
-        </view>
-
-        <!-- WiFi信息 -->
-        <view v-if="realtimeStatus.device_realtime.ssid" class="bg-[#f5f5f5] rounded-12px p-3 mb-2">
-          <text class="text-12px text-[#666] block mb-2">WiFi信息</text>
-          <view class="space-y-1">
-            <!-- WiFi名称 -->
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">WiFi名称</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.ssid }}</text>
-            </view>
-
-            <!-- WiFi状态 -->
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">WiFi状态</text>
-              <text :class="realtimeStatus.device_realtime.wifi_enabled ? 'text-[#2e7d32]' : 'text-[#999]'">
-                {{ realtimeStatus.device_realtime.wifi_enabled ? '已开启' : '已关闭' }}
-              </text>
-            </view>
-
-            <!-- WiFi密码 -->
-            <view v-if="realtimeStatus.device_realtime.wifi_password"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">WiFi密码</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.wifi_password }}</text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 其他信息 -->
-        <view class="bg-[#f5f5f5] rounded-12px p-3">
-          <view class="space-y-1">
-            <!-- 软件版本 -->
-            <view v-if="realtimeStatus.device_realtime.software_version"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">软件版本</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.software_version }}</text>
-            </view>
-
-            <!-- IMSI -->
-            <view v-if="realtimeStatus.device_realtime.imsi" class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">IMSI</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.imsi }}</text>
-            </view>
-
-            <!-- 当前ICCID -->
-            <view v-if="realtimeStatus.device_realtime.current_iccid"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">当前ICCID</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.current_iccid }}</text>
-            </view>
-
-            <!-- 同步间隔 -->
-            <view v-if="realtimeStatus.device_realtime.sync_interval"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">同步间隔</text>
-              <text class="text-[#212121]">{{ realtimeStatus.device_realtime.sync_interval }}秒</text>
-            </view>
-
-            <!-- 最后更新 -->
-            <view v-if="realtimeStatus.device_realtime.last_update_time"
-              class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">最后更新</text>
-              <text class="text-[#999]">{{ formatTime(realtimeStatus.device_realtime.last_update_time) }}</text>
-            </view>
-          </view>
-        </view>
-      </view>
-
-      <!-- 套餐信息 -->
-      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden mt-2 p-2 px-4 pb-3">
-        <view class="flex items-center justify-between mb-2">
-          <text class="text-13px font-600 text-[#212121]">当前生效套餐</text>
-          <view v-if="false && currentPackage" class="flex items-center gap-1 px-2 py-1 rounded-8px bg-[#f5f5f5]"
-            @click="togglePackageList">
-            <text class="text-11px text-[#666]">全部套餐</text>
-            <i :class="[
-                'text-14px text-[#999] transition-transform',
-                showPackageList ? 'i-mdi-chevron-up' : 'i-mdi-chevron-down',
-              ]" />
-          </view>
-        </view>
-
-        <!-- 当前套餐 -->
-        <view v-if="currentPackage" class="bg-[#f5f5f5] rounded-12px p-3">
-          <view class="flex items-start justify-between gap-3 mb-3">
-            <view class="min-w-0 flex-1">
-              <text class="text-14px font-600 text-[#212121] block break-all">
-                {{ currentPackage.package_name || '-' }}
-              </text>
-              <text class="text-11px text-[#64748b] block mt-1 break-all">
-                {{ formatCurrentPackagePeriodRange(currentPackage.activated_at, currentPackage.expires_at) }}
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
-                color: getPackageStatusColor(currentPackage.status).text,
-              }" class="px-2 py-0.5 rounded text-10px font-600">
-              {{ currentPackage.status_name || '-' }}
-            </view>
-          </view>
-
-          <view class="grid grid-cols-3 gap-2 mb-3">
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">总量</text>
-              <text class="text-12px font-600 text-[#212121]">{{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">已使用</text>
-              <text class="text-12px font-600 text-[var(--brand-primary)]">{{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }}</text>
-            </view>
-            <view class="bg-white rounded-8px p-2 text-center">
-              <text class="text-10px text-[#999] block mb-1">剩余</text>
-              <text class="text-12px font-600 text-[#2e7d32]">{{ formatPackageDataSize(getPackageRemainMb(currentPackage)) }}</text>
-            </view>
-          </view>
-
-          <view class="bg-white rounded-8px p-2 mb-3">
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-11px text-[#666]">已使用</text>
-              <text class="text-11px font-600 text-[#212121]">
-                {{ formatPackageDataSize(getPackageUsedMb(currentPackage)) }} /
-                {{ formatPackageDataSize(getPackageTotalMb(currentPackage)) }}
-              </text>
-            </view>
-            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
-                  'h-full rounded-full transition-all',
-                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <view class="space-y-1 mb-1">
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐价格</text>
-              <text class="text-[#212121]">{{ formatPackagePrice(currentPackage.paid_amount) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">套餐类型</text>
-              <text class="text-[#212121]">{{ getPackageTypeText(currentPackage.package_type) }}</text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">下单时间</text>
-              <text class="text-[#212121]">{{ formatTime(currentPackage.created_at) }}</text>
-            </view>
-          </view>
-
-          <!-- 套餐名称和状态 -->
-          <view v-if="false" class="flex items-center justify-between mb-2">
-            <view class="flex items-center gap-2">
-              <i :class="[
-                  'text-16px',
-                  currentPackage.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
-                ]" />
-              <text class="text-14px font-600 text-[#212121]">
-                {{ currentPackage.package_name }}
-              </text>
-            </view>
-            <view :style="{
-                backgroundColor: getPackageStatusColor(currentPackage.status).bg,
-                color: getPackageStatusColor(currentPackage.status).text,
-              }" class="px-2 py-0.5 rounded text-10px font-600">
-              {{ currentPackage.status_name }}
-            </view>
-          </view>
-
-          <!-- 流量使用进度 -->
-          <view v-if="false" class="bg-white rounded-8px p-2 mb-2">
-            <view class="flex items-center justify-between mb-1">
-              <text class="text-11px text-[#666]">虚拟流量</text>
-              <text class="text-11px font-600 text-[#212121]">
-                {{ formatDataSize(currentPackage.virtual_used_mb) }} /
-                {{ formatDataSize(currentPackage.virtual_limit_mb) }}
-              </text>
-            </view>
-            <!-- 进度条 -->
-            <view class="h-4px bg-[#e0e0e0] rounded-full overflow-hidden">
-              <view :style="{ width: `${getPackageUsagePercent(currentPackage)}%` }" :class="[
-                  'h-full rounded-full transition-all',
-                  getPackageUsagePercent(currentPackage) > 90 ? 'bg-[#ff6b6b]' : 'bg-[#3ed268]',
-                ]" />
-            </view>
-          </view>
-
-          <!-- 套餐详情 -->
-          <view v-if="false" class="space-y-1">
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">真实流量</text>
-              <text class="text-[#212121]">
-                {{ formatDataSize(currentPackage.data_usage_mb) }} /
-                {{ formatDataSize(currentPackage.data_limit_mb) }}
-              </text>
-            </view>
-            <view class="flex items-center justify-between text-11px">
-              <text class="text-[#666]">流量比例</text>
-              <text class="text-[#212121]">1 : {{ currentPackage.virtual_ratio }}</text>
-            </view>
-            <view v-if="currentPackage.expires_at"
-              class="flex items-center justify-between text-11px pt-1 border-t-1px border-[#e5e7eb]">
-              <text class="text-[#999]">到期时间</text>
-              <text class="text-[#999]">{{ formatTime(currentPackage.expires_at) }}</text>
-            </view>
-          </view>
-        </view>
-
-        <!-- 无套餐提示 -->
-        <view v-else class="bg-[#f5f5f5] rounded-12px p-4 flex flex-col items-center">
-          <i class="i-mdi-package-variant-closed text-40px text-[#ddd] mb-2" />
-          <text class="text-12px text-[#999]">暂无生效套餐</text>
-        </view>
-
-        <!-- 套餐列表 -->
-        <view v-if="packageList.length > 0" class="mt-3">
-          <text class="text-13px font-600 text-[#212121] block mb-2">套餐列表 ({{ packageList.length }})</text>
-          <view class="space-y-2">
-            <view v-for="pkg in packageList" :key="pkg.package_usage_id" class="bg-[#f5f5f5] rounded-12px p-3">
-              <!-- 套餐头部 -->
-              <view class="flex items-center justify-between mb-2">
-                <view class="flex items-center gap-1.5">
-                  <i :class="[
-                      'text-14px',
-                      pkg.package_type === 'formal' ? 'i-mdi-package-variant text-[var(--brand-primary)]' : 'i-mdi-gas-station text-[#2e7d32]',
-                    ]" />
-                  <text class="text-13px font-600 text-[#212121]">{{ pkg.package_name }}</text>
-                  <text v-if="pkg.master_usage_id" class="text-10px text-[#999]">(加油包)</text>
-                </view>
-                <view :style="{
-                    backgroundColor: getPackageStatusColor(pkg.status).bg,
-                    color: getPackageStatusColor(pkg.status).text,
-                  }" class="px-2 py-0.5 rounded text-10px font-600">
-                  {{ pkg.status_name }}
-                </view>
-              </view>
-
-              <!-- 流量信息 -->
-              <view class="space-y-0.5">
-                <view class="flex items-center justify-between text-11px">
-                  <text class="text-[#666]">已使用</text>
-                  <text class="text-[#212121]">
-                    {{ formatPackageDataSize(getPackageUsedMb(pkg)) }} / {{ formatPackageDataSize(getPackageTotalMb(pkg)) }}
-                  </text>
-                </view>
-                <view class="flex items-center justify-between text-11px">
-                  <text class="text-[#666]">剩余</text>
-                  <text class="text-[#212121]">{{ formatPackageDataSize(getPackageRemainMb(pkg)) }}</text>
-                </view>
-                <view class="flex items-center justify-between text-11px">
-                  <text class="text-[#666]">金额</text>
-                  <text class="text-[#212121]">{{ formatPackagePrice(pkg.paid_amount) }}</text>
-                </view>
-                <view v-if="pkg.status === 1" class="mt-2 bg-white rounded-8px px-2.5 py-2">
-                  <text class="text-11px font-600 text-[#475569]">{{ formatPackageEffectivePeriod(pkg.activated_at, pkg.expires_at) }}</text>
-                </view>
-              </view>
-            </view>
-          </view>
-        </view>
-      </view>
-    </view>
-
-    <!-- 空状态 -->
-    <view v-else class="px-4 pt-20 flex flex-col items-center">
-      <i class="i-mdi-package-variant-closed text-6xl text-[#cbd5e1] mb-3" />
-      <text class="text-base text-[#64748b]">暂无数据</text>
-    </view>
-
-    <!-- 底部留白 -->
-    <view class="h-8" />
-  </view>
-</template>
-
-<style scoped>
-  .space-y-2>view:not(:last-child) {
-    margin-bottom: 8px;
-  }
-
-  .break-all {
-    word-break: break-all;
-  }
-</style>
diff --git a/src/pages/agent-system/assets/index.vue b/src/pages/agent-system/assets/index.vue
index 4606d27..c292076 100644
--- a/src/pages/agent-system/assets/index.vue
+++ b/src/pages/agent-system/assets/index.vue
@@ -71,6 +71,14 @@
 
   // 用户信息
   const userInfo = ref<UserInfo | null>(null)
+  const sessionButtonCodes = ref<string[]>([])
+
+  const ASSET_ACTION_BUTTON_CODES = {
+    cardStop: 'asset:card_stop_h5',
+    cardStart: 'asset:card_start_h5',
+    deviceStop: 'asset:device_stop_h5',
+    deviceStart: 'asset:device_start_h5',
+  } as const
 
   // 获取单卡列表（代理端）
   function getStandaloneCards(params : any) {
@@ -130,10 +138,36 @@
   const carrierList = ref<CarrierInfo[]>([])
   const isAgent = computed(() => userInfo.value?.user_type === 3)
   const searchPlaceholder = computed(() => activeTab.value === 'card' ? '搜索ICCID' : '搜索设备号')
+  const canShowDeviceStopButton = computed(() => hasActionButtonPermission(ASSET_ACTION_BUTTON_CODES.deviceStop))
+  const canShowDeviceStartButton = computed(() => hasActionButtonPermission(ASSET_ACTION_BUTTON_CODES.deviceStart))
 
   function hasStatusCode(error : unknown) {
     return typeof error === 'object' && error !== null && 'statusCode' in error
   }
+
+  function getSessionButtonCodes() {
+    const cachedUserInfo = uni.getStorageSync('user_info')
+
+    if (!cachedUserInfo || typeof cachedUserInfo !== 'object' || !Array.isArray((cachedUserInfo as UserInfo).buttons)) {
+      return []
+    }
+
+    return (cachedUserInfo as UserInfo).buttons!.filter((code) => {
+      return typeof code === 'string' && code.trim().length > 0
+    })
+  }
+
+  function hasActionButtonPermission(code : string) {
+    return sessionButtonCodes.value.includes(code)
+  }
+
+  function canShowCardStopButton(card : CardInfo) {
+    return card.network_status !== 0 && hasActionButtonPermission(ASSET_ACTION_BUTTON_CODES.cardStop)
+  }
+
+  function canShowCardStartButton(card : CardInfo) {
+    return card.network_status !== 1 && hasActionButtonPermission(ASSET_ACTION_BUTTON_CODES.cardStart)
+  }
   // 运营商选择器选项
   const carrierOptions = computed(() => [
     { label: '全部运营商', value: undefined },
@@ -410,12 +444,12 @@
     if (asset.type === 'card') {
       const card = asset.raw as CardInfo
       uni.navigateTo({
-        url: `/pages/agent-system/asset-search/index?iccid=${card.iccid}`,
+        url: `/pages/agent-system/asset-detail/index?iccid=${card.iccid}`,
       })
     } else {
       const device = asset.raw as DeviceInfo
       uni.navigateTo({
-        url: `/pages/agent-system/asset-search/index?virtual_no=${device.virtual_no}`,
+        url: `/pages/agent-system/asset-detail/index?virtual_no=${device.virtual_no}`,
       })
     }
   }
@@ -575,6 +609,7 @@
   onMounted(async () => {
     // 1. 获取状态栏高度
     statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight || 20
+    sessionButtonCodes.value = getSessionButtonCodes()
 
     // 2. 加载用户信息（判断是企业端还是代理端）
     try {
@@ -646,8 +681,7 @@
         <view v-if="isAgent"
           class="flex items-center gap-1.5 px-3 py-1.5 bg-[#f8fafc] rounded-full flex-shrink-0 max-w-36"
           @click="showShopPicker = true">
-          <text class="text-12px truncate"
-            :class="selectedShopFilter ? 'text-brand font-medium' : 'text-[#64748b]'">
+          <text class="text-12px truncate" :class="selectedShopFilter ? 'text-brand font-medium' : 'text-[#64748b]'">
             {{ selectedShopName }}
           </text>
           <i class="i-mdi-chevron-down text-12px text-[#94a3b8] flex-shrink-0" />
@@ -716,42 +750,30 @@
               <view class="flex items-center gap-2">
                 <!-- IoT卡操作按钮 -->
                 <template v-if="asset.type === 'card'">
-                  <template v-if="(asset.raw as CardInfo).network_status === 0">
-                    <view
-                      class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#52c41a] text-white shadow-sm shadow-[#52c41a]/30 active:scale-95 transition-transform"
-                      @click="handleStartCard(asset, $event)">
-                      复机
-                    </view>
-                  </template>
-                  <template v-else-if="(asset.raw as CardInfo).network_status === 1">
-                    <view
-                      class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#ff4d4f] text-white shadow-sm shadow-[#ff4d4f]/30 active:scale-95 transition-transform"
-                      @click="handleStopCard(asset, $event)">
-                      停机
-                    </view>
-                  </template>
-                  <template v-else>
-                    <view
-                      class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#ff4d4f] text-white shadow-sm shadow-[#ff4d4f]/30 active:scale-95 transition-transform"
-                      @click="handleStopCard(asset, $event)">
-                      停机
-                    </view>
-                    <view
-                      class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#52c41a] text-white shadow-sm shadow-[#52c41a]/30 active:scale-95 transition-transform"
-                      @click="handleStartCard(asset, $event)">
-                      复机
-                    </view>
-                  </template>
+                  <view
+                    v-if="canShowCardStopButton(asset.raw as CardInfo)"
+                    class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#ff4d4f] text-white shadow-sm shadow-[#ff4d4f]/30 active:scale-95 transition-transform"
+                    @click="handleStopCard(asset, $event)">
+                    停机
+                  </view>
+                  <view
+                    v-if="canShowCardStartButton(asset.raw as CardInfo)"
+                    class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#52c41a] text-white shadow-sm shadow-[#52c41a]/30 active:scale-95 transition-transform"
+                    @click="handleStartCard(asset, $event)">
+                    复机
+                  </view>
                 </template>
 
                 <!-- 设备操作按钮 -->
                 <template v-else>
                   <view
+                    v-if="canShowDeviceStopButton"
                     class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#ff4d4f] text-white shadow-sm shadow-[#ff4d4f]/30 active:scale-95 transition-transform"
                     @click="handleStopDevice(asset, $event)">
                     停机
                   </view>
                   <view
+                    v-if="canShowDeviceStartButton"
                     class="px-3 py-1.5 rounded-10px text-12px font-medium bg-[#52c41a] text-white shadow-sm shadow-[#52c41a]/30 active:scale-95 transition-transform"
                     @click="handleStartDevice(asset, $event)">
                     复机
@@ -766,11 +788,10 @@
           <!-- 加载更多 -->
           <view v-if="activeTabHasMore" class="py-4 flex justify-center">
             <view
-              class="min-w-32 px-5 py-2.5 rounded-full text-sm font-medium transition-all"
+              class="min-w-32 px-5 py-2.5 rounded-full text-sm font-medium transition-all flex items-center justify-center"
               :class="loading
                 ? 'bg-[#f1f5f9] text-[#94a3b8]'
-                : 'bg-brand text-white shadow-sm shadow-brand/30 active:scale-95'"
-              @click="!loading && loadMore()">
+                : 'bg-brand text-white shadow-sm shadow-brand/30 active:scale-95'" @click="!loading && loadMore()">
               <template v-if="loading">
                 <i class="i-mdi-loading animate-spin text-base mr-1.5" />
                 <text>加载中...</text>
diff --git a/src/pages/agent-system/commission-center/index.vue b/src/pages/agent-system/commission-center/index.vue
index fcac6f9..fb9ea32 100644
--- a/src/pages/agent-system/commission-center/index.vue
+++ b/src/pages/agent-system/commission-center/index.vue
@@ -261,7 +261,6 @@ function loadMore() {
             </view>
             <view class="flex items-center justify-between text-12px text-[#999]">
               <text>{{ formatTime(record.created_at) }}</text>
-              <text v-if="record.order_id">订单 {{ record.order_id }}</text>
             </view>
           </view>
 
diff --git a/src/pages/agent-system/commission/index.vue b/src/pages/agent-system/commission/index.vue
deleted file mode 100644
index 51dc139..0000000
--- a/src/pages/agent-system/commission/index.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<script setup lang="ts">
-import { onMounted } from 'vue'
-
-// 直接跳转到佣金中心
-onMounted(() => {
-  uni.redirectTo({
-    url: '/pages/agent-system/commission-center/index',
-  })
-})
-</script>
-
-<template>
-  <view class="bg-[#fafafa] min-h-screen flex items-center justify-center">
-    <text class="text-14px text-[#999]">跳转中...</text>
-  </view>
-</template>
diff --git a/src/pages/agent-system/enterprise-cards/index.vue b/src/pages/agent-system/enterprise-cards/index.vue
index daf4331..43507a1 100644
--- a/src/pages/agent-system/enterprise-cards/index.vue
+++ b/src/pages/agent-system/enterprise-cards/index.vue
@@ -54,7 +54,7 @@ const stats = computed(() => {
 
 async function loadCarriers() {
   try {
-    const response = await getCarriers({ page: 1, size: 50 })
+    const response = await getCarriers({ page: 1, size: 100 })
     carrierList.value = response?.items || []
   } catch (error) {
     console.error('加载运营商列表失败:', error)
@@ -128,7 +128,7 @@ async function loadEnterpriseCards(isRefresh = false) {
 
 function viewCardDetail(card: any) {
   uni.navigateTo({
-    url: `/pages/agent-system/asset-search/index?iccid=${card.iccid}`,
+    url: `/pages/agent-system/asset-detail/index?iccid=${card.iccid}`,
   })
 }
 
diff --git a/src/pages/agent-system/enterprise-devices/index.vue b/src/pages/agent-system/enterprise-devices/index.vue
index 670289e..d8d9ccc 100644
--- a/src/pages/agent-system/enterprise-devices/index.vue
+++ b/src/pages/agent-system/enterprise-devices/index.vue
@@ -74,7 +74,7 @@ async function loadEnterpriseDevices(isRefresh = false) {
 
 function viewDeviceDetail(device: any) {
   uni.navigateTo({
-    url: `/pages/agent-system/asset-search/index?virtual_no=${device.virtual_no}`,
+    url: `/pages/agent-system/asset-detail/index?virtual_no=${device.virtual_no}`,
   })
 }
 
diff --git a/src/pages/agent-system/home/index.vue b/src/pages/agent-system/home/index.vue
index b76fe6a..27237f0 100644
--- a/src/pages/agent-system/home/index.vue
+++ b/src/pages/agent-system/home/index.vue
@@ -94,8 +94,6 @@
       shopId.value = user.shop_id || loginUserInfo?.shop_id || 0
       const fundSummaryUsername = loginUserInfo?.username || user.username
 
-      console.log('首页数据加载成功:', { user })
-
       // 如果是代理账号,加载佣金数据
       if (user.user_type === 3) {
         await loadCommissionData(fundSummaryUsername)
diff --git a/src/pages/agent-system/my-packages/index.vue b/src/pages/agent-system/my-packages/index.vue
deleted file mode 100644
index 9a817b3..0000000
--- a/src/pages/agent-system/my-packages/index.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-function goBack() {
-  uni.navigateBack()
-}
-</script>
-
-<template>
-  <view class="bg-[#fafafa] min-h-screen flex items-center justify-center pb-safe">
-    <view class="px-6 text-center">
-      <i class="i-mdi-hammer-wrench text-64px text-[#ccc] block mb-4" />
-      <text class="text-18px font-600 text-[#333] block mb-2">功能开发中</text>
-      <text class="text-14px text-[#999] block mb-6">
-        我的套餐功能正在开发中，敬请期待
-      </text>
-      <view
-        class="bg-[#212121] text-white rounded-full px-8 py-3 inline-block"
-        @click="goBack"
-      >
-        <text class="text-15px">返回</text>
-      </view>
-    </view>
-  </view>
-</template>
diff --git a/src/pages/agent-system/packages/index.vue b/src/pages/agent-system/packages/index.vue
deleted file mode 100644
index e1506f2..0000000
--- a/src/pages/agent-system/packages/index.vue
+++ /dev/null
@@ -1,245 +0,0 @@
-<script setup lang="ts">
-import { ref, computed, onMounted } from 'vue'
-import { getEnterpriseCards } from '@/api/enterprise'
-import { getUserInfo } from '@/api/auth'
-
-interface CardInfo {
-  id: number
-  iccid: string
-  msisdn: string
-  virtual_no?: string
-  carrier_id: number
-  carrier_name?: string
-  package_name?: string
-  status: number
-  status_name: string
-  network_status: number
-  network_status_name: string
-}
-
-// 企业ID
-const enterpriseId = ref<number>(0)
-// IoT卡列表
-const cardList = ref<CardInfo[]>([])
-// 加载状态
-const loading = ref(true)
-
-// 套餐统计
-const packageStats = computed(() => {
-  const total = cardList.value.length
-  const hasPackage = cardList.value.filter(c => c.package_name).length
-  const noPackage = total - hasPackage
-
-  return { total, hasPackage, noPackage }
-})
-
-// 按套餐分组
-const packageGroups = computed(() => {
-  const groups = new Map<string, CardInfo[]>()
-
-  cardList.value.forEach(card => {
-    const pkg = card.package_name || '无套餐'
-    if (!groups.has(pkg)) {
-      groups.set(pkg, [])
-    }
-    groups.get(pkg)!.push(card)
-  })
-
-  return Array.from(groups.entries()).map(([name, cards]) => ({
-    name,
-    count: cards.length,
-    cards,
-  }))
-})
-
-// 加载数据
-async function loadData() {
-  loading.value = true
-
-  try {
-    // 获取企业ID
-    if (!enterpriseId.value) {
-      const userInfo = uni.getStorageSync('user_info')
-      if (userInfo?.enterprise_id) {
-        enterpriseId.value = userInfo.enterprise_id
-      } else {
-        const apiUserInfo = await getUserInfo()
-        if (!apiUserInfo.enterprise_id) {
-          throw new Error('未找到企业ID')
-        }
-        enterpriseId.value = apiUserInfo.enterprise_id
-      }
-    }
-
-    // 获取企业卡列表
-    const response = await getEnterpriseCards(enterpriseId.value)
-    cardList.value = response?.items || []
-  } catch (error: any) {
-    console.error('加载数据失败:', error)
-    if (error instanceof Error && error.message && !error.statusCode) {
-      uni.$u.toast(error.message)
-    }
-  } finally {
-    loading.value = false
-  }
-}
-
-// 查看IoT卡详情
-function viewCardDetail(card: CardInfo) {
-  uni.navigateTo({
-    url: `/pages/agent-system/asset-search/index?iccid=${card.iccid}`,
-  })
-}
-
-// 获取卡片状态颜色
-function getStatusColor(status: number) {
-  const map: Record<number, { bg: string, text: string }> = {
-    1: { bg: '#f5f5f5', text: '#999' }, // 在库
-    2: { bg: '#e8f5e9', text: '#2e7d32' }, // 已分销
-    3: { bg: '#ffebee', text: '#c62828' }, // 已停用
-  }
-  return map[status] || { bg: '#f5f5f5', text: '#999' }
-}
-
-// 获取网络状态颜色
-function getNetworkStatusColor(status: number) {
-  return status === 1
-    ? { bg: '#e8f5e9', text: '#2e7d32' }
-    : { bg: '#ffebee', text: '#c62828' }
-}
-
-onMounted(() => {
-  loadData()
-})
-</script>
-
-<template>
-  <view class="bg-[#fafafa] min-h-screen pb-safe">
-    <!-- 顶部统计 -->
-    <view class="px-4 pt-4 pb-3">
-      <view class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] p-4">
-        <text class="text-16px font-700 text-[#212121] block mb-3">套餐统计</text>
-        <view class="grid grid-cols-3 gap-3">
-          <view class="text-center">
-            <text class="text-24px font-700 text-[#212121] block">{{ packageStats.total }}</text>
-            <text class="text-11px text-[#999] mt-1">总IoT卡</text>
-          </view>
-          <view class="text-center">
-            <text class="text-24px font-700 text-[var(--brand-primary)] block">{{ packageStats.hasPackage }}</text>
-            <text class="text-11px text-[#999] mt-1">已订购</text>
-          </view>
-          <view class="text-center">
-            <text class="text-24px font-700 text-[#999] block">{{ packageStats.noPackage }}</text>
-            <text class="text-11px text-[#999] mt-1">未订购</text>
-          </view>
-        </view>
-      </view>
-    </view>
-
-    <!-- 加载状态 -->
-    <view v-if="loading" class="pt-20 flex flex-col items-center">
-      <i class="i-mdi-loading animate-spin text-40px text-[#999]" />
-    </view>
-
-    <!-- 套餐分组列表 -->
-    <view v-else class="px-4 pb-4">
-      <view class="space-y-3">
-        <view
-          v-for="group in packageGroups"
-          :key="group.name"
-          class="bg-white rounded-16px shadow-[0_2px_12px_rgba(0,0,0,0.06)] overflow-hidden"
-        >
-          <!-- 套餐头部 -->
-          <view class="px-4 py-3 bg-[#f8fafc] border-b-1px border-[#f1f5f9]">
-            <view class="flex items-center justify-between">
-              <view class="flex items-center gap-2">
-                <i class="i-mdi-package-variant text-20px text-[var(--brand-primary)]" />
-                <text class="text-15px font-600 text-[#212121]">{{ group.name }}</text>
-              </view>
-              <text class="text-12px text-[#999]">{{ group.count }} 张</text>
-            </view>
-          </view>
-
-          <!-- IoT卡列表 -->
-          <view class="px-4 py-2">
-            <view
-              v-for="(card, index) in group.cards"
-              :key="card.id"
-              class="py-3 active:bg-[#f8fafc] transition-all"
-              :class="{ 'border-t-1px border-[#f1f5f9]': index > 0 }"
-              @click="viewCardDetail(card)"
-            >
-              <view class="flex items-start justify-between">
-                <view class="flex-1 min-w-0">
-                  <!-- ICCID -->
-                  <text class="text-13px text-[#212121] block mb-1 font-500">
-                    {{ card.iccid }}
-                  </text>
-
-                  <!-- 电话号码 -->
-                  <view class="flex items-center gap-2 mb-1">
-                    <i class="i-mdi-phone text-14px text-[#999]" />
-                    <text class="text-12px text-[#666]">
-                      {{ card.msisdn }}
-                    </text>
-                  </view>
-
-                  <!-- 状态标签 -->
-                  <view class="flex items-center gap-2">
-                    <!-- 卡片状态 -->
-                    <view
-                      :style="{
-                        backgroundColor: getStatusColor(card.status).bg,
-                        color: getStatusColor(card.status).text,
-                      }"
-                      class="px-2 py-0.5 rounded text-10px font-600"
-                    >
-                      {{ card.status_name }}
-                    </view>
-
-                    <!-- 网络状态 -->
-                    <view
-                      :style="{
-                        backgroundColor: getNetworkStatusColor(card.network_status).bg,
-                        color: getNetworkStatusColor(card.network_status).text,
-                      }"
-                      class="px-2 py-0.5 rounded text-10px font-600"
-                    >
-                      {{ card.network_status_name }}
-                    </view>
-                  </view>
-                </view>
-
-                <!-- 右侧箭头 -->
-                <view class="flex items-center ml-3">
-                  <i class="i-mdi-chevron-right text-20px text-[#cbd5e1]" />
-                </view>
-              </view>
-            </view>
-          </view>
-        </view>
-      </view>
-
-      <!-- 空状态 -->
-      <view v-if="packageGroups.length === 0" class="bg-white rounded-16px py-16 flex flex-col items-center">
-        <i class="i-mdi-package-variant-closed text-64px text-[#ddd] mb-3" />
-        <text class="text-15px text-[#999]">暂无套餐数据</text>
-      </view>
-    </view>
-  </view>
-</template>
-
-<style scoped>
-.space-y-3 > view:not(:last-child) {
-  margin-bottom: 12px;
-}
-
-@keyframes spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
-}
-
-.animate-spin {
-  animation: spin 1s linear infinite;
-}
-</style>
diff --git a/src/pages/agent-system/tags/index.vue b/src/pages/agent-system/tags/index.vue
deleted file mode 100644
index e19fd66..0000000
--- a/src/pages/agent-system/tags/index.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-function goBack() {
-  uni.navigateBack()
-}
-</script>
-
-<template>
-  <view class="bg-[#fafafa] min-h-screen flex items-center justify-center pb-safe">
-    <view class="px-6 text-center">
-      <i class="i-mdi-hammer-wrench text-64px text-[#ccc] block mb-4" />
-      <text class="text-18px font-600 text-[#333] block mb-2">功能开发中</text>
-      <text class="text-14px text-[#999] block mb-6">
-        标签管理功能正在开发中，敬请期待
-      </text>
-      <view
-        class="bg-[#212121] text-white rounded-full px-8 py-3 inline-block"
-        @click="goBack"
-      >
-        <text class="text-15px">返回</text>
-      </view>
-    </view>
-  </view>
-</template>
diff --git a/src/pages/agent-system/user-info/index.vue b/src/pages/agent-system/user-info/index.vue
index b9b809d..b5bb4b8 100644
--- a/src/pages/agent-system/user-info/index.vue
+++ b/src/pages/agent-system/user-info/index.vue
@@ -43,7 +43,6 @@ async function loadUserInfo() {
   try {
     // 调用 API 获取用户信息
     const data = await getUserInfo()
-    console.log('获取用户信息成功:', data)
     userInfo.value = data
   }
   catch (error: any) {
diff --git a/src/pages/agent-system/utils.ts b/src/pages/agent-system/utils.ts
deleted file mode 100644
index 9d72564..0000000
--- a/src/pages/agent-system/utils.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-// 套餐状态枚举
-export const packageStatus = {
-  0: { name: '待生效', color: '#666', bgColor: '#f5f5f5' },
-  1: { name: '生效中', color: '#212121', bgColor: '#e8e8e8' },
-  2: { name: '已用完', color: '#999', bgColor: '#f5f5f5' },
-  3: { name: '已过期', color: '#999', bgColor: '#f5f5f5' },
-  4: { name: '已失效', color: '#999', bgColor: '#f5f5f5' },
-}
-
-// 套餐类型
-export const packageTypeMap = {
-  formal: '正式套餐',
-  addon: '加油包',
-}
-
-// 佣金来源映射
-export const commissionSourceMap = {
-  cost_diff: '成本差价',
-  one_time: '一次性佣金',
-  tier_bonus: '层级分成',
-}
-
-// 格式化流量 (MB to GB)
-export function formatDataSize(mb: number): string {
-  if (mb < 1024)
-    return `${mb}MB`
-  return `${(mb / 1024).toFixed(1)}GB`
-}
-
-// 计算使用百分比
-export function calcUsagePercent(used: number, total: number): number {
-  if (total === 0)
-    return 0
-  return Math.min(Math.round((used / total) * 100), 100)
-}
-
-// 格式化时间
-export function formatDate(dateStr: string | null): string {
-  if (!dateStr)
-    return '--'
-  const date = new Date(dateStr)
-  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`
-}
-
-// 格式化日期时间
-export function formatDateTime(dateStr: string | null): string {
-  if (!dateStr)
-    return '--'
-  const date = new Date(dateStr)
-  return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`
-}
-
-// 计算剩余天数
-export function calcRemainingDays(expiresAt: string | null): number | null {
-  if (!expiresAt)
-    return null
-  const now = new Date()
-  const expireDate = new Date(expiresAt)
-  const diff = expireDate.getTime() - now.getTime()
-  return Math.ceil(diff / (1000 * 60 * 60 * 24))
-}
-
-// 格式化金额 (分转元)
-export function formatAmount(cents: number): string {
-  return (cents / 100).toFixed(2)
-}
-
-// 获取剩余天数颜色
-export function getRemainingDaysColor(days: number | null): string {
-  if (days === null)
-    return '#bdbdbd'
-  if (days <= 7)
-    return '#f44336' // 红色
-  if (days <= 30)
-    return '#ff9800' // 橙色
-  return '#4caf50' // 绿色
-}
diff --git a/src/pages/common/login/index.vue b/src/pages/common/login/index.vue
index f9e0fab..b1460b7 100644
--- a/src/pages/common/login/index.vue
+++ b/src/pages/common/login/index.vue
@@ -106,6 +106,10 @@ async function submit() {
       username: account.value.trim(),
       password: password.value.trim(),
     });
+    const sessionUser = {
+      ...res.user,
+      buttons: Array.isArray(res.buttons) ? res.buttons : [],
+    };
 
     // 保存 access_token
     setToken(res.access_token);
@@ -113,12 +117,6 @@ async function submit() {
     // 保存 refresh_token 到本地存储
     uni.setStorageSync('refresh_token', res.refresh_token);
 
-    // 保存用户信息到本地存储
-    uni.setStorageSync('user_info', res.user);
-
-    // 调试日志：查看用户信息
-    console.log('登录成功，用户信息:', res.user);
-
     // 验证用户类型 (只允许 3=代理 和 4=企业 登录)
     if (res.user.user_type !== 3 && res.user.user_type !== 4) {
       const typeNames: Record<number, string> = {
@@ -139,9 +137,12 @@ async function submit() {
       return;
     }
 
+    // 保存用户信息到本地存储
+    uni.setStorageSync('user_info', sessionUser);
+
     uni.showToast({
       title: '登录成功',
-      icon: 'success',
+      icon: 'none',
       duration: 1500,
     });
 
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index 29f5e49..18dce28 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -2,7 +2,7 @@ import type { providerType, UserState } from './types';
 import type { LoginReq } from '@/api/user/types';
 import { defineStore } from 'pinia';
 import { UserApi } from '@/api';
-import { refreshToken } from '@/api/auth';
+import { refreshToken, type UserInfo } from '@/api/auth';
 
 import { clearToken, setToken } from '@/utils/auth';
 
@@ -82,12 +82,22 @@ const useUserStore = defineStore('user', {
 
       try {
         const res = await refreshToken(refresh_token);
+        const rawUserInfo = uni.getStorageSync('user_info');
+        const cachedUserInfo = rawUserInfo && typeof rawUserInfo === 'object'
+          ? rawUserInfo as Partial<UserInfo>
+          : {};
+        const cachedButtons = Array.isArray(cachedUserInfo.buttons) ? cachedUserInfo.buttons : [];
+        const sessionUser = {
+          ...cachedUserInfo,
+          ...res.user,
+          buttons: Array.isArray(res.buttons) ? res.buttons : cachedButtons,
+        };
         // 更新 access_token
         setToken(res.access_token);
         // 更新 refresh_token
         uni.setStorageSync('refresh_token', res.refresh_token);
         // 更新用户信息
-        uni.setStorageSync('user_info', res.user);
+        uni.setStorageSync('user_info', sessionUser);
         return res;
       }
       catch (error) {
diff --git a/src/utils/request/index.ts b/src/utils/request/index.ts
index 2026fee..8d5a2c6 100644
--- a/src/utils/request/index.ts
+++ b/src/utils/request/index.ts
@@ -29,7 +29,7 @@ export function setupRequest() {
 export function request<T = any>(config: HttpRequestConfig): Promise<T> {
   return new Promise((resolve, reject) => {
     http.request(config).then((res: HttpResponse<IResponse<T>>) => {
-      console.log('[ res ] >', res);
+      // console.log('[ res ] >', res);
       const { data } = res.data;
       resolve(data as T);
     }).catch((err: any) => {