From 84cb4930fdf950f317c4fb07259cc444ab8b3d83 Mon Sep 17 00:00:00 2001
From: lzh <sickone075@gmail.com>
Date: Fri, 27 Mar 2026 16:48:13 +0800
Subject: [PATCH] =?UTF-8?q?refactor(@vben/web-antd):=20=E5=88=A0=E9=99=A4?=
 =?UTF-8?q?=E4=BF=9D=E6=B4=81=E5=B7=A5=E5=8D=95=E4=B8=AD=E5=BF=83=EF=BC=8C?=
 =?UTF-8?q?=E7=BB=9F=E4=B8=80=E4=BD=BF=E7=94=A8=E9=80=9A=E7=94=A8=E5=B7=A5?=
 =?UTF-8?q?=E5=8D=95=E4=B8=AD=E5=BF=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

保洁工单中心与通用工单中心功能重叠，统一入口避免歧义。

- 删除 views/ops/cleaning/work-order 整个目录
- 迁移 cleaning-actions/detail-ext/work-progress 组件到 work-order/components/
- 迁移 CLEANING_TYPE_OPTIONS/TEXT_MAP 到 work-order/data.ts
- 删除路由中保洁工单详情和看板两条路由
- 更新详情页组件引用路径

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../web-antd/src/router/routes/modules/ops.ts |   22 -
 .../views/ops/cleaning/work-order/config.ts   |   15 -
 .../cleaning/work-order/dashboard/index.vue   | 1402 -----------
 .../src/views/ops/cleaning/work-order/data.ts |  362 ---
 .../ops/cleaning/work-order/detail/index.vue  | 2179 -----------------
 .../views/ops/cleaning/work-order/index.vue   |  878 -------
 .../work-order/modules/assign-form.vue        |  227 --
 .../work-order/modules/cancel-form.vue        |  123 -
 .../cleaning/work-order/modules/card-view.vue |  872 -------
 .../cleaning/work-order/modules/stats-bar.vue |  486 ----
 .../modules/upgrade-priority-form.vue         |  136 -
 .../components/cleaning-actions.vue           |    0
 .../components/cleaning-detail-ext.vue        |    0
 .../components/cleaning-work-progress.vue     |    2 +-
 .../web-antd/src/views/ops/work-order/data.ts |   36 +-
 .../src/views/ops/work-order/detail/index.vue |    6 +-
 16 files changed, 34 insertions(+), 6712 deletions(-)
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/config.ts
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/dashboard/index.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/data.ts
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/detail/index.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/index.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/modules/assign-form.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/modules/cancel-form.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/modules/card-view.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/modules/stats-bar.vue
 delete mode 100644 apps/web-antd/src/views/ops/cleaning/work-order/modules/upgrade-priority-form.vue
 rename apps/web-antd/src/views/ops/{cleaning => }/work-order/components/cleaning-actions.vue (100%)
 rename apps/web-antd/src/views/ops/{cleaning => }/work-order/components/cleaning-detail-ext.vue (100%)
 rename apps/web-antd/src/views/ops/{cleaning => }/work-order/components/cleaning-work-progress.vue (99%)

diff --git a/apps/web-antd/src/router/routes/modules/ops.ts b/apps/web-antd/src/router/routes/modules/ops.ts
index 46cad717e..b8923ffb6 100644
--- a/apps/web-antd/src/router/routes/modules/ops.ts
+++ b/apps/web-antd/src/router/routes/modules/ops.ts
@@ -51,28 +51,6 @@ const routes: RouteRecordRaw[] = [
         },
         component: () => import('#/views/ops/traffic/index.vue'),
       },
-      // 保洁工单详情
-      {
-        path: 'cleaning/work-order/detail/:id',
-        name: 'CleaningWorkOrderDetail',
-        meta: {
-          title: '工单详情',
-          activePath: '/ops/cleaning/work-order',
-        },
-        component: () =>
-          import('#/views/ops/cleaning/work-order/detail/index.vue'),
-      },
-      // 保洁工单统计看板
-      {
-        path: 'cleaning/work-order/dashboard',
-        name: 'CleaningWorkOrderDashboard',
-        meta: {
-          title: '统计看板',
-          activePath: '/ops/cleaning/work-order',
-        },
-        component: () =>
-          import('#/views/ops/cleaning/work-order/dashboard/index.vue'),
-      },
       // 工单中心详情（通用，支持所有工单类型）
       {
         path: 'work-order/detail/:id',
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/config.ts b/apps/web-antd/src/views/ops/cleaning/work-order/config.ts
deleted file mode 100644
index 6faaf0d45..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/config.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { OpsOrderCenterApi } from '#/api/ops/order-center';
-
-/** 保洁类型选项 */
-export const CLEANING_TYPE_OPTIONS = [
-  { label: '日常', value: OpsOrderCenterApi.CleaningType.ROUTINE },
-  { label: '深度', value: OpsOrderCenterApi.CleaningType.DEEP },
-  { label: '应急', value: OpsOrderCenterApi.CleaningType.EMERGENCY },
-];
-
-/** 保洁类型文本映射 */
-export const CLEANING_TYPE_TEXT_MAP: Record<string, string> = {
-  ROUTINE: '日常',
-  DEEP: '深度',
-  EMERGENCY: '应急',
-};
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/dashboard/index.vue b/apps/web-antd/src/views/ops/cleaning/work-order/dashboard/index.vue
deleted file mode 100644
index 5273c205b..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/dashboard/index.vue
+++ /dev/null
@@ -1,1402 +0,0 @@
-<script setup lang="ts">
-import type { ECOption } from '@vben/plugins/echarts';
-
-import {
-  nextTick,
-  onActivated,
-  onDeactivated,
-  onMounted,
-  onUnmounted,
-  ref,
-} from 'vue';
-
-import { IconifyIcon } from '@vben/icons';
-import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
-
-import { Card, Col, Row, Spin, Statistic, Tooltip } from 'ant-design-vue';
-
-import { getDashboardStats } from '#/api/ops/order-center';
-
-defineOptions({ name: 'CleaningWorkOrderDashboard' });
-
-// ========== 保洁类型映射 ==========
-// eslint-disable-next-line no-unused-vars
-const _CLEANING_TYPE_MAP: Record<
-  string,
-  { color: string; icon: string; type: string }
-> = {
-  ROUTINE: { type: '日常保洁', icon: 'solar:broom-bold', color: '#1677ff' },
-  DEEP: { type: '深度保洁', icon: 'solar:multiply-bold', color: '#52c41a' },
-  SPOT: {
-    type: '专项清洁',
-    icon: 'solar:spray-bottle-bold',
-    color: '#faad14',
-  },
-  EMERGENCY: { type: '应急处理', icon: 'solar:flame-bold', color: '#ff4d4f' },
-};
-
-// ========== 数据类型定义 ==========
-interface DashboardStats {
-  // 基础统计
-  pendingCount: number;
-  inProgressCount: number;
-  completedTodayCount: number;
-  completedTotalCount: number;
-
-  // 趋势数据（7天）
-  trendData: {
-    completedData: number[];
-    createdData: number[];
-    dates: string[];
-  };
-
-  // 工单时段分布（24小时）
-  hourlyDistribution: {
-    data: number[];
-    hours: string[];
-  };
-
-  // 耗时趋势数据（7天）
-  timeTrendData: {
-    completionTimeData: number[];
-    dates: string[];
-    responseTimeData: number[];
-  };
-
-  // 工单状态分布
-  statusDistribution: Array<{ name: string; value: number }>;
-
-  // 时段热力图数据（近7天 x 24小时）
-  heatmapData: {
-    data: number[][]; // 7x24的二维数组
-    days: string[]; // 周一到周日
-    hours: string[]; // 0-23小时
-  };
-
-  // 功能类型工单排行
-  functionTypeRanking: Array<{
-    completed: number;
-    count: number;
-    functionType: string;
-    rate: number;
-  }>;
-
-  // 当月与上月工单趋势对比
-  monthlyTrendData?: {
-    currentMonth: { createdData: number[]; dates: string[] };
-    lastMonth: { createdData: number[]; dates: string[] };
-  };
-
-  // 工牌近7天队列数量统计
-  badgeQueueStats?: {
-    dates: string[];
-    queueData: number[];
-  };
-}
-
-// ========== 响应式数据 ==========
-const loading = ref(true);
-const chartLoading = ref(true);
-
-// 图表引用
-const trendChartRef = ref();
-const heatmapChartRef = ref();
-const timeTrendChartRef = ref();
-const statusChartRef = ref();
-const functionTypeRankingChartRef = ref();
-const badgeQueueChartRef = ref();
-
-const { renderEcharts: renderTrendChart } = useEcharts(trendChartRef);
-const { renderEcharts: renderHeatmapChart } = useEcharts(heatmapChartRef);
-const { renderEcharts: renderTimeTrendChart } = useEcharts(timeTrendChartRef);
-const { renderEcharts: renderStatusChart } = useEcharts(statusChartRef);
-const { renderEcharts: renderFunctionTypeRankingChart } = useEcharts(
-  functionTypeRankingChartRef,
-);
-const { renderEcharts: renderBadgeQueueChart } = useEcharts(badgeQueueChartRef);
-
-const statsData = ref<DashboardStats>({
-  pendingCount: 0,
-  inProgressCount: 0,
-  completedTodayCount: 0,
-  completedTotalCount: 0,
-  trendData: {
-    dates: [],
-    createdData: [],
-    completedData: [],
-  },
-  hourlyDistribution: {
-    hours: [],
-    data: [],
-  },
-  timeTrendData: {
-    dates: [],
-    responseTimeData: [],
-    completionTimeData: [],
-  },
-  statusDistribution: [],
-  heatmapData: {
-    days: [],
-    hours: [],
-    data: [],
-  },
-  functionTypeRanking: [],
-  monthlyTrendData: undefined,
-  badgeQueueStats: undefined,
-});
-
-// ========== 空数据（API失败时的fallback） ==========
-const EMPTY_STATS: DashboardStats = {
-  pendingCount: 0,
-  inProgressCount: 0,
-  completedTodayCount: 0,
-  completedTotalCount: 0,
-  trendData: { dates: [], createdData: [], completedData: [] },
-  hourlyDistribution: { hours: [], data: [] },
-  timeTrendData: { dates: [], responseTimeData: [], completionTimeData: [] },
-  statusDistribution: [],
-  heatmapData: { days: [], hours: [], data: [] },
-  functionTypeRanking: [],
-  monthlyTrendData: undefined,
-  badgeQueueStats: undefined,
-};
-
-// ========== 图表配置 ==========
-
-/**
- * 工单趋势图表配置（当月 vs 上月新增工单对比）
- */
-function getTrendChartOptions(): ECOption {
-  const monthly = statsData.value.monthlyTrendData;
-  // 如果没有月度对比数据，回退到原有7天数据
-  if (!monthly) {
-    const { trendData } = statsData.value;
-    return {
-      tooltip: { trigger: 'axis' },
-      legend: {
-        data: ['新增工单'],
-        top: '5%',
-        textStyle: { color: '#595959' },
-      },
-      grid: {
-        left: '3%',
-        right: '4%',
-        bottom: '3%',
-        top: '15%',
-        containLabel: true,
-      },
-      xAxis: [
-        {
-          type: 'category',
-          boundaryGap: false,
-          data: trendData.dates,
-          axisLine: { lineStyle: { color: '#d9d9d9' } },
-          axisLabel: { color: '#8c8c8c' },
-        },
-      ],
-      yAxis: [
-        {
-          type: 'value',
-          name: '工单数量',
-          nameTextStyle: { color: '#8c8c8c' },
-          axisLine: { show: false },
-          axisLabel: { color: '#8c8c8c' },
-          splitLine: { lineStyle: { color: '#f0f0f0', type: 'dashed' } },
-        },
-      ],
-      series: [
-        {
-          name: '新增工单',
-          type: 'line',
-          smooth: true,
-          symbol: 'circle',
-          symbolSize: 6,
-          data: trendData.createdData,
-          itemStyle: { color: '#1677ff' },
-          areaStyle: {
-            opacity: 0.15,
-            color: {
-              type: 'linear',
-              x: 0,
-              y: 0,
-              x2: 0,
-              y2: 1,
-              colorStops: [
-                { offset: 0, color: 'rgba(22, 119, 255, 0.4)' },
-                { offset: 1, color: 'rgba(22, 119, 255, 0.05)' },
-              ],
-            },
-          },
-        },
-      ],
-    };
-  }
-
-  // 使用日期中的"日"部分作为x轴（方便对比）
-  const currentDates = monthly.currentMonth.dates.map((d) => {
-    const parts = d.split('-');
-    return parts[2] || d;
-  });
-  const lastDates = monthly.lastMonth.dates.map((d) => {
-    const parts = d.split('-');
-    return parts[2] || d;
-  });
-  // 取最长的日期轴
-  const xData =
-    currentDates.length >= lastDates.length ? currentDates : lastDates;
-
-  return {
-    tooltip: {
-      trigger: 'axis',
-      axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } },
-    },
-    legend: {
-      data: ['当月新增', '上月新增'],
-      top: '5%',
-      textStyle: { color: '#595959' },
-    },
-    grid: {
-      left: '3%',
-      right: '4%',
-      bottom: '3%',
-      top: '15%',
-      containLabel: true,
-    },
-    xAxis: [
-      {
-        type: 'category',
-        boundaryGap: false,
-        data: xData,
-        axisLine: { lineStyle: { color: '#d9d9d9' } },
-        axisLabel: { color: '#8c8c8c', formatter: (val: string) => `${val}日` },
-      },
-    ],
-    yAxis: [
-      {
-        type: 'value',
-        name: '工单数量',
-        nameTextStyle: { color: '#8c8c8c' },
-        axisLine: { show: false },
-        axisLabel: { color: '#8c8c8c' },
-        splitLine: { lineStyle: { color: '#f0f0f0', type: 'dashed' } },
-      },
-    ],
-    series: [
-      {
-        name: '当月新增',
-        type: 'line',
-        smooth: true,
-        symbol: 'circle',
-        symbolSize: 6,
-        areaStyle: {
-          opacity: 0.15,
-          color: {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [
-              { offset: 0, color: 'rgba(22, 119, 255, 0.35)' },
-              { offset: 1, color: 'rgba(22, 119, 255, 0.03)' },
-            ],
-          },
-        },
-        emphasis: { focus: 'series' },
-        data: monthly.currentMonth.createdData,
-        itemStyle: { color: '#1677ff' },
-        lineStyle: { width: 2.5 },
-      },
-      {
-        name: '上月新增',
-        type: 'line',
-        smooth: true,
-        symbol: 'circle',
-        symbolSize: 5,
-        lineStyle: { type: 'dashed', width: 1.5 },
-        areaStyle: {
-          opacity: 0.06,
-          color: {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [
-              { offset: 0, color: 'rgba(147, 196, 255, 0.25)' },
-              { offset: 1, color: 'rgba(147, 196, 255, 0.03)' },
-            ],
-          },
-        },
-        emphasis: { focus: 'series' },
-        data: monthly.lastMonth.createdData,
-        itemStyle: { color: '#93c4fd' },
-      },
-    ],
-  };
-}
-
-/**
- * 平均耗时趋势图表配置（双轴折线图）
- */
-function getTimeTrendChartOptions(): ECOption {
-  const { timeTrendData } = statsData.value;
-  return {
-    tooltip: {
-      trigger: 'axis',
-      axisPointer: {
-        type: 'cross',
-        label: {
-          backgroundColor: '#6a7985',
-        },
-      },
-      formatter: (params: any) => {
-        let result = `${params[0].name}<br/>`;
-        params.forEach((param: any) => {
-          result += `${param.marker} ${param.seriesName}: ${param.value}分钟<br/>`;
-        });
-        return result;
-      },
-    },
-    legend: {
-      data: ['平均响应时间', '平均完成时间'],
-      top: '5%',
-      textStyle: {
-        color: '#595959',
-      },
-    },
-    grid: {
-      left: '3%',
-      right: '4%',
-      bottom: '3%',
-      top: '15%',
-      containLabel: true,
-    },
-    xAxis: [
-      {
-        type: 'category',
-        boundaryGap: false,
-        data: timeTrendData.dates,
-        axisLine: {
-          lineStyle: {
-            color: '#d9d9d9',
-          },
-        },
-        axisLabel: {
-          color: '#8c8c8c',
-        },
-      },
-    ],
-    yAxis: [
-      {
-        type: 'value',
-        name: '响应时间(分钟)',
-        nameTextStyle: {
-          color: '#8c8c8c',
-          fontSize: 12,
-        },
-        position: 'left',
-        axisLine: {
-          show: false,
-        },
-        axisLabel: {
-          color: '#8c8c8c',
-        },
-        splitLine: {
-          lineStyle: {
-            color: '#f0f0f0',
-            type: 'dashed',
-          },
-        },
-      },
-      {
-        type: 'value',
-        name: '完成时间(分钟)',
-        nameTextStyle: {
-          color: '#8c8c8c',
-          fontSize: 12,
-        },
-        position: 'right',
-        axisLine: {
-          show: false,
-        },
-        axisLabel: {
-          color: '#8c8c8c',
-        },
-        splitLine: {
-          show: false,
-        },
-      },
-    ],
-    series: [
-      {
-        name: '平均响应时间',
-        type: 'line',
-        smooth: true,
-        symbol: 'circle',
-        symbolSize: 6,
-        yAxisIndex: 0,
-        data: timeTrendData.responseTimeData,
-        itemStyle: {
-          color: '#1677ff',
-        },
-        lineStyle: {
-          width: 2,
-        },
-      },
-      {
-        name: '平均完成时间',
-        type: 'line',
-        smooth: true,
-        symbol: 'circle',
-        symbolSize: 6,
-        yAxisIndex: 1,
-        data: timeTrendData.completionTimeData,
-        itemStyle: {
-          color: '#52c41a',
-        },
-        lineStyle: {
-          width: 2,
-        },
-      },
-    ],
-  };
-}
-
-/**
- * 工单状态分布环形饼图配置
- */
-function getStatusDistributionChartOptions(): ECOption {
-  const { statusDistribution } = statsData.value;
-  const STATUS_COLORS: Record<string, string> = {
-    待处理: '#faad14',
-    排队中: '#722ed1',
-    已派单: '#1677ff',
-    已到岗: '#13c2c2',
-    已完成: '#52c41a',
-    已取消: '#ff4d4f',
-    已暂停: '#8c8c8c',
-  };
-  const total = statusDistribution.reduce((sum, item) => sum + item.value, 0);
-  return {
-    tooltip: {
-      trigger: 'item',
-      backgroundColor: 'rgba(255, 255, 255, 0.96)',
-      borderColor: '#f0f0f0',
-      borderWidth: 1,
-      padding: [8, 12],
-      textStyle: { color: '#262626', fontSize: 13 },
-      formatter: (params: any) => {
-        const marker = `<span style="display:inline-block;width:8px;height:8px;border-radius:50%;background:${params.color};margin-right:6px;"></span>`;
-        return `${marker}${params.name}<br/><span style="font-size:16px;font-weight:600">${params.value}</span> 个 <span style="color:#8c8c8c;margin-left:4px">${params.percent}%</span>`;
-      },
-    },
-    legend: {
-      orient: 'vertical',
-      right: '4%',
-      top: 'center',
-      itemWidth: 10,
-      itemHeight: 10,
-      itemGap: 14,
-      icon: 'circle',
-      textStyle: { fontSize: 12, color: '#595959' },
-    },
-    graphic: [
-      {
-        type: 'text',
-        left: '23%',
-        top: '38%',
-        style: {
-          text: `${total}`,
-          fontSize: 26,
-          fontWeight: '700',
-          fill: '#262626',
-          textAlign: 'center',
-        },
-      },
-      {
-        type: 'text',
-        left: '23%',
-        top: '55%',
-        style: {
-          text: '近7天工单',
-          fontSize: 11,
-          fill: '#bfbfbf',
-          textAlign: 'center',
-        },
-      },
-    ],
-    series: [
-      {
-        name: '工单状态分布',
-        type: 'pie',
-        radius: ['48%', '70%'],
-        center: ['25%', '50%'],
-        avoidLabelOverlap: false,
-        label: { show: false },
-        emphasis: {
-          scale: true,
-          scaleSize: 8,
-          label: { show: false },
-        },
-        itemStyle: {
-          borderColor: '#fff',
-          borderWidth: 2,
-          borderRadius: 6,
-        },
-        data: statusDistribution.map((item) => ({
-          ...item,
-          itemStyle: {
-            color: STATUS_COLORS[item.name] || '#d9d9d9',
-          },
-        })),
-      },
-    ],
-  };
-}
-
-/**
- * 时段热力图图表配置（7天x24小时）
- * 对数变换 + RGB线性插值：低量区间色彩差异大，高量区间自动压缩
- */
-function getHeatmapChartOptions(): ECOption {
-  const { heatmapData } = statsData.value;
-  const xAxisData = heatmapData.hours.map((_h, i) => i);
-  const yAxisData = heatmapData.days.map((_d, i) => i);
-
-  const data: number[][] = [];
-  for (let day = 0; day < heatmapData.days.length; day++) {
-    for (let hour = 0; hour < 24; hour++) {
-      const value = heatmapData.data[day]?.[hour] || 0;
-      data.push([hour, day, value]);
-    }
-  }
-
-  const maxVal = Math.max(1, ...data.map((d: number[]) => d[2] || 0));
-
-  // RGB线性插值生成颜色：0单灰色 → 最大值主蓝，基于对数比例
-  const COLOR_ZERO: [number, number, number] = [245, 245, 245]; // #f5f5f5
-  const COLOR_MAX: [number, number, number] = [22, 119, 255]; // #1677ff
-  const logMax = Math.log1p(maxVal);
-
-  function valueToColor(val: number): string {
-    if (val <= 0) return `rgb(${COLOR_ZERO.join(',')})`;
-    const t = Math.log1p(val) / logMax; // 0~1 对数比例
-    const r = Math.round(COLOR_ZERO[0] + (COLOR_MAX[0] - COLOR_ZERO[0]) * t);
-    const g = Math.round(COLOR_ZERO[1] + (COLOR_MAX[1] - COLOR_ZERO[1]) * t);
-    const b = Math.round(COLOR_ZERO[2] + (COLOR_MAX[2] - COLOR_ZERO[2]) * t);
-    return `rgb(${r},${g},${b})`;
-  }
-
-  // 为每个数据点计算精确颜色
-  const seriesData = data.map((d) => ({
-    value: d,
-    itemStyle: { color: valueToColor(d[2] || 0) },
-  }));
-
-  // 图例色带：采样生成渐变色阶
-  const legendSteps = 10;
-  const legendColors: string[] = [];
-  for (let i = 0; i <= legendSteps; i++) {
-    const val = (maxVal * i) / legendSteps;
-    legendColors.push(valueToColor(val));
-  }
-
-  return {
-    tooltip: {
-      position: 'top',
-      formatter: (params: any) => {
-        const day = heatmapData.days[params.value[1]] || '';
-        const hour = heatmapData.hours[params.value[0]] || '';
-        const value = params.value[2] || 0;
-        return `${day} ${hour}<br/>工单数: ${value}单`;
-      },
-    },
-    grid: {
-      height: '70%',
-      top: '5%',
-      left: '8%',
-      right: '3%',
-      bottom: '20%',
-    },
-    xAxis: {
-      type: 'category',
-      data: xAxisData,
-      splitArea: { show: true },
-      axisLabel: {
-        fontSize: 9,
-        color: '#8c8c8c',
-        formatter: (i: number) => (i % 3 === 0 ? `${i}:00` : ''),
-      },
-      axisLine: { show: false },
-      axisTick: { show: false },
-    },
-    yAxis: {
-      type: 'category',
-      data: yAxisData,
-      splitArea: { show: true },
-      axisLabel: {
-        fontSize: 11,
-        color: '#595959',
-        formatter: (i: number) => heatmapData.days[i] || '',
-      },
-      axisLine: { show: false },
-      axisTick: { show: false },
-    },
-    visualMap: {
-      min: 0,
-      max: maxVal,
-      calculable: false,
-      orient: 'horizontal',
-      left: 'center',
-      bottom: '2%',
-      text: [`${maxVal}`, '0'],
-      textStyle: { fontSize: 10, color: '#8c8c8c' },
-      itemWidth: 10,
-      itemHeight: 80,
-      inRange: { color: legendColors },
-      show: true,
-    },
-    series: [
-      {
-        name: '工单数量',
-        type: 'heatmap',
-        data: seriesData,
-        label: { show: false },
-        emphasis: {
-          itemStyle: {
-            shadowBlur: 10,
-            shadowColor: 'rgba(0, 0, 0, 0.3)',
-          },
-        },
-      },
-    ],
-  };
-}
-
-/**
- * 区域类型排行图表配置
- */
-function getFunctionTypeRankingChartOptions(): ECOption {
-  // 按工单数从低到高排序（ECharts水平柱状图yAxis从下往上，所以升序=视觉上从高到低）
-  const sorted = [...statsData.value.functionTypeRanking].toSorted(
-    (a, b) => a.count - b.count,
-  );
-  return {
-    grid: {
-      left: '3%',
-      right: '15%',
-      top: '5%',
-      bottom: '3%',
-      containLabel: true,
-    },
-    xAxis: {
-      type: 'value',
-      max: 'dataMax',
-      axisLabel: {
-        show: false,
-      },
-      splitLine: {
-        show: false,
-      },
-    },
-    yAxis: {
-      type: 'category',
-      data: sorted.map((item) => item.functionType),
-      axisLabel: {
-        fontSize: 13,
-        color: '#595959',
-      },
-      axisLine: {
-        show: false,
-      },
-      axisTick: {
-        show: false,
-      },
-    },
-    series: [
-      {
-        type: 'bar',
-        data: sorted.map((item) => ({
-          value: item.count,
-          itemStyle: {
-            color: getCompletionRateColor(item.rate),
-            borderRadius: [0, 6, 6, 0],
-          },
-        })),
-        barWidth: 18,
-        label: {
-          show: true,
-          position: 'right',
-          fontSize: 13,
-          color: '#262626',
-          fontWeight: 500,
-          formatter: (params: any) => `${params.value}单`,
-        },
-      },
-    ],
-  };
-
-  /** 获取完成率对应的颜色 */
-  function getCompletionRateColor(rate: number): string {
-    if (rate >= 95) return '#52c41a';
-    if (rate >= 90) return '#1677ff';
-    if (rate >= 85) return '#faad14';
-    if (rate >= 80) return '#ff7a45';
-    return '#ff4d4f';
-  }
-}
-
-/**
- * 工牌近7天队列数量统计图表配置
- */
-function getBadgeQueueChartOptions(): ECOption {
-  const queue = statsData.value.badgeQueueStats;
-  if (!queue || queue.dates.length === 0) return {};
-  const maxVal = Math.max(...queue.queueData, 1);
-  return {
-    tooltip: {
-      trigger: 'axis',
-      backgroundColor: 'rgba(255, 255, 255, 0.96)',
-      borderColor: '#f0f0f0',
-      borderWidth: 1,
-      padding: [8, 12],
-      textStyle: { color: '#262626', fontSize: 13 },
-      formatter: (params: any) => {
-        const param = params[0];
-        return `<span style="color:#8c8c8c">${param.name}</span><br/><span style="font-size:16px;font-weight:600;color:#1677ff">${param.value}</span> <span style="color:#8c8c8c">个排队</span>`;
-      },
-    },
-    grid: {
-      left: '3%',
-      right: '4%',
-      bottom: '3%',
-      top: '15%',
-      containLabel: true,
-    },
-    xAxis: [
-      {
-        type: 'category',
-        data: queue.dates,
-        axisLine: { lineStyle: { color: '#f0f0f0' } },
-        axisTick: { show: false },
-        axisLabel: { color: '#8c8c8c', fontSize: 11 },
-      },
-    ],
-    yAxis: [
-      {
-        type: 'value',
-        name: '队列数',
-        nameTextStyle: { color: '#8c8c8c', fontSize: 12 },
-        axisLine: { show: false },
-        axisTick: { show: false },
-        axisLabel: { color: '#8c8c8c' },
-        splitLine: { lineStyle: { color: '#f5f5f5', type: 'dashed' } },
-      },
-    ],
-    series: [
-      {
-        name: '队列数量',
-        type: 'bar',
-        barWidth: '40%',
-        data: queue.queueData.map((val) => ({
-          value: val,
-          itemStyle: {
-            color: {
-              type: 'linear',
-              x: 0,
-              y: 0,
-              x2: 0,
-              y2: 1,
-              colorStops: [
-                { offset: 0, color: val === maxVal ? '#0958d9' : '#1677ff' },
-                { offset: 1, color: val === maxVal ? '#4096ff' : '#91caff' },
-              ],
-            },
-            borderRadius: [6, 6, 0, 0],
-          },
-        })),
-        label: {
-          show: true,
-          position: 'top',
-          fontSize: 11,
-          fontWeight: '600',
-          color: '#1677ff',
-          formatter: (params: any) => (params.value > 0 ? params.value : ''),
-        },
-        emphasis: {
-          itemStyle: {
-            color: {
-              type: 'linear',
-              x: 0,
-              y: 0,
-              x2: 0,
-              y2: 1,
-              colorStops: [
-                { offset: 0, color: '#003eb3' },
-                { offset: 1, color: '#0958d9' },
-              ],
-            },
-          },
-        },
-      },
-    ],
-  };
-}
-
-// ========== 数据加载 ==========
-
-/** 加载统计数据 */
-async function loadStats() {
-  loading.value = true;
-  try {
-    const resp = await getDashboardStats();
-
-    statsData.value = {
-      pendingCount: resp.pendingCount,
-      inProgressCount: resp.inProgressCount,
-      completedTodayCount: resp.completedTodayCount,
-      completedTotalCount: resp.completedTotalCount,
-      trendData: resp.trendData,
-      hourlyDistribution: resp.hourlyDistribution,
-      timeTrendData: resp.timeTrendData,
-      statusDistribution: resp.statusDistribution,
-      heatmapData: resp.heatmapData,
-      functionTypeRanking: resp.functionTypeRanking,
-      monthlyTrendData: resp.monthlyTrendData,
-      badgeQueueStats: resp.badgeQueueStats,
-    };
-
-    // 渲染图表
-    chartLoading.value = false;
-    await nextTick();
-    renderTrendChart(getTrendChartOptions());
-    renderHeatmapChart(getHeatmapChartOptions());
-    renderTimeTrendChart(getTimeTrendChartOptions());
-    renderStatusChart(getStatusDistributionChartOptions());
-    renderFunctionTypeRankingChart(getFunctionTypeRankingChartOptions());
-    renderBadgeQueueChart(getBadgeQueueChartOptions());
-  } catch {
-    // API失败时使用空数据作为fallback
-    statsData.value = { ...EMPTY_STATS };
-  } finally {
-    loading.value = false;
-  }
-}
-
-// ========== 生命周期 ==========
-let refreshTimer: null | ReturnType<typeof setInterval> = null;
-
-function startPolling() {
-  stopPolling();
-  loadStats();
-  refreshTimer = setInterval(loadStats, 30_000);
-}
-
-function stopPolling() {
-  if (refreshTimer) {
-    clearInterval(refreshTimer);
-    refreshTimer = null;
-  }
-}
-
-onMounted(startPolling);
-onActivated(() => {
-  if (!refreshTimer) {
-    startPolling();
-  }
-});
-onDeactivated(stopPolling);
-onUnmounted(stopPolling);
-</script>
-
-<template>
-  <div class="work-order-dashboard">
-    <Spin :spinning="loading">
-      <!-- 第一行：核心指标卡片 -->
-      <Row :gutter="[12, 12]" class="mb-3">
-        <Col :xs="24" :sm="12" :lg="6">
-          <Card class="metric-card metric-card--pending">
-            <div class="metric-content">
-              <div class="metric-icon">
-                <IconifyIcon icon="solar:clock-circle-bold-duotone" />
-              </div>
-              <div class="metric-info">
-                <div class="metric-label">待处理工单</div>
-                <Statistic
-                  :value="statsData.pendingCount"
-                  :value-style="{
-                    fontSize: '24px',
-                    fontWeight: 600,
-                    color: '#ff4d4f',
-                  }"
-                />
-              </div>
-            </div>
-          </Card>
-        </Col>
-
-        <Col :xs="24" :sm="12" :lg="6">
-          <Card class="metric-card metric-card--progress">
-            <div class="metric-content">
-              <div class="metric-icon">
-                <IconifyIcon icon="solar:play-circle-bold-duotone" />
-              </div>
-              <div class="metric-info">
-                <div class="metric-label">进行中工单</div>
-                <Statistic
-                  :value="statsData.inProgressCount"
-                  :value-style="{
-                    fontSize: '24px',
-                    fontWeight: 600,
-                    color: '#1677ff',
-                  }"
-                />
-              </div>
-            </div>
-          </Card>
-        </Col>
-
-        <Col :xs="24" :sm="12" :lg="6">
-          <Card class="metric-card metric-card--completed">
-            <div class="metric-content">
-              <div class="metric-icon">
-                <IconifyIcon icon="solar:check-circle-bold-duotone" />
-              </div>
-              <div class="metric-info">
-                <div class="metric-label">今日完成</div>
-                <Statistic
-                  :value="statsData.completedTodayCount"
-                  :value-style="{
-                    fontSize: '24px',
-                    fontWeight: 600,
-                    color: '#52c41a',
-                  }"
-                />
-              </div>
-            </div>
-          </Card>
-        </Col>
-
-        <Col :xs="24" :sm="12" :lg="6">
-          <Card class="metric-card metric-card--total">
-            <div class="metric-content">
-              <div class="metric-icon">
-                <IconifyIcon icon="solar:document-text-bold-duotone" />
-              </div>
-              <div class="metric-info">
-                <div class="metric-label">累计完成</div>
-                <Statistic
-                  :value="statsData.completedTotalCount"
-                  :value-style="{
-                    fontSize: '24px',
-                    fontWeight: 600,
-                    color: '#722ed1',
-                  }"
-                />
-              </div>
-            </div>
-          </Card>
-        </Col>
-      </Row>
-
-      <!-- 第二行：工单趋势（当月vs上月） + 时段热力图（近7天） -->
-      <Row :gutter="[12, 12]" class="mb-3">
-        <Col :xs="24" :lg="16">
-          <Card class="chart-card" title="工单趋势（当月 vs 上月）">
-            <template #extra>
-              <Tooltip title="展示当月与上月的新增工单对比">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="info-icon"
-                />
-              </Tooltip>
-            </template>
-            <Spin :spinning="chartLoading">
-              <EchartsUI ref="trendChartRef" class="chart-container" />
-            </Spin>
-          </Card>
-        </Col>
-
-        <Col :xs="24" :lg="8">
-          <Card class="chart-card" title="时段热力图（近7天）">
-            <template #extra>
-              <Tooltip title="展示近7天各时段的工单数量热力分布">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="info-icon"
-                />
-              </Tooltip>
-            </template>
-            <Spin :spinning="chartLoading">
-              <EchartsUI ref="heatmapChartRef" class="chart-container" />
-            </Spin>
-          </Card>
-        </Col>
-      </Row>
-
-      <!-- 第三行：平均耗时趋势 + 工单状态分布 -->
-      <Row :gutter="[12, 12]" class="mb-3">
-        <Col :xs="24" :lg="16">
-          <Card class="chart-card" title="平均耗时趋势（近7天）">
-            <template #extra>
-              <Tooltip title="展示平均响应时间和平均完成时间的变化趋势">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="info-icon"
-                />
-              </Tooltip>
-            </template>
-            <Spin :spinning="chartLoading">
-              <EchartsUI
-                ref="timeTrendChartRef"
-                class="chart-container chart-container--medium"
-              />
-            </Spin>
-          </Card>
-        </Col>
-
-        <Col :xs="24" :lg="8">
-          <Card class="chart-card" title="工单状态分布（近7天）">
-            <template #extra>
-              <Tooltip title="展示近7天工单的状态占比分布">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="info-icon"
-                />
-              </Tooltip>
-            </template>
-            <Spin :spinning="chartLoading">
-              <EchartsUI
-                ref="statusChartRef"
-                class="chart-container chart-container--medium"
-              />
-            </Spin>
-          </Card>
-        </Col>
-      </Row>
-
-      <!-- 第四行：工单排队趋势（近7天） + 区域类型排行 -->
-      <Row :gutter="[12, 12]">
-        <!-- 工单排队趋势（近7天） -->
-        <Col :xs="24" :md="12" :lg="12">
-          <Card class="chart-card" title="工单排队趋势（近7天）">
-            <template #extra>
-              <Tooltip title="展示近7天每日排队等待派单的工单数量变化">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="info-icon"
-                />
-              </Tooltip>
-            </template>
-            <Spin :spinning="chartLoading">
-              <EchartsUI ref="badgeQueueChartRef" class="chart-container" />
-            </Spin>
-          </Card>
-        </Col>
-
-        <!-- 区域类型排行 -->
-        <Col :xs="24" :md="12" :lg="12">
-          <Card class="chart-card" title="区域类型排行">
-            <template #extra>
-              <Tooltip title="按区域类型统计工单数量排行">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="info-icon"
-                />
-              </Tooltip>
-            </template>
-            <Spin :spinning="chartLoading">
-              <EchartsUI
-                ref="functionTypeRankingChartRef"
-                class="chart-container"
-              />
-            </Spin>
-          </Card>
-        </Col>
-      </Row>
-    </Spin>
-  </div>
-</template>
-
-<style scoped lang="scss">
-// ========== 响应式适配 ==========
-@media (max-width: 768px) {
-  .work-order-dashboard {
-    padding: 8px;
-  }
-
-  .chart-container {
-    height: 220px !important;
-  }
-
-  .modern-chart {
-    height: 160px !important;
-  }
-}
-
-.work-order-dashboard {
-  padding: 16px;
-}
-
-// ========== 核心指标卡片 ==========
-.metric-card {
-  position: relative;
-  overflow: hidden;
-  background: #fff;
-  border: 1px solid #f0f0f0;
-  border-radius: 8px;
-  transition: all 0.3s ease;
-
-  &:hover {
-    box-shadow: 0 4px 16px rgb(0 0 0 / 6%);
-    transform: translateY(-2px);
-  }
-
-  :deep(.ant-card-body) {
-    padding: 16px;
-  }
-
-  .metric-content {
-    display: flex;
-    gap: 12px;
-    align-items: center;
-  }
-
-  .metric-icon {
-    display: flex;
-    flex-shrink: 0;
-    align-items: center;
-    justify-content: center;
-    width: 48px;
-    height: 48px;
-    font-size: 22px;
-    border-radius: 10px;
-
-    :deep(svg) {
-      width: 22px;
-      height: 22px;
-    }
-  }
-
-  .metric-info {
-    flex: 1;
-  }
-
-  .metric-label {
-    margin-bottom: 2px;
-    font-size: 13px;
-    color: #262626;
-  }
-
-  &--pending .metric-icon {
-    color: #ff4d4f;
-    background: #fff1f0;
-  }
-
-  &--progress .metric-icon {
-    color: #1677ff;
-    background: #e6f4ff;
-  }
-
-  &--completed .metric-icon {
-    color: #52c41a;
-    background: #f6ffed;
-  }
-
-  &--total .metric-icon {
-    color: #722ed1;
-    background: #f9f0ff;
-  }
-}
-
-// ========== 图表卡片 ==========
-.chart-card {
-  background: #fff;
-  border: 1px solid #f0f0f0;
-  border-radius: 8px;
-  transition: all 0.3s ease;
-
-  &:hover {
-    box-shadow: 0 2px 12px rgb(0 0 0 / 5%);
-  }
-
-  :deep(.ant-card-head) {
-    min-height: 44px;
-    padding: 0 16px;
-    border-bottom: 1px solid #f0f0f0;
-
-    .ant-card-head-title {
-      padding: 12px 0;
-      font-size: 14px;
-      font-weight: 600;
-      color: #262626;
-    }
-  }
-
-  :deep(.ant-card-body) {
-    padding: 12px 16px 16px;
-  }
-
-  &--compact {
-    :deep(.ant-card-body) {
-      padding: 12px 16px;
-    }
-  }
-
-  &--equal {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    min-height: 260px;
-
-    :deep(.ant-card-body) {
-      display: flex;
-      flex: 1;
-      flex-direction: column;
-      justify-content: center;
-    }
-  }
-
-  .info-icon {
-    font-size: 14px;
-    color: #8c8c8c;
-    cursor: help;
-
-    &:hover {
-      color: #1677ff;
-    }
-  }
-
-  .card-title {
-    display: flex;
-    gap: 6px;
-    align-items: center;
-    font-size: 14px;
-    font-weight: 600;
-    color: #262626;
-
-    .title-icon {
-      font-size: 16px;
-      color: #1677ff;
-    }
-  }
-
-  .chart-container {
-    height: 280px;
-
-    &--medium {
-      height: 240px;
-    }
-
-    &--small {
-      height: 200px;
-    }
-  }
-}
-
-// ========== 现代化卡片样式 ==========
-.modern-card {
-  height: 100%;
-  min-height: 260px;
-  overflow: hidden;
-  background: #fff;
-  border: 1px solid #f0f0f0;
-  border-radius: 8px;
-  transition: all 0.3s ease;
-
-  &:hover {
-    box-shadow: 0 4px 16px rgb(0 0 0 / 6%);
-    transform: translateY(-1px);
-  }
-
-  :deep(.ant-card-body) {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    padding: 16px;
-  }
-
-  .modern-header {
-    display: flex;
-    align-items: center;
-    margin-bottom: 12px;
-  }
-
-  .modern-title {
-    font-size: 14px;
-    font-weight: 600;
-    color: #262626;
-  }
-
-  .modern-chart {
-    flex: 1;
-    height: 180px;
-    min-height: 180px;
-  }
-
-  // 热力图卡片特定样式
-  &--heatmap {
-    .modern-chart {
-      height: 200px;
-    }
-  }
-
-  // 排行卡片特定样式
-  &--ranking {
-    .modern-chart {
-      height: 180px;
-    }
-  }
-
-  // 时长卡片特定样式
-  &--duration {
-    .modern-chart {
-      height: 180px;
-    }
-  }
-}
-
-// ========== 暗色模式适配 ==========
-html.dark {
-  .metric-card {
-    background: #1f1f1f;
-    border-color: #303030;
-
-    &:hover {
-      box-shadow: 0 8px 24px rgb(0 0 0 / 40%);
-    }
-
-    .metric-label {
-      color: rgb(255 255 255 / 65%);
-    }
-  }
-
-  .chart-card {
-    background: #1f1f1f;
-    border-color: #303030;
-
-    :deep(.ant-card-head) {
-      border-bottom-color: #303030;
-
-      .ant-card-head-title {
-        color: rgb(255 255 255 / 85%);
-      }
-    }
-  }
-
-  .card-title {
-    color: rgb(255 255 255 / 85%);
-  }
-
-  // 现代化卡片暗色模式
-  .modern-card {
-    background: #1f1f1f;
-    border-color: #303030;
-
-    .modern-title {
-      color: rgb(255 255 255 / 85%);
-    }
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/data.ts b/apps/web-antd/src/views/ops/cleaning/work-order/data.ts
deleted file mode 100644
index d44930461..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/data.ts
+++ /dev/null
@@ -1,362 +0,0 @@
-import type { VbenFormSchema } from '#/adapter/form';
-import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-
-import { OpsOrderCenterApi } from '#/api/ops/order-center';
-
-/** 状态颜色映射（背景色 + 文字色） */
-export const STATUS_COLOR_MAP: Record<string, { bg: string; text: string }> = {
-  PENDING: { bg: '#FFF3E8', text: '#C2540A' }, // 待分配
-  QUEUED: { bg: '#F0EDFF', text: '#6D28D9' }, // 排队中
-  DISPATCHED: { bg: '#E0F2FE', text: '#0284C7' }, // 已派发
-  CONFIRMED: { bg: '#EEF0FF', text: '#3730A3' }, // 已确认
-  ARRIVED: { bg: '#E5F5EF', text: '#0D9488' }, // 已到岗
-  IN_PROGRESS: { bg: '#E8F0FE', text: '#1558C0' }, // 进行中
-  PAUSED: { bg: '#FFF7E0', text: '#92400E' }, // 已暂停
-  RESUMED: { bg: '#E5F6FB', text: '#0891B2' }, // 已恢复
-  COMPLETED: { bg: '#E8FAF2', text: '#0A7A55' }, // 已完成
-  CANCELLED: { bg: '#F0EDE8', text: '#6B5E52' }, // 已取消
-};
-
-/** 状态文本映射 */
-export const STATUS_TEXT_MAP: Record<string, string> = {
-  PENDING: '待分配',
-  QUEUED: '排队中',
-  DISPATCHED: '已推送',
-  CONFIRMED: '已确认',
-  ARRIVED: '作业中',
-  PAUSED: '已暂停',
-  RESUMED: '已恢复',
-  COMPLETED: '已完成',
-  CANCELLED: '已取消',
-};
-
-/** 状态图标映射 */
-export const STATUS_ICON_MAP: Record<string, string> = {
-  PENDING: 'solar:inbox-line-bold-duotone', // 待分配
-  QUEUED: 'solar:clock-circle-bold-duotone', // 排队中
-  DISPATCHED: 'solar:transfer-horizontal-bold-duotone', // 已推送
-  CONFIRMED: 'solar:check-circle-bold-duotone', // 已确认
-  ARRIVED: 'solar:play-circle-bold-duotone', // 作业中
-  PAUSED: 'solar:pause-circle-bold-duotone', // 已暂停
-  RESUMED: 'solar:play-circle-bold-duotone', // 已恢复
-  COMPLETED: 'solar:check-read-bold-duotone', // 已完成
-  CANCELLED: 'solar:close-circle-bold-duotone', // 已取消
-};
-
-/** Tab 快捷筛选配置 */
-export const STATUS_TAB_OPTIONS = [
-  { key: 'ALL', label: '全部', statuses: undefined },
-  { key: 'PENDING', label: '待处理', statuses: ['PENDING'] },
-  {
-    key: 'IN_PROGRESS',
-    label: '进行中',
-    statuses: ['DISPATCHED', 'CONFIRMED', 'ARRIVED', 'QUEUED'],
-  },
-  { key: 'COMPLETED', label: '已完成', statuses: ['COMPLETED'] },
-  { key: 'CANCELLED', label: '已取消', statuses: ['CANCELLED'] },
-];
-
-/** 工单类型选项 */
-export const ORDER_TYPE_OPTIONS = [
-  { label: '保洁', value: OpsOrderCenterApi.OrderType.CLEAN },
-  { label: '维修', value: OpsOrderCenterApi.OrderType.REPAIR },
-  { label: '安保', value: OpsOrderCenterApi.OrderType.SECURITY },
-];
-
-/** 工单类型文本映射 */
-export const ORDER_TYPE_TEXT_MAP: Record<string, string> = {
-  CLEAN: '保洁',
-  REPAIR: '维修',
-  SECURITY: '安保',
-};
-
-/** 工单类型颜色映射（背景色 + 文字色） */
-export const ORDER_TYPE_COLOR_MAP: Record<
-  string,
-  { bg: string; text: string }
-> = {
-  CLEAN: { bg: '#E5FAF2', text: '#047857' }, // 保洁
-  SECURITY: { bg: '#EEF0FF', text: '#3730A3' }, // 安保
-  FACILITIES: { bg: '#FFF5E0', text: '#92400E' }, // 设施
-  SERVICE: { bg: '#E0F2FE', text: '#0369A1' }, // 服务
-};
-
-/** 工单状态选项 */
-export const ORDER_STATUS_OPTIONS = [
-  { label: '待分配', value: OpsOrderCenterApi.OrderStatus.PENDING },
-  { label: '排队中', value: OpsOrderCenterApi.OrderStatus.QUEUED },
-  { label: '已推送', value: OpsOrderCenterApi.OrderStatus.DISPATCHED },
-  { label: '已确认', value: OpsOrderCenterApi.OrderStatus.CONFIRMED },
-  { label: '已到岗', value: OpsOrderCenterApi.OrderStatus.ARRIVED },
-  { label: '已暂停', value: OpsOrderCenterApi.OrderStatus.PAUSED },
-  { label: '已完成', value: OpsOrderCenterApi.OrderStatus.COMPLETED },
-  { label: '已取消', value: OpsOrderCenterApi.OrderStatus.CANCELLED },
-];
-
-/** 优先级选项 */
-export const PRIORITY_OPTIONS = [
-  { label: 'P0 (紧急)', value: OpsOrderCenterApi.Priority.P0 },
-  { label: 'P1 (重要)', value: OpsOrderCenterApi.Priority.P1 },
-  { label: 'P2 (普通)', value: OpsOrderCenterApi.Priority.P2 },
-];
-
-/** 触发来源选项 */
-export const TRIGGER_SOURCE_OPTIONS = [
-  { label: '蓝牙信标', value: OpsOrderCenterApi.TriggerSource.IOT_BEACON },
-  { label: '客流阈值', value: OpsOrderCenterApi.TriggerSource.PEOPLE_FLOW },
-  { label: '手动创建', value: OpsOrderCenterApi.TriggerSource.MANUAL },
-  { label: '视频告警', value: OpsOrderCenterApi.TriggerSource.VIDEO_ALARM },
-  { label: '门禁告警', value: OpsOrderCenterApi.TriggerSource.ACCESS_ALARM },
-  { label: '巡更告警', value: OpsOrderCenterApi.TriggerSource.PATROL_ALARM },
-  { label: '紧急按钮', value: OpsOrderCenterApi.TriggerSource.PANIC_BUTTON },
-];
-
-/** 触发来源文本映射 */
-export const TRIGGER_SOURCE_TEXT_MAP: Record<string, string> = {
-  IOT_BEACON: '蓝牙信标',
-  IOT_TRAFFIC: '客流阈值',
-  TRAFFIC: '客流阈值',
-  PEOPLE_FLOW: '客流阈值',
-  MANUAL: '手动创建',
-  VIDEO_ALARM: '视频告警',
-  ACCESS_ALARM: '门禁告警',
-  PATROL_ALARM: '巡更告警',
-  PANIC_BUTTON: '紧急按钮',
-};
-
-/** 保洁类型选项 */
-export const CLEANING_TYPE_OPTIONS = [
-  { label: '日常', value: OpsOrderCenterApi.CleaningType.ROUTINE },
-  { label: '深度', value: OpsOrderCenterApi.CleaningType.DEEP },
-  { label: '应急', value: OpsOrderCenterApi.CleaningType.EMERGENCY },
-];
-
-/** 保洁类型文本映射 */
-export const CLEANING_TYPE_TEXT_MAP: Record<string, string> = {
-  ROUTINE: '日常',
-  DEEP: '深度',
-  EMERGENCY: '应急',
-};
-
-/** 安保告警类型文本映射 */
-export const SECURITY_ALARM_TYPE_MAP: Record<string, string> = {
-  intrusion: '入侵检测',
-  leave_post: '离岗检测',
-  fire: '火焰检测',
-  fence: '电子围栏',
-};
-
-/** 安保告警类型颜色映射 */
-export const SECURITY_ALARM_TYPE_COLOR_MAP: Record<string, string> = {
-  intrusion: '#f5222d',
-  leave_post: '#fa8c16',
-  fire: '#ff4d4f',
-  fence: '#faad14',
-};
-
-/** 列表表格列定义 */
-export function useGridColumns(): VxeTableGridOptions['columns'] {
-  return [
-    { type: 'seq', width: 50, title: '序号' },
-    {
-      field: 'orderCode',
-      title: '工单编号',
-      minWidth: 180,
-      showOverflow: true,
-    },
-    {
-      field: 'title',
-      title: '工单标题',
-      minWidth: 180,
-      showOverflow: true,
-    },
-    {
-      field: 'orderType',
-      title: '类型',
-      width: 80,
-      align: 'center',
-      slots: { default: 'orderType' },
-    },
-    {
-      field: 'status',
-      title: '状态',
-      width: 90,
-      align: 'center',
-      slots: { default: 'status' },
-    },
-    {
-      field: 'priority',
-      title: '优先级',
-      width: 80,
-      align: 'center',
-      slots: { default: 'priority' },
-    },
-    {
-      field: 'location',
-      title: '位置',
-      minWidth: 150,
-      showOverflow: true,
-    },
-    {
-      field: 'assigneeName',
-      title: '执行人',
-      width: 90,
-      align: 'center',
-      slots: { default: 'assignee' },
-    },
-    {
-      field: 'createTime',
-      title: '创建时间',
-      width: 160,
-      formatter: 'formatDateTime',
-    },
-    {
-      title: '操作',
-      width: 200,
-      fixed: 'right',
-      align: 'center',
-      slots: { default: 'actions' },
-    },
-  ];
-}
-
-/** 搜索表单Schema */
-export function useSearchFormSchema(): VbenFormSchema[] {
-  return [
-    {
-      fieldName: 'orderType',
-      label: '工单类型',
-      component: 'Select',
-      componentProps: {
-        options: ORDER_TYPE_OPTIONS,
-        placeholder: '请选择工单类型',
-        allowClear: true,
-      },
-    },
-    {
-      fieldName: 'status',
-      label: '工单状态',
-      component: 'Select',
-      componentProps: {
-        options: ORDER_STATUS_OPTIONS,
-        placeholder: '请选择工单状态',
-        mode: 'multiple',
-        allowClear: true,
-        maxTagCount: 2,
-      },
-    },
-    {
-      fieldName: 'priority',
-      label: '优先级',
-      component: 'Select',
-      componentProps: {
-        options: PRIORITY_OPTIONS,
-        placeholder: '请选择优先级',
-        allowClear: true,
-      },
-    },
-    {
-      fieldName: 'orderCode',
-      label: '工单编号',
-      component: 'Input',
-      componentProps: {
-        placeholder: '请输入工单编号',
-        allowClear: true,
-      },
-    },
-    {
-      fieldName: 'title',
-      label: '工单标题',
-      component: 'Input',
-      componentProps: {
-        placeholder: '请输入标题关键词',
-        allowClear: true,
-      },
-    },
-  ];
-}
-
-/** 派单表单Schema */
-export function useAssignFormSchema(): VbenFormSchema[] {
-  return [
-    {
-      fieldName: 'orderId',
-      label: '工单ID',
-      component: 'Input',
-      dependencies: {
-        triggerFields: [''],
-        show: () => false,
-      },
-    },
-    {
-      fieldName: 'assigneeId',
-      label: '执行人',
-      component: 'Select',
-      componentProps: {
-        placeholder: '请选择执行人',
-        // TODO: 接入保洁员列表API
-        options: [],
-      },
-      rules: 'required',
-    },
-    {
-      fieldName: 'remark',
-      label: '备注',
-      component: 'Textarea',
-      componentProps: {
-        placeholder: '请输入备注（选填）',
-        rows: 3,
-      },
-    },
-  ];
-}
-
-/** 升级优先级表单Schema */
-export function useUpgradePriorityFormSchema(): VbenFormSchema[] {
-  return [
-    {
-      fieldName: 'orderId',
-      label: '工单ID',
-      component: 'Input',
-      dependencies: {
-        triggerFields: [''],
-        show: () => false,
-      },
-    },
-    {
-      fieldName: 'reason',
-      label: '升级原因',
-      component: 'Textarea',
-      componentProps: {
-        placeholder: '请输入升级为P0紧急工单的原因',
-        rows: 4,
-      },
-      rules: 'required',
-    },
-  ];
-}
-
-/** 状态干预表单Schema */
-export function useStatusInterventionFormSchema(): VbenFormSchema[] {
-  return [
-    {
-      fieldName: 'orderId',
-      label: '工单ID',
-      component: 'Input',
-      dependencies: {
-        triggerFields: [''],
-        show: () => false,
-      },
-    },
-    {
-      fieldName: 'reason',
-      label: '操作原因',
-      component: 'Textarea',
-      componentProps: {
-        placeholder: '请输入操作原因',
-        rows: 4,
-      },
-      rules: 'required',
-    },
-  ];
-}
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/detail/index.vue b/apps/web-antd/src/views/ops/cleaning/work-order/detail/index.vue
deleted file mode 100644
index 3a22d8be6..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/detail/index.vue
+++ /dev/null
@@ -1,2179 +0,0 @@
-<script setup lang="ts">
-import type { OpsCleaningApi } from '#/api/ops/cleaning';
-import type { OpsOrderCenterApi } from '#/api/ops/order-center';
-
-import {
-  computed,
-  onActivated,
-  onDeactivated,
-  onMounted,
-  onUnmounted,
-  ref,
-} from 'vue';
-import { useRoute, useRouter } from 'vue-router';
-
-import { Page, useVbenModal } from '@vben/common-ui';
-import { useTabs } from '@vben/hooks';
-import { IconifyIcon } from '@vben/icons';
-import { formatDateTime } from '@vben/utils';
-
-import {
-  Avatar,
-  Button,
-  Card,
-  Col,
-  Descriptions,
-  Divider,
-  Empty,
-  message,
-  Progress,
-  Row,
-  Spin,
-  Tag,
-  Tooltip,
-} from 'ant-design-vue';
-
-import { sendDeviceMessage } from '#/api/iot/device/device';
-import {
-  getBadgeRealtimeStatus,
-  getOrderBusinessLogs,
-  getOrderTimeline,
-  manualCompleteOrder,
-} from '#/api/ops/cleaning';
-import { getOrderDetail } from '#/api/ops/order-center';
-
-import { usePriorityInfo } from '../../../work-order/data';
-import CleaningDetailExt from '../components/cleaning-detail-ext.vue';
-import {
-  CLEANING_TYPE_TEXT_MAP,
-  ORDER_TYPE_COLOR_MAP,
-  ORDER_TYPE_TEXT_MAP,
-  STATUS_COLOR_MAP,
-  STATUS_ICON_MAP,
-  STATUS_TEXT_MAP,
-  TRIGGER_SOURCE_TEXT_MAP,
-} from '../data';
-import AssignForm from '../modules/assign-form.vue';
-import CancelForm from '../modules/cancel-form.vue';
-import UpgradePriorityForm from '../modules/upgrade-priority-form.vue';
-
-defineOptions({ name: 'CleaningWorkOrderDetail' });
-
-const route = useRoute();
-const router = useRouter();
-const { closeTabByKey } = useTabs();
-const id = route.params.id as string;
-
-// ========== 模拟数据开关 ==========
-const USE_MOCK_DATA = false;
-
-const loading = ref(true);
-const order = ref<OpsOrderCenterApi.OrderDetail>(
-  {} as OpsOrderCenterApi.OrderDetail,
-);
-const timeline = ref<OpsCleaningApi.TimelineItem[]>([]);
-const businessLogs = ref<OpsCleaningApi.BusinessLog[]>([]);
-const badgeStatus = ref<null | OpsCleaningApi.BadgeRealtimeStatus>(null);
-const refreshTimer = ref<number>();
-const showLogs = ref(false);
-
-// ========== 状态流转步骤定义 ==========
-const STATUS_STEPS = [
-  {
-    key: 'PENDING',
-    title: '待分配',
-    icon: 'solar:inbox-line-bold-duotone',
-    desc: '工单已创建，等待分配',
-  },
-  {
-    key: 'QUEUED',
-    title: '排队中',
-    icon: 'solar:clock-circle-bold-duotone',
-    desc: '执行人忙碌，任务排队',
-  },
-  {
-    key: 'DISPATCHED',
-    title: '已推送',
-    icon: 'solar:transfer-horizontal-bold-duotone',
-    desc: '已推送至执行人',
-  },
-  {
-    key: 'CONFIRMED',
-    title: '已确认',
-    icon: 'solar:check-circle-bold-duotone',
-    desc: '执行人已确认接单',
-  },
-  {
-    key: 'ARRIVED',
-    title: '作业中',
-    icon: 'solar:play-circle-bold-duotone',
-    desc: '正在执行作业',
-  },
-  {
-    key: 'COMPLETED',
-    title: '已完成',
-    icon: 'solar:check-read-bold-duotone',
-    desc: '工单已完成',
-  },
-];
-
-// ========== 日志类型配置 ==========
-const LOG_TYPE_CONFIG: Record<
-  string,
-  { bgColor: string; color: string; icon: string; label: string }
-> = {
-  system: {
-    color: '#1677ff',
-    bgColor: '#e6f4ff',
-    icon: 'solar:server-bold-duotone',
-    label: '系统',
-  },
-  operation: {
-    color: '#52c41a',
-    bgColor: '#f6ffed',
-    icon: 'solar:user-check-bold-duotone',
-    label: '操作',
-  },
-  alert: {
-    color: '#fa8c16',
-    bgColor: '#fff7e6',
-    icon: 'solar:bell-bold-duotone',
-    label: '告警',
-  },
-  device: {
-    color: '#722ed1',
-    bgColor: '#f9f0ff',
-    icon: 'solar:bluetooth-wave-bold-duotone',
-    label: '设备',
-  },
-};
-
-// ========== 模拟数据 ==========
-const MOCK_ORDER: OpsOrderCenterApi.OrderDetail = {
-  id: 10_001,
-  orderCode: 'WO20260123143025001',
-  title: 'A区洗手间紧急保洁',
-  orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-  status: 'ARRIVED' as OpsOrderCenterApi.OrderStatus,
-  priority: 0 as OpsOrderCenterApi.Priority,
-  areaId: 101,
-  location: 'A区 / 1楼洗手间',
-  assigneeId: 2001,
-  assigneeName: '张三',
-  createTime: '2026-01-23 14:30:25',
-  triggerSource: 'IOT_BEACON' as OpsOrderCenterApi.TriggerSource,
-  triggerDeviceKey: 'beacon_a1_toilet_001',
-  startTime: '2026-01-23 14:45:00',
-  extInfo: {
-    cleaningType: 'ROUTINE' as OpsOrderCenterApi.CleaningType,
-    expectedDuration: 30,
-    arrivedTime: new Date(Date.now() - 15 * 60 * 1000).toISOString(),
-  },
-};
-
-const MOCK_TIMELINE: OpsCleaningApi.TimelineItem[] = [
-  {
-    status: 'PENDING',
-    statusName: '工单创建',
-    time: '2026-01-23 14:30:25',
-    operator: '系统',
-    description: '蓝牙信标触发自动创建',
-  },
-  {
-    status: 'DISPATCHED',
-    statusName: '已推送',
-    time: '2026-01-23 14:31:02',
-    operator: '系统',
-    description: '推送至保洁员张三',
-  },
-  {
-    status: 'CONFIRMED',
-    statusName: '已确认',
-    time: '2026-01-23 14:32:15',
-    operator: '张三',
-    description: '保洁员确认接单',
-  },
-  {
-    status: 'ARRIVED',
-    statusName: '已到岗',
-    time: '2026-01-23 14:45:00',
-    operator: '系统',
-    description: '检测到保洁员到达',
-  },
-];
-
-const MOCK_BUSINESS_LOGS: OpsCleaningApi.BusinessLog[] = [
-  {
-    id: 1,
-    type: 'system',
-    title: '工单自动创建',
-    content: '蓝牙信标 beacon_a1_toilet_001 触发，系统自动创建保洁工单',
-    operator: '系统',
-    time: '2026-01-23 14:30:25',
-    status: 'PENDING',
-  },
-  {
-    id: 2,
-    type: 'system',
-    title: '智能派单',
-    content: '根据距离优先算法，自动分配给保洁员张三',
-    operator: '系统',
-    time: '2026-01-23 14:31:00',
-    status: 'DISPATCHED',
-  },
-  {
-    id: 3,
-    type: 'device',
-    title: '工牌推送',
-    content: '已向工牌设备 badge_zhangsan_001 发送震动提醒',
-    operator: '系统',
-    time: '2026-01-23 14:31:02',
-    status: 'DISPATCHED',
-  },
-  {
-    id: 4,
-    type: 'operation',
-    title: '接单确认',
-    content: '保洁员通过工牌按钮确认接受工单',
-    operator: '张三',
-    time: '2026-01-23 14:32:15',
-    status: 'CONFIRMED',
-  },
-  {
-    id: 5,
-    type: 'device',
-    title: '位置检测',
-    content: '工牌进入作业区域 A区洗手间，信号强度 -42dBm',
-    operator: '系统',
-    time: '2026-01-23 14:45:00',
-    status: 'ARRIVED',
-  },
-  {
-    id: 6,
-    type: 'alert',
-    title: '电量预警',
-    content: '工牌电量 72%，建议及时充电',
-    operator: '系统',
-    time: '2026-01-23 14:50:00',
-    status: 'ARRIVED',
-    extra: { level: 'warning' },
-  },
-  {
-    id: 7,
-    type: 'device',
-    title: '心跳上报',
-    content: '工牌状态正常，持续在区域内作业',
-    operator: '系统',
-    time: '2026-01-23 15:00:30',
-    status: 'ARRIVED',
-  },
-];
-
-const MOCK_BADGE_STATUS: OpsCleaningApi.BadgeRealtimeStatus = {
-  deviceId: 3001,
-  deviceKey: 'badge_zhangsan_001',
-  status: 'BUSY' as OpsCleaningApi.BadgeStatus,
-  batteryLevel: 72,
-  lastHeartbeatTime: new Date(Date.now() - 30 * 1000).toISOString(),
-  rssi: -42,
-  isInArea: true,
-  areaId: 101,
-  areaName: 'A区洗手间',
-};
-
-// 模态框
-const [AssignFormModal, assignFormModalApi] = useVbenModal({
-  connectedComponent: AssignForm,
-  destroyOnClose: true,
-});
-const [UpgradePriorityFormModal, upgradePriorityFormModalApi] = useVbenModal({
-  connectedComponent: UpgradePriorityForm,
-  destroyOnClose: true,
-});
-const [CancelFormModal, cancelFormModalApi] = useVbenModal({
-  connectedComponent: CancelForm,
-  destroyOnClose: true,
-});
-
-const { getPriorityInfo } = usePriorityInfo();
-
-/** 计算作业时长 */
-const workDuration = computed(() => {
-  if (!order.value.extInfo?.arrivedTime) return 0;
-  const arrived = new Date(order.value.extInfo.arrivedTime).getTime();
-  // 如果已完成，使用完成时间；否则使用当前时间
-  const endTime = order.value.endTime
-    ? new Date(order.value.endTime).getTime()
-    : Date.now();
-  return Math.floor((endTime - arrived) / 60_000);
-});
-
-/** 计算作业进度 */
-const workProgress = computed(() => {
-  if (!order.value.extInfo?.expectedDuration) return 0;
-  // 根据实际已用时长和预计时长计算进度
-  return Math.min(
-    Math.round(
-      (workDuration.value / order.value.extInfo.expectedDuration) * 100,
-    ),
-    100,
-  );
-});
-
-/** 是否超时 */
-const isOvertime = computed(() => {
-  // 已完成状态不判断超时
-  if (order.value.status === 'COMPLETED') return false;
-  // 已用时长超过预计时长才算超时
-  return (
-    order.value.extInfo?.expectedDuration &&
-    workDuration.value > order.value.extInfo.expectedDuration
-  );
-});
-
-/** 动态生成应该显示的状态步骤（根据 timeline 过滤） */
-const visibleSteps = computed(() => {
-  // 必须显示的节点（主流程）
-  const requiredSteps = new Set([
-    'ARRIVED',
-    'COMPLETED',
-    'CONFIRMED',
-    'DISPATCHED',
-    'PENDING',
-  ]);
-
-  // timeline 中存在的状态
-  const timelineStatuses = new Set(timeline.value.map((t) => t.status));
-
-  // 当前状态
-  const currentStatus = order.value.status;
-
-  // 过滤出要显示的节点
-  return STATUS_STEPS.filter((step) => {
-    // 必须显示的节点
-    if (requiredSteps.has(step.key)) return true;
-
-    // QUEUED 节点：只有在 timeline 中明确存在时才显示
-    if (step.key === 'QUEUED') {
-      return timelineStatuses.has('QUEUED');
-    }
-
-    // 其他节点：timeline 中存在，或者是当前状态
-    return timelineStatuses.has(step.key) || currentStatus === step.key;
-  });
-});
-
-/** 计算当前状态步骤索引 */
-const currentStepIndex = computed(() => {
-  if (order.value.status === 'CANCELLED') return -1;
-  if (order.value.status === 'PAUSED') {
-    // 暂停状态显示在到岗后
-    return visibleSteps.value.findIndex((s) => s.key === 'ARRIVED');
-  }
-  const index = visibleSteps.value.findIndex(
-    (s) => s.key === order.value.status,
-  );
-  return Math.max(index, 0);
-});
-
-/** 日志按时间倒序排列（最新在上，最早在下） */
-const sortedLogs = computed(() => {
-  return [...businessLogs.value].toSorted(
-    (a, b) => new Date(b.time).getTime() - new Date(a.time).getTime(),
-  );
-});
-
-/** 获取日志类型配置 */
-function getLogTypeConfig(type: string) {
-  return LOG_TYPE_CONFIG[type] || LOG_TYPE_CONFIG.system;
-}
-
-/** 格式化相对时间 */
-function formatRelativeTime(time: string) {
-  const now = Date.now();
-  const target = new Date(time).getTime();
-  const diff = now - target;
-
-  if (diff < 60_000) return '刚刚';
-  if (diff < 3_600_000) return `${Math.floor(diff / 60_000)} 分钟前`;
-  if (diff < 86_400_000) return `${Math.floor(diff / 3_600_000)} 小时前`;
-  return formatDateTime(time);
-}
-
-/** 加载工单详情 */
-async function loadOrderDetail() {
-  loading.value = true;
-  try {
-    if (USE_MOCK_DATA) {
-      await new Promise((resolve) => setTimeout(resolve, 500));
-      order.value = { ...MOCK_ORDER };
-      await Promise.all([loadTimeline(), loadBusinessLogs()]);
-      if (order.value.assigneeId) await loadBadgeStatus();
-    } else {
-      order.value = await getOrderDetail(id);
-      await Promise.all([loadTimeline(), loadBusinessLogs()]);
-      if (order.value.assigneeId) {
-        await loadBadgeStatus();
-      }
-    }
-  } catch (error) {
-    console.error('❌ 工单详情加载失败:', error);
-    message.error('获取工单详情失败');
-    handleBack();
-  } finally {
-    loading.value = false;
-  }
-}
-
-/** 加载时间轴 */
-async function loadTimeline() {
-  try {
-    if (USE_MOCK_DATA) {
-      timeline.value = [...MOCK_TIMELINE];
-    } else {
-      const res = await getOrderTimeline(id);
-      timeline.value = res.timeline || [];
-    }
-  } catch {
-    timeline.value = [];
-  }
-}
-
-/** 加载业务日志 */
-async function loadBusinessLogs() {
-  try {
-    if (USE_MOCK_DATA) {
-      businessLogs.value = [...MOCK_BUSINESS_LOGS];
-    } else {
-      const res = await getOrderBusinessLogs(id);
-      businessLogs.value = res.logs || [];
-    }
-  } catch {
-    businessLogs.value = [];
-  }
-}
-
-/** 加载工牌状态 */
-async function loadBadgeStatus() {
-  if (!order.value.assigneeId) {
-    return;
-  }
-  try {
-    badgeStatus.value = USE_MOCK_DATA
-      ? { ...MOCK_BADGE_STATUS }
-      : await getBadgeRealtimeStatus(order.value.assigneeId);
-  } catch (error) {
-    console.error('❌ 工牌状态加载失败:', error);
-    badgeStatus.value = null;
-  }
-}
-
-async function handleRefresh() {
-  await loadOrderDetail();
-}
-
-/** 关闭当前页并返回上一个路由 */
-async function handleBack() {
-  const currentPath = route.fullPath;
-  router.back();
-  // 延迟关闭 tab，确保路由已经跳转
-  setTimeout(() => {
-    closeTabByKey(currentPath);
-  }, 100);
-}
-function handleAssign() {
-  assignFormModalApi
-    .setData({ orderId: order.value.id, orderCode: order.value.orderCode })
-    .open();
-}
-function handleUpgrade() {
-  upgradePriorityFormModalApi
-    .setData({
-      orderId: order.value.id,
-      orderCode: order.value.orderCode,
-      currentPriority: order.value.priority,
-    })
-    .open();
-}
-function handleCancel() {
-  cancelFormModalApi
-    .setData({
-      orderId: order.value.id,
-      orderCode: order.value.orderCode,
-      title: order.value.title,
-    })
-    .open();
-}
-
-async function handleVoiceNotify() {
-  if (!order.value.assigneeId) return;
-  try {
-    await sendDeviceMessage({
-      deviceId: order.value.assigneeId,
-      method: 'voice.broadcast',
-      params: {
-        content: `请注意：${order.value.title}`,
-      },
-    });
-    message.success('语音提醒已发送');
-  } catch {
-    message.error('发送失败');
-  }
-}
-
-async function handleManualComplete() {
-  try {
-    await manualCompleteOrder(order.value.id!);
-    message.success('工单已完成');
-    handleRefresh();
-  } catch {
-    message.error('操作失败');
-  }
-}
-
-function getBatteryColor(level: null | number) {
-  if (level === null) return '#d9d9d9'; // 灰色表示未知
-  if (level <= 20) return '#f5222d';
-  if (level <= 50) return '#fa8c16';
-  return '#52c41a';
-}
-
-/** 获取工牌状态文本（兼容大小写） */
-function getBadgeStatusText(status: string) {
-  const upperStatus = status?.toUpperCase();
-  switch (upperStatus) {
-    case 'BUSY': {
-      return '作业中';
-    }
-    case 'IDLE': {
-      return '空闲';
-    }
-    case 'OFFLINE': {
-      return '离线';
-    }
-    case 'PAUSED': {
-      return '暂停';
-    }
-    default: {
-      return status || '未知';
-    }
-  }
-}
-
-/** 判断是否为忙碌状态（兼容大小写） */
-function isBusyStatus(status: string) {
-  return status?.toUpperCase() === 'BUSY';
-}
-
-function startPolling() {
-  stopPolling();
-  refreshTimer.value = window.setInterval(() => {
-    if (order.value.status === 'ARRIVED' && order.value.assigneeId)
-      loadBadgeStatus();
-  }, 30_000);
-}
-
-function stopPolling() {
-  if (refreshTimer.value) {
-    clearInterval(refreshTimer.value);
-    refreshTimer.value = null;
-  }
-}
-
-onMounted(async () => {
-  if (!id && !USE_MOCK_DATA) {
-    message.warning('参数错误');
-    handleBack();
-    return;
-  }
-  await loadOrderDetail();
-  startPolling();
-});
-
-onActivated(async () => {
-  if (!refreshTimer.value) {
-    await loadOrderDetail();
-    startPolling();
-  }
-});
-onDeactivated(stopPolling);
-onUnmounted(stopPolling);
-</script>
-
-<template>
-  <Page>
-    <AssignFormModal @success="handleRefresh" />
-    <UpgradePriorityFormModal @success="handleRefresh" />
-    <CancelFormModal @success="handleRefresh" />
-
-    <Spin :spinning="loading">
-      <!-- 头部 -->
-      <Card :body-style="{ padding: '12px 20px' }" class="detail-header mb-3">
-        <div class="flex items-center justify-between">
-          <div class="flex items-center gap-3">
-            <Button size="small" @click="handleBack">
-              <IconifyIcon icon="ant-design:arrow-left-outlined" class="mr-1" />
-              返回
-            </Button>
-            <Divider type="vertical" class="h-6" />
-            <div>
-              <div class="flex items-center gap-2">
-                <span class="text-base font-semibold">{{ order.title }}</span>
-                <span
-                  v-if="STATUS_COLOR_MAP[order.status]"
-                  class="status-tag inline-flex items-center rounded px-2 py-0.5 text-xs font-medium"
-                  :style="{
-                    backgroundColor: STATUS_COLOR_MAP[order.status]?.bg,
-                    color: STATUS_COLOR_MAP[order.status]?.text,
-                  }"
-                >
-                  <IconifyIcon
-                    :icon="STATUS_ICON_MAP[order.status] || 'solar:circle-bold'"
-                    class="mr-1"
-                  />
-                  {{ STATUS_TEXT_MAP[order.status] }}
-                </span>
-                <span
-                  v-if="order.priority != null"
-                  class="priority-badge inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium"
-                  :class="{
-                    'animate-pulse': Number(order.priority) === 0,
-                  }"
-                  :style="getPriorityInfo(order.priority).style"
-                >
-                  <IconifyIcon
-                    v-if="getPriorityInfo(order.priority).icon"
-                    :icon="getPriorityInfo(order.priority).icon"
-                  />
-                  {{ getPriorityInfo(order.priority).label }}
-                </span>
-              </div>
-              <div class="mt-1.5 flex items-center gap-4 text-sm text-gray-500">
-                <span class="flex items-center gap-1">
-                  <IconifyIcon icon="solar:document-text-bold-duotone" />
-                  {{ order.orderCode }}
-                </span>
-                <span class="flex items-center gap-1">
-                  <IconifyIcon icon="solar:map-point-bold-duotone" />
-                  {{ order.location || '-' }}
-                </span>
-              </div>
-            </div>
-          </div>
-          <Tooltip title="刷新数据">
-            <Button size="small" shape="circle" @click="handleRefresh">
-              <IconifyIcon icon="ant-design:reload-outlined" />
-            </Button>
-          </Tooltip>
-        </div>
-      </Card>
-
-      <!-- 工单进度 -->
-      <Card class="progress-overview-card mb-3">
-        <template #title>
-          <div class="flex items-center gap-2">
-            <IconifyIcon
-              icon="solar:routing-2-bold-duotone"
-              class="text-blue-500"
-            />
-            <span>工单进度</span>
-          </div>
-        </template>
-        <template #extra>
-          <div class="progress-actions">
-            <div class="progress-summary">
-              <span class="summary-item">
-                <IconifyIcon
-                  icon="solar:clock-circle-bold-duotone"
-                  class="text-gray-400"
-                />
-                创建于 {{ formatRelativeTime(order.createTime) }}
-              </span>
-              <Divider type="vertical" />
-              <span class="summary-item">
-                <IconifyIcon
-                  icon="solar:document-text-bold-duotone"
-                  class="text-gray-400"
-                />
-                {{ businessLogs.length }} 条日志
-              </span>
-            </div>
-            <!-- 展开日志按钮 -->
-            <Tooltip :title="showLogs ? '收起日志' : '查看业务日志'">
-              <Button
-                type="text"
-                size="small"
-                class="logs-toggle-btn"
-                :class="{ 'logs-toggle-active': showLogs }"
-                @click="showLogs = !showLogs"
-              >
-                <IconifyIcon icon="solar:notebook-bold-duotone" class="mr-1" />
-                <span>日志</span>
-                <IconifyIcon
-                  :icon="
-                    showLogs
-                      ? 'solar:alt-arrow-up-linear'
-                      : 'solar:alt-arrow-down-linear'
-                  "
-                  class="ml-1 transition-transform"
-                />
-              </Button>
-            </Tooltip>
-          </div>
-        </template>
-
-        <!-- 横向进度指示器 -->
-        <div class="progress-steps-wrapper">
-          <div class="progress-nodes">
-            <!-- 进度线（背景 + 填充） -->
-            <div class="progress-line">
-              <div
-                class="progress-line-fill"
-                :class="{ 'line-all-completed': order.status === 'COMPLETED' }"
-                :style="{
-                  width: `${Math.max(0, (currentStepIndex / (visibleSteps.length - 1)) * 100)}%`,
-                }"
-              ></div>
-            </div>
-            <div
-              v-for="(step, index) in visibleSteps"
-              :key="step.key"
-              class="progress-node"
-              :class="{
-                'node-completed': index < currentStepIndex,
-                'node-current':
-                  index === currentStepIndex &&
-                  !['CANCELLED', 'COMPLETED'].includes(order.status),
-                'node-completed-current':
-                  index === currentStepIndex && order.status === 'COMPLETED',
-                'node-pending': index > currentStepIndex,
-                'node-cancelled': order.status === 'CANCELLED',
-              }"
-            >
-              <Tooltip :title="step.desc">
-                <div class="node-icon">
-                  <IconifyIcon :icon="step.icon" />
-                </div>
-              </Tooltip>
-              <div class="node-label">{{ step.title }}</div>
-              <div
-                v-if="
-                  index < currentStepIndex ||
-                  (index === currentStepIndex && order.status === 'COMPLETED')
-                "
-                class="node-time"
-              >
-                {{
-                  timeline.find((t) => t.status === step.key)?.time
-                    ? formatRelativeTime(
-                        timeline.find((t) => t.status === step.key)?.time || '',
-                      )
-                    : step.key === 'PENDING'
-                      ? formatRelativeTime(order.createTime)
-                      : step.key === 'COMPLETED' && order.endTime
-                        ? formatRelativeTime(order.endTime)
-                        : ''
-                }}
-              </div>
-              <div
-                v-else-if="
-                  index === currentStepIndex &&
-                  order.status !== 'CANCELLED' &&
-                  order.status !== 'COMPLETED'
-                "
-                class="node-badge"
-              >
-                <span class="badge-dot"></span>
-                进行中
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <!-- 已取消状态提示 -->
-        <div v-if="order.status === 'CANCELLED'" class="cancelled-banner">
-          <IconifyIcon icon="solar:close-circle-bold-duotone" />
-          <span>工单已取消</span>
-        </div>
-
-        <!-- 展开的业务日志列表 -->
-        <div v-if="showLogs" class="logs-expand-section">
-          <div v-if="businessLogs.length > 0" class="logs-simple-list">
-            <div
-              v-for="(log, index) in sortedLogs"
-              :key="log.id"
-              class="log-simple-item"
-            >
-              <div class="log-simple-left">
-                <div
-                  class="log-simple-dot"
-                  :style="{ backgroundColor: getLogTypeConfig(log.type).color }"
-                ></div>
-                <div
-                  v-if="index < sortedLogs.length - 1"
-                  class="log-simple-line"
-                ></div>
-              </div>
-              <div class="log-simple-content">
-                <div class="log-simple-header">
-                  <span class="log-simple-title-line">
-                    <span
-                      class="log-simple-title"
-                      :style="{ color: getLogTypeConfig(log.type).color }"
-                    >
-                      {{ log.title }}
-                    </span>
-                    <span v-if="log.content" class="log-simple-msg">{{
-                      log.content
-                    }}</span>
-                  </span>
-                  <span class="log-simple-time">{{
-                    formatRelativeTime(log.time)
-                  }}</span>
-                </div>
-              </div>
-            </div>
-          </div>
-          <Empty
-            v-else
-            description="暂无日志"
-            :image="Empty.PRESENTED_IMAGE_SIMPLE"
-            class="logs-empty"
-          />
-        </div>
-      </Card>
-
-      <Row :gutter="12">
-        <!-- 左侧 -->
-        <Col :span="16">
-          <!-- 作业进度卡片 -->
-          <Card
-            v-if="
-              order.extInfo && ['ARRIVED', 'COMPLETED'].includes(order.status)
-            "
-            class="work-progress-card mb-3"
-          >
-            <template #title>
-              <div class="flex items-center gap-2">
-                <IconifyIcon
-                  icon="solar:chart-2-bold-duotone"
-                  class="text-blue-500"
-                />
-                <span>作业进度</span>
-              </div>
-            </template>
-            <Row :gutter="24" align="middle">
-              <Col :span="8">
-                <div class="progress-circle-wrapper">
-                  <Progress
-                    type="circle"
-                    :percent="workProgress"
-                    :stroke-color="
-                      isOvertime
-                        ? '#ff4d4f'
-                        : workProgress >= 100
-                          ? '#52c41a'
-                          : {
-                              '0%': '#1677ff',
-                              '100%': '#52c41a',
-                            }
-                    "
-                    :stroke-width="7"
-                    :size="130"
-                  >
-                    <template #format>
-                      <div class="progress-inner">
-                        <div
-                          class="progress-value"
-                          :style="{
-                            color: isOvertime
-                              ? '#ff4d4f'
-                              : workProgress >= 100
-                                ? '#52c41a'
-                                : '#1677ff',
-                          }"
-                        >
-                          {{ workProgress }}%
-                        </div>
-                        <div class="progress-label">完成度</div>
-                      </div>
-                    </template>
-                  </Progress>
-                </div>
-              </Col>
-              <Col :span="16">
-                <div class="work-stats-grid">
-                  <div class="stat-item">
-                    <div class="stat-icon bg-blue-50 dark:bg-blue-900/30">
-                      <IconifyIcon
-                        icon="solar:clipboard-list-bold-duotone"
-                        class="text-blue-500"
-                      />
-                    </div>
-                    <div class="stat-content">
-                      <div class="stat-label">作业类型</div>
-                      <div class="stat-value">
-                        {{
-                          CLEANING_TYPE_TEXT_MAP[order.extInfo.cleaningType!] ||
-                          '-'
-                        }}
-                      </div>
-                    </div>
-                  </div>
-                  <div class="stat-item">
-                    <div class="stat-icon bg-green-50 dark:bg-green-900/30">
-                      <IconifyIcon
-                        icon="solar:clock-circle-bold-duotone"
-                        class="text-green-500"
-                      />
-                    </div>
-                    <div class="stat-content">
-                      <div class="stat-label">预计时长</div>
-                      <div class="stat-value">
-                        {{ order.extInfo.expectedDuration }} 分钟
-                      </div>
-                    </div>
-                  </div>
-                  <div class="stat-item">
-                    <div
-                      class="stat-icon"
-                      :class="
-                        isOvertime
-                          ? 'bg-red-50 dark:bg-red-900/30'
-                          : 'bg-orange-50 dark:bg-orange-900/30'
-                      "
-                    >
-                      <IconifyIcon
-                        icon="solar:stopwatch-bold-duotone"
-                        :class="isOvertime ? 'text-red-500' : 'text-orange-500'"
-                      />
-                    </div>
-                    <div class="stat-content">
-                      <div class="stat-label">已用时长</div>
-                      <div
-                        class="stat-value"
-                        :class="{ 'text-red-500': isOvertime }"
-                      >
-                        {{ workDuration }} 分钟
-                        <Tag
-                          v-if="isOvertime"
-                          color="error"
-                          size="small"
-                          class="ml-1"
-                        >
-                          超时
-                        </Tag>
-                      </div>
-                    </div>
-                  </div>
-                  <div class="stat-item">
-                    <div class="stat-icon bg-purple-50 dark:bg-purple-900/30">
-                      <IconifyIcon
-                        icon="solar:hourglass-line-bold-duotone"
-                        class="text-purple-500"
-                      />
-                    </div>
-                    <div class="stat-content">
-                      <div class="stat-label">剩余时间</div>
-                      <div
-                        class="stat-value"
-                        :class="{ 'text-red-500': isOvertime }"
-                      >
-                        {{
-                          isOvertime
-                            ? `已超时 ${
-                                workDuration -
-                                (order.extInfo.expectedDuration || 0)
-                              } 分钟`
-                            : `${
-                                (order.extInfo.expectedDuration || 0) -
-                                workDuration
-                              } 分钟`
-                        }}
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </Col>
-            </Row>
-          </Card>
-
-          <!-- 基础信息 -->
-          <Card class="info-card mb-3">
-            <template #title>
-              <div class="flex items-center gap-2">
-                <IconifyIcon
-                  icon="solar:info-circle-bold-duotone"
-                  class="text-blue-500"
-                />
-                <span>基础信息</span>
-              </div>
-            </template>
-            <Descriptions
-              :column="2"
-              bordered
-              size="small"
-              class="custom-descriptions"
-            >
-              <Descriptions.Item label="工单类型">
-                <span
-                  class="inline-flex items-center rounded px-2 py-0.5 text-xs font-medium"
-                  :style="{
-                    backgroundColor: ORDER_TYPE_COLOR_MAP[order.orderType]?.bg,
-                    color: ORDER_TYPE_COLOR_MAP[order.orderType]?.text,
-                  }"
-                >
-                  <IconifyIcon icon="solar:broom-bold-duotone" class="mr-1" />
-                  {{ ORDER_TYPE_TEXT_MAP[order.orderType] }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item label="作业区域">
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:map-point-bold-duotone"
-                    class="text-gray-400"
-                  />
-                  {{ order.location || '-' }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item label="触发来源">
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:bluetooth-wave-bold-duotone"
-                    class="text-blue-400"
-                  />
-                  {{
-                    TRIGGER_SOURCE_TEXT_MAP[
-                      order.triggerSource || order.sourceType || ''
-                    ] || '-'
-                  }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item label="创建时间">
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:calendar-bold-duotone"
-                    class="text-gray-400"
-                  />
-                  {{ formatDateTime(order.createTime) }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item
-                v-if="order.extInfo?.arrivedTime"
-                label="到岗时间"
-              >
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:user-rounded-bold-duotone"
-                    class="text-green-400"
-                  />
-                  {{ formatDateTime(order.extInfo.arrivedTime) }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item v-if="order.startTime" label="开始时间">
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:play-circle-bold-duotone"
-                    class="text-green-400"
-                  />
-                  {{ formatDateTime(order.startTime) }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item v-if="order.endTime" label="完成时间">
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:check-read-bold-duotone"
-                    class="text-blue-400"
-                  />
-                  {{ formatDateTime(order.endTime) }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item
-                v-if="order.updateTime && order.endTime !== order.updateTime"
-                label="更新时间"
-              >
-                <span class="flex items-center gap-1">
-                  <IconifyIcon
-                    icon="solar:refresh-circle-bold-duotone"
-                    class="text-gray-400"
-                  />
-                  {{ formatDateTime(order.updateTime) }}
-                </span>
-              </Descriptions.Item>
-              <Descriptions.Item v-if="order.triggerDeviceKey" label="触发设备">
-                <code class="device-code">{{ order.triggerDeviceKey }}</code>
-              </Descriptions.Item>
-              <Descriptions.Item
-                v-if="order.extInfo?.cleaningType"
-                label="作业类型"
-              >
-                <span>
-                  {{ CLEANING_TYPE_TEXT_MAP[order.extInfo.cleaningType] }}
-                </span>
-              </Descriptions.Item>
-            </Descriptions>
-          </Card>
-
-          <!-- 保洁扩展信息 + 离岗警告 -->
-          <CleaningDetailExt
-            :order="order"
-            :badge-status="badgeStatus"
-            @voice-notify="handleVoiceNotify"
-          />
-        </Col>
-
-        <!-- 右侧 -->
-        <Col :span="8">
-          <!-- 执行人 -->
-          <Card class="assignee-card mb-3">
-            <template #title>
-              <div class="flex items-center gap-2">
-                <IconifyIcon
-                  icon="solar:user-bold-duotone"
-                  class="text-blue-500"
-                />
-                <span>执行人</span>
-              </div>
-            </template>
-            <div v-if="order.assigneeId">
-              <div class="assignee-info">
-                <Avatar :size="40" class="assignee-avatar">
-                  {{ order.assigneeName?.charAt(0) || '?' }}
-                </Avatar>
-                <div class="assignee-detail">
-                  <div class="assignee-name">
-                    {{ order.assigneeName || '未知' }}
-                  </div>
-                  <div class="assignee-id">工号: {{ order.assigneeId }}</div>
-                </div>
-                <Tag
-                  v-if="badgeStatus"
-                  :color="
-                    isBusyStatus(badgeStatus.status) ? 'processing' : 'default'
-                  "
-                  class="status-badge"
-                >
-                  {{ getBadgeStatusText(badgeStatus.status) }}
-                </Tag>
-              </div>
-
-              <!-- 工牌状态 -->
-              <div v-if="badgeStatus" class="badge-status-panel">
-                <div class="panel-header">
-                  <IconifyIcon
-                    icon="solar:bluetooth-wave-bold-duotone"
-                    class="text-blue-500"
-                  />
-                  <span>工牌实时状态</span>
-                  <div class="pulse-dot"></div>
-                </div>
-                <div class="badge-stats">
-                  <div class="badge-stat-item">
-                    <div class="badge-stat-icon">
-                      <IconifyIcon
-                        icon="solar:map-point-wave-bold-duotone"
-                        :class="
-                          badgeStatus.isInArea
-                            ? 'text-green-500'
-                            : 'text-orange-500'
-                        "
-                      />
-                    </div>
-                    <div class="badge-stat-content">
-                      <div class="badge-stat-label">位置状态</div>
-                      <div class="flex items-center gap-2">
-                        <Tag
-                          :color="badgeStatus.isInArea ? 'success' : 'warning'"
-                          size="small"
-                        >
-                          {{ badgeStatus.isInArea ? '在区域内' : '已离开' }}
-                        </Tag>
-                        <span
-                          v-if="badgeStatus.areaName"
-                          class="text-xs text-gray-500"
-                        >
-                          {{ badgeStatus.areaName }}
-                        </span>
-                      </div>
-                    </div>
-                  </div>
-                  <div class="badge-stat-item">
-                    <div class="badge-stat-icon">
-                      <IconifyIcon
-                        icon="solar:battery-charge-bold-duotone"
-                        :style="{
-                          color: getBatteryColor(badgeStatus.batteryLevel),
-                        }"
-                      />
-                    </div>
-                    <div class="badge-stat-content">
-                      <div class="badge-stat-label">电池电量</div>
-                      <div v-if="badgeStatus.batteryLevel != null">
-                        <div class="battery-bar">
-                          <div
-                            class="battery-fill"
-                            :style="{
-                              width: `${badgeStatus.batteryLevel}%`,
-                              backgroundColor: getBatteryColor(
-                                badgeStatus.batteryLevel,
-                              ),
-                            }"
-                          ></div>
-                        </div>
-                        <span
-                          class="battery-text"
-                          :style="{
-                            color: getBatteryColor(badgeStatus.batteryLevel),
-                          }"
-                        >
-                          {{ badgeStatus.batteryLevel }}%
-                        </span>
-                      </div>
-                      <span v-else class="text-xs text-gray-400">未知</span>
-                    </div>
-                  </div>
-                  <div class="badge-stat-item">
-                    <div class="badge-stat-icon">
-                      <IconifyIcon
-                        icon="solar:wifi-router-bold-duotone"
-                        class="text-blue-500"
-                      />
-                    </div>
-                    <div class="badge-stat-content">
-                      <div class="badge-stat-label">信号强度</div>
-                      <div
-                        v-if="badgeStatus.rssi != null"
-                        class="signal-strength"
-                      >
-                        <div
-                          v-for="i in 4"
-                          :key="i"
-                          class="signal-bar"
-                          :class="{
-                            active: badgeStatus.rssi > -70 + (i - 1) * 15,
-                          }"
-                        ></div>
-                        <span class="signal-value">
-                          {{ badgeStatus.rssi }} dBm
-                        </span>
-                      </div>
-                      <span v-else class="text-xs text-gray-400">未知</span>
-                    </div>
-                  </div>
-                  <div class="badge-stat-item">
-                    <div class="badge-stat-icon">
-                      <IconifyIcon
-                        icon="solar:pulse-2-bold-duotone"
-                        class="text-green-500"
-                      />
-                    </div>
-                    <div class="badge-stat-content">
-                      <div class="badge-stat-label">最后心跳</div>
-                      <div class="heartbeat-time">
-                        {{ formatRelativeTime(badgeStatus.lastHeartbeatTime) }}
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div v-else class="no-assignee">
-              <div class="no-assignee-icon">
-                <IconifyIcon icon="solar:user-plus-bold-duotone" />
-              </div>
-              <div class="no-assignee-text">暂未分配执行人</div>
-              <Button type="primary" ghost size="small" @click="handleAssign">
-                <IconifyIcon icon="solar:user-plus-bold-duotone" class="mr-1" />
-                立即分配
-              </Button>
-            </div>
-          </Card>
-
-          <!-- 操作 -->
-          <Card v-if="order.status !== 'COMPLETED'" class="actions-card">
-            <template #title>
-              <div class="flex items-center gap-2">
-                <IconifyIcon
-                  icon="solar:settings-bold-duotone"
-                  class="text-blue-500"
-                />
-                <span>快捷操作</span>
-              </div>
-            </template>
-            <div class="actions-list">
-              <template v-if="order.status === 'PENDING'">
-                <Button
-                  type="primary"
-                  block
-                  class="action-btn"
-                  @click="handleAssign"
-                >
-                  <IconifyIcon
-                    icon="solar:user-plus-bold-duotone"
-                    class="mr-1"
-                  />
-                  分配执行人
-                </Button>
-                <Button danger block class="action-btn" @click="handleCancel">
-                  <IconifyIcon
-                    icon="solar:close-circle-bold-duotone"
-                    class="mr-1"
-                  />
-                  取消工单
-                </Button>
-              </template>
-
-              <template v-if="order.status === 'DISPATCHED'">
-                <Button
-                  type="primary"
-                  block
-                  class="action-btn"
-                  @click="handleVoiceNotify"
-                >
-                  <IconifyIcon
-                    icon="solar:volume-loud-bold-duotone"
-                    class="mr-1"
-                  />
-                  语音提醒
-                </Button>
-                <Button danger block class="action-btn" @click="handleCancel">
-                  <IconifyIcon
-                    icon="solar:close-circle-bold-duotone"
-                    class="mr-1"
-                  />
-                  取消工单
-                </Button>
-              </template>
-
-              <template v-if="order.status === 'ARRIVED'">
-                <Button
-                  type="primary"
-                  block
-                  class="action-btn action-btn-success"
-                  @click="handleManualComplete"
-                >
-                  <IconifyIcon
-                    icon="solar:check-circle-bold-duotone"
-                    class="mr-1"
-                  />
-                  手动完成
-                </Button>
-                <Button block class="action-btn" @click="handleVoiceNotify">
-                  <IconifyIcon
-                    icon="solar:volume-loud-bold-duotone"
-                    class="mr-1"
-                  />
-                  语音提醒
-                </Button>
-                <Button block class="action-btn" @click="handleCancel">
-                  <IconifyIcon
-                    icon="solar:pause-circle-bold-duotone"
-                    class="mr-1"
-                  />
-                  暂停工单
-                </Button>
-              </template>
-
-              <Button
-                v-if="
-                  Number(order.priority) !== 0 &&
-                  !['COMPLETED', 'CANCELLED'].includes(order.status)
-                "
-                danger
-                ghost
-                block
-                class="action-btn action-btn-upgrade"
-                @click="handleUpgrade"
-              >
-                <IconifyIcon icon="solar:bolt-bold-duotone" class="mr-1" />
-                升级为 P0 紧急
-              </Button>
-            </div>
-          </Card>
-        </Col>
-      </Row>
-    </Spin>
-  </Page>
-</template>
-
-<style scoped>
-@keyframes pulse-glow {
-  0%,
-  100% {
-    box-shadow: 0 0 0 3px rgb(22 119 255 / 15%);
-  }
-
-  50% {
-    box-shadow: 0 0 0 5px rgb(22 119 255 / 8%);
-  }
-}
-
-@keyframes slide-down {
-  from {
-    opacity: 0;
-    transform: translateY(-6px);
-  }
-
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-@keyframes pulse {
-  0% {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  50% {
-    opacity: 0.5;
-    transform: scale(1.2);
-  }
-
-  100% {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
-:deep(.ant-card) {
-  border-radius: 8px;
-  box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
-  transition: box-shadow 0.2s;
-}
-
-:deep(.ant-card:hover) {
-  box-shadow: 0 2px 8px rgb(0 0 0 / 6%);
-}
-
-:deep(.ant-card-head) {
-  min-height: 40px;
-  padding: 0 16px;
-  border-bottom: 1px solid #f0f0f0;
-}
-
-:deep(.ant-card-head-title) {
-  padding: 10px 0;
-  font-size: 14px;
-  font-weight: 600;
-}
-
-:deep(.ant-card-body) {
-  padding: 12px 16px;
-}
-
-/* ========== 头部样式 ========== */
-.detail-header {
-  background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
-}
-
-.status-tag {
-  display: inline-flex;
-  align-items: center;
-  padding: 2px 8px;
-  font-size: 12px;
-  font-weight: 500;
-  border-radius: 10px;
-}
-
-.priority-badge {
-  font-size: 12px;
-  box-shadow: 0 1px 2px rgb(0 0 0 / 8%);
-}
-
-/* ========== 进度概览卡片 ========== */
-.progress-overview-card {
-  background: linear-gradient(135deg, #fafbff 0%, #f5f7ff 100%);
-}
-
-.progress-actions {
-  display: flex;
-  gap: 12px;
-  align-items: center;
-}
-
-.progress-summary {
-  display: flex;
-  gap: 6px;
-  align-items: center;
-  font-size: 12px;
-  color: #8c8c8c;
-}
-
-.summary-item {
-  display: flex;
-  gap: 3px;
-  align-items: center;
-}
-
-/* 日志展开按钮 */
-.logs-toggle-btn {
-  display: flex;
-  gap: 3px;
-  align-items: center;
-  padding: 4px 10px;
-  font-size: 12px;
-  font-weight: 500;
-  color: #595959;
-  background: #f5f5f5;
-  border-radius: 4px;
-  transition: all 0.2s;
-}
-
-.logs-toggle-btn:hover {
-  color: #1677ff;
-  background: #e6f4ff;
-}
-
-.logs-toggle-active {
-  color: #1677ff;
-  background: #e6f4ff;
-}
-
-/* 横向进度条 */
-.progress-steps-wrapper {
-  position: relative;
-  padding: 0 72px;
-  overflow: hidden;
-}
-
-.progress-nodes {
-  position: relative;
-  display: flex;
-  justify-content: space-between;
-}
-
-.progress-line {
-  position: absolute;
-  top: 16px;
-  right: 0;
-  left: 0;
-  z-index: 0;
-  height: 3px;
-  background: #e8e8e8;
-  border-radius: 2px;
-}
-
-.progress-line-fill {
-  height: 100%;
-  background: linear-gradient(90deg, #52c41a 0%, #1677ff 100%);
-  border-radius: 2px;
-  transition: width 0.5s ease;
-
-  &.line-all-completed {
-    background: #52c41a;
-  }
-}
-
-.progress-node {
-  position: relative;
-  z-index: 1;
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-  align-items: center;
-  width: 0;
-  overflow: visible;
-  white-space: nowrap;
-}
-
-.node-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  font-size: 15px;
-  background: #fff;
-  border: 2px solid #e8e8e8;
-  border-radius: 50%;
-  transition: all 0.3s;
-}
-
-.node-current .node-icon {
-  color: #fff;
-  background: linear-gradient(135deg, #1677ff 0%, #4096ff 100%);
-  border-color: #1677ff;
-  box-shadow: 0 0 0 3px rgb(22 119 255 / 15%);
-  animation: pulse-glow 2s infinite;
-}
-
-.node-completed .node-icon {
-  color: #fff;
-  background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
-  border-color: #52c41a;
-  box-shadow: 0 2px 6px rgb(82 196 26 / 25%);
-}
-
-/* 已完成的当前节点（绿色覆盖蓝色） */
-.progress-node.node-completed-current .node-icon {
-  color: #fff;
-  background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
-  border-color: #52c41a;
-  box-shadow: 0 2px 6px rgb(82 196 26 / 25%);
-  animation: none;
-}
-
-.node-pending .node-icon {
-  color: #bfbfbf;
-  background: #fafafa;
-}
-
-.node-cancelled .node-icon {
-  color: #fff;
-  background: linear-gradient(135deg, #ff4d4f 0%, #ff7875 100%);
-  border-color: #ff4d4f;
-}
-
-.node-label {
-  font-size: 13px;
-  font-weight: 500;
-  color: #595959;
-}
-
-.node-completed .node-label {
-  color: #52c41a;
-}
-
-.node-completed .node-time {
-  color: #52c41a;
-}
-
-.node-completed-current .node-label {
-  color: #52c41a;
-}
-
-.node-completed-current .node-time {
-  color: #52c41a;
-}
-
-.node-current .node-label {
-  font-weight: 600;
-  color: #1677ff;
-}
-
-.node-time {
-  font-size: 12px;
-  color: #8c8c8c;
-}
-
-.node-badge {
-  display: flex;
-  gap: 4px;
-  align-items: center;
-  padding: 2px 8px;
-  font-size: 12px;
-  font-weight: 500;
-  color: #1677ff;
-  background: #e6f4ff;
-  border-radius: 10px;
-}
-
-.badge-dot {
-  width: 6px;
-  height: 6px;
-  background: #1677ff;
-  border-radius: 50%;
-  animation: pulse 1.5s infinite;
-}
-
-.cancelled-banner {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-  justify-content: center;
-  padding: 10px;
-  margin-top: 16px;
-  font-size: 13px;
-  font-weight: 500;
-  color: #ff4d4f;
-  background: #fff2f0;
-  border: 1px solid #ffccc7;
-  border-radius: 6px;
-}
-
-/* ========== 作业进度卡片 ========== */
-.work-progress-card {
-  background: linear-gradient(135deg, #fff 0%, #f0f7ff 100%);
-}
-
-.progress-circle-wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.progress-inner {
-  text-align: center;
-}
-
-.progress-value {
-  font-size: 26px;
-  font-weight: 700;
-  line-height: 1.2;
-  color: #1677ff;
-}
-
-.progress-label {
-  margin-top: 2px;
-  font-size: 13px;
-  color: #8c8c8c;
-}
-
-.work-stats-grid {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  gap: 16px;
-}
-
-.stat-item {
-  display: flex;
-  gap: 12px;
-  align-items: center;
-  padding: 14px 16px;
-  background: #fff;
-  border-radius: 10px;
-  box-shadow: 0 1px 3px rgb(0 0 0 / 6%);
-}
-
-.stat-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 38px;
-  height: 38px;
-  font-size: 18px;
-  border-radius: 10px;
-}
-
-.stat-label {
-  margin-bottom: 2px;
-  font-size: 13px;
-  color: #8c8c8c;
-}
-
-.stat-value {
-  font-size: 15px;
-  font-weight: 600;
-  color: #262626;
-}
-
-/* ========== 信息卡片 ========== */
-.info-card :deep(.ant-descriptions-item-label) {
-  font-size: 13px;
-  font-weight: 500;
-  background: #fafafa;
-}
-
-.info-card :deep(.ant-descriptions-item-content) {
-  font-size: 13px;
-}
-
-.device-code {
-  padding: 2px 8px;
-  font-family: 'SF Mono', Monaco, monospace;
-  font-size: 12px;
-  color: #1677ff;
-  background: #f5f5f5;
-  border-radius: 4px;
-}
-
-/* ========== 展开日志区域样式 ========== */
-.logs-expand-section {
-  padding-top: 0;
-  margin-top: 12px;
-  border-top: 1px dashed #e8e8e8;
-  animation: slide-down 0.2s ease;
-}
-
-.logs-simple-list {
-  max-height: 280px;
-  padding: 4px 4px 0;
-  overflow: hidden auto;
-}
-
-.log-simple-item {
-  position: relative;
-  display: flex;
-  gap: 12px;
-  padding: 8px 10px;
-  cursor: default;
-  border-radius: 6px;
-  transition: background-color 0.15s;
-
-  &:hover {
-    background: #f5f5f5;
-  }
-
-  &:last-child .log-simple-line {
-    display: none;
-  }
-}
-
-.log-simple-left {
-  position: relative;
-  display: flex;
-  flex-shrink: 0;
-  flex-direction: column;
-  align-items: center;
-  width: 12px;
-  padding: 8px 0;
-  margin: -8px 0;
-}
-
-.log-simple-dot {
-  position: relative;
-  z-index: 1;
-  flex-shrink: 0;
-  width: 8px;
-  height: 8px;
-  margin-top: 6px;
-  border-radius: 50%;
-  box-shadow: 0 0 0 3px #fff;
-}
-
-.log-simple-line {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 50%;
-  width: 1px;
-  background: #e8e8e8;
-  transform: translateX(-50%);
-}
-
-.log-simple-item:first-child .log-simple-line {
-  top: 22px;
-}
-
-.log-simple-content {
-  flex: 1;
-  min-width: 0;
-}
-
-.log-simple-header {
-  display: flex;
-  gap: 12px;
-  align-items: center;
-  justify-content: space-between;
-  line-height: 20px;
-}
-
-.log-simple-title-line {
-  display: flex;
-  gap: 6px;
-  align-items: center;
-  min-width: 0;
-}
-
-.log-simple-title {
-  flex-shrink: 0;
-  font-size: 13px;
-  font-weight: 500;
-}
-
-.log-simple-msg {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  font-size: 12px;
-  color: #8c8c8c;
-  white-space: nowrap;
-}
-
-.log-simple-time {
-  flex-shrink: 0;
-  font-size: 12px;
-  color: #bfbfbf;
-}
-
-.logs-empty {
-  padding: 12px 0;
-}
-
-/* ========== 执行人卡片 ========== */
-.assignee-info {
-  display: flex;
-  gap: 10px;
-  align-items: center;
-  padding-bottom: 12px;
-  margin-bottom: 12px;
-  border-bottom: 1px solid #f0f0f0;
-}
-
-.assignee-avatar {
-  background: linear-gradient(135deg, #1677ff 0%, #4096ff 100%);
-  box-shadow: 0 2px 8px rgb(22 119 255 / 20%);
-}
-
-.assignee-detail {
-  flex: 1;
-}
-
-.assignee-name {
-  font-size: 14px;
-  font-weight: 600;
-  color: #262626;
-}
-
-.assignee-id {
-  font-size: 12px;
-  color: #8c8c8c;
-}
-
-.status-badge {
-  padding: 2px 10px;
-  font-size: 12px;
-  border-radius: 10px;
-}
-
-/* ========== 工牌状态面板 ========== */
-.badge-status-panel {
-  padding: 12px;
-  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
-  border-radius: 8px;
-}
-
-.panel-header {
-  display: flex;
-  gap: 6px;
-  align-items: center;
-  margin-bottom: 12px;
-  font-size: 13px;
-  font-weight: 500;
-  color: #595959;
-}
-
-.pulse-dot {
-  width: 6px;
-  height: 6px;
-  margin-left: auto;
-  background: #52c41a;
-  border-radius: 50%;
-  animation: pulse 1.5s infinite;
-}
-
-.badge-stats {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.badge-stat-item {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-
-.badge-stat-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  font-size: 14px;
-}
-
-.badge-stat-content {
-  flex: 1;
-}
-
-.badge-stat-label {
-  margin-bottom: 2px;
-  font-size: 12px;
-  color: #8c8c8c;
-}
-
-.battery-bar {
-  width: 100%;
-  height: 5px;
-  margin-bottom: 2px;
-  overflow: hidden;
-  background: #e8e8e8;
-  border-radius: 2px;
-}
-
-.battery-fill {
-  height: 100%;
-  border-radius: 2px;
-  transition: width 0.3s;
-}
-
-.battery-text {
-  font-size: 12px;
-  font-weight: 500;
-}
-
-.signal-strength {
-  display: flex;
-  gap: 3px;
-  align-items: center;
-}
-
-.signal-bar {
-  width: 3px;
-  height: 6px;
-  background: #e8e8e8;
-  border-radius: 1px;
-  transition: background 0.3s;
-}
-
-.signal-bar:nth-child(2) {
-  height: 9px;
-}
-
-.signal-bar:nth-child(3) {
-  height: 12px;
-}
-
-.signal-bar:nth-child(4) {
-  height: 15px;
-}
-
-.signal-bar.active {
-  background: #52c41a;
-}
-
-.signal-value {
-  margin-left: 8px;
-  font-size: 12px;
-  color: #8c8c8c;
-}
-
-.heartbeat-time {
-  font-size: 13px;
-  font-weight: 500;
-  color: #262626;
-}
-
-/* ========== 无执行人 ========== */
-.no-assignee {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  align-items: center;
-  padding: 24px 0;
-}
-
-.no-assignee-icon {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 48px;
-  height: 48px;
-  font-size: 20px;
-  color: #bfbfbf;
-  background: #f5f5f5;
-  border-radius: 50%;
-}
-
-.no-assignee-text {
-  font-size: 14px;
-  color: #8c8c8c;
-}
-
-/* ========== 操作卡片 ========== */
-.actions-list {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-
-.action-btn {
-  display: flex;
-  gap: 6px;
-  align-items: center;
-  justify-content: center;
-  height: 36px;
-  font-size: 14px;
-  font-weight: 500;
-  border-radius: 6px;
-  transition: all 0.2s;
-}
-
-.action-btn:hover {
-  box-shadow: 0 2px 8px rgb(0 0 0 / 10%);
-  transform: translateY(-1px);
-}
-
-.action-btn-success {
-  background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
-  border: none;
-}
-
-.action-btn-success:hover {
-  background: linear-gradient(135deg, #389e0d 0%, #52c41a 100%);
-}
-
-.action-btn-upgrade {
-  border-style: dashed;
-}
-
-/* ========== 暗色模式适配 ========== */
-:deep(.dark) {
-  .detail-header,
-  .progress-overview-card,
-  .work-progress-card {
-    background: var(--component-background);
-  }
-
-  .progress-line {
-    background: rgb(255 255 255 / 10%);
-  }
-
-  .node-icon {
-    background: rgb(255 255 255 / 5%);
-    border-color: rgb(255 255 255 / 15%);
-  }
-
-  .node-pending .node-icon {
-    background: rgb(255 255 255 / 5%);
-  }
-
-  .stat-item {
-    background: rgb(255 255 255 / 5%);
-  }
-
-  .logs-toggle-btn {
-    color: #a6a6a6;
-    background: rgb(255 255 255 / 5%);
-  }
-
-  .logs-toggle-btn:hover,
-  .logs-toggle-active {
-    color: #1677ff;
-    background: rgb(22 119 255 / 15%);
-  }
-
-  .logs-expand-section {
-    border-top-color: rgb(255 255 255 / 10%);
-  }
-
-  .log-simple-line {
-    background: rgb(255 255 255 / 15%);
-  }
-
-  .log-simple-dot {
-    box-shadow: 0 0 0 2px var(--component-background);
-  }
-
-  .log-simple-text {
-    color: #a6a6a6;
-  }
-
-  .badge-status-panel {
-    background: rgb(255 255 255 / 5%);
-  }
-
-  .no-assignee-icon {
-    background: rgb(255 255 255 / 5%);
-  }
-
-  .cancelled-banner {
-    background: rgb(255 77 79 / 10%);
-    border-color: rgb(255 77 79 / 30%);
-  }
-}
-
-/* ========== 通用卡片样式 ========== */
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/index.vue b/apps/web-antd/src/views/ops/cleaning/work-order/index.vue
deleted file mode 100644
index f0dce9010..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/index.vue
+++ /dev/null
@@ -1,878 +0,0 @@
-<script setup lang="ts">
-import type { VxeTableGridOptions } from '#/adapter/vxe-table';
-import type { OpsOrderCenterApi } from '#/api/ops/order-center';
-
-import { nextTick, onMounted, ref } from 'vue';
-import { useRouter } from 'vue-router';
-
-import { Page, useVbenModal } from '@vben/common-ui';
-import { IconifyIcon } from '@vben/icons';
-
-import {
-  Button,
-  Card,
-  Input,
-  message,
-  Select,
-  Tabs,
-  Tag,
-} from 'ant-design-vue';
-
-import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { OpsCleaningApi, sendDeviceNotify } from '#/api/ops/cleaning';
-import { getOrderPage } from '#/api/ops/order-center';
-
-import AreaFilterDrawer from '../../components/AreaFilterDrawer.vue';
-import {
-  ORDER_TYPE_COLOR_MAP,
-  ORDER_TYPE_OPTIONS,
-  ORDER_TYPE_TEXT_MAP,
-  PRIORITY_OPTIONS,
-  STATUS_COLOR_MAP,
-  STATUS_TAB_OPTIONS,
-  STATUS_TEXT_MAP,
-  useGridColumns,
-} from './data';
-import AssignForm from './modules/assign-form.vue';
-import CancelForm from './modules/cancel-form.vue';
-import CardView from './modules/card-view.vue';
-import StatsBar from './modules/stats-bar.vue';
-import UpgradePriorityForm from './modules/upgrade-priority-form.vue';
-
-defineOptions({ name: 'CleaningWorkOrderCenter' });
-
-const router = useRouter();
-const viewMode = ref<'card' | 'list'>('card');
-const activeTab = ref('ALL');
-const showAdvancedFilter = ref(false);
-const showAreaFilter = ref(false);
-const selectedAreaId = ref<number | undefined>(undefined);
-const cardViewRef = ref();
-const statsBarRef = ref();
-
-/** Tab 状态数量统计 */
-const tabCounts = ref<Record<string, number>>({
-  ALL: 0,
-  PENDING: 0,
-  IN_PROGRESS: 0,
-  COMPLETED: 0,
-  CANCELLED: 0,
-});
-
-// 模态框
-const [AssignFormModal, assignFormModalApi] = useVbenModal({
-  connectedComponent: AssignForm,
-  destroyOnClose: true,
-});
-
-const [UpgradePriorityFormModal, upgradePriorityFormModalApi] = useVbenModal({
-  connectedComponent: UpgradePriorityForm,
-  destroyOnClose: true,
-});
-
-const [CancelFormModal, cancelFormModalApi] = useVbenModal({
-  connectedComponent: CancelForm,
-  destroyOnClose: true,
-});
-
-// 查询参数
-const queryParams = ref({
-  orderType: undefined as OpsOrderCenterApi.OrderType | undefined,
-  status: undefined as OpsOrderCenterApi.OrderStatus[] | undefined,
-  priority: undefined as OpsOrderCenterApi.Priority | undefined,
-  orderCode: '',
-  title: '',
-  areaId: undefined as number | undefined,
-});
-
-/** 搜索 */
-function handleSearch() {
-  if (viewMode.value === 'list') {
-    gridApi.query();
-  } else {
-    cardViewRef.value?.query();
-  }
-}
-
-/** 刷新数据 */
-function handleRefresh() {
-  handleSearch();
-  statsBarRef.value?.refresh();
-}
-
-/** 重置筛选条件 */
-function handleReset() {
-  queryParams.value = {
-    orderType: undefined,
-    status: undefined,
-    priority: undefined,
-    orderCode: '',
-    title: '',
-    areaId: undefined,
-  };
-  selectedAreaId.value = undefined;
-  activeTab.value = 'ALL';
-  handleSearch();
-}
-
-/** Tab 切换 */
-function handleTabChange(key: number | string) {
-  const keyStr = String(key);
-  activeTab.value = keyStr;
-  const tabConfig = STATUS_TAB_OPTIONS.find((t) => t.key === keyStr);
-  if (tabConfig) {
-    queryParams.value.status = tabConfig.statuses as
-      | OpsOrderCenterApi.OrderStatus[]
-      | undefined;
-  }
-  handleSearch();
-}
-
-/** 视图切换 */
-async function handleViewModeChange(mode: 'card' | 'list') {
-  if (viewMode.value === mode) return;
-  viewMode.value = mode;
-  await nextTick();
-  handleSearch();
-}
-
-/** 查看详情 */
-function handleDetail(id: number) {
-  router.push({ name: 'CleaningWorkOrderDetail', params: { id } });
-}
-
-/** 打开派单表单 */
-function handleAssign(row: OpsOrderCenterApi.OrderItem) {
-  assignFormModalApi
-    .setData({ orderId: row.id, orderCode: row.orderCode })
-    .open();
-}
-
-/** 升级优先级 */
-function handleUpgrade(row: OpsOrderCenterApi.OrderItem) {
-  upgradePriorityFormModalApi
-    .setData({
-      orderId: row.id,
-      orderCode: row.orderCode,
-      currentPriority: row.priority,
-    })
-    .open();
-}
-
-/** 取消工单 */
-function handleCancel(row: OpsOrderCenterApi.OrderItem) {
-  cancelFormModalApi
-    .setData({
-      orderId: row.id,
-      orderCode: row.orderCode,
-      title: row.title,
-    })
-    .open();
-}
-
-/** 发送工牌通知 */
-async function handleNotify(
-  row: OpsOrderCenterApi.OrderItem,
-  type: 'vibrate' | 'voice',
-) {
-  if (!row.assigneeId) {
-    message.warning('该工单暂未分配执行人');
-    return;
-  }
-
-  try {
-    await sendDeviceNotify({
-      badgeId: row.assigneeId,
-      type:
-        type === 'voice'
-          ? OpsCleaningApi.NotifyType.VOICE
-          : OpsCleaningApi.NotifyType.VIBRATE,
-      content:
-        type === 'voice' ? `请注意，您有待处理工单：${row.title}` : undefined,
-    });
-    message.success(type === 'voice' ? '语音提醒已发送' : '震动提醒已发送');
-  } catch {
-    message.error('发送失败');
-  }
-}
-
-/** 区域筛选确认 */
-function handleAreaConfirm(id: number | undefined) {
-  selectedAreaId.value = id;
-  queryParams.value.areaId = id;
-  handleSearch();
-}
-
-/** 处理统计卡片点击 */
-function handleStatClick(statKey: string) {
-  // 重置筛选条件
-  queryParams.value = {
-    orderType: undefined,
-    status: undefined,
-    priority: undefined,
-    orderCode: '',
-    title: '',
-    areaId: queryParams.value.areaId,
-  };
-
-  switch (statKey) {
-    case 'completedTodayCount': {
-      queryParams.value.status = [
-        'COMPLETED',
-      ] as OpsOrderCenterApi.OrderStatus[];
-      break;
-    }
-    case 'inProgressCount': {
-      queryParams.value.status = [
-        'DISPATCHED',
-        'CONFIRMED',
-        'ARRIVED',
-        'QUEUED',
-      ];
-      break;
-    }
-    case 'pendingCount': {
-      queryParams.value.status = ['PENDING'] as OpsOrderCenterApi.OrderStatus[];
-      break;
-    }
-    default: {
-      break;
-    }
-  }
-
-  handleSearch();
-}
-
-// 表格配置
-const [Grid, gridApi] = useVbenVxeGrid({
-  gridOptions: {
-    columns: useGridColumns(),
-    height: 500,
-    keepSource: true,
-    proxyConfig: {
-      ajax: {
-        query: async ({
-          page,
-        }: {
-          page: { currentPage: number; pageSize: number };
-        }) => {
-          const params = {
-            pageNo: page.currentPage,
-            pageSize: page.pageSize,
-            ...queryParams.value,
-          };
-
-          // 处理状态数组
-          // 如果后端接收 List<String>，通常不需要手动 join(',')，直接传数组即可
-          // axios/requestClient 会自动处理为 status=A&status=B 的形式
-          // 这里移除 .join(',') 的逻辑，直接保留数组
-
-          return await getOrderPage(params);
-        },
-      },
-    },
-    pagerConfig: {
-      enabled: true,
-    },
-    rowConfig: {
-      keyField: 'id',
-      isHover: true,
-    },
-  } as VxeTableGridOptions<OpsOrderCenterApi.OrderItem>,
-});
-
-onMounted(() => {
-  // 默认使用卡片视图
-});
-</script>
-
-<template>
-  <Page auto-content-height>
-    <!-- 模态框 -->
-    <AssignFormModal @success="handleRefresh" />
-    <UpgradePriorityFormModal @success="handleRefresh" />
-    <CancelFormModal @success="handleRefresh" />
-
-    <!-- 区域筛选抽屉 -->
-    <AreaFilterDrawer
-      v-model:open="showAreaFilter"
-      v-model:model-value="selectedAreaId"
-      @confirm="handleAreaConfirm"
-    />
-
-    <!-- 快速统计栏 -->
-    <StatsBar ref="statsBarRef" @stat-click="handleStatClick" />
-
-    <!-- 工单列表容器 -->
-    <Card :body-style="{ padding: 0 }">
-      <!-- Tab 行：状态筛选 + 操作按钮 -->
-      <div class="tab-row">
-        <!-- 左侧：Tab -->
-        <Tabs
-          v-model:active-key="activeTab"
-          class="status-tabs"
-          :tab-bar-gutter="24"
-          @change="handleTabChange"
-        >
-          <Tabs.TabPane v-for="tab in STATUS_TAB_OPTIONS" :key="tab.key">
-            <template #tab>
-              <div class="tab-item">
-                <span class="tab-label">{{ tab.label }}</span>
-                <span
-                  v-if="(tabCounts[tab.key] ?? 0) > 0"
-                  class="tab-count"
-                  :class="{ 'tab-count--danger': tab.key === 'PENDING' }"
-                >
-                  {{ tabCounts[tab.key] }}
-                </span>
-              </div>
-            </template>
-          </Tabs.TabPane>
-        </Tabs>
-
-        <!-- 右侧：操作按钮 -->
-        <div class="tab-actions">
-          <!-- 视图切换 -->
-          <div class="btn-group">
-            <Button
-              class="group-btn"
-              :class="{ 'group-btn--active': viewMode === 'card' }"
-              @click="handleViewModeChange('card')"
-            >
-              <IconifyIcon icon="solar:widget-bold" />
-            </Button>
-            <Button
-              class="group-btn"
-              :class="{ 'group-btn--active': viewMode === 'list' }"
-              @click="handleViewModeChange('list')"
-            >
-              <IconifyIcon icon="solar:list-bold" />
-            </Button>
-          </div>
-
-          <div class="btn-divider"></div>
-
-          <!-- 筛选按钮 -->
-          <Button
-            class="action-btn"
-            :class="{ 'action-btn--active': showAdvancedFilter }"
-            @click="showAdvancedFilter = !showAdvancedFilter"
-          >
-            <IconifyIcon icon="solar:filter-bold" />
-          </Button>
-
-          <!-- 区域筛选按钮 -->
-          <Button
-            class="action-btn"
-            :class="{ 'action-btn--active': selectedAreaId !== undefined }"
-            @click="showAreaFilter = true"
-          >
-            <IconifyIcon icon="solar:map-point-bold" />
-          </Button>
-
-          <!-- 刷新按钮 -->
-          <Button class="action-btn" @click="handleRefresh">
-            <IconifyIcon icon="solar:refresh-bold" />
-          </Button>
-
-          <div class="btn-divider"></div>
-
-          <!-- 创建按钮 -->
-          <Button
-            type="primary"
-            class="create-btn"
-            @click="() => message.info('手动创建工单功能开发中')"
-          >
-            <IconifyIcon icon="solar:add-circle-bold" />
-            <span>创建工单</span>
-          </Button>
-        </div>
-      </div>
-
-      <!-- 搜索条件区域（展开时显示） -->
-      <div v-show="showAdvancedFilter" class="search-panel">
-        <div class="search-items">
-          <div class="search-item">
-            <span class="search-label">关键词</span>
-            <Input
-              v-model:value="queryParams.title"
-              placeholder="工单标题"
-              allow-clear
-              style="width: 180px"
-              @press-enter="handleSearch"
-            />
-          </div>
-          <div class="search-item">
-            <span class="search-label">工单编号</span>
-            <Input
-              v-model:value="queryParams.orderCode"
-              placeholder="输入工单编号"
-              allow-clear
-              style="width: 160px"
-              @press-enter="handleSearch"
-            />
-          </div>
-          <div class="search-item">
-            <span class="search-label">工单类型</span>
-            <Select
-              v-model:value="queryParams.orderType"
-              placeholder="全部"
-              allow-clear
-              style="width: 120px"
-              :options="ORDER_TYPE_OPTIONS"
-            />
-          </div>
-          <div class="search-item">
-            <span class="search-label">优先级</span>
-            <Select
-              v-model:value="queryParams.priority"
-              placeholder="全部"
-              allow-clear
-              style="width: 120px"
-              :options="PRIORITY_OPTIONS"
-            />
-          </div>
-        </div>
-        <div class="search-actions">
-          <Button @click="handleReset">
-            <IconifyIcon icon="solar:restart-bold" class="btn-icon" />
-            重置
-          </Button>
-          <Button type="primary" @click="handleSearch">
-            <IconifyIcon icon="solar:magnifer-bold" class="btn-icon" />
-            搜索
-          </Button>
-        </div>
-      </div>
-
-      <!-- 卡片视图 -->
-      <div v-if="viewMode === 'card'" class="card-content">
-        <CardView
-          ref="cardViewRef"
-          :search-params="queryParams as any"
-          @detail="handleDetail"
-          @assign="handleAssign"
-          @upgrade="handleUpgrade"
-          @cancel="handleCancel"
-          @notify="handleNotify"
-        />
-      </div>
-
-      <!-- 表格视图 -->
-      <div v-else class="list-content">
-        <Grid>
-          <!-- 工单类型列 -->
-          <template #orderType="{ row }">
-            <span
-              v-if="ORDER_TYPE_COLOR_MAP[row.orderType]"
-              class="inline-block rounded px-1.5 py-0.5 text-xs font-medium"
-              :style="{
-                backgroundColor: ORDER_TYPE_COLOR_MAP[row.orderType]?.bg,
-                color: ORDER_TYPE_COLOR_MAP[row.orderType]?.text,
-              }"
-            >
-              {{ ORDER_TYPE_TEXT_MAP[row.orderType] }}
-            </span>
-            <span v-else class="text-gray-400">-</span>
-          </template>
-
-          <!-- 工单状态列 -->
-          <template #status="{ row }">
-            <span
-              v-if="STATUS_COLOR_MAP[row.status]"
-              class="inline-block rounded px-1.5 py-0.5 text-xs font-medium"
-              :style="{
-                backgroundColor: STATUS_COLOR_MAP[row.status]?.bg,
-                color: STATUS_COLOR_MAP[row.status]?.text,
-              }"
-            >
-              {{ STATUS_TEXT_MAP[row.status] }}
-            </span>
-            <span v-else class="text-gray-400">-</span>
-          </template>
-
-          <!-- 优先级列 -->
-          <template #priority="{ row }">
-            <Tag v-if="row.priority === 0" color="error" size="small"> P0 </Tag>
-            <Tag v-else-if="row.priority === 1" color="warning" size="small">
-              P1
-            </Tag>
-            <span v-else class="text-gray-400">P2</span>
-          </template>
-
-          <!-- 执行人列 -->
-          <template #assignee="{ row }">
-            <span v-if="row.assigneeName">{{ row.assigneeName }}</span>
-            <span v-else class="text-gray-400">待分配</span>
-          </template>
-
-          <!-- 操作列 -->
-          <template #actions="{ row }">
-            <Button type="link" size="small" @click="handleDetail(row.id)">
-              详情
-            </Button>
-            <Button
-              v-if="row.status === 'PENDING'"
-              type="link"
-              size="small"
-              @click="handleAssign(row)"
-            >
-              派单
-            </Button>
-            <Button
-              v-if="row.status === 'DISPATCHED'"
-              type="link"
-              size="small"
-              @click="handleNotify(row, 'voice')"
-            >
-              提醒
-            </Button>
-            <Button
-              v-if="
-                row.priority !== 0 &&
-                !['COMPLETED', 'CANCELLED'].includes(row.status)
-              "
-              type="link"
-              size="small"
-              danger
-              @click="handleUpgrade(row)"
-            >
-              升级
-            </Button>
-            <Button
-              v-if="!['COMPLETED', 'CANCELLED'].includes(row.status)"
-              type="link"
-              size="small"
-              danger
-              @click="handleCancel(row)"
-            >
-              取消
-            </Button>
-          </template>
-        </Grid>
-      </div>
-    </Card>
-  </Page>
-</template>
-
-<style scoped lang="scss">
-/* 隐藏 VxeGrid 自带的搜索表单区域 */
-:deep(.vxe-grid--form-wrapper) {
-  display: none !important;
-}
-
-/* Tab 行 */
-.tab-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 16px;
-  border-bottom: 1px solid #f0f0f0;
-}
-
-/* Tab 样式优化 */
-.status-tabs {
-  flex: 1;
-  min-width: 0;
-
-  :deep(.ant-tabs-nav) {
-    margin-bottom: 0;
-
-    &::before {
-      display: none;
-    }
-  }
-
-  :deep(.ant-tabs-tab) {
-    padding: 14px 4px;
-    font-size: 14px;
-    transition: all 0.2s;
-
-    &:hover {
-      color: var(--ant-color-primary);
-    }
-
-    &.ant-tabs-tab-active {
-      font-weight: 600;
-    }
-  }
-
-  :deep(.ant-tabs-ink-bar) {
-    height: 2px;
-    border-radius: 1px;
-  }
-
-  .tab-item {
-    display: flex;
-    gap: 6px;
-    align-items: center;
-  }
-
-  .tab-label {
-    line-height: 1;
-  }
-
-  .tab-count {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    min-width: 18px;
-    height: 18px;
-    padding: 0 5px;
-    font-size: 11px;
-    font-weight: 500;
-    line-height: 1;
-    color: #fff;
-    background: #8c8c8c;
-    border-radius: 9px;
-
-    &--danger {
-      background: #ff4d4f;
-    }
-  }
-}
-
-/* Tab 右侧操作按钮 */
-.tab-actions {
-  display: flex;
-  flex-shrink: 0;
-  gap: 6px;
-  align-items: center;
-  padding: 8px 0;
-}
-
-/* 按钮分隔线 */
-.btn-divider {
-  width: 1px;
-  height: 16px;
-  margin: 0 4px;
-  background: #e5e5e5;
-}
-
-/* 视图切换按钮组 */
-.btn-group {
-  display: flex;
-  gap: 0;
-  background: #f5f5f5;
-  border-radius: 6px;
-
-  .group-btn {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 32px;
-    height: 32px;
-    padding: 0;
-    font-size: 16px;
-    color: #8c8c8c;
-    background: transparent;
-    border: none;
-    border-radius: 6px;
-    transition: all 0.2s;
-
-    &:hover {
-      color: #595959;
-    }
-
-    &--active {
-      color: var(--ant-color-primary);
-      background: #fff;
-      box-shadow: 0 1px 2px rgb(0 0 0 / 8%);
-    }
-  }
-}
-
-/* 操作按钮 */
-.action-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 32px;
-  height: 32px;
-  padding: 0;
-  font-size: 16px;
-  color: #595959;
-  background: transparent;
-  border: 1px solid #d9d9d9;
-  border-radius: 6px;
-  transition: all 0.2s;
-
-  &:hover {
-    color: var(--ant-color-primary);
-    border-color: var(--ant-color-primary);
-  }
-
-  &--active {
-    color: var(--ant-color-primary);
-    background: var(--ant-color-primary-bg);
-    border-color: var(--ant-color-primary);
-  }
-}
-
-/* 创建按钮 */
-.create-btn {
-  display: flex;
-  gap: 4px;
-  align-items: center;
-  height: 32px;
-  padding: 0 14px;
-  font-size: 14px;
-  border-radius: 6px;
-}
-
-/* 搜索面板 */
-.search-panel {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 12px 16px;
-  background: transparent;
-  border-bottom: 1px solid #f0f0f0;
-}
-
-.search-items {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 16px;
-  align-items: center;
-}
-
-.search-item {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-
-.search-label {
-  font-size: 13px;
-  color: #595959;
-  white-space: nowrap;
-}
-
-.search-actions {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-
-/* 内容区 */
-.card-content {
-  padding: 16px;
-}
-
-.list-content {
-  padding: 16px;
-
-  :deep(.vxe-grid) {
-    overflow: hidden;
-    background: transparent;
-    border-radius: 8px;
-  }
-
-  :deep(.vxe-table) {
-    background: transparent;
-  }
-
-  :deep(.vxe-header--column) {
-    background: rgb(0 0 0 / 2%);
-  }
-
-  :deep(.vxe-body--row) {
-    background: transparent;
-
-    &:hover > td {
-      background: rgb(0 0 0 / 4%) !important;
-    }
-  }
-
-  :deep(.vxe-table--border-line) {
-    border-color: rgb(0 0 0 / 6%);
-  }
-}
-
-html.dark {
-  .tab-row {
-    border-color: #303030;
-  }
-
-  .btn-divider {
-    background: #404040;
-  }
-
-  .btn-group {
-    background: #333;
-
-    .group-btn {
-      color: #8c8c8c;
-
-      &:hover {
-        color: #bfbfbf;
-      }
-
-      &--active {
-        color: var(--ant-color-primary);
-        background: #1f1f1f;
-      }
-    }
-  }
-
-  .action-btn {
-    color: #8c8c8c;
-    border-color: #434343;
-
-    &:hover {
-      color: var(--ant-color-primary);
-      border-color: var(--ant-color-primary);
-    }
-
-    &--active {
-      color: var(--ant-color-primary);
-      background: rgb(22 119 255 / 15%);
-      border-color: var(--ant-color-primary);
-    }
-  }
-
-  .tab-count {
-    background: #595959;
-
-    &--danger {
-      background: #a61d24;
-    }
-  }
-
-  .search-panel {
-    background: transparent;
-    border-color: #303030;
-  }
-
-  .search-label {
-    color: rgb(255 255 255 / 65%);
-  }
-
-  .list-content {
-    :deep(.vxe-grid) {
-      background: transparent;
-    }
-
-    :deep(.vxe-table) {
-      background: transparent;
-    }
-
-    :deep(.vxe-header--column) {
-      background: rgb(255 255 255 / 4%);
-    }
-
-    :deep(.vxe-body--row) {
-      background: transparent;
-
-      &:hover > td {
-        background: rgb(255 255 255 / 6%) !important;
-      }
-    }
-
-    :deep(.vxe-table--border-line) {
-      border-color: rgb(255 255 255 / 8%);
-    }
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/modules/assign-form.vue b/apps/web-antd/src/views/ops/cleaning/work-order/modules/assign-form.vue
deleted file mode 100644
index 08415d341..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/modules/assign-form.vue
+++ /dev/null
@@ -1,227 +0,0 @@
-<script setup lang="ts">
-import type { OpsCleaningApi } from '#/api/ops/cleaning';
-
-import { computed, ref } from 'vue';
-
-import { useVbenModal } from '@vben/common-ui';
-
-import { Avatar, Badge, Card, message, Spin } from 'ant-design-vue';
-
-import { useVbenForm } from '#/adapter/form';
-import { getBadgeStatusList } from '#/api/ops/cleaning';
-import { assignOrder } from '#/api/ops/order-center';
-
-defineOptions({ name: 'WorkOrderAssignForm' });
-
-const emit = defineEmits<{ success: [] }>();
-
-const [Modal, modalApi] = useVbenModal({
-  onOpenChange: async (isOpen) => {
-    if (isOpen) {
-      const data = modalApi.getData<{ orderCode: string; orderId: number }>();
-      if (data) {
-        orderId.value = data.orderId;
-        orderCode.value = data.orderCode;
-      }
-      await loadBadges();
-    }
-  },
-  onConfirm: handleSubmit,
-});
-
-const orderId = ref<number>();
-const orderCode = ref<string>('');
-const loading = ref(false);
-const badgeLoading = ref(false);
-const badgeList = ref<OpsCleaningApi.BadgeStatusItem[]>([]);
-const selectedBadgeId = ref<number>();
-
-const [Form, formApi] = useVbenForm({
-  schema: [
-    {
-      fieldName: 'remark',
-      label: '派单备注',
-      component: 'Textarea',
-      componentProps: {
-        placeholder: '请输入派单备注（选填）',
-        rows: 3,
-      },
-    },
-  ],
-  showDefaultActions: false,
-});
-
-/** 加载工牌列表 */
-async function loadBadges() {
-  badgeLoading.value = true;
-  try {
-    const res = await getBadgeStatusList();
-    badgeList.value = res || [];
-  } catch {
-    badgeList.value = [];
-  } finally {
-    badgeLoading.value = false;
-  }
-}
-
-/** 选择工牌 */
-function selectBadge(badge: OpsCleaningApi.BadgeStatusItem) {
-  selectedBadgeId.value = badge.deviceId;
-}
-
-/** 获取状态颜色 */
-function getStatusColor(status: string) {
-  const colorMap: Record<string, string> = {
-    IDLE: '#52c41a',
-    BUSY: '#faad14',
-    OFFLINE: '#d9d9d9',
-    PAUSED: '#ff7a45',
-  };
-  return colorMap[status] || '#d9d9d9';
-}
-
-/** 获取状态文本 */
-function getStatusText(status: string) {
-  const textMap: Record<string, string> = {
-    IDLE: '空闲',
-    BUSY: '忙碌',
-    OFFLINE: '离线',
-    PAUSED: '暂停',
-  };
-  return textMap[status] || status;
-}
-
-/** 获取电量颜色 */
-function getBatteryColor(level: number) {
-  if (level <= 20) return '#F44336';
-  if (level <= 50) return '#FF9800';
-  return '#4CAF50';
-}
-
-/** 提交表单 */
-async function handleSubmit() {
-  if (!selectedBadgeId.value) {
-    message.warning('请选择执行工牌');
-    return;
-  }
-
-  loading.value = true;
-  try {
-    const formData = await formApi.getValues();
-    await assignOrder({
-      orderId: orderId.value!,
-      assigneeId: selectedBadgeId.value,
-      remark: formData.remark,
-    });
-    message.success('派单成功');
-    modalApi.close();
-    emit('success');
-  } finally {
-    loading.value = false;
-  }
-}
-
-/** 可用工牌（优先显示空闲） */
-const sortedBadges = computed(() => {
-  return [...badgeList.value].toSorted((a, b) => {
-    const order: Record<string, number> = {
-      IDLE: 0,
-      BUSY: 1,
-      PAUSED: 2,
-      OFFLINE: 3,
-    };
-    return (order[a.status] || 99) - (order[b.status] || 99);
-  });
-});
-</script>
-
-<template>
-  <Modal title="分配工单" class="w-[600px]">
-    <div class="assign-form">
-      <!-- 工单信息 -->
-      <div class="mb-4 rounded-lg bg-gray-50 p-3 dark:bg-gray-800">
-        <div class="text-sm text-gray-500">
-          工单编号：<span class="font-medium text-gray-700 dark:text-gray-300">
-            {{ orderCode }}
-          </span>
-        </div>
-      </div>
-
-      <!-- 工牌选择 -->
-      <div class="mb-4">
-        <div class="mb-2 text-sm font-medium">选择执行工牌</div>
-        <Spin :spinning="badgeLoading">
-          <div
-            v-if="sortedBadges.length > 0"
-            class="badge-grid grid max-h-64 gap-3 overflow-y-auto"
-          >
-            <Card
-              v-for="badge in sortedBadges"
-              :key="badge.deviceId"
-              size="small"
-              class="badge-card cursor-pointer transition-all"
-              :class="[
-                selectedBadgeId === badge.deviceId
-                  ? 'border-primary ring-2 ring-primary/20'
-                  : 'hover:border-gray-300',
-                badge.status === 'OFFLINE' ? 'opacity-50' : '',
-              ]"
-              @click="selectBadge(badge)"
-            >
-              <div class="flex items-center gap-3">
-                <Badge :color="getStatusColor(badge.status)" :offset="[-4, 28]">
-                  <Avatar size="small" class="bg-blue-500">
-                    {{ badge.deviceKey?.charAt(0) || '?' }}
-                  </Avatar>
-                </Badge>
-                <div class="min-w-0 flex-1">
-                  <div class="flex items-center justify-between">
-                    <span class="truncate font-medium">{{
-                      badge.deviceKey
-                    }}</span>
-                    <span
-                      class="ml-2 text-xs"
-                      :style="{ color: getStatusColor(badge.status) }"
-                    >
-                      {{ getStatusText(badge.status) }}
-                    </span>
-                  </div>
-                  <div
-                    class="mt-1 flex items-center justify-between text-xs text-gray-400"
-                  >
-                    <span>{{ badge.currentAreaName || '未知区域' }}</span>
-                    <span
-                      :style="{ color: getBatteryColor(badge.batteryLevel) }"
-                    >
-                      {{ badge.batteryLevel }}%
-                    </span>
-                  </div>
-                </div>
-              </div>
-            </Card>
-          </div>
-          <div v-else class="py-8 text-center text-gray-400">暂无可用工牌</div>
-        </Spin>
-      </div>
-
-      <!-- 备注表单 -->
-      <Form />
-    </div>
-  </Modal>
-</template>
-
-<style scoped lang="scss">
-.assign-form {
-  .badge-grid {
-    grid-template-columns: repeat(2, 1fr);
-  }
-
-  .badge-card {
-    border-radius: 8px;
-
-    :deep(.ant-card-body) {
-      padding: 12px;
-    }
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/modules/cancel-form.vue b/apps/web-antd/src/views/ops/cleaning/work-order/modules/cancel-form.vue
deleted file mode 100644
index a62b95fe9..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/modules/cancel-form.vue
+++ /dev/null
@@ -1,123 +0,0 @@
-<script setup lang="ts">
-import { ref } from 'vue';
-
-import { useVbenModal } from '@vben/common-ui';
-import { IconifyIcon } from '@vben/icons';
-
-import { Alert, message } from 'ant-design-vue';
-
-import { useVbenForm, z } from '#/adapter/form';
-import { cancelOrder } from '#/api/ops/order-center';
-
-defineOptions({ name: 'CancelOrderForm' });
-
-const emit = defineEmits<{ success: [] }>();
-
-const [Modal, modalApi] = useVbenModal({
-  onOpenChange: (isOpen) => {
-    if (isOpen) {
-      const data = modalApi.getData<{
-        orderCode: string;
-        orderId: number;
-        title: string;
-      }>();
-      if (data) {
-        orderId.value = data.orderId;
-        orderCode.value = data.orderCode;
-        orderTitle.value = data.title;
-      }
-    }
-  },
-  onConfirm: handleSubmit,
-});
-
-const orderId = ref<number>();
-const orderCode = ref<string>('');
-const orderTitle = ref<string>('');
-const loading = ref(false);
-
-const [Form, formApi] = useVbenForm({
-  schema: [
-    {
-      fieldName: 'reason',
-      label: '取消原因',
-      component: 'Textarea',
-      componentProps: {
-        placeholder: '请输入取消工单的原因',
-        rows: 4,
-        maxLength: 200,
-        showCount: true,
-      },
-      rules: z
-        .string()
-        .min(2, '原因至少2个字符')
-        .max(200, '原因不能超过200字符'),
-    },
-  ],
-  showDefaultActions: false,
-});
-
-/** 提交表单 */
-async function handleSubmit() {
-  const { valid, values } = await formApi.validate();
-  if (!valid) return;
-
-  loading.value = true;
-  try {
-    await cancelOrder({
-      id: orderId.value!,
-      reason: values.reason,
-    });
-    message.success('工单已取消');
-    modalApi.close();
-    emit('success');
-  } finally {
-    loading.value = false;
-  }
-}
-</script>
-
-<template>
-  <Modal title="取消工单" class="w-[480px]">
-    <div class="cancel-form">
-      <!-- 警告提示 -->
-      <Alert
-        type="error"
-        show-icon
-        class="mb-4"
-        message="取消后工单将无法恢复，请确认操作"
-      >
-        <template #icon>
-          <IconifyIcon icon="lucide:alert-circle" class="text-red-500" />
-        </template>
-      </Alert>
-
-      <!-- 工单信息 -->
-      <div class="mb-4 rounded-lg bg-gray-50 p-4 dark:bg-gray-800">
-        <div class="mb-2 text-sm text-gray-500">
-          工单编号：<span
-            class="font-medium text-gray-700 dark:text-gray-300"
-            >{{ orderCode }}</span
-          >
-        </div>
-        <div class="text-sm text-gray-500">
-          工单标题：<span
-            class="font-medium text-gray-700 dark:text-gray-300"
-            >{{ orderTitle }}</span
-          >
-        </div>
-      </div>
-
-      <!-- 表单 -->
-      <Form />
-    </div>
-  </Modal>
-</template>
-
-<style scoped>
-.cancel-form {
-  :deep(.ant-form-item) {
-    margin-bottom: 0;
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/modules/card-view.vue b/apps/web-antd/src/views/ops/cleaning/work-order/modules/card-view.vue
deleted file mode 100644
index 7cb28734d..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/modules/card-view.vue
+++ /dev/null
@@ -1,872 +0,0 @@
-<script lang="ts" setup>
-import { computed, onMounted, ref } from 'vue';
-
-import { DICT_TYPE } from '@vben/constants';
-import { IconifyIcon } from '@vben/icons';
-import { useDictStore } from '@vben/stores';
-
-import {
-  Button,
-  Col,
-  Dropdown,
-  Empty,
-  Menu,
-  Pagination,
-  Popconfirm,
-  Row,
-  Spin,
-  Tag,
-  Tooltip,
-} from 'ant-design-vue';
-import dayjs from 'dayjs';
-
-import { getOrderPage } from '#/api/ops/order-center';
-
-import { usePriorityInfo } from '../../../work-order/data';
-import {
-  ORDER_TYPE_COLOR_MAP,
-  ORDER_TYPE_TEXT_MAP,
-  STATUS_COLOR_MAP,
-  STATUS_ICON_MAP,
-  STATUS_TEXT_MAP,
-} from '../data';
-
-defineOptions({ name: 'WorkOrderCardView' });
-
-const props = defineProps<Props>();
-
-const emit = defineEmits<{
-  assign: [row: OpsOrderCenterApi.OrderItem];
-  cancel: [row: OpsOrderCenterApi.OrderItem];
-  detail: [id: number];
-  notify: [row: OpsOrderCenterApi.OrderItem, type: 'vibrate' | 'voice'];
-  upgrade: [row: OpsOrderCenterApi.OrderItem];
-}>();
-
-// ========== 模拟数据开关 ==========
-const USE_MOCK_DATA = false;
-
-// 模拟工单数据
-const MOCK_ORDER_LIST: OpsOrderCenterApi.OrderItem[] = [
-  {
-    id: 10_001,
-    orderCode: 'WO20260123143025001',
-    title: 'A区洗手间紧急保洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'ARRIVED' as OpsOrderCenterApi.OrderStatus,
-    priority: 0 as OpsOrderCenterApi.Priority,
-    location: 'A区 / 1楼洗手间',
-    assigneeId: 2001,
-    assigneeName: '张三',
-    createTime: '2026-01-23 14:30:25',
-  },
-  {
-    id: 10_002,
-    orderCode: 'WO20260123150012002',
-    title: 'B区大厅日常保洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'DISPATCHED' as OpsOrderCenterApi.OrderStatus,
-    priority: 1 as OpsOrderCenterApi.Priority,
-    location: 'B区 / 大厅',
-    assigneeId: 2002,
-    assigneeName: '李四',
-    createTime: '2026-01-23 15:00:12',
-  },
-  {
-    id: 10_003,
-    orderCode: 'WO20260123151530003',
-    title: 'C区会议室深度保洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'PENDING' as OpsOrderCenterApi.OrderStatus,
-    priority: 2 as OpsOrderCenterApi.Priority,
-    location: 'C区 / 3楼会议室',
-    createTime: '2026-01-23 15:15:30',
-  },
-  {
-    id: 10_004,
-    orderCode: 'WO20260123091045004',
-    title: 'D区电梯厅保洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'COMPLETED' as OpsOrderCenterApi.OrderStatus,
-    priority: 2 as OpsOrderCenterApi.Priority,
-    location: 'D区 / 电梯厅',
-    assigneeId: 2003,
-    assigneeName: '王五',
-    createTime: '2026-01-23 09:10:45',
-  },
-  {
-    id: 10_005,
-    orderCode: 'WO20260123160000005',
-    title: 'E区停车场应急清洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'QUEUED' as OpsOrderCenterApi.OrderStatus,
-    priority: 0 as OpsOrderCenterApi.Priority,
-    location: 'E区 / 地下停车场',
-    assigneeId: 2001,
-    assigneeName: '张三',
-    createTime: '2026-01-23 16:00:00',
-  },
-  {
-    id: 10_006,
-    orderCode: 'WO20260123102030006',
-    title: 'A区休息区保洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'CONFIRMED' as OpsOrderCenterApi.OrderStatus,
-    priority: 1 as OpsOrderCenterApi.Priority,
-    location: 'A区 / 2楼休息区',
-    assigneeId: 2004,
-    assigneeName: '赵六',
-    createTime: '2026-01-23 10:20:30',
-  },
-  {
-    id: 10_007,
-    orderCode: 'WO20260123110500007',
-    title: 'F区门厅玻璃清洁',
-    orderType: 'CLEAN' as OpsOrderCenterApi.OrderType,
-    status: 'PAUSED' as OpsOrderCenterApi.OrderStatus,
-    priority: 2 as OpsOrderCenterApi.Priority,
-    location: 'F区 / 门厅',
-    assigneeId: 2005,
-    assigneeName: '钱七',
-    createTime: '2026-01-23 11:05:00',
-  },
-  {
-    id: 10_008,
-    orderCode: 'WO20260123140000008',
-    title: 'B区卫生间设备维修',
-    orderType: 'REPAIR' as OpsOrderCenterApi.OrderType,
-    status: 'PENDING' as OpsOrderCenterApi.OrderStatus,
-    priority: 1 as OpsOrderCenterApi.Priority,
-    location: 'B区 / 2楼卫生间',
-    createTime: '2026-01-23 14:00:00',
-  },
-];
-
-interface Props {
-  searchParams?: Partial<OpsOrderCenterApi.OrderPageQuery>;
-}
-
-const loading = ref(false);
-const list = ref<OpsOrderCenterApi.OrderItem[]>([]);
-const total = ref(0);
-const queryParams = ref({
-  pageNo: 1,
-  pageSize: 8,
-});
-
-/** 字典相关 */
-const dictStore = useDictStore();
-const sourceTypeOptions = computed(() =>
-  dictStore.getDictOptions(DICT_TYPE.OPS_TRIGGER_SOURCE),
-);
-
-const { getPriorityInfo } = usePriorityInfo();
-
-function getSourceTypeInfo(value: string) {
-  const option = sourceTypeOptions.value.find((item) => item.value === value);
-  if (!option) return { label: value, color: 'default' };
-
-  // 优先使用字典配置的 cssClass 作为颜色 (如果匹配 Ant Design Tag 的预设颜色)
-  // 或者如果你的字典有专门的 color 字段也可以在这里处理
-  if (option.cssClass) {
-    return { label: option.label, color: option.cssClass };
-  }
-
-  let color = 'default';
-  switch (option.colorType) {
-    case 'danger': {
-      color = 'error';
-      break;
-    }
-    case 'info': {
-      color = 'default';
-      break;
-    }
-    case 'primary': {
-      color = 'processing';
-      break;
-    }
-    case 'success': {
-      color = 'success';
-      break;
-    }
-    case 'warning': {
-      color = 'warning';
-      break;
-    }
-    default: {
-      color = option.colorType || 'default';
-    }
-  }
-  return { label: option.label, color };
-}
-
-/** 获取工单列表 */
-async function getList() {
-  loading.value = true;
-  try {
-    if (USE_MOCK_DATA) {
-      await new Promise((resolve) => setTimeout(resolve, 400));
-      list.value = [...MOCK_ORDER_LIST];
-      total.value = MOCK_ORDER_LIST.length;
-    } else {
-      const data = await getOrderPage({
-        ...queryParams.value,
-        ...props.searchParams,
-      });
-      list.value = data.list || [];
-      total.value = data.total || 0;
-    }
-  } finally {
-    loading.value = false;
-  }
-}
-
-/** 处理页码变化 */
-function handlePageChange(page: number, pageSize: number) {
-  queryParams.value.pageNo = page;
-  queryParams.value.pageSize = pageSize;
-  getList();
-}
-
-/** 判断是否为紧急工单 */
-function isUrgent(priority: number) {
-  return priority === 0;
-}
-
-/** 判断是否为终态 */
-function isTerminal(status: string) {
-  return ['CANCELLED', 'COMPLETED'].includes(status);
-}
-
-/** 判断是否为进行中状态 */
-function isInProgress(status: string) {
-  return ['ARRIVED', 'CONFIRMED', 'DISPATCHED', 'QUEUED'].includes(status);
-}
-
-/** 格式化时间显示 */
-function formatTime(time: Date | string) {
-  if (!time) return '-';
-
-  try {
-    const date = dayjs(time);
-    if (!date.isValid()) {
-      return '-';
-    }
-
-    // 格式化为 YYYY-MM-DD HH:mm:ss
-    return date.format('YYYY-MM-DD HH:mm:ss');
-  } catch {
-    return '-';
-  }
-}
-
-defineExpose({
-  reload: getList,
-  query: () => {
-    queryParams.value.pageNo = 1;
-    getList();
-  },
-});
-
-onMounted(() => {
-  getList();
-});
-</script>
-
-<template>
-  <div class="work-order-card-view">
-    <!-- 工单卡片列表 -->
-    <Spin :spinning="loading" class="card-grid">
-      <Row v-if="list.length > 0" :gutter="[12, 12]">
-        <Col
-          v-for="item in list"
-          :key="item.id"
-          :xs="24"
-          :sm="12"
-          :md="8"
-          :lg="6"
-          :xl="6"
-        >
-          <div
-            class="order-card"
-            :class="{
-              'order-card--urgent': isUrgent(item.priority),
-              'order-card--terminal': isTerminal(item.status),
-            }"
-            @click="emit('detail', item.id)"
-          >
-            <!-- 头部：状态 + 优先级 -->
-            <div class="card-header">
-              <div
-                class="status-info"
-                :style="{
-                  '--status-color': STATUS_COLOR_MAP[item.status]?.text,
-                  '--status-bg': STATUS_COLOR_MAP[item.status]?.bg,
-                }"
-              >
-                <IconifyIcon
-                  :icon="STATUS_ICON_MAP[item.status] || 'solar:circle-bold'"
-                  class="status-icon"
-                />
-                <span class="status-text">{{
-                  STATUS_TEXT_MAP[item.status]
-                }}</span>
-              </div>
-              <div
-                class="priority-tag"
-                :style="getPriorityInfo(item.priority).style"
-              >
-                <IconifyIcon
-                  v-if="getPriorityInfo(item.priority).icon"
-                  :icon="getPriorityInfo(item.priority).icon"
-                />
-                {{ getPriorityInfo(item.priority).label }}
-              </div>
-            </div>
-
-            <!-- 主体内容 -->
-            <div class="card-body">
-              <!-- 标题 -->
-              <Tooltip :title="item.title" placement="topLeft">
-                <h4 class="card-title">{{ item.title }}</h4>
-              </Tooltip>
-
-              <!-- 信息行 -->
-              <div class="info-rows">
-                <!-- 工单编号 -->
-                <div class="info-row">
-                  <IconifyIcon
-                    icon="solar:bill-list-bold-duotone"
-                    class="info-icon"
-                  />
-                  <span class="info-text order-code-styled">
-                    {{ item.orderCode }}
-                  </span>
-                </div>
-
-                <!-- 位置信息 -->
-                <div class="info-row">
-                  <IconifyIcon
-                    icon="solar:map-point-bold-duotone"
-                    class="info-icon"
-                  />
-                  <span class="info-text location-text">
-                    {{ item.location || '未指定位置' }}
-                  </span>
-                </div>
-
-                <!-- 执行人 -->
-                <div class="info-row">
-                  <IconifyIcon
-                    icon="solar:user-bold-duotone"
-                    class="info-icon"
-                  />
-                  <span
-                    v-if="item.assigneeName"
-                    class="info-text assignee-text"
-                  >
-                    {{ item.assigneeName }}
-                    <span
-                      v-if="
-                        (item.extInfo as OpsOrderCenterApi.SecurityExtInfo)
-                          ?.assignedUserPhone
-                      "
-                      class="assignee-phone"
-                    >
-                      ({{
-                        (item.extInfo as OpsOrderCenterApi.SecurityExtInfo)
-                          .assignedUserPhone
-                      }})
-                    </span>
-                  </span>
-                  <span v-else class="info-text info-text--muted">待分配</span>
-                </div>
-
-                <!-- 触发来源 -->
-                <div v-if="item.sourceType" class="info-row">
-                  <IconifyIcon
-                    icon="solar:radar-bold-duotone"
-                    class="info-icon"
-                  />
-                  <Tag
-                    :color="getSourceTypeInfo(item.sourceType).color"
-                    class="source-tag"
-                    :bordered="false"
-                  >
-                    {{ getSourceTypeInfo(item.sourceType).label }}
-                  </Tag>
-                </div>
-              </div>
-            </div>
-
-            <!-- 底部：元信息 + 操作按钮 -->
-            <div class="card-footer">
-              <!-- 左侧：类型 + 时间 -->
-              <div class="card-meta">
-                <span
-                  class="type-tag"
-                  :style="{
-                    backgroundColor: ORDER_TYPE_COLOR_MAP[item.orderType]?.bg,
-                    color: ORDER_TYPE_COLOR_MAP[item.orderType]?.text,
-                  }"
-                >
-                  {{ ORDER_TYPE_TEXT_MAP[item.orderType] }}
-                </span>
-                <span class="create-time">{{
-                  formatTime(item.createTime)
-                }}</span>
-              </div>
-
-              <!-- 右侧：操作按钮 -->
-              <div class="card-actions" @click.stop>
-                <!-- 待分配：派单 -->
-                <Tooltip v-if="item.status === 'PENDING'" title="分配执行人">
-                  <Button
-                    type="primary"
-                    size="small"
-                    class="action-btn"
-                    @click="emit('assign', item)"
-                  >
-                    <IconifyIcon icon="solar:user-plus-bold" />
-                  </Button>
-                </Tooltip>
-
-                <!-- 已推送：提醒（暂不开放） -->
-                <Dropdown
-                  v-if="false && item.status === 'DISPATCHED'"
-                  placement="topRight"
-                >
-                  <Button size="small" class="action-btn action-btn--notify">
-                    <IconifyIcon icon="solar:bell-bold" />
-                  </Button>
-                  <template #overlay>
-                    <Menu>
-                      <Menu.Item
-                        key="voice"
-                        @click="emit('notify', item, 'voice')"
-                      >
-                        <IconifyIcon
-                          icon="solar:volume-loud-bold"
-                          class="mr-2"
-                        />
-                        语音提醒
-                      </Menu.Item>
-                      <Menu.Item
-                        key="vibrate"
-                        @click="emit('notify', item, 'vibrate')"
-                      >
-                        <IconifyIcon
-                          icon="solar:smartphone-vibration-bold"
-                          class="mr-2"
-                        />
-                        震动提醒
-                      </Menu.Item>
-                    </Menu>
-                  </template>
-                </Dropdown>
-
-                <!-- 升级优先级 -->
-                <Tooltip
-                  v-if="item.priority !== 0 && isInProgress(item.status)"
-                  title="升级为紧急"
-                >
-                  <Button
-                    size="small"
-                    class="action-btn action-btn--upgrade"
-                    @click="emit('upgrade', item)"
-                  >
-                    <IconifyIcon icon="solar:bolt-bold" />
-                  </Button>
-                </Tooltip>
-
-                <!-- 取消工单 -->
-                <Popconfirm
-                  v-if="!isTerminal(item.status)"
-                  title="确定取消此工单？"
-                  placement="topRight"
-                  @confirm="emit('cancel', item)"
-                >
-                  <Button size="small" class="action-btn action-btn--danger">
-                    <IconifyIcon icon="solar:close-circle-bold" />
-                  </Button>
-                </Popconfirm>
-              </div>
-            </div>
-          </div>
-        </Col>
-      </Row>
-
-      <!-- 空状态 -->
-      <Empty v-else description="暂无工单数据" class="my-16" />
-    </Spin>
-
-    <!-- 分页 -->
-    <div v-if="list.length > 0" class="pagination-wrapper">
-      <Pagination
-        v-model:current="queryParams.pageNo"
-        :page-size="8"
-        :total="total"
-        :show-total="(t) => `共 ${t} 条`"
-        size="small"
-        show-quick-jumper
-        @change="handlePageChange"
-      />
-    </div>
-  </div>
-</template>
-
-<style scoped lang="scss">
-.work-order-card-view {
-  // 动画
-  @keyframes pulse {
-    0%,
-    100% {
-      opacity: 1;
-    }
-
-    50% {
-      opacity: 0.6;
-    }
-  }
-
-  .card-grid {
-    min-height: 300px;
-  }
-
-  // 卡片
-  .order-card {
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    min-height: 200px;
-    padding: 12px;
-    cursor: pointer;
-    background: #fff;
-    border: 1px solid #f0f0f0;
-    border-radius: 8px;
-    transition: all 0.2s;
-
-    &:hover {
-      border-color: #d9d9d9;
-      box-shadow: 0 2px 8px rgb(0 0 0 / 6%);
-    }
-
-    &--urgent {
-      &::before {
-        position: absolute;
-        top: 0;
-        right: 0;
-        width: 120px;
-        height: 120px;
-        pointer-events: none;
-        content: '';
-        background: radial-gradient(
-          circle at 100% 0%,
-          rgb(192 29 29 / 14%) 0%,
-          rgb(192 29 29 / 6%) 40%,
-          transparent 70%
-        );
-        border-radius: 0 8px 0 0;
-      }
-    }
-
-    &--terminal {
-      opacity: 0.65;
-
-      &:hover {
-        opacity: 1;
-      }
-    }
-  }
-
-  // 头部
-  .card-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 8px;
-  }
-
-  .status-info {
-    --status-color: #6b5e52;
-    --status-bg: #f0ede8;
-
-    display: flex;
-    gap: 4px;
-    align-items: center;
-    padding: 2px 8px;
-    font-size: 12px;
-    font-weight: 500;
-    color: var(--status-color);
-    background: var(--status-bg);
-    border-radius: 4px;
-
-    .status-icon {
-      font-size: 14px;
-    }
-  }
-
-  .priority-tag {
-    display: flex;
-    gap: 2px;
-    align-items: center;
-    padding: 2px 6px;
-    font-size: 11px;
-    font-weight: 600;
-    border-radius: 4px;
-
-    &.priority-0 {
-      animation: pulse 2s infinite;
-    }
-  }
-
-  // 主体
-  .card-body {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    min-height: 0;
-  }
-
-  .card-title {
-    display: -webkit-box;
-    margin: 0 0 8px;
-    overflow: hidden;
-    -webkit-line-clamp: 2;
-    font-size: 14px;
-    font-weight: 600;
-    line-height: 1.5;
-    color: #262626;
-    -webkit-box-orient: vertical;
-  }
-
-  .info-rows {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    gap: 8px;
-  }
-
-  .info-row {
-    display: flex;
-    gap: 8px;
-    align-items: center;
-    font-size: 13px;
-    color: #595959;
-
-    .info-icon {
-      flex-shrink: 0;
-      font-size: 15px;
-      color: #8c8c8c;
-    }
-
-    .info-text {
-      flex: 1;
-      min-width: 0;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-
-      &--muted {
-        color: #bfbfbf;
-      }
-    }
-
-    .order-code-styled {
-      flex: none;
-      padding: 1px 6px;
-      font-family: 'SF Mono', Monaco, monospace;
-      font-size: 12px;
-      color: #595959;
-      background: #f5f5f5;
-      border-radius: 4px;
-    }
-
-    .location-text {
-      font-weight: 500;
-      color: #262626;
-    }
-
-    .assignee-text {
-      font-weight: 500;
-      color: #1677ff;
-    }
-
-    .assignee-phone {
-      font-weight: 400;
-      color: #8c8c8c;
-    }
-
-    .assignee-avatar {
-      flex-shrink: 0;
-      font-size: 10px !important;
-      line-height: 16px !important;
-      color: #fff;
-      background: #1677ff;
-    }
-
-    .source-tag {
-      margin: 0;
-      font-size: 11px;
-      line-height: 18px;
-      border: none;
-    }
-  }
-
-  // 底部区域
-  .card-footer {
-    display: flex;
-    gap: 12px;
-    align-items: center;
-    justify-content: space-between;
-    padding-top: 8px;
-    margin-top: 10px;
-    border-top: 1px solid #f5f5f5;
-  }
-
-  // 底部元信息
-  .card-meta {
-    display: flex;
-    gap: 6px;
-    align-items: center;
-    min-width: 0;
-
-    .type-tag {
-      flex-shrink: 0;
-      padding: 1px 6px;
-      margin: 0;
-      font-size: 11px;
-      font-weight: 500;
-      line-height: 16px;
-      border-radius: 4px;
-    }
-
-    .order-code {
-      flex-shrink: 0;
-      font-family: 'SF Mono', Monaco, monospace;
-      font-size: 11px;
-      color: #8c8c8c;
-    }
-
-    .create-time {
-      flex-shrink: 0;
-      font-size: 11px;
-      color: #8c8c8c;
-    }
-  }
-
-  // 操作按钮
-  .card-actions {
-    display: flex;
-    flex-shrink: 0;
-    gap: 4px;
-  }
-
-  .action-btn {
-    width: 28px;
-    height: 28px;
-    padding: 0;
-    font-size: 14px;
-    line-height: 1;
-    border-radius: 6px;
-
-    // 确保按钮内图标居中
-    :deep(.iconify) {
-      display: block;
-      margin: 0 auto;
-    }
-
-    &--notify {
-      color: #fa8c16;
-      border-color: #ffd591;
-
-      &:hover {
-        color: #d46b08;
-        border-color: #fa8c16;
-      }
-    }
-
-    &--upgrade {
-      color: #ff4d4f;
-      border-color: #ffccc7;
-
-      &:hover {
-        color: #cf1322;
-        border-color: #ff4d4f;
-      }
-    }
-
-    &--danger {
-      color: #8c8c8c;
-      border-color: #d9d9d9;
-
-      &:hover {
-        color: #ff4d4f;
-        border-color: #ff4d4f;
-      }
-    }
-  }
-
-  // 分页
-  .pagination-wrapper {
-    display: flex;
-    justify-content: flex-end;
-    padding-top: 12px;
-    border-top: 1px solid #f0f0f0;
-  }
-}
-
-// 暗色模式
-html.dark {
-  .work-order-card-view {
-    .order-card {
-      background: #1f1f1f;
-      border-color: #303030;
-
-      &:hover {
-        border-color: #434343;
-      }
-
-      &--urgent::before {
-        background: radial-gradient(
-          circle at 100% 0%,
-          rgb(192 29 29 / 18%) 0%,
-          rgb(192 29 29 / 7%) 40%,
-          transparent 70%
-        );
-      }
-    }
-
-    .card-title {
-      color: rgb(255 255 255 / 85%);
-    }
-
-    .info-row {
-      color: rgb(255 255 255 / 65%);
-
-      .info-icon {
-        color: rgb(255 255 255 / 45%);
-      }
-
-      .info-text--muted {
-        color: rgb(255 255 255 / 30%);
-      }
-    }
-
-    .card-meta {
-      border-color: #303030;
-
-      .order-code,
-      .create-time {
-        color: rgb(255 255 255 / 45%);
-      }
-    }
-
-    .pagination-wrapper {
-      border-color: #303030;
-    }
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/modules/stats-bar.vue b/apps/web-antd/src/views/ops/cleaning/work-order/modules/stats-bar.vue
deleted file mode 100644
index d93399478..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/modules/stats-bar.vue
+++ /dev/null
@@ -1,486 +0,0 @@
-<script setup lang="ts">
-import type { OpsOrderCenterApi } from '#/api/ops/order-center';
-
-import { onActivated, onDeactivated, onMounted, onUnmounted, ref } from 'vue';
-
-import { IconifyIcon } from '@vben/icons';
-
-import { Card, Col, Row, Spin } from 'ant-design-vue';
-
-import { getQuickStats } from '#/api/ops/order-center';
-
-defineOptions({ name: 'WorkOrderStatsBar' });
-
-const emit = defineEmits<{
-  statClick: [statKey: string];
-}>();
-
-// ========== 模拟数据开关 ==========
-const USE_MOCK_DATA = false;
-
-/** 扩展的统计数据接口 */
-interface DashboardStats extends OpsOrderCenterApi.QuickStats {
-  // 响应速度
-  avgResponseTime: number; // 平均响应时间（分钟）
-  fastestResponseTime: number; // 最快响应时间（分钟）
-  responseRate: number; // 响应率（%）
-  // 作业统计
-  completionRate: number; // 完成率（%）
-  avgCompletionTime: number; // 平均完成时间（分钟）
-  qualityScore: number; // 作业质量评分（0-100）
-  // 人员状态
-  workingCleanerCount: number; // 作业中人员
-  idleCleanerCount: number; // 空闲人员
-}
-
-const loading = ref(false);
-const statsData = ref<DashboardStats>({
-  pendingCount: 0,
-  inProgressCount: 0,
-  completedTodayCount: 0,
-  onlineBadgeCount: 0,
-  avgResponseTime: 0,
-  fastestResponseTime: 0,
-  responseRate: 0,
-  completionRate: 0,
-  avgCompletionTime: 0,
-  qualityScore: 0,
-  workingCleanerCount: 0,
-  idleCleanerCount: 0,
-});
-
-// 模拟数据
-const MOCK_STATS: DashboardStats = {
-  pendingCount: 8,
-  inProgressCount: 15,
-  completedTodayCount: 42,
-  onlineBadgeCount: 12,
-  avgResponseTime: 12.5,
-  fastestResponseTime: 3.2,
-  responseRate: 95.8,
-  completionRate: 87.5,
-  avgCompletionTime: 45.3,
-  qualityScore: 92.3,
-  workingCleanerCount: 8,
-  idleCleanerCount: 4,
-};
-
-let refreshTimer: null | ReturnType<typeof setInterval> = null;
-
-function startPolling() {
-  stopPolling();
-  loadStats();
-  refreshTimer = setInterval(loadStats, 30_000);
-}
-
-function stopPolling() {
-  if (refreshTimer) {
-    clearInterval(refreshTimer);
-    refreshTimer = null;
-  }
-}
-
-/** 加载统计数据 */
-async function loadStats() {
-  loading.value = true;
-  try {
-    if (USE_MOCK_DATA) {
-      await new Promise((resolve) => setTimeout(resolve, 300));
-      statsData.value = {
-        ...MOCK_STATS,
-        pendingCount: MOCK_STATS.pendingCount + Math.floor(Math.random() * 3),
-        inProgressCount:
-          MOCK_STATS.inProgressCount + Math.floor(Math.random() * 2),
-        completedTodayCount:
-          MOCK_STATS.completedTodayCount + Math.floor(Math.random() * 5),
-        onlineBadgeCount:
-          MOCK_STATS.onlineBadgeCount + Math.floor(Math.random() * 2) - 1,
-        workingCleanerCount:
-          MOCK_STATS.workingCleanerCount + Math.floor(Math.random() * 2) - 1,
-      };
-    } else {
-      const quickStats = await getQuickStats();
-      // TODO: 扩展 API 返回更多统计数据
-      statsData.value = {
-        ...quickStats,
-        avgResponseTime: 0,
-        fastestResponseTime: 0,
-        responseRate: 0,
-        completionRate: 0,
-        avgCompletionTime: 0,
-        qualityScore: 0,
-        workingCleanerCount: 0,
-        idleCleanerCount: 0,
-      };
-    }
-  } catch {
-    // 使用默认数据
-  } finally {
-    loading.value = false;
-  }
-}
-
-/** 处理统计项点击 */
-function handleStatClick(statKey: string) {
-  emit('statClick', statKey);
-}
-
-onMounted(startPolling);
-onActivated(() => {
-  // 首次 mount 时 onActivated 也会触发，此时 refreshTimer 已存在，跳过
-  if (!refreshTimer) {
-    startPolling();
-  }
-});
-onDeactivated(stopPolling);
-onUnmounted(stopPolling);
-
-defineExpose({ refresh: loadStats });
-</script>
-
-<template>
-  <div class="stats-dashboard">
-    <Spin :spinning="loading">
-      <!-- 第一行：核心指标 -->
-      <Row :gutter="12" class="mb-3">
-        <!-- 待处理 -->
-        <Col :xs="24" :sm="12" :md="6">
-          <Card
-            :body-style="{ padding: '12px 14px' }"
-            class="stats-card stats-card--clickable"
-            @click="handleStatClick('pendingCount')"
-          >
-            <div class="stats-content">
-              <div
-                class="stats-icon"
-                style="--icon-color: #ff4d4f; --icon-bg: #fff1f0"
-              >
-                <IconifyIcon icon="solar:clock-circle-bold-duotone" />
-              </div>
-              <div class="stats-info">
-                <div class="stats-title">待处理</div>
-                <div class="stats-value">{{ statsData.pendingCount }}</div>
-              </div>
-            </div>
-          </Card>
-        </Col>
-
-        <!-- 进行中 -->
-        <Col :xs="24" :sm="12" :md="6">
-          <Card
-            :body-style="{ padding: '12px 14px' }"
-            class="stats-card stats-card--clickable"
-            @click="handleStatClick('inProgressCount')"
-          >
-            <div class="stats-content">
-              <div
-                class="stats-icon"
-                style="--icon-color: #1677ff; --icon-bg: #e6f4ff"
-              >
-                <IconifyIcon icon="solar:play-circle-bold-duotone" />
-              </div>
-              <div class="stats-info">
-                <div class="stats-title">进行中</div>
-                <div class="stats-value">{{ statsData.inProgressCount }}</div>
-              </div>
-            </div>
-          </Card>
-        </Col>
-
-        <!-- 今日完成 -->
-        <Col :xs="24" :sm="12" :md="6">
-          <Card
-            :body-style="{ padding: '12px 14px' }"
-            class="stats-card stats-card--clickable"
-            @click="handleStatClick('completedTodayCount')"
-          >
-            <div class="stats-content">
-              <div
-                class="stats-icon"
-                style="--icon-color: #52c41a; --icon-bg: #f6ffed"
-              >
-                <IconifyIcon icon="solar:check-circle-bold-duotone" />
-              </div>
-              <div class="stats-info">
-                <div class="stats-title">今日完成</div>
-                <div class="stats-value">
-                  {{ statsData.completedTodayCount }}
-                </div>
-              </div>
-            </div>
-          </Card>
-        </Col>
-
-        <!-- 在线人员 -->
-        <Col :xs="24" :sm="12" :md="6">
-          <Card :body-style="{ padding: '12px 14px' }" class="stats-card">
-            <div class="stats-content">
-              <div
-                class="stats-icon"
-                style="--icon-color: #722ed1; --icon-bg: #f9f0ff"
-              >
-                <IconifyIcon
-                  icon="solar:users-group-two-rounded-bold-duotone"
-                />
-              </div>
-              <div class="stats-info">
-                <div class="stats-title">在线工牌</div>
-                <div class="stats-value">
-                  {{ statsData.onlineBadgeCount }}
-                </div>
-              </div>
-            </div>
-          </Card>
-        </Col>
-      </Row>
-    </Spin>
-  </div>
-</template>
-
-<style scoped lang="scss">
-.stats-dashboard {
-  margin-bottom: 12px;
-}
-
-// 核心指标卡片
-.stats-card {
-  position: relative;
-  overflow: hidden;
-  background: #fff;
-  border: 1px solid #f0f0f0;
-  border-radius: 6px;
-  transition: all 0.3s;
-
-  &:hover {
-    border-color: #d9d9d9;
-    box-shadow: 0 2px 6px rgb(0 0 0 / 5%);
-  }
-
-  &--clickable {
-    cursor: pointer;
-
-    &:hover {
-      box-shadow: 0 2px 8px rgb(0 0 0 / 6%);
-      transform: translateY(-1px);
-    }
-  }
-
-  .stats-content {
-    display: flex;
-    gap: 10px;
-    align-items: center;
-  }
-
-  .stats-icon {
-    --icon-color: #8c8c8c;
-    --icon-bg: #f5f5f5;
-
-    display: flex;
-    flex-shrink: 0;
-    align-items: center;
-    justify-content: center;
-    width: 40px;
-    height: 40px;
-    color: var(--icon-color);
-    background: var(--icon-bg);
-    border-radius: 8px;
-    transition: all 0.3s;
-
-    :deep(svg) {
-      width: 20px;
-      height: 20px;
-    }
-  }
-
-  .stats-info {
-    flex: 1;
-    min-width: 0;
-  }
-
-  .stats-title {
-    margin-bottom: 2px;
-    font-size: 13px;
-    font-weight: 500;
-    line-height: 1.3;
-    color: #595959;
-  }
-
-  .stats-subtitle {
-    margin-bottom: 4px;
-    font-size: 11px;
-    line-height: 1.3;
-    color: #8c8c8c;
-  }
-
-  .stats-value {
-    font-family:
-      -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto,
-      sans-serif;
-    font-size: 20px;
-    font-weight: 600;
-    font-variant-numeric: tabular-nums;
-    line-height: 1.2;
-    color: #262626;
-  }
-}
-
-// 态势数据卡片
-.metric-card {
-  background: #fff;
-  border: 1px solid #f0f0f0;
-  border-radius: 8px;
-  transition: all 0.3s;
-
-  &:hover {
-    border-color: #d9d9d9;
-    box-shadow: 0 2px 8px rgb(0 0 0 / 6%);
-  }
-
-  .metric-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 16px;
-  }
-
-  .metric-title {
-    display: flex;
-    gap: 8px;
-    align-items: center;
-    font-size: 15px;
-    font-weight: 600;
-    color: #262626;
-  }
-
-  .metric-icon {
-    font-size: 18px;
-    color: #1677ff;
-  }
-
-  .metric-status {
-    padding: 2px 8px;
-    font-size: 12px;
-    font-weight: 500;
-    background: rgb(22 119 255 / 10%);
-    border-radius: 4px;
-  }
-
-  .metric-content {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-  }
-
-  .metric-item {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 8px 0;
-  }
-
-  .metric-label {
-    font-size: 13px;
-    color: #8c8c8c;
-  }
-
-  .metric-value {
-    font-family:
-      -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto,
-      sans-serif;
-    font-size: 16px;
-    font-weight: 600;
-    font-variant-numeric: tabular-nums;
-    color: #262626;
-
-    &--primary {
-      color: #1677ff;
-    }
-
-    &--success {
-      color: #52c41a;
-    }
-  }
-
-  .metric-progress {
-    margin-top: 4px;
-  }
-
-  .progress-label {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 6px;
-    font-size: 12px;
-    color: #8c8c8c;
-  }
-
-  .progress-value {
-    font-size: 13px;
-    font-weight: 600;
-    color: #262626;
-  }
-}
-
-// 暗色模式
-html.dark {
-  .stats-card {
-    background: #1f1f1f;
-    border-color: #303030;
-
-    &:hover {
-      border-color: #434343;
-      box-shadow: 0 2px 8px rgb(0 0 0 / 30%);
-    }
-
-    &--clickable:hover {
-      box-shadow: 0 4px 12px rgb(0 0 0 / 40%);
-    }
-
-    .stats-title {
-      color: rgb(255 255 255 / 85%);
-    }
-
-    .stats-subtitle {
-      color: rgb(255 255 255 / 45%);
-    }
-
-    .stats-value {
-      color: rgb(255 255 255 / 85%);
-    }
-  }
-
-  .metric-card {
-    background: #1f1f1f;
-    border-color: #303030;
-
-    &:hover {
-      border-color: #434343;
-      box-shadow: 0 2px 8px rgb(0 0 0 / 30%);
-    }
-
-    .metric-title {
-      color: rgb(255 255 255 / 85%);
-    }
-
-    .metric-status {
-      background: rgb(22 119 255 / 20%);
-    }
-
-    .metric-label {
-      color: rgb(255 255 255 / 45%);
-    }
-
-    .metric-value {
-      color: rgb(255 255 255 / 85%);
-    }
-
-    .progress-label {
-      color: rgb(255 255 255 / 45%);
-    }
-
-    .progress-value {
-      color: rgb(255 255 255 / 85%);
-    }
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/modules/upgrade-priority-form.vue b/apps/web-antd/src/views/ops/cleaning/work-order/modules/upgrade-priority-form.vue
deleted file mode 100644
index 5f2813780..000000000
--- a/apps/web-antd/src/views/ops/cleaning/work-order/modules/upgrade-priority-form.vue
+++ /dev/null
@@ -1,136 +0,0 @@
-<script setup lang="ts">
-import { ref } from 'vue';
-
-import { useVbenModal } from '@vben/common-ui';
-import { IconifyIcon } from '@vben/icons';
-
-import { Alert, message } from 'ant-design-vue';
-
-import { useVbenForm, z } from '#/adapter/form';
-import { upgradePriority } from '#/api/ops/cleaning';
-
-defineOptions({ name: 'UpgradePriorityForm' });
-
-const emit = defineEmits<{ success: [] }>();
-
-const [Modal, modalApi] = useVbenModal({
-  onOpenChange: (isOpen) => {
-    if (isOpen) {
-      const data = modalApi.getData<{
-        currentPriority: number;
-        orderCode: string;
-        orderId: number;
-      }>();
-      if (data) {
-        orderId.value = data.orderId;
-        orderCode.value = data.orderCode;
-        currentPriority.value = data.currentPriority;
-      }
-    }
-  },
-  onConfirm: handleSubmit,
-});
-
-const orderId = ref<number>();
-const orderCode = ref<string>('');
-const currentPriority = ref<number>(2);
-const loading = ref(false);
-
-const [Form, formApi] = useVbenForm({
-  schema: [
-    {
-      fieldName: 'reason',
-      label: '升级原因',
-      component: 'Textarea',
-      componentProps: {
-        placeholder:
-          '请输入升级为P0紧急工单的原因，例如：领导临时检查、VIP客户投诉等',
-        rows: 4,
-        maxLength: 200,
-        showCount: true,
-      },
-      rules: z
-        .string()
-        .min(5, '原因至少5个字符')
-        .max(200, '原因不能超过200字符'),
-    },
-  ],
-  showDefaultActions: false,
-});
-
-/** 获取优先级文本 */
-function getPriorityText(priority: number) {
-  const map: Record<number, string> = {
-    0: 'P0 (紧急)',
-    1: 'P1 (重要)',
-    2: 'P2 (普通)',
-  };
-  return map[priority] || 'P2';
-}
-
-/** 提交表单 */
-async function handleSubmit() {
-  const { valid, values } = await formApi.validate();
-  if (!valid || !values) return;
-
-  loading.value = true;
-  try {
-    await upgradePriority({
-      orderId: orderId.value!,
-      reason: values.reason,
-    });
-    message.success('已升级为P0紧急工单');
-    modalApi.close();
-    emit('success');
-  } finally {
-    loading.value = false;
-  }
-}
-</script>
-
-<template>
-  <Modal title="升级优先级" class="w-[500px]">
-    <div class="upgrade-form">
-      <!-- 警告提示 -->
-      <Alert
-        type="warning"
-        show-icon
-        class="mb-4"
-        message="升级为P0紧急工单后，该工单将插队优先处理"
-      >
-        <template #icon>
-          <IconifyIcon icon="lucide:zap" class="text-orange-500" />
-        </template>
-      </Alert>
-
-      <!-- 工单信息 -->
-      <div class="mb-4 rounded-lg bg-gray-50 p-4 dark:bg-gray-800">
-        <div class="mb-2 flex items-center justify-between">
-          <span class="text-sm text-gray-500">工单编号</span>
-          <span class="font-medium">{{ orderCode }}</span>
-        </div>
-        <div class="flex items-center justify-between">
-          <span class="text-sm text-gray-500">当前优先级</span>
-          <div class="flex items-center gap-2">
-            <span class="text-gray-600 dark:text-gray-300">
-              {{ getPriorityText(currentPriority) }}
-            </span>
-            <IconifyIcon icon="lucide:arrow-right" class="text-gray-400" />
-            <span class="font-bold text-red-500">P0 (紧急)</span>
-          </div>
-        </div>
-      </div>
-
-      <!-- 表单 -->
-      <Form />
-    </div>
-  </Modal>
-</template>
-
-<style scoped>
-.upgrade-form {
-  :deep(.ant-form-item) {
-    margin-bottom: 0;
-  }
-}
-</style>
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-actions.vue b/apps/web-antd/src/views/ops/work-order/components/cleaning-actions.vue
similarity index 100%
rename from apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-actions.vue
rename to apps/web-antd/src/views/ops/work-order/components/cleaning-actions.vue
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-detail-ext.vue b/apps/web-antd/src/views/ops/work-order/components/cleaning-detail-ext.vue
similarity index 100%
rename from apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-detail-ext.vue
rename to apps/web-antd/src/views/ops/work-order/components/cleaning-detail-ext.vue
diff --git a/apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-work-progress.vue b/apps/web-antd/src/views/ops/work-order/components/cleaning-work-progress.vue
similarity index 99%
rename from apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-work-progress.vue
rename to apps/web-antd/src/views/ops/work-order/components/cleaning-work-progress.vue
index 5c6c76c34..dd5892a0c 100644
--- a/apps/web-antd/src/views/ops/cleaning/work-order/components/cleaning-work-progress.vue
+++ b/apps/web-antd/src/views/ops/work-order/components/cleaning-work-progress.vue
@@ -7,7 +7,7 @@ import { IconifyIcon } from '@vben/icons';
 
 import { Card, Progress, Tag } from 'ant-design-vue';
 
-import { CLEANING_TYPE_TEXT_MAP } from '../config';
+import { CLEANING_TYPE_TEXT_MAP } from '../data';
 
 defineOptions({ name: 'CleaningWorkProgress' });
 
diff --git a/apps/web-antd/src/views/ops/work-order/data.ts b/apps/web-antd/src/views/ops/work-order/data.ts
index 2b0004aeb..5a147b045 100644
--- a/apps/web-antd/src/views/ops/work-order/data.ts
+++ b/apps/web-antd/src/views/ops/work-order/data.ts
@@ -110,6 +110,20 @@ export function usePriorityInfo() {
   return { getPriorityInfo };
 }
 
+/** 保洁类型选项 */
+export const CLEANING_TYPE_OPTIONS = [
+  { label: '日常', value: OpsOrderCenterApi.CleaningType.ROUTINE },
+  { label: '深度', value: OpsOrderCenterApi.CleaningType.DEEP },
+  { label: '应急', value: OpsOrderCenterApi.CleaningType.EMERGENCY },
+];
+
+/** 保洁类型文本映射 */
+export const CLEANING_TYPE_TEXT_MAP: Record<string, string> = {
+  ROUTINE: '日常',
+  DEEP: '深度',
+  EMERGENCY: '应急',
+};
+
 /** 工单类型选项 */
 export const ORDER_TYPE_OPTIONS = [
   { label: '保洁', value: OpsOrderCenterApi.OrderType.CLEAN },
@@ -124,15 +138,25 @@ export const ORDER_TYPE_TEXT_MAP: Record<string, string> = {
   SECURITY: '安保',
 };
 
-/** 工单类型颜色映射（背景色 + 文字色） */
+/** 工单类型颜色映射（背景色 + 文字色 + 边条色） */
 export const ORDER_TYPE_COLOR_MAP: Record<
   string,
-  { bg: string; text: string }
+  { bg: string; border: string; text: string }
 > = {
-  CLEAN: { bg: '#E5FAF2', text: '#047857' }, // 保洁
-  SECURITY: { bg: '#EEF0FF', text: '#3730A3' }, // 安保
-  FACILITIES: { bg: '#FFF5E0', text: '#92400E' }, // 设施
-  SERVICE: { bg: '#E0F2FE', text: '#0369A1' }, // 服务
+  CLEAN: { bg: '#E5FAF2', text: '#047857', border: '#10B981' }, // 保洁
+  REPAIR: { bg: '#FFF5E0', text: '#92400E', border: '#F59E0B' }, // 维修
+  SECURITY: { bg: '#EEF0FF', text: '#3730A3', border: '#6366F1' }, // 安保
+  FACILITIES: { bg: '#FFF5E0', text: '#92400E', border: '#F59E0B' }, // 设施
+  SERVICE: { bg: '#E0F2FE', text: '#0369A1', border: '#0EA5E9' }, // 服务
+};
+
+/** 工单类型图标映射 */
+export const ORDER_TYPE_ICON_MAP: Record<string, string> = {
+  CLEAN: 'solar:broom-bold-duotone', // 保洁
+  REPAIR: 'solar:wrench-bold-duotone', // 维修
+  SECURITY: 'solar:shield-check-bold-duotone', // 安保
+  FACILITIES: 'solar:settings-bold-duotone', // 设施
+  SERVICE: 'solar:headphones-round-bold-duotone', // 服务
 };
 
 /** 工单状态选项 */
diff --git a/apps/web-antd/src/views/ops/work-order/detail/index.vue b/apps/web-antd/src/views/ops/work-order/detail/index.vue
index e9f132f13..542711ea1 100644
--- a/apps/web-antd/src/views/ops/work-order/detail/index.vue
+++ b/apps/web-antd/src/views/ops/work-order/detail/index.vue
@@ -40,9 +40,9 @@ import {
 } from '#/api/ops/cleaning';
 import { getOrderDetail } from '#/api/ops/order-center';
 
-import CleaningActions from '../../cleaning/work-order/components/cleaning-actions.vue';
-import CleaningDetailExt from '../../cleaning/work-order/components/cleaning-detail-ext.vue';
-import CleaningWorkProgress from '../../cleaning/work-order/components/cleaning-work-progress.vue';
+import CleaningActions from '../components/cleaning-actions.vue';
+import CleaningDetailExt from '../components/cleaning-detail-ext.vue';
+import CleaningWorkProgress from '../components/cleaning-work-progress.vue';
 import SecurityDetailExt from '../../security/work-order/components/security-detail-ext.vue';
 import {
   ORDER_TYPE_COLOR_MAP,