diff --git a/src/assets/dashboard/part-schematic-bg.png b/src/assets/dashboard/part-schematic-bg.png
new file mode 100644
index 0000000..8b99925
Binary files /dev/null and b/src/assets/dashboard/part-schematic-bg.png differ
diff --git a/src/views/index.vue b/src/views/index.vue
index 2158744..34735cc 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,38 +1,72 @@
 <template>
-  <div class="assembly-dashboard"
-    :style="{ width: `${style.width}px`, height: `${style.height}px`, transform: style.transform }">
+  <div
+    class="assembly-dashboard"
+    :style="{ width: `${style.width}px`, height: `${style.height}px`, transform: style.transform }"
+  >
     <div class="dashboard-shell">
       <header class="dashboard-header">
-        <div class="brand"><img class="brand-logo" :src="clientLogoUrl" alt="RENLY" /></div>
+        <div class="brand">
+          <img class="brand-logo" :src="clientLogoUrl" alt="RENLY" />
+        </div>
         <h1>装配中心任务看板</h1>
         <div class="current-time">{{ currentTime }}</div>
       </header>
+
       <main class="dashboard-content">
-        <section class="summary-row">
-          <article v-for="item in summaryCards" :key="item.title" class="panel summary-card" :class="item.className">
-            <div>
-              <div class="summary-title">{{ item.title }}</div>
-              <div v-if="item.metrics" class="summary-metrics">
-                <div v-for="metric in item.metrics" :key="metric.label" class="summary-metric">
-                  <span>{{ metric.label }}</span>
-                  <b>{{ metric.value }}</b>
-                  <small>{{ item.unit }}</small>
-                </div>
-              </div>
-              <div v-else class="summary-body">
-                <img class="summary-icon" :src="item.icon" :alt="item.title" />
-                <div class="summary-value" :class="item.valueClass"><span>{{ item.value }}</span><small
-                    v-if="item.unit">{{ item.unit }}</small></div>
-              </div>
-            </div>
-            <div v-if="item.people" class="people-list">
-              <div v-for="person in item.people" :key="person.name"><span>{{ person.name }}</span><b>{{ person.group
-                  }}</b></div>
+        <section class="status-row">
+          <article v-for="item in topStats" :key="item.key" class="panel stat-card" :class="item.className">
+            <div class="stat-title">{{ item.title }}</div>
+            <div class="stat-value">
+              <span>{{ item.value }}</span>
+              <small v-if="item.unit">{{ item.unit }}</small>
             </div>
           </article>
         </section>
+
         <section class="main-grid">
-          <div class="left-column">
+          <article class="panel table-panel aggregate-panel">
+            <div class="panel-caption">装配任务分类汇总</div>
+            <!-- <div class="aggregate-tip">统计口径：计划数量 &gt; 完成数量，辅助配件选择“包含”。</div> -->
+            <div class="summary-wrap">
+              <table class="summary-table">
+                <thead>
+                  <tr>
+                    <th class="group-th">大类</th>
+                    <th class="subclass-th">分类</th>
+                    <th class="metric-th">指标</th>
+                    <!-- <th>条件</th> -->
+                    <th class="count-th">数量</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr v-for="row in aggregateRows" :key="`${row.categoryKey}-${row.metricKey}`">
+                    <td v-if="row.parentRowspan" :rowspan="row.parentRowspan" class="group-cell">
+                      <div class="category-total">
+                        <span>{{ row.parent }}</span>
+                        <strong>{{ row.parentTotal }}</strong>
+                      </div>
+                    </td>
+                    <td
+                      v-if="row.childRowspan"
+                      :rowspan="row.childRowspan"
+                      class="subclass-cell"
+                      :style="{ '--part-bg': `url(${partSchematicBg})` }"
+                    >
+                      <div class="category-total subclass-total">
+                        <span>{{ row.child }}</span>
+                        <strong>{{ row.childTotal }}</strong>
+                      </div>
+                    </td>
+                    <td class="metric-cell" :class="`metric-${row.metricKey}`">{{ row.metric }}</td>
+                    <!-- <td class="condition-cell">{{ row.condition }}</td> -->
+                    <td class="count-cell">{{ row.value }}</td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </article>
+
+          <aside class="right-column">
             <article class="panel table-panel">
               <div class="panel-caption">发货状态列表</div>
               <div class="scroll-wrap">
@@ -40,18 +74,27 @@
                   <thead>
                     <tr>
                       <th class="idx-th">序号</th>
-                      <th v-for="c in taskColumns2" :key="c.key">{{ c.label }}</th>
+                      <th v-for="column in deliveryColumns" :key="column.key" :style="{ width: column.width }">
+                        {{ column.label }}
+                      </th>
                     </tr>
                   </thead>
-                  <tbody :style="deliveryScrollStyle">
-                    <tr v-for="(r, i) in deliveryDisplayRows" :key="i">
-                      <td class="idx-td">{{ r._idx }}</td>
-                      <td v-for="c in taskColumns2" :key="c.key">{{ r[c.key] }}</td>
+                  <tbody>
+                    <tr v-for="row in deliveryDisplayRows" :key="`delivery-${row._idx}`">
+                      <td class="idx-td">{{ row._idx }}</td>
+                      <td
+                        v-for="column in deliveryColumns"
+                        :key="column.key"
+                        :class="getCellClass(column.key, row[column.key])"
+                      >
+                        {{ row[column.key] }}
+                      </td>
                     </tr>
                   </tbody>
                 </table>
               </div>
             </article>
+
             <article class="panel table-panel task-panel">
               <div class="panel-caption">在制任务列表</div>
               <div class="scroll-wrap">
@@ -59,53 +102,21 @@
                   <thead>
                     <tr>
                       <th class="idx-th">序号</th>
-                      <th v-for="c in taskColumns" :key="c.key">{{ c.label }}</th>
+                      <th v-for="column in taskColumns" :key="column.key" :style="{ width: column.width }">
+                        {{ column.label }}
+                      </th>
                     </tr>
                   </thead>
-                  <tbody :style="taskScrollStyle">
-                    <tr v-for="(r, i) in taskDisplayRows" :key="i" :class="{ warning: r.urgentQty > 0 }">
-                      <td class="idx-td">{{ r._idx }}</td>
-                      <td v-for="c in taskColumns" :key="c.key">{{ r[c.key] }}</td>
-                    </tr>
-                  </tbody>
-                </table>
-              </div>
-            </article>
-          </div>
-          <aside class="right-column">
-            <article class="panel table-panel">
-              <div class="panel-caption">在制任务缺件明细</div>
-              <div class="scroll-wrap">
-                <table>
-                  <thead>
-                    <tr>
-                      <th class="idx-th">序号</th>
-                      <th v-for="c in materialColumns" :key="c.key">{{ c.label }}</th>
-                    </tr>
-                  </thead>
-                  <tbody :style="materialScrollStyle">
-                    <tr v-for="(r, i) in materialDisplayRows" :key="i">
-                      <td class="idx-td">{{ r._idx }}</td>
-                      <td v-for="c in materialColumns" :key="c.key">{{ r[c.key] }}</td>
-                    </tr>
-                  </tbody>
-                </table>
-              </div>
-            </article>
-            <article class="panel table-panel">
-              <div class="panel-caption">已完工作务</div>
-              <div class="scroll-wrap">
-                <table>
-                  <thead>
-                    <tr>
-                      <th class="idx-th">序号</th>
-                      <th v-for="c in doneColumns" :key="c.key">{{ c.label }}</th>
-                    </tr>
-                  </thead>
-                  <tbody :style="doneScrollStyle">
-                    <tr v-for="(r, i) in doneDisplayRows" :key="i">
-                      <td class="idx-td">{{ r._idx }}</td>
-                      <td v-for="c in doneColumns" :key="c.key" :class="c.key === 'passRate' ? r.rateClass : ''">{{ r[c.key] }}</td>
+                  <tbody>
+                    <tr v-for="row in taskDisplayRows" :key="`task-${row._idx}`" :class="{ warning: row.urgentQty > 0 }">
+                      <td class="idx-td">{{ row._idx }}</td>
+                      <td
+                        v-for="column in taskColumns"
+                        :key="column.key"
+                        :class="getCellClass(column.key, row[column.key])"
+                      >
+                        {{ row[column.key] }}
+                      </td>
                     </tr>
                   </tbody>
                 </table>
@@ -119,330 +130,514 @@
 </template>
 
 <script setup>
-import { computed, inject, nextTick, onMounted, onUnmounted, reactive, ref } from 'vue'
-const CreateData = inject('CreateData')
-const ExecDatabase = inject('ExecDatabase')
+import { computed, inject, onMounted, onUnmounted, reactive, ref } from 'vue'
+import partSchematicBg from '@/assets/dashboard/part-schematic-bg.png'
+
 defineOptions({ name: 'AssemblyCenterTaskDashboard' })
 
+const CreateData = inject('CreateData')
+const ExecDatabase = inject('ExecDatabase')
+
+const clientLogoUrl = './public/ClientLogo.png'
 const now = ref(new Date('2026-05-06 10:10:10'))
-let timer = null
+const style = reactive({
+  width: 1920,
+  height: 1080,
+  transform: 'scaleY(1) scaleX(1) translate(-50%, -50%)'
+})
+
+let clockTimer = null
+let refreshTimer = null
 let resizeHandler = null
 let scrollTimers = []
-const style = reactive({ width: 1920, height: 1080, transform: 'scaleY(1) scaleX(1) translate(-50%, -50%)' })
-const setScale = () => { const s = getScale(); style.transform = `scaleY(${s.y}) scaleX(${s.x}) translate(-50%, -50%)` }
-const getScale = () => ({ x: window.innerWidth / style.width, y: window.innerHeight / style.height })
-const pad = v => String(v).padStart(2, '0')
-const currentTime = computed(() => `${now.value.getFullYear()}-${pad(now.value.getMonth() + 1)}-${pad(now.value.getDate())} ${pad(now.value.getHours())}:${pad(now.value.getMinutes())}:${pad(now.value.getSeconds())}`)
-const clientLogoUrl = './public/ClientLogo.png'
-const icon = name => `./public/svg/${name}.svg`
-const tableData = ref([])
-const getFirstRow = rows => {
-  if (Array.isArray(rows) && rows.length > 0) {
-    return rows[0]
-  }
-  return {}
-}
-onMounted(() => {
-  startClock();
-  setScale();
-  resizeHandler = setScale;
-  window.addEventListener('resize', resizeHandler)
-  searchDashboardData()
-  startAllScroll()
-  setInterval(function(){
-    searchDashboardData()
-  },600000)
-  
-})
-onUnmounted(() => {
-  if (timer) window.clearInterval(timer);
-  if (resizeHandler) window.removeEventListener('resize', resizeHandler)
-  stopAllScroll()
-})
 
-// ============ 滚动数据 ============
 const deliveryRows = ref([])
 const taskRows = ref([])
-const materialRows = ref([])
-const doneRows = ref([])
+const valveTaskRows = ref([])
+const systemTaskRows = ref([])
+const stagnationRows = ref([])
 
-// 每个列表的滚动偏移
 const deliveryOffset = ref(0)
 const taskOffset = ref(0)
-const materialOffset = ref(0)
-const doneOffset = ref(0)
+const passRate = ref('100%')
+const exceptionCount = ref(0)
 
-// 可见行数
 const VISIBLE_ROWS = {
-  delivery: 8,
-  task: 7,
-  material: 8,
-  done: 7
+  delivery: 7,
+  task: 7
 }
 
-// 生成带序号和循环滚动的显示行
-const makeDisplayRows = (rows, offset, visibleCount) => {
-  if (!rows || rows.length === 0) return []
-  const len = rows.length
-  const result = []
-  for (let i = 0; i < visibleCount; i++) {
-    const idx = (offset + i) % len
-    result.push({ ...rows[idx], _idx: idx + 1 })
+const metricDefinitions = [
+  { key: 'dispatch', label: '派工', condition: '派工时间不为空' },
+  { key: 'completeSet', label: '齐套', condition: '任务状态为可执行' },
+  { key: 'urgent', label: '加急', condition: '加急总数大于0' },
+  { key: 'stagnation', label: '滞留', condition: '未及时送检' }
+]
+
+const categoryGroups = [
+  {
+    parent: '阀类',
+    children: [
+      { key: 'valveMain', label: '阀类' },
+      { key: 'valveOther', label: '其他类' }
+    ]
+  },
+  {
+    parent: '系统类',
+    children: [
+      { key: 'systemElectric', label: '电气类' },
+      { key: 'systemAssembly', label: '装配类' }
+    ]
   }
-  return result
-}
+]
+
+const pad = value => String(value).padStart(2, '0')
+
+const currentTime = computed(() => {
+  const date = now.value
+  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`
+})
+
+const topStats = computed(() => [
+  { key: 'dispatch', title: '派工汇总', value: getMetricTotal('dispatch'), unit: '条', className: 'blue-stat' },
+  { key: 'completeSet', title: '齐套汇总', value: getMetricTotal('completeSet'), unit: '条', className: 'green-stat' },
+  { key: 'urgent', title: '加急汇总', value: getMetricTotal('urgent'), unit: '条', className: 'red-stat' },
+  { key: 'stagnation', title: '滞留汇总', value: getMetricTotal('stagnation'), unit: '条', className: 'orange-stat' },
+  { key: 'passRate', title: '装配合格率', value: passRate.value, unit: '', className: 'green-stat' },
+  { key: 'exception', title: '异常未关闭', value: exceptionCount.value, unit: '条', className: 'red-stat' }
+])
+
+const aggregateRows = computed(() => {
+  const rows = []
+
+  categoryGroups.forEach(group => {
+    const parentTotal = getGroupTotal(group)
+
+    group.children.forEach(child => {
+      const childTotal = getCategoryTotal(child.key)
+
+      metricDefinitions.forEach(metric => {
+        rows.push({
+          parent: group.parent,
+          parentTotal,
+          parentRowspan: rows.filter(item => item.parent === group.parent).length === 0
+            ? group.children.length * metricDefinitions.length
+            : 0,
+          child: child.label,
+          childTotal,
+          childRowspan: metric.key === metricDefinitions[0].key ? metricDefinitions.length : 0,
+          categoryKey: child.key,
+          metricKey: metric.key,
+          metric: metric.label,
+          condition: metric.condition,
+          value: countRows(child.key, metric.key)
+        })
+      })
+    })
+  })
+
+  return rows
+})
 
 const deliveryDisplayRows = computed(() => makeDisplayRows(deliveryRows.value, deliveryOffset.value, VISIBLE_ROWS.delivery))
 const taskDisplayRows = computed(() => makeDisplayRows(taskRows.value, taskOffset.value, VISIBLE_ROWS.task))
-const materialDisplayRows = computed(() => makeDisplayRows(materialRows.value, materialOffset.value, VISIBLE_ROWS.material))
-const doneDisplayRows = computed(() => makeDisplayRows(doneRows.value, doneOffset.value, VISIBLE_ROWS.done))
 
-// 滚动样式（平滑过渡）
-const deliveryScrollStyle = computed(() => ({ transition: 'none' }))
-const taskScrollStyle = computed(() => ({ transition: 'none' }))
-const materialScrollStyle = computed(() => ({ transition: 'none' }))
-const doneScrollStyle = computed(() => ({ transition: 'none' }))
+onMounted(() => {
+  startClock()
+  setScale()
+  resizeHandler = setScale
+  window.addEventListener('resize', resizeHandler)
+  searchDashboardData()
+  startAllScroll()
+  refreshTimer = window.setInterval(searchDashboardData, 600000)
+})
 
-// 启动单个列表滚动
-const startScroll = (rowsRef, offsetRef) => {
-  const id = window.setInterval(() => {
-    if (rowsRef.value.length > 0) {
-      offsetRef.value = (offsetRef.value + 1) % rowsRef.value.length
-    }
-  }, 2000)
-  scrollTimers.push(id)
-  return id
+onUnmounted(() => {
+  if (clockTimer) {
+    window.clearInterval(clockTimer)
+  }
+  if (refreshTimer) {
+    window.clearInterval(refreshTimer)
+  }
+  if (resizeHandler) {
+    window.removeEventListener('resize', resizeHandler)
+  }
+  stopAllScroll()
+})
+
+const setScale = () => {
+  const scale = getScale()
+  style.transform = `scaleY(${scale.y}) scaleX(${scale.x}) translate(-50%, -50%)`
+}
+
+const getScale = () => ({
+  x: window.innerWidth / style.width,
+  y: window.innerHeight / style.height
+})
+
+const startClock = () => {
+  clockTimer = window.setInterval(() => {
+    now.value = new Date(now.value.getTime() + 1000)
+  }, 1000)
 }
 
 const startAllScroll = () => {
   startScroll(deliveryRows, deliveryOffset)
   startScroll(taskRows, taskOffset)
-  startScroll(materialRows, materialOffset)
-  startScroll(doneRows, doneOffset)
+}
+
+const startScroll = (rowsRef, offsetRef) => {
+  const timerId = window.setInterval(() => {
+    if (rowsRef.value.length > 0) {
+      offsetRef.value = (offsetRef.value + 1) % rowsRef.value.length
+    }
+  }, 2500)
+  scrollTimers.push(timerId)
 }
 
 const stopAllScroll = () => {
-  scrollTimers.forEach(id => window.clearInterval(id))
+  scrollTimers.forEach(timerId => window.clearInterval(timerId))
   scrollTimers = []
 }
 
-// ============ 数据查询 ============
+const makeDisplayRows = (rows, offset, visibleCount) => {
+  if (!Array.isArray(rows) || rows.length === 0) {
+    return []
+  }
+
+  const displayRows = []
+  for (let index = 0; index < visibleCount; index += 1) {
+    const rowIndex = (offset + index) % rows.length
+    displayRows.push({ ...rows[rowIndex], _idx: rowIndex + 1 })
+  }
+  return displayRows
+}
+
 const searchDashboardData = () => {
-  searchExecutableData()
-  searchUnclosedData()
-  searchMaterialshortageData()
-  searchUrgentData()
   searchDeliveryData()
   searchTaskData()
   searchPassRateData()
-  searchDoneTaskData()
-}
-const searchExecutableData = () => {
-  queryDashboardData('装配中心任务看板_可执行任务数', applyExecutableData)
-}
-const searchUnclosedData = () => {
-  queryDashboardData('装配中心任务看板_异常未关闭总数', applyUnclosedData)
-}
-const searchDeliveryData = () => {
-  queryDashboardData('装配中心任务看板_发货状态查询', applyDeliveryData)
-}
-const searchMaterialshortageData = () => {
-  queryDashboardData('装配中心任务看板_在制品缺件查询', applyMaterialshortageData)
-}
-const searchUrgentData = () => {
-  queryDashboardData('装配中心任务看板_加急任务总数查询', applyUrgentData)
-}
-// const searchTaskData = () => {
-//   queryDashboardData('装配中心任务看板_装配任务查询', applyTaskData)
-// }
-const searchTaskData = () => {
-  queryDashboardData('装配中心任务看板_装配在制任务查询', applyTaskData)
-}
-const searchPassRateData = () => {
-  queryDashboardData('装配中心任务看板_装配合格率', applyPassRateData)
-}
-const searchDoneTaskData = () => {
-  queryDashboardData('装配中心任务看板_已完成任务', applyDoneTaskData)
-}
-const applyExecutableData = rows => {
-  const row = rows[0] || {}
-  summaryCards[0].metrics[0].value = row.阀类可执行任务数 || 0
-  summaryCards[0].metrics[1].value = row.系统类电气任务数 || 0
-  summaryCards[0].metrics[2].value = row.系统类机械任务数 || 0
-  summaryCards[1].value = row.及时送检数 || 0
-}
-const applyUnclosedData = rows => {
-  summaryCards[4].value = rows[0].装配异常未关闭总数
-}
-const applyDeliveryData = rows => {
-  deliveryRows.value = rows.map(item => {
-    let requiredDate = ''
-    if (item.要求发货日期) {
-      // 如果是字符串
-      if (typeof item.要求发货日期 === 'string') {
-        requiredDate = item.要求发货日期.split(' ')[0]
-      } 
-      // 如果是 Date 对象
-      else if (item.要求发货日期 instanceof Date) {
-        requiredDate = item.要求发货日期.toISOString().split('T')[0]
-      }
-      // 如果是其他格式
-      else {
-        const dateStr = String(item.要求发货日期)
-        requiredDate = dateStr.split(' ')[0]
-      }
-    }
-  return {
-    productionOrder: item.订单编号,
-    salesOrder: item.合同号 || '',
-    materialName: item.物料描述 || '',
-    materialCode: item.物料编号 || '',
-    completeSet: item.齐套 === 1 ? '是' : '否',
-    issueStatus: item.发料状态 === '1' ? '发料齐套' : (item.发料状态 === '2' ? '发料缺件' : ''),
-    urgentQty: item.操作人,
-    assignQty: item.交货数量,
-    taskdate: requiredDate,
-    operator: item.任务状态 === 0 ? '待执行' : (item.发料状态 === 1 ? '可执行' : '已开工'),
-  }
-  })
-}
-const applyUrgentData = rows => {
-  summaryCards[3].value = rows[0].加急总数
-}
-const applyPassRateData = rows => {
-  summaryCards[2].value = rows[0].总合格率+'%'
-}
-const applyDoneTaskData = rows => {
-  doneRows.value = rows.map(item => ({
-    productionOrder:item.计划号?.toString() || '',
-    materialName: item.零件名称 || '',
-    materialCode: item.零件编码 || '',
-    passRate: item.单项合格率+'%',
-    rateClass:item.单项合格率 <= 70 ? 'orange-cell' : 'green-cell'
-  }))
+  searchUnclosedData()
+  searchAggregateTaskData()
+  searchStagnationData()
 }
 
-const applyTaskData = rows => {
-  taskRows.value = rows.map(item => ({
-    productionOrder: item.订单号?.toString() || '',
-    salesOrder: item.合同号 || '',
-    materialName: item.零件名称 || '',
-    materialCode: item.零件编码 || '',
-    processName: item.工序名称 || '',
-    completeSet: item.齐套 === '是' ? '是' : '否',
-    issueStatus: item.发料状态 === '发料齐套' ? '发料齐套' : (item.发料状态 === '发料缺件' ? '发料缺件' : ''),
-    urgentQty: (item.加急总数 && item.加急总数 > 0) ? item.加急总数 : (item.加急 === '加急' ? (item.分配数 || 0) : 0),
-    assignQty: item.分配数 || 0,
-    inspectQty: item.完成数量,
-    assignTarget: item.操作人 || '',
-    workHours: '',
-    operator: item.操作人 || ''
-  }))
+const searchDeliveryData = () => {
+  queryDashboardData('装配中心任务看板_发货状态查询', [], applyDeliveryData)
 }
-const applyMaterialshortageData = rows => {
-  console.log(rows)
-  materialRows.value = rows.map(item => ({
-    wipOrder: item.DocEntry,
-    shortageStatus: item.U_Name,
-    finishTime: item.ItemCode,
-    owner: item.加急数量
-  }))
-  console.log(materialRows.value)
+
+const searchTaskData = () => {
+  queryDashboardData('装配中心任务看板_装配在制任务查询', [], applyTaskData)
 }
-const queryDashboardData = (procedureName, applyData) => {
-  let data
-  data = CreateData('11', procedureName, [])
-  ExecDatabase(data).then(response => {
-    const rows = getResponseRows(response)
-    tableData.value = rows
-    applyData(rows)
+
+const searchPassRateData = () => {
+  queryDashboardData('装配中心任务看板_装配合格率', [], applyPassRateData)
+}
+
+const searchUnclosedData = () => {
+  queryDashboardData('装配中心任务看板_异常未关闭总数', [], applyUnclosedData)
+}
+
+const searchAggregateTaskData = () => {
+  const params = createPlanQueryParams()
+  queryDashboardData('计划排产_阀类任务查询', params, rows => {
+    valveTaskRows.value = rows.map(row => ({ ...row, _sourceType: 'valve' }))
+  }, 50000, 1)
+  queryDashboardData('计划排产_系统类任务查询', params, rows => {
+    systemTaskRows.value = rows.map(row => ({ ...row, _sourceType: 'system' }))
+  }, 50000, 1)
+}
+
+const searchStagnationData = () => {
+  const params = [
+    ['订单号', 0],
+    ['合同号', ''],
+    ['产品编码', ''],
+    ['产品名称', ''],
+    ['工序名称', ''],
+    ['辅助配件', '包含']
+  ]
+  queryDashboardData('异常提醒_装配及时送检_查询', params, rows => {
+    stagnationRows.value = rows
   })
 }
+
+const createPlanQueryParams = () => [
+  ['订单号', 0],
+  ['物料类型', '自制件'],
+  ['合同号', ''],
+  ['产品编码', ''],
+  ['产品名称', ''],
+  ['工序名称', ''],
+  ['要求完工日期1', undefined],
+  ['要求完工日期2', undefined],
+  ['计划开始', ''],
+  ['计划完成', ''],
+  ['排产状态', '已完成'],
+  ['辅助配件', '包含'],
+  ['指派对象', '全部']
+]
+
+const queryDashboardData = (procedureName, params, applyData, pageSize, pageCurrent) => {
+  const data = CreateData('11', procedureName, params, pageSize, pageCurrent)
+  ExecDatabase(data)
+    .then(response => {
+      applyData(getResponseRows(response))
+    })
+    .catch(error => {
+      console.error(`${procedureName} 查询失败:`, error)
+      applyData([])
+    })
+}
+
 const getResponseRows = response => {
   if (response && Array.isArray(response.data)) {
     return response.data
   }
+  if (response && response.data && Array.isArray(response.data.rows)) {
+    return response.data.rows
+  }
   if (response && response.data && Array.isArray(response.data.result)) {
     return response.data.result
   }
   return []
 }
 
-const startClock = () => { timer = window.setInterval(() => { now.value = new Date(now.value.getTime() + 1000) }, 1000) }
-const svgData = svg => 'data:image/svg+xml;utf8,' + encodeURIComponent(svg)
-const svgIcon = (from, to, body) => svgData(
-  `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72 72" fill="none">
-    <defs>
-      <linearGradient id="bg" x1="0" y1="0" x2="0" y2="1">
-        <stop offset="0" stop-color="${from}"/>
-        <stop offset="1" stop-color="${to}"/>
-      </linearGradient>
-      <linearGradient id="shine" x1="0" y1="0" x2="0" y2="1">
-        <stop offset="0" stop-color="#fff" stop-opacity=".35"/>
-        <stop offset="1" stop-color="#fff" stop-opacity="0"/>
-      </linearGradient>
-      <filter id="glow" x="-55%" y="-55%" width="210%" height="210%"><feGaussianBlur stdDeviation="4" result="b"/><feMerge><feMergeNode in="b"/><feMergeNode in="SourceGraphic"/></feMerge></filter>
-    </defs>
-    <rect x="7" y="7" width="58" height="58" rx="11" fill="url(#bg)" filter="url(#glow)"/>
-    <path d="M14 14h44v20c-10-4-29-4-44 1z" fill="url(#shine)"/>
-    <g transform="translate(36 36) scale(1.12) translate(-36 -36)" stroke="#fff" stroke-width="4.1" stroke-linecap="round" stroke-linejoin="round" opacity=".96">${body}</g>
-  </svg>`
-)
-const icons = {
-  pending: svgIcon('#37a9ff', '#0862f3', '<rect x="23" y="20" width="26" height="36" rx="4"/><path d="M29 20h14l-3-6h-8l-3 6zM29 34h14M29 43h14"/>'),
-  urgent: svgIcon('#ff7469', '#dc2524', '<path d="M21 55h30M25 50V34a11 11 0 0 1 22 0v16M36 13v8M18 21l6 6M54 21l-6 6M15 38h8M49 38h8"/>'),
-  cart: svgIcon('#28a8ff', '#0a58ff', '<path d="M16 22h7l5 25h27l5-17H28"/><circle cx="32" cy="56" r="2.8"/><circle cx="52" cy="56" r="2.8"/>'),
-  checklist: svgIcon('#49e89e', '#08a86e', '<rect x="21" y="17" width="32" height="42" rx="5"/><path d="M28 35l5 5 12-13M28 49h19"/>'),
-  returnDown: svgIcon('#ffb23f', '#fb7418', '<rect x="21" y="23" width="31" height="32" rx="4"/><path d="M36 14v24M27 31l9 9 9-9"/>'),
-  returnSales: svgIcon('#9867ff', '#6232e6', '<path d="M51 22H28a10 10 0 0 0 0 20h26M28 14l-11 9 11 9"/><rect x="35" y="37" width="18" height="18" rx="2"/>'),
-  finalCheck: svgIcon('#3a95ff', '#0a61e8', '<path d="M36 14l16 7v13c0 11-7 18-16 24-9-6-16-13-16-24V21z"/><path d="M27 37l6 6 13-15"/>'),
-  other: svgIcon('#4bd8ff', '#0a88cc', '<path d="M19 26l17-10 17 10-17 10zM19 26v19l17 10 17-10V26M36 36v19"/>'),
-  shield: svgIcon('#3a9aff', '#0861e8', '<path d="M36 14l16 7v13c0 11-7 18-16 24-9-6-16-13-16-24V21z"/><path d="M28 37l6 6 12-14"/>'),
-  done: svgIcon('#47eaa0', '#0da76b', '<rect x="19" y="19" width="34" height="34" rx="8"/><path d="M27 37l7 7 15-18"/>')
+const applyDeliveryData = rows => {
+  deliveryRows.value = rows.map(item => ({
+    productionOrder: normalizeText(item.订单编号 || item.订单号),
+    salesOrder: normalizeText(item.合同号),
+    materialName: normalizeText(item.物料描述 || item.产品名称),
+    materialCode: normalizeText(item.物料编号 || item.产品编码),
+    quantity: formatQuantity(item.交货数量 || item.计划数量),
+    requiredDate: formatDate(item.要求发货日期),
+    completeSet: formatComplete(item.齐套),
+    issueStatus: formatSendStatus(item.发料状态),
+    operator: normalizeText(item.操作人),
+    startStatus: formatStartStatus(item.任务状态)
+  }))
 }
-const summaryCards = [
-  { title: '可执行任务数', unit: '条', className: 'executable-card', metrics: [{ label: '阀类', value: 0 }, { label: '系统-电气', value: 0 },{ label: '系统-机械', value: 0 }] },
-  { title: '及时送检数', value: 0, unit: '条', icon: icons.pending , valueClass: 'red-text'},
-  { title: '装配合格率', value: '100%', icon: icons.finalCheck, valueClass: 'green-text full-value' },
-  { title: '加急任务数', value: 125, unit: '条', icon: icons.urgent, valueClass: 'red-text' },
-  { title: '异常未关闭消息数', value: 5, unit: '条', icon: icons.urgent, valueClass: 'red-text', className: 'exception-card' },
+
+const applyTaskData = rows => {
+  taskRows.value = rows.map(item => ({
+    productionOrder: normalizeText(item.订单号),
+    salesOrder: normalizeText(item.合同号),
+    materialName: normalizeText(item.零件名称 || item.产品名称),
+    materialCode: normalizeText(item.零件编码 || item.产品编码),
+    completeSet: formatComplete(item.齐套),
+    issueStatus: formatSendStatus(item.发料状态),
+    urgentQty: getUrgentCount(item),
+    assignQty: formatQuantity(item.分配数 || item.指派数量 || item.计划数量),
+    inspectQty: formatQuantity(item.完成数量),
+    assignTarget: normalizeText(item.指派对象 || item.操作人)
+  }))
+}
+
+const applyPassRateData = rows => {
+  const row = rows[0] || {}
+  const value = row.总合格率 ?? row.装配合格率 ?? row.合格率
+  passRate.value = value === undefined || value === null || value === '' ? '100%' : `${formatQuantity(value)}%`
+}
+
+const applyUnclosedData = rows => {
+  const row = rows[0] || {}
+  exceptionCount.value = toNumber(row.装配异常未关闭总数 ?? row.异常未关闭总数 ?? row.总数)
+}
+
+const countRows = (categoryKey, metricKey) => {
+  const sourceRows = metricKey === 'stagnation'
+    ? stagnationRows.value
+    : [...valveTaskRows.value, ...systemTaskRows.value]
+
+  return sourceRows
+    .filter(row => isPlanUnfinished(row))
+    .filter(row => matchCategory(row, categoryKey))
+    .filter(row => matchMetric(row, metricKey))
+    .length
+}
+
+const getMetricTotal = metricKey => {
+  return categoryGroups.reduce((total, group) => {
+    return total + group.children.reduce((groupTotal, child) => groupTotal + countRows(child.key, metricKey), 0)
+  }, 0)
+}
+
+const getCategoryTotal = categoryKey => {
+  return metricDefinitions.reduce((total, metric) => total + countRows(categoryKey, metric.key), 0)
+}
+
+const getGroupTotal = group => {
+  return group.children.reduce((total, child) => total + getCategoryTotal(child.key), 0)
+}
+
+const isPlanUnfinished = row => {
+  const planQty = toNumber(getField(row, ['计划数量', '计划数']))
+  const doneQty = toNumber(getField(row, ['完成数量', '送检数', '完成数']))
+  return planQty > doneQty
+}
+
+const matchCategory = (row, categoryKey) => {
+  const productName = normalizeText(getField(row, ['产品名称', '物料名称', '物料描述', '零件名称']))
+  const taskType = normalizeText(getField(row, ['任务类型', '自制件属性', '物料类型']))
+  const assignTarget = normalizeText(getField(row, ['指派对象', '操作人', '二次派工']))
+  const isValveSource = row._sourceType === 'valve' || taskType.includes('阀')
+  const isSystemSource = row._sourceType === 'system' || taskType.includes('系统')
+
+  if (categoryKey === 'valveMain') {
+    return isValveSource && productName.includes('阀')
+  }
+  if (categoryKey === 'valveOther') {
+    return isValveSource && !productName.includes('阀')
+  }
+  if (categoryKey === 'systemElectric') {
+    return isSystemSource && assignTarget.includes('电气')
+  }
+  if (categoryKey === 'systemAssembly') {
+    return isSystemSource && (assignTarget.includes('机械') || (assignTarget.includes('装配') && !assignTarget.includes('电气')))
+  }
+  return false
+}
+
+const matchMetric = (row, metricKey) => {
+  if (metricKey === 'dispatch') {
+    return hasValue(getField(row, ['派工时间']))
+  }
+  if (metricKey === 'completeSet') {
+    return isExecutableTask(row)
+  }
+  if (metricKey === 'urgent') {
+    return isUrgentTask(row)
+  }
+  if (metricKey === 'stagnation') {
+    return true
+  }
+  return false
+}
+
+const isExecutableTask = row => {
+  const taskStatus = getField(row, ['任务状态'])
+  if (taskStatus !== undefined && taskStatus !== null && taskStatus !== '') {
+    return Number(taskStatus) === 1 || String(taskStatus).includes('可执行')
+  }
+
+  const completeSet = getField(row, ['齐套'])
+  return completeSet === 1 || completeSet === '1' || completeSet === '是'
+}
+
+const isUrgentTask = row => {
+  return getUrgentCount(row) > 0 ||
+    normalizeText(getField(row, ['加急状态', '加急'])).includes('加急') ||
+    normalizeText(getField(row, ['优先级'])).includes('是')
+}
+
+const getUrgentCount = row => toNumber(getField(row, ['加急总数', '加急数量', '加急数']))
+
+const getField = (row, fields) => {
+  for (const field of fields) {
+    if (row[field] !== undefined && row[field] !== null) {
+      return row[field]
+    }
+  }
+  return ''
+}
+
+const hasValue = value => value !== undefined && value !== null && String(value).trim() !== ''
+
+const normalizeText = value => {
+  if (value === undefined || value === null) {
+    return ''
+  }
+  return String(value).trim()
+}
+
+const toNumber = value => {
+  if (value === undefined || value === null || value === '') {
+    return 0
+  }
+  const numberValue = Number(value)
+  return Number.isNaN(numberValue) ? 0 : numberValue
+}
+
+const formatDate = value => {
+  if (!value) {
+    return ''
+  }
+  return String(value).split('T')[0].split(' ')[0]
+}
+
+const formatQuantity = value => {
+  if (value === undefined || value === null || value === '') {
+    return ''
+  }
+  const numberValue = Number(value)
+  if (Number.isNaN(numberValue)) {
+    return value
+  }
+  return Number.isInteger(numberValue)
+    ? String(numberValue)
+    : String(numberValue).replace(/0+$/, '').replace(/\.$/, '')
+}
+
+const formatComplete = value => {
+  if (value === '是' || value === '否') {
+    return value
+  }
+  return Number(value || 0) === 1 ? '是' : '否'
+}
+
+const formatSendStatus = value => {
+  if (value === '发料齐套' || value === '发料缺件' || value === '未发料') {
+    return value
+  }
+  if (Number(value || 0) === 1) {
+    return '发料齐套'
+  }
+  if (Number(value || 0) === 2) {
+    return '发料缺件'
+  }
+  return ''
+}
+
+const formatStartStatus = value => {
+  return Number(value || 0) > 0 ? '已开工' : '待执行'
+}
+
+const getCellClass = (key, value) => {
+  if (['completeSet', 'issueStatus', 'startStatus'].includes(key)) {
+    if (value === '是' || value === '发料齐套' || value === '已开工') {
+      return 'green-cell'
+    }
+    if (value === '否' || value === '发料缺件' || value === '待执行') {
+      return 'orange-cell'
+    }
+  }
+  return ''
+}
+
+const deliveryColumns = [
+  { label: '生产订单', key: 'productionOrder', width: '82px' },
+  { label: '销售订单', key: 'salesOrder', width: '100px' },
+  { label: '物料名称', key: 'materialName', width: '142px' },
+  { label: '物料编码', key: 'materialCode', width: '164px' },
+  { label: '数量', key: 'quantity', width: '58px' },
+  { label: '要求发货日期', key: 'requiredDate', width: '108px' },
+  { label: '齐套', key: 'completeSet', width: '54px' },
+  { label: '发料状态', key: 'issueStatus', width: '86px' },
+  { label: '操作人', key: 'operator', width: '76px' },
+  { label: '装配开工', key: 'startStatus', width: '82px' }
 ]
+
 const taskColumns = [
-  { label: '生产订单', key: 'productionOrder', width: '72px' },
-  { label: '销售订单', key: 'salesOrder', width: '92px' },
-  { label: '物料名称', key: 'materialName', width: '190px' },
-  { label: '物料编码', key: 'materialCode', width: '176px' },
-  { label: '齐套', key: 'completeSet', width: '52px' },
-  { label: '发料状态', key: 'issueStatus', width: '88px' },
-  { label: '加急数', key: 'urgentQty', width: '62px' },
-  { label: '分配数', key: 'assignQty', width: '70px' },
-  { label: '送检数', key: 'inspectQty', width: '70px' },
-  { label: '指派对象', key: 'assignTarget', width: '88px' },
-  
-]
-const taskColumns2 = [
-  { label: '生产订单', key: 'productionOrder', width: '72px' },
-  { label: '销售订单', key: 'salesOrder', width: '92px' },
-  { label: '物料名称', key: 'materialName', width: '190px' },
-  { label: '物料编码', key: 'materialCode', width: '176px' },
-  { label: '数量', key: 'assignQty', width: '176px' },
-  { label: '要求发货日期', key: 'taskdate', width: '176px' },
-  { label: '齐套', key: 'completeSet', width: '52px' },
-  { label: '发料状态', key: 'issueStatus', width: '88px' },
-  { label: '操作人', key: 'urgentQty', width: '62px' },
-  { label: '装配开工', key: 'operator', width: '82px' },
-]
-const materialColumns = [
-  { label: '生产订单', key: 'wipOrder', width: '76px' },
-  { label: '物料名称', key: 'shortageStatus', width: '105px' },
-  { label: '物料编码', key: 'finishTime', width: '160px' },
-  { label: '加急数量', key: 'owner', width: '90px' },
-]
-const doneColumns = [
-  { label: '生产订单', key: 'productionOrder', width: '88px' },
+  { label: '生产订单', key: 'productionOrder', width: '82px' },
+  { label: '销售订单', key: 'salesOrder', width: '100px' },
   { label: '物料名称', key: 'materialName', width: '150px' },
-  { label: '物料编码', key: 'materialCode', width: '165px' },
-  { label: '合格率', key: 'passRate', width: '86px' },
+  { label: '物料编码', key: 'materialCode', width: '172px' },
+  { label: '齐套', key: 'completeSet', width: '54px' },
+  { label: '发料状态', key: 'issueStatus', width: '86px' },
+  { label: '加急数', key: 'urgentQty', width: '64px' },
+  { label: '分配数', key: 'assignQty', width: '66px' },
+  { label: '送检数', key: 'inspectQty', width: '66px' },
+  { label: '指派对象', key: 'assignTarget', width: '86px' }
 ]
 </script>
 
@@ -458,11 +653,13 @@ const doneColumns = [
   width: 1920px;
   height: 1080px;
   transform-origin: 0 0;
-  transition: .3s;
+  transition: 0.3s;
   overflow: hidden;
   color: #f3f9ff;
   font-family: 'Microsoft YaHei', Arial, sans-serif;
-  background: #07001f;
+  background:
+    radial-gradient(circle at 20% 18%, rgba(13, 87, 122, 0.34), transparent 28%),
+    linear-gradient(180deg, #07001f 0%, #07132d 54%, #071628 100%);
 }
 
 .dashboard-shell {
@@ -476,35 +673,36 @@ const doneColumns = [
   grid-template-columns: 336px 1fr 442px;
   align-items: center;
   height: 95px;
-  border-bottom: 1px solid rgba(21, 162, 240, .7);
+  border-bottom: 1px solid rgba(21, 162, 240, 0.7);
 }
 
 .brand {
-  width: 300px;
-  height: 72px;
-  display: flex;
-  align-items: center;
-  overflow: visible;
   position: relative;
   z-index: 2;
+  display: flex;
+  align-items: center;
+  width: 300px;
+  height: 72px;
+  overflow: visible;
 }
 
 .brand-logo {
   width: 224px;
   height: 58px;
   padding: 5px 10px;
-  background: #ffffff;
-  border-radius: 6px;
   object-fit: contain;
   object-position: left center;
+  background: #ffffff;
+  border-radius: 6px;
   filter: drop-shadow(0 0 5px rgba(255, 255, 255, 0.28));
 }
+
 .dashboard-header h1 {
   margin: 0;
-  color: #fff;
+  color: #ffffff;
   font-size: 55px;
   font-weight: 900;
-  letter-spacing: .08em;
+  letter-spacing: 0;
   text-align: center;
 }
 
@@ -517,44 +715,41 @@ const doneColumns = [
 
 .dashboard-content {
   display: grid;
-  grid-template-rows: 126px 1fr;
-  gap: 17px;
+  grid-template-rows: 120px 1fr;
+  gap: 15px;
   height: calc(100% - 95px);
   padding-top: 10px;
 }
 
-.summary-row {
+.status-row {
   display: grid;
-  grid-template-columns: 1.28fr 1fr 1fr 1fr .82fr;
-  gap: 17px;
+  grid-template-columns: repeat(6, minmax(0, 1fr));
+  gap: 15px;
+  min-height: 0;
 }
 
 .main-grid {
   display: grid;
-  grid-template-columns: 2.05fr 1fr;
-  gap: 17px;
-  min-height: 0;
-}
-
-.left-column {
-  display: grid;
-  grid-template-rows: 1.05fr .9fr;
-  gap: 17px;
+  grid-template-columns: 780px 1fr;
+  gap: 15px;
   min-height: 0;
 }
 
 .right-column {
   display: grid;
-  grid-template-rows: 1.05fr .9fr;
-  gap: 17px;
+  grid-template-rows: 1fr 1fr;
+  gap: 15px;
+  min-width: 0;
   min-height: 0;
 }
 
 .panel {
   position: relative;
-  border: 1px solid rgba(29, 153, 229, .78);
-  background: rgba(3, 16, 48, .38);
-  box-shadow: inset 0 0 18px rgba(27, 130, 214, .24), 0 0 10px rgba(1, 132, 220, .18);
+  border: 1px solid rgba(29, 153, 229, 0.78);
+  background: rgba(3, 16, 48, 0.48);
+  box-shadow:
+    inset 0 0 18px rgba(27, 130, 214, 0.24),
+    0 0 10px rgba(1, 132, 220, 0.18);
 }
 
 .panel::before {
@@ -562,7 +757,15 @@ const doneColumns = [
   inset: -1px;
   content: '';
   pointer-events: none;
-  background: linear-gradient(90deg, #2bd8ff 0 14px, transparent 14px) left top/14px 2px no-repeat, linear-gradient(180deg, #2bd8ff 0 14px, transparent 14px) left top/2px 14px no-repeat, linear-gradient(270deg, #2bd8ff 0 14px, transparent 14px) right top/14px 2px no-repeat, linear-gradient(180deg, #2bd8ff 0 14px, transparent 14px) right top/2px 14px no-repeat, linear-gradient(90deg, #2bd8ff 0 14px, transparent 14px) left bottom/14px 2px no-repeat, linear-gradient(0deg, #2bd8ff 0 14px, transparent 14px) left bottom/2px 14px no-repeat, linear-gradient(270deg, #2bd8ff 0 14px, transparent 14px) right bottom/14px 2px no-repeat, linear-gradient(0deg, #2bd8ff 0 14px, transparent 14px) right bottom/2px 14px no-repeat;
+  background:
+    linear-gradient(90deg, #2bd8ff 0 14px, transparent 14px) left top / 14px 2px no-repeat,
+    linear-gradient(180deg, #2bd8ff 0 14px, transparent 14px) left top / 2px 14px no-repeat,
+    linear-gradient(270deg, #2bd8ff 0 14px, transparent 14px) right top / 14px 2px no-repeat,
+    linear-gradient(180deg, #2bd8ff 0 14px, transparent 14px) right top / 2px 14px no-repeat,
+    linear-gradient(90deg, #2bd8ff 0 14px, transparent 14px) left bottom / 14px 2px no-repeat,
+    linear-gradient(0deg, #2bd8ff 0 14px, transparent 14px) left bottom / 2px 14px no-repeat,
+    linear-gradient(270deg, #2bd8ff 0 14px, transparent 14px) right bottom / 14px 2px no-repeat,
+    linear-gradient(0deg, #2bd8ff 0 14px, transparent 14px) right bottom / 2px 14px no-repeat;
 }
 
 .panel::after {
@@ -570,223 +773,57 @@ const doneColumns = [
   inset: 0;
   content: '';
   pointer-events: none;
-  box-shadow: inset 0 0 12px rgba(43, 216, 255, .12);
+  box-shadow: inset 0 0 12px rgba(43, 216, 255, 0.12);
 }
 
-.summary-card {
-  display: flex;
+.stat-card {
+  display: grid;
+  grid-template-rows: 34px 1fr;
   align-items: center;
-  justify-content: center;
   min-width: 0;
-  padding: 8px 18px;
+  padding: 14px 20px 12px;
 }
 
-.summary-card > div:first-child {
-  width: 100%;
-  min-width: 0;
-}
-
-.absence-card {
-  justify-content: space-between;
-}
-
-.absence-card > div:first-child {
-  width: auto;
-  padding-right: 22px;
-  border-right: 3px solid rgba(238, 247, 255, 0.92);
-}
-
-.absence-card .summary-title {
-  text-align: left;
-}
-
-.absence-card .summary-body {
-  display: flex;
-  gap: 26px;
-  width: auto;
-}
-
-.absence-card .summary-value {
-  display: flex;
-  gap: 8px;
-}
-
-.absence-card .summary-value span {
-  text-align: left;
-}
-
-.executable-card {
-  padding: 8px 16px;
-}
-
-.executable-card .summary-title {
-  margin-bottom: 8px;
+.stat-title {
+  color: #95ddff;
   font-size: 21px;
-  text-align: left;
+  font-weight: 700;
 }
 
-.summary-metrics {
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-  gap: 2px;
-  align-items: center;
-  width: 100%;
-}
-
-.summary-metric {
-  position: relative;
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  grid-template-rows: 22px 48px;
+.stat-value {
+  display: flex;
   align-items: baseline;
+  justify-content: center;
   min-width: 0;
-  // padding: 6px 10px 4px;
-  color: #fff;
-  font-weight: 800;
-}
-
-.summary-metric span {
-  grid-column: 1 / -1;
-  color: #89d4ff;
-  font-size: 18px;
-  line-height: 22px;
-  white-space: nowrap;
-}
-
-.summary-metric b {
-  color: #18c65b;
-  font-size: 57px;
-  line-height: 1;
-  text-align: right;
-  text-shadow: 0 0 10px rgba(24, 198, 91, .32);
-}
-
-.summary-metric small {
-  color: #fff;
-  font-size: 18px;
-  font-weight: 700;
-  text-align: left;
-  white-space: nowrap;
-}
-
-.exception-card {
-  padding: 8px 12px;
-}
-
-.exception-card .summary-title {
-  font-size: 18px;
-}
-
-.exception-card .summary-body {
-  grid-template-columns: 54px 150px;
-  column-gap: 16px;
-}
-
-.exception-card .summary-icon {
-  width: 54px;
-  height: 54px;
-}
-
-.exception-card .summary-value {
-  grid-template-columns: 105px 28px;
-}
-
-.exception-card .summary-value span {
-  font-size: 48px;
-}
-
-.exception-card .summary-value small {
-  font-size: 20px;
-}
-
-.summary-title {
-  margin-bottom: 5px;
-  color: #89d4ff;
-  font-size: 20px;
-  font-weight: 700;
-  text-align: left;
-}
-
-.summary-body {
-  display: grid;
-  grid-template-columns: 66px 214px;
-  align-items: center;
-  justify-content: center;
-  column-gap: 26px;
-  width: 100%;
-}
-
-.summary-icon {
-  width: 66px;
-  height: 66px;
-  object-fit: contain;
-}
-
-.summary-value {
-  display: grid;
-  grid-template-columns: 150px 32px;
-  align-items: baseline;
-  justify-content: center;
-  color: #fff;
+  color: #ffffff;
   font-weight: 900;
   line-height: 1;
 }
 
-.summary-value span {
-  font-size: 57px;
-  text-align: center;
+.stat-value span {
+  font-size: 58px;
 }
 
-.summary-value small {
-  color: #fff;
+.stat-value small {
+  margin-left: 9px;
   font-size: 22px;
   font-weight: 700;
-  text-align: left;
 }
 
-.full-value span {
-  grid-column: 1 / -1;
+.blue-stat .stat-value span {
+  color: #36c8ff;
 }
 
-.red-text span {
-  color: #ff1e2e;
+.green-stat .stat-value span {
+  color: #18d36f;
 }
 
-.green-text span {
-  color: #18c65b;
+.red-stat .stat-value span {
+  color: #ff3040;
 }
 
-.orange-text span {
-  color: #ff9c12;
-}
-
-.absence-card .summary-value::before {
-  content: '总数：';
-  color: #fff;
-  font-size: 20px;
-  font-weight: 700;
-}
-
-.people-list {
-  min-width: 130px;
-  color: #fff;
-  font-size: 13px;
-  line-height: 1.75;
-}
-
-.people-list div {
-  display: flex;
-  gap: 18px;
-  justify-content: space-between;
-}
-
-.panel-caption {
-  height: 38px;
-  color: #8cd3ff;
-  font-size: 30px;
-  font-weight: 600;
-  line-height: 38px;
-  text-align: center;
+.orange-stat .stat-value span {
+  color: #ffb13b;
 }
 
 .table-panel {
@@ -796,6 +833,24 @@ const doneColumns = [
   min-height: 0;
 }
 
+.panel-caption {
+  height: 42px;
+  color: #8cd3ff;
+  font-size: 30px;
+  font-weight: 700;
+  line-height: 42px;
+  text-align: center;
+}
+
+.aggregate-tip {
+  height: 28px;
+  color: #d6f1ff;
+  font-size: 17px;
+  line-height: 24px;
+  text-align: center;
+}
+
+.summary-wrap,
 .scroll-wrap {
   flex: 1;
   min-height: 0;
@@ -809,38 +864,172 @@ table {
   border-collapse: collapse;
 }
 
-th, td {
-  height: 48px;
-  border: 1px solid rgba(53, 149, 217, .54);
+th,
+td {
+  border: 1px solid rgba(53, 149, 217, 0.54);
   color: #f1f8ff;
-  font-size: 20px;
   line-height: 1.18;
   text-align: center;
   vertical-align: middle;
-  white-space: pre-line;
-  word-break: break-all;
-  background: rgba(4, 24, 57, .44);
+  background: rgba(4, 24, 57, 0.5);
 }
 
 th {
-  height: 44px;
+  height: 42px;
   color: #bde9ff;
-  font-weight: 500;
-  background: rgba(12, 68, 119, .28);
+  font-size: 18px;
+  font-weight: 600;
+  background: rgba(12, 68, 119, 0.34);
 }
 
-.idx-th {
+td {
+  height: 45px;
+  font-size: 17px;
+  white-space: pre-line;
+  word-break: break-all;
+}
+
+.summary-table th {
+  height: 40px;
+}
+
+.summary-table td {
+  height: 45px;
+  font-size: 19px;
+}
+
+.group-th {
+  width: 82px;
+}
+
+.subclass-th {
+  width: 210px;
+}
+
+.metric-th {
+  width: 74px;
+}
+
+.count-th {
+  width: 78px;
+}
+
+.group-cell {
+  color: #ffffff;
+  font-size: 25px;
+  font-weight: 800;
+  background: rgba(7, 74, 112, 0.58);
+}
+
+.subclass-cell {
+  position: relative;
+  overflow: hidden;
+  color: #e8f7ff;
+  font-size: 18px;
+  font-weight: 700;
+  line-height: 1.35;
+  background: rgba(7, 45, 82, 0.58);
+}
+
+.subclass-cell::before {
+  position: absolute;
+  inset: 8px 12px;
+  content: '';
+  pointer-events: none;
+  background: var(--part-bg) center / contain no-repeat;
+  filter: drop-shadow(0 0 10px rgba(65, 199, 255, 0.35));
+  opacity: 0.28;
+}
+
+.category-total {
+  position: relative;
+  z-index: 1;
+  display: grid;
+  gap: 9px;
+  justify-items: center;
+  line-height: 1.1;
+}
+
+.category-total span {
+  color: #ffffff;
+  font-size: 22px;
+  font-weight: 800;
+}
+
+.category-total strong {
+  color: #ff3040;
+  font-size: 32px;
+  font-weight: 900;
+  line-height: 1;
+  text-shadow: 0 0 10px rgba(255, 48, 64, 0.28);
+}
+
+.subclass-total {
+  min-height: 106px;
+  align-content: center;
+}
+
+.subclass-total span {
+  font-size: 20px;
+}
+
+.subclass-total strong {
+  font-size: 31px;
+}
+
+.metric-cell {
+  font-weight: 800;
+}
+
+.metric-dispatch {
+  color: #36c8ff;
+}
+
+.metric-completeSet {
+  color: #18d36f;
+}
+
+.metric-urgent {
+  color: #ff4451;
+}
+
+.metric-stagnation {
+  color: #ffb13b;
+}
+
+.condition-cell {
+  padding: 0 12px;
+  color: #d7f2ff;
+  text-align: left;
+}
+
+.count-cell {
+  color: #ffffff;
+  font-size: 26px;
+  font-weight: 900;
+}
+
+.idx-th,
+.idx-td {
   width: 44px;
 }
 
 .idx-td {
-  width: 44px;
   color: #89d4ff;
-  // font-size: 13px;
+}
+
+.right-column td {
+  height: 42px;
+  font-size: 16px;
+}
+
+.right-column th {
+  height: 40px;
+  font-size: 16px;
 }
 
 .task-panel td {
-  height: 47px;
+  height: 42px;
 }
 
 .warning td {
@@ -849,9 +1038,11 @@ th {
 
 .green-cell {
   color: #32ff32;
+  font-weight: 700;
 }
 
 .orange-cell {
-  color: #ff7a1a;
+  color: #ffb13b;
+  font-weight: 700;
 }
 </style>
diff --git a/work/AI对话记录_20260703/装配任务看板_分类汇总背景图_对话记录.md b/work/AI对话记录_20260703/装配任务看板_分类汇总背景图_对话记录.md
new file mode 100644
index 0000000..17f7659
--- /dev/null
+++ b/work/AI对话记录_20260703/装配任务看板_分类汇总背景图_对话记录.md
@@ -0,0 +1,138 @@
+# 装配任务看板分类汇总背景图修改 AI 对话记录
+
+日期：2026-07-03
+
+文档路径：`C:\WorkYuanLy\装配任务看板\work\AI对话记录_20260703\装配任务看板_分类汇总背景图_对话记录.md`
+
+## 原始用户指令
+
+```text
+将修改上传到远程
+修改C:\WorkYuanLy\装配任务看板\src\views\index.vue
+在大类和分类的每一项下面增加汇总数根据图内红字所示
+在分类下的四项增加背景图片  先找一个差不多的零件示意图先放上  看看效果
+
+2. 【与AI深度交互全记录】
+内容：请直接将今日与AI对话的原始记录/截图/文档链接附上。
+要求：必须包含你为了完成任务，是如何把一个大目标拆解成若干步骤，并分步向AI提问的指令。鼓励展示“追问”和“修正”的过程。所有的对话都存入work下  新建对话记录
+```
+
+用户同时提供了一张标注图，红字示例表达了汇总数展示方式：
+
+```text
+大类“阀类”下方显示 293
+分类“阀类”下方显示 44
+分类“其他类”下方显示 249
+```
+
+## 大目标拆解
+
+1. 检查项目结构、`src/views/index.vue` 当前实现、资源目录和 git 状态。
+2. 明确汇总口径：分类汇总数 = 该分类下“派工、齐套、加急、滞留”四项数量之和；大类汇总数 = 该大类下所有分类汇总数之和。
+3. 准备分类背景图：先生成一张接近零件示意图风格的机械阀体爆炸图，放到项目资源目录。
+4. 修改 Vue 模板、计算逻辑和样式：在大类/分类名称下面展示红色汇总数；分类四项增加低透明度背景图。
+5. 运行构建验证。
+6. 在 `work` 下新建本次 AI 对话记录。
+7. 提交并推送到远程仓库。
+
+## 分步向 AI 提问的指令
+
+本次用户一次性给出了综合目标。执行时将其拆成以下 AI 子指令：
+
+```text
+请先读取项目结构、git 状态、src/views/index.vue、资源目录，确认当前看板数据结构和可用图片资源。
+```
+
+```text
+请按截图红字规则，在大类和分类单元格内增加“名称 + 汇总数”结构，汇总数使用现有指标数据动态计算。
+```
+
+```text
+请准备一张适合看板分类格背景的零件示意图，风格要偏深蓝工业看板，避免文字和水印。
+```
+
+```text
+请把背景图接入分类列四个合并单元格，只作为弱背景，不能遮挡分类名称和红色汇总数。
+```
+
+```text
+请运行 npm run build 验证资源引用和 Vue 模板可构建。
+```
+
+```text
+请在 work 下新建对话记录，记录原始用户指令、拆解步骤、追问/修正和验证结果。
+```
+
+```text
+请提交相关文件并推送到 origin/main。
+```
+
+## 追问与修正过程
+
+本次没有向用户追加提问，采用可直接执行的合理假设：
+
+1. 发现 `src/views/index.vue` 在开始修改前已经存在大量未提交改动，因此采用“基于当前工作区追加修改”的方式，不回滚既有内容。
+2. 发现本地已有机床和机器人图片，但不符合“零件示意图”要求，因此生成了一张机械阀体零件示意背景图。
+3. 汇总口径按截图推断为“分类四个指标相加，大类下所有分类相加”，未改动单项指标已有统计逻辑。
+4. 背景图只放在分类列四个合并单元格，使用低透明度和前景层级，避免影响文字读取。
+
+## 图片生成提示词
+
+```text
+Use case: productivity-visual
+Asset type: dashboard category cell background image
+Primary request: a clean technical schematic of mechanical assembly parts suitable as a subtle background image behind Chinese dashboard text
+Subject: valve body, bolts, flange, small mechanical components arranged as a compact exploded-view schematic
+Style/medium: polished 3D technical illustration mixed with blueprint linework
+Composition/framing: centered object with generous transparent-looking negative space around it, square canvas
+Lighting/mood: cool cyan-blue highlights on dark navy background, high-tech industrial dashboard style
+Color palette: cyan, steel blue, dark navy, soft white highlights
+Constraints: no text, no labels, no watermark, no logos, avoid busy clutter, keep enough contrast but suitable for use at low opacity behind text
+```
+
+生成图片已复制到：
+
+```text
+C:\WorkYuanLy\装配任务看板\src\assets\dashboard\part-schematic-bg.png
+```
+
+## AI 可见对话摘录
+
+```text
+AI：我会先检查项目结构和当前 index.vue 的实现，再确定汇总数和背景图最小改动点；同时会按你的要求在 work 下建立本次 AI 交互记录文档。
+```
+
+```text
+AI：当前文件内容显示为乱码，但 Vue 结构和逻辑仍能识别；我会尽量只改汇总展示和分类背景相关代码，不去整体转码或重写，避免扩大变更范围。
+```
+
+```text
+AI：我看到 src/assets/image 里已有机床和机器人图片，但不太像“零件示意图”。我会生成一张偏蓝色线稿风格的机械零件图，作为四个分类单元的背景底图，并把它落到项目资源目录里。
+```
+
+```text
+AI：汇总规则我按截图理解为：每个“分类”的红字 = 该分类下 4 个指标数量相加；每个“大类”的红字 = 该大类下所有分类红字相加。
+```
+
+```text
+AI：构建通过，新增图片已经被打进 dist/assets。接下来会建立 work 下的新对话记录目录，写入本次用户原始指令、拆解步骤、图片生成提示词和执行/修正过程。
+```
+
+## 修改结果
+
+1. `src/views/index.vue`
+   - 大类单元格增加红色汇总数。
+   - 分类单元格增加红色汇总数。
+   - 分类四项增加零件示意背景图。
+   - 新增分类汇总和大类汇总计算函数。
+
+2. `src/assets/dashboard/part-schematic-bg.png`
+   - 新增用于分类单元格的零件示意背景图。
+
+3. 构建验证
+
+```text
+npm run build
+结果：通过
+备注：Vite 输出了常规 chunk size 警告和 Sass legacy JS API deprecation warning，未阻断构建。
+```