diff --git a/src/api/mes/plan/index.ts b/src/api/mes/plan/index.ts
index 37d6a0dc..aa005db7 100644
--- a/src/api/mes/plan/index.ts
+++ b/src/api/mes/plan/index.ts
@@ -177,5 +177,9 @@ export const PlanApi = {
 
   getPlanPageByTask: async (params: any) => {
     return await request.get({ url: `/mes/plan/page-by-task`, params })
+  },
+
+  getProductCapacityPage: async (params: any) => {
+    return await request.get({ url: `/mes/plan/product-capacity-page`, params })
   }
 }
diff --git a/src/locales/en.ts b/src/locales/en.ts
index 1a6c8d66..e990e60e 100644
--- a/src/locales/en.ts
+++ b/src/locales/en.ts
@@ -1353,14 +1353,27 @@ export default {
       deviceType: 'Device Type',
       deviceStatus: 'Device Status',
       workshop: 'Workshop',
-      ratedCapacity: 'Rated Capacity',
+      ratedCapacity: 'Rated Capacity (Planned Capacity)',
       reportCapacity: 'Report Capacity',
+      reportCapacityTooltip: 'Average of data from the last half year',
+      reportCapacityViewDetail: 'View Detail',
       actualCapacity: 'Actual Capacity',
       placeholderDeviceCode: 'Please input device code',
       placeholderDeviceName: 'Please input device name',
       placeholderDeviceType: 'Please input device type',
       placeholderDeviceStatus: 'Please select device status',
       placeholderWorkshop: 'Please input workshop',
+      dialogTitlePrefix: 'Report Capacity Detail - ',
+      dialogProductCode: 'Product Code',
+      dialogProductCodePlaceholder: 'Please input product code',
+      dialogProductName: 'Product Name',
+      dialogProductNamePlaceholder: 'Please input product name',
+      dialogTaskCode: 'Task Code',
+      dialogTaskCodePlaceholder: 'Please input task code',
+      dialogBaogongTotal: 'Report Total',
+      dialogAvgCapacity: 'Avg Report Capacity',
+      dialogSearchButtonText: 'Search',
+      dialogResetButtonText: 'Reset',
       exportFilename: 'Capacity Report.xls'
     },
     // Critical Component
diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts
index 8d045c09..c94f4ad6 100644
--- a/src/locales/zh-CN.ts
+++ b/src/locales/zh-CN.ts
@@ -1343,14 +1343,27 @@ export default {
       deviceType: '设备类型',
       deviceStatus: '设备状态',
       workshop: '所属车间',
-      ratedCapacity: '额定产能',
+      ratedCapacity: '额定产能（计划产能）',
       reportCapacity: '报工产能',
+      reportCapacityTooltip: '近半年的数据均值',
+      reportCapacityViewDetail: '查看明细',
       actualCapacity: '实际产能',
       placeholderDeviceCode: '请输入设备编码',
       placeholderDeviceName: '请输入设备名称',
       placeholderDeviceType: '请输入设备类型',
       placeholderDeviceStatus: '请选择设备状态',
       placeholderWorkshop: '请输入所属车间',
+      dialogTitlePrefix: '报工产能明细 - ',
+      dialogProductCode: '产品编码',
+      dialogProductCodePlaceholder: '请输入产品编码',
+      dialogProductName: '产品名称',
+      dialogProductNamePlaceholder: '请输入产品名称',
+      dialogTaskCode: '任务编码',
+      dialogTaskCodePlaceholder: '请输入任务编码',
+      dialogBaogongTotal: '报工总数',
+      dialogAvgCapacity: '报工均值产能',
+      dialogSearchButtonText: '搜索',
+      dialogResetButtonText: '重置',
       exportFilename: '产能报表.xls'
     },
     // 设备关键件
diff --git a/src/views/mes/capacityReport/ProductCapacityDialog.vue b/src/views/mes/capacityReport/ProductCapacityDialog.vue
new file mode 100644
index 00000000..716aa4f8
--- /dev/null
+++ b/src/views/mes/capacityReport/ProductCapacityDialog.vue
@@ -0,0 +1,140 @@
+<template>
+  <Dialog v-model="dialogVisible" :title="dialogTitle" width="1200" :scroll="true" max-height="70vh" align-center>
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" label-width="auto">
+      <el-form-item :label="t('EquipmentManagement.CapacityReport.dialogProductCode')" prop="productCode">
+        <el-input
+          v-model="queryParams.productCode"
+          :placeholder="t('EquipmentManagement.CapacityReport.dialogProductCodePlaceholder')"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-200px"
+        />
+      </el-form-item>
+      <el-form-item :label="t('EquipmentManagement.CapacityReport.dialogProductName')" prop="productName">
+        <el-input
+          v-model="queryParams.productName"
+          :placeholder="t('EquipmentManagement.CapacityReport.dialogProductNamePlaceholder')"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-200px"
+        />
+      </el-form-item>
+      <el-form-item :label="t('EquipmentManagement.CapacityReport.dialogTaskCode')" prop="taskCode">
+        <el-input
+          v-model="queryParams.taskCode"
+          :placeholder="t('EquipmentManagement.CapacityReport.dialogTaskCodePlaceholder')"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-200px"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery">
+          <Icon icon="ep:search" class="mr-5px" />
+          {{ t('EquipmentManagement.CapacityReport.dialogSearchButtonText') }}
+        </el-button>
+        <el-button @click="resetQuery">
+          <Icon icon="ep:refresh" class="mr-5px" />
+          {{ t('EquipmentManagement.CapacityReport.dialogResetButtonText') }}
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" style="margin-top: 16px">
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.dialogProductCode')" align="center" prop="productCode" />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.dialogProductName')" align="center" prop="productName" />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.dialogTaskCode')" align="center" prop="taskCode" />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.dialogBaogongTotal')" align="center" prop="baogongTotal" />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.dialogAvgCapacity')" align="center" prop="avgCapacity" />
+    </el-table>
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { PlanApi } from '@/api/mes/plan'
+
+const { t } = useI18n()
+
+const props = defineProps<{
+  modelValue: boolean
+  deviceId?: number
+  deviceName?: string
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: boolean): void
+}>()
+
+const dialogVisible = computed({
+  get() {
+    return props.modelValue
+  },
+  set(value: boolean) {
+    emit('update:modelValue', value)
+  }
+})
+
+const dialogTitle = computed(() => {
+  const name = props.deviceName || '-'
+  return `${t('EquipmentManagement.CapacityReport.dialogTitlePrefix')}${name}`
+})
+
+const loading = ref(false)
+const list = ref<any[]>([])
+const total = ref(0)
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  deviceId: undefined as number | undefined,
+  productCode: undefined as string | undefined,
+  productName: undefined as string | undefined,
+  taskCode: undefined as string | undefined
+})
+const queryFormRef = ref()
+
+const getList = async () => {
+  if (!props.deviceId) {
+    list.value = []
+    total.value = 0
+    return
+  }
+  loading.value = true
+  try {
+    const data = await PlanApi.getProductCapacityPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+const resetQuery = () => {
+  queryFormRef.value?.resetFields()
+  queryParams.deviceId = props.deviceId
+  handleQuery()
+}
+
+watch(
+  () => [props.modelValue, props.deviceId],
+  ([visible, deviceId]) => {
+    if (!visible) return
+    queryParams.deviceId = deviceId as number
+    queryParams.pageNo = 1
+    queryParams.productCode = undefined
+    queryParams.productName = undefined
+    queryParams.taskCode = undefined
+    getList()
+  }
+)
+</script>
diff --git a/src/views/mes/capacityReport/index.vue b/src/views/mes/capacityReport/index.vue
index 4f42f55b..b58cce17 100644
--- a/src/views/mes/capacityReport/index.vue
+++ b/src/views/mes/capacityReport/index.vue
@@ -1,50 +1,28 @@
 <template>
   <ContentWrap>
     <!-- 搜索工作栏 -->
-    <el-form
-      class="-mb-15px"
-      :model="queryParams"
-      ref="queryFormRef"
-      :inline="true"
-      min-label-width="80px"
-    >
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true" min-label-width="80px">
       <el-form-item :label="t('EquipmentManagement.CapacityReport.deviceCode')" prop="deviceCode">
-        <el-input
-          v-model="queryParams.deviceCode"
-          :placeholder="t('EquipmentManagement.CapacityReport.placeholderDeviceCode')"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
+        <el-input v-model="queryParams.deviceCode"
+          :placeholder="t('EquipmentManagement.CapacityReport.placeholderDeviceCode')" clearable
+          @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
       <el-form-item :label="t('EquipmentManagement.CapacityReport.deviceName')" prop="deviceName">
-        <el-input
-          v-model="queryParams.deviceName"
-          :placeholder="t('EquipmentManagement.CapacityReport.placeholderDeviceName')"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
+        <el-input v-model="queryParams.deviceName"
+          :placeholder="t('EquipmentManagement.CapacityReport.placeholderDeviceName')" clearable
+          @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
       <el-form-item :label="t('EquipmentManagement.CapacityReport.deviceType')" prop="deviceType">
-        <el-input
-          v-model="queryParams.deviceType"
-          :placeholder="t('EquipmentManagement.CapacityReport.placeholderDeviceType')"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
+        <el-input v-model="queryParams.deviceType"
+          :placeholder="t('EquipmentManagement.CapacityReport.placeholderDeviceType')" clearable
+          @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
       <el-form-item :label="t('EquipmentManagement.CapacityReport.workshop')" prop="workshop" v-show="showAllFilters">
-        <el-input
-          v-model="queryParams.workshop"
-          :placeholder="t('EquipmentManagement.CapacityReport.placeholderWorkshop')"
-          clearable
-          @keyup.enter="handleQuery"
-          class="!w-240px"
-        />
+        <el-input v-model="queryParams.workshop"
+          :placeholder="t('EquipmentManagement.CapacityReport.placeholderWorkshop')" clearable
+          @keyup.enter="handleQuery" class="!w-240px" />
       </el-form-item>
-    
+
       <el-form-item v-if="filterCount > 3">
         <el-button type="text" class="text-primary" @click="toggleFilters">
           <Icon :icon="showAllFilters ? 'ep:arrow-up' : 'ep:arrow-down'" class="mr-5px" />
@@ -52,7 +30,7 @@
             t('FactoryModeling.FactoryStructure.expandText') }}
         </el-button>
       </el-form-item>
-    
+
       <el-form-item>
         <el-button @click="handleQuery">
           <Icon icon="ep:search" class="mr-5px" /> {{ t('common.query') }}
@@ -69,37 +47,49 @@
 
   <!-- 列表 -->
   <ContentWrap>
-    <el-table
-      v-loading="loading"
-      :data="list"
-      :stripe="true"
-      :show-overflow-tooltip="true"
-      :row-key="(row) => row.id"
-      @select-all="handleSelectAll"
-      @select="handleSelect"
-    >
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" :row-key="(row) => row.id"
+      @select-all="handleSelectAll" @select="handleSelect">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.deviceCode')" align="center" prop="deviceCode" sortable />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.deviceName')" align="center" prop="deviceName" sortable />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.deviceType')" align="center" prop="typeName" sortable />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.ratedCapacity')" align="center" prop="ratedCapacity" sortable />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.reportCapacity')" align="center" prop="reportCapacity" sortable />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.actualCapacity')" align="center" prop="actualCapacity" sortable />
-      <el-table-column :label="t('EquipmentManagement.CapacityReport.workshop')" align="center" prop="workshopName" sortable />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.deviceCode')" align="center" prop="deviceCode"
+        sortable />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.deviceName')" align="center" prop="deviceName"
+        sortable />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.deviceType')" align="center" prop="typeName"
+        sortable />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.ratedCapacity')" align="center"
+        prop="ratedCapacity" sortable />
+      <el-table-column align="center" prop="reportCapacity">
+        <template #header>
+          <span>{{ t('EquipmentManagement.CapacityReport.reportCapacity') }}</span>
+          <el-tooltip :content="t('EquipmentManagement.CapacityReport.reportCapacityTooltip')" placement="top">
+            <Icon icon="ep:question-filled" class="ml-4px"
+              style="vertical-align: middle; color: var(--el-text-color-secondary)" />
+          </el-tooltip>
+        </template>
+        <template #default="scope">
+          <el-button link type="primary" @click="openProductCapacity(scope.row)">
+            {{ t('EquipmentManagement.CapacityReport.reportCapacityViewDetail') }}
+          </el-button>
+        </template>
+      </el-table-column>
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.actualCapacity')" align="center"
+        prop="actualCapacity" sortable />
+      <el-table-column :label="t('EquipmentManagement.CapacityReport.workshop')" align="center" prop="workshopName"
+        sortable />
     </el-table>
-    <Pagination
-      :total="total"
-      v-model:page="queryParams.pageNo"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
+    <Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
+      @pagination="getList" />
   </ContentWrap>
+
+  <ProductCapacityDialog v-model="productCapacityVisible" :device-id="productCapacityDeviceId"
+    :device-name="productCapacityDeviceName" />
 </template>
 
 <script setup lang="ts">
 import { ref, reactive } from 'vue'
 import download from '@/utils/download'
 import { DeviceLedgerApi, CapacityReportVO } from '@/api/mes/device-ledger'
+import ProductCapacityDialog from './ProductCapacityDialog.vue'
 
 defineOptions({ name: 'CapacityReport' })
 
@@ -122,6 +112,15 @@ const exportLoading = ref(false)
 const showAllFilters = ref(false) // 是否显示所有筛选框
 const filterCount = 4 // 筛选框数量
 const selectedIds = ref<number[]>([])
+const productCapacityVisible = ref(false)
+const productCapacityDeviceId = ref<number>()
+const productCapacityDeviceName = ref<string>()
+
+const openProductCapacity = (row: CapacityReportVO) => {
+  productCapacityDeviceId.value = row.id
+  productCapacityDeviceName.value = row.deviceName
+  productCapacityVisible.value = true
+}
 
 /** 切换筛选框展开/折叠 */
 const toggleFilters = () => {