服务工单-完成，服务汇总初始化页面

.env.production

@@ -4,14 +4,14 @@ ENV = 'production'
 # base api
 
 
-VUE_APP_BASE_API = 'https://kptyun.cn/'
+# VUE_APP_BASE_API = 'https://kptyun.cn/'
 
 # VUE_APP_BASE_API = 'http://localhost:8084/'
 
 
 
 
-# VUE_APP_BASE_API = 'http://210.16.189.72:8099/'
+ VUE_APP_BASE_API = 'http://210.16.189.72:8099/'
   
 
 # VUE_APP_BASE_API = 'http://localhost:8082/'

src/icons/svg/服务汇总.svg

@@ -0,0 +1,17 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg t="1600764537714" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13015" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+  <!-- 工单基础框架 -->
+  <path d="M832 112H724V72c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v40H372V72c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v40H192c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32z m-40 728H232V272h560v568z" fill="#ffffff"/>
+  
+  <!-- 图表统计图标 -->
+  <path d="M325 448h-50c-4.4 0-8 3.6-8 8v288c0 4.4 3.6 8 8 8h50c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z" fill="#ffffff"/>
+  <path d="M487 376h-50c-4.4 0-8 3.6-8 8v360c0 4.4 3.6 8 8 8h50c4.4 0 8-3.6 8-8V384c0-4.4-3.6-8-8-8z" fill="#ffffff"/>
+  <path d="M649 296h-50c-4.4 0-8 3.6-8 8v440c0 4.4 3.6 8 8 8h50c4.4 0 8-3.6 8-8V304c0-4.4-3.6-8-8-8z" fill="#ffffff"/>
+  
+  <!-- 顶部曲线图 -->
+  <path d="M320 320c48-48 112-80 192-80s144 32 192 80" fill="none" stroke="#ffffff" stroke-width="32" stroke-linecap="round"/>
+  
+  <!-- 底部文本线条 -->
+  <path d="M320 544h384c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H320c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" fill="#ffffff"/>
+  <path d="M320 688h384c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H320c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" fill="#ffffff"/>
+</svg> 

src/icons/svg/生产工序配置.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg t="1600764537714" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13015" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+  <!-- 工单基础框架 -->
+  <path d="M832 112H724V72c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v40H372V72c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v40H192c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32z m-40 728H232V272h560v568z" fill="#ffffff"/>
+  
+  <!-- 齿轮图标 -->
+  <path d="M512 320c-88.4 0-160 71.6-160 160s71.6 160 160 160 160-71.6 160-160-71.6-160-160-160z m0 256c-53 0-96-43-96-96s43-96 96-96 96 43 96 96-43 96-96 96z" fill="#ffffff"/>
+  <path d="M684.7 392.3l42.4-42.4c3.1-3.1 3.1-8.2 0-11.3l-30.1-30.1c-3.1-3.1-8.2-3.1-11.3 0l-42.4 42.4c-21.1-16.4-45.3-27.8-71.3-33.2V264c0-4.4-3.6-8-8-8h-42.7c-4.4 0-8 3.6-8 8v53.7c-26 5.4-50.2 16.8-71.3 33.2l-42.4-42.4c-3.1-3.1-8.2-3.1-11.3 0l-30.1 30.1c-3.1 3.1-3.1 8.2 0 11.3l42.4 42.4c-16.4 21.1-27.8 45.3-33.2 71.3H264c-4.4 0-8 3.6-8 8v42.7c0 4.4 3.6 8 8 8h53.7c5.4 26 16.8 50.2 33.2 71.3l-42.4 42.4c-3.1 3.1-3.1 8.2 0 11.3l30.1 30.1c3.1 3.1 8.2 3.1 11.3 0l42.4-42.4c21.1 16.4 45.3 27.8 71.3 33.2V736c0 4.4 3.6 8 8 8h42.7c4.4 0 8-3.6 8-8v-53.7c26-5.4 50.2-16.8 71.3-33.2l42.4 42.4c3.1 3.1 8.2 3.1 11.3 0l30.1-30.1c3.1-3.1 3.1-8.2 0-11.3l-42.4-42.4c16.4-21.1 27.8-45.3 33.2-71.3H736c4.4 0 8-3.6 8-8v-42.7c0-4.4-3.6-8-8-8h-53.7c-5.4-26-16.8-50.2-33.2-71.3z" fill="#ffffff"/>
+  
+  <!-- 底部文本线条 -->
+  <path d="M320 544h384c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H320c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" fill="#ffffff"/>
+  <path d="M320 688h384c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H320c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" fill="#ffffff"/>
+</svg> 

src/views/productManagement/installationCompletedSummary/components/InstallationStatistics.vue

@@ -0,0 +1,514 @@
+<template>
+  <el-card class="box-card">
+    <div slot="header" class="clearfix">
+      <div class="header-content">
+        <div class="header-title">
+          <span>已安装统计</span>
+          <span class="update-time">{{ updateTime }}</span>
+        </div>
+        <div class="filter-section">
+          <el-select v-model="productFilter" placeholder="货品" size="small" @change="handleFilterChange">
+            <el-option
+              v-for="item in productOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+          <el-select v-model="monthFilter" placeholder="时间" size="small" @change="handleFilterChange">
+            <el-option
+              v-for="item in monthOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+          <el-select v-model="personnelFilter" placeholder="人员" size="small" @change="handleFilterChange">
+            <el-option
+              v-for="item in personnelOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+          <el-select v-model="customerFilter" placeholder="客户" size="small" @change="handleFilterChange">
+            <el-option
+              v-for="item in customerOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </div>
+      </div>
+    </div>
+    <el-table 
+      :data="displayData" 
+      style="width: 100%"
+      border
+      size="small"
+    >
+      <el-table-column prop="customerName" label="客户名称" align="center"/>
+      <el-table-column prop="productName" label="安装货品" align="center"/>
+      <el-table-column prop="installer" label="安装人员" align="center"/>
+      <el-table-column prop="planQuantity" label="计划量" align="center"/>
+      <el-table-column prop="completedQuantity" label="已完成量" align="center"/>
+      <el-table-column prop="installStartTime" label="接单时间/开始安装时间" align="center"/>
+      <el-table-column prop="expectedEndTime" label="预计完成时间" align="center"/>
+      <el-table-column prop="actualEndTime" label="实际完成时间" align="center"/>
+      <el-table-column prop="planDays" label="工时" align="center"/>
+      <el-table-column prop="actualDays" label="实际工时" align="center">
+        <template slot-scope="scope">
+          <span :style="{ color: getWorkDaysColor(scope.row) }">{{ scope.row.actualDays }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="completionRate" label="完成效率" align="center">
+        <template slot-scope="scope">
+          <span :style="{ color: getCompletionRateColor(scope.row) }">{{ scope.row.completionRate }}%</span>
+        </template>
+      </el-table-column>
+      <el-table-column prop="personCount" label="人数" align="center"/>
+    </el-table>
+    <div class="expand-button" v-if="tableData.length > 10">
+      <el-button type="text" @click="isExpanded = !isExpanded" class="expand-btn">
+        <div class="button-content">
+          <i :class="['el-icon-arrow-' + (isExpanded ? 'up' : 'down')]"></i>
+          <span class="expand-text">{{ isExpanded ? '收起' : '展开更多' }}</span>
+        </div>
+      </el-button>
+    </div>
+  </el-card>
+</template>
+
+<script>
+export default {
+  name: 'InstallationStatistics',
+  props: {
+    updateTime: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      isExpanded: false,
+      productFilter: '',
+      monthFilter: '',
+      personnelFilter: '',
+      customerFilter: '',
+      productOptions: [],
+      monthOptions: [],
+      personnelOptions: [],
+      customerOptions: [],
+      tableData: [
+        {
+          customerName: '现代牧业二场',
+          productName: '智能膜环',
+          installer: '张明星',
+          planQuantity: 5000,
+          completedQuantity: 5000,
+          installStartTime: '2024-10-01',
+          expectedEndTime: '2024-10-30',
+          actualEndTime: '2024-10-28',
+          planDays: 30,
+          actualDays: 28,
+          completionRate: 107,
+          personCount: 1785
+        },
+        {
+          customerName: '现代牧业和林',
+          productName: '精准阉割',
+          installer: '陈希多',
+          planQuantity: 5000,
+          completedQuantity: 5000,
+          installStartTime: '2024-10-01',
+          expectedEndTime: '2024-10-30',
+          actualEndTime: '2024-10-25',
+          planDays: 30,
+          actualDays: 25,
+          completionRate: 120,
+          personCount: 2000
+        },
+        {
+          customerName: '现代牧业三场',
+          productName: '精准阉割',
+          installer: '李九联',
+          planQuantity: 5000,
+          completedQuantity: 5000,
+          installStartTime: '2024-10-30',
+          expectedEndTime: '2024-11-30',
+          actualEndTime: '2024-11-28',
+          planDays: 31,
+          actualDays: 29,
+          completionRate: 106,
+          personCount: 1724
+        },
+        {
+          customerName: '蜂谷牧场',
+          productName: '体况评分',
+          installer: '李季冬',
+          planQuantity: 2000,
+          completedQuantity: 2000,
+          installStartTime: '2024-09-28',
+          expectedEndTime: '2024-10-20',
+          actualEndTime: '2024-10-24',
+          planDays: 23,
+          actualDays: 27,
+          completionRate: 85,
+          personCount: 1481
+        },
+        {
+          customerName: '海丰牧场',
+          productName: '体况评分',
+          installer: '谭性成',
+          planQuantity: 3000,
+          completedQuantity: 3000,
+          installStartTime: '2024-08-01',
+          expectedEndTime: '2024-08-20',
+          actualEndTime: '2024-08-22',
+          planDays: 20,
+          actualDays: 22,
+          completionRate: 90,
+          personCount: 1346
+        },
+        {
+          customerName: '大丰牧场',
+          productName: '精准阉割',
+          installer: '柯凡',
+          planQuantity: 1000,
+          completedQuantity: 1000,
+          installStartTime: '2024-09-01',
+          expectedEndTime: '2024-09-20',
+          actualEndTime: '2024-09-25',
+          planDays: 20,
+          actualDays: 25,
+          completionRate: 80,
+          personCount: 1200
+        },
+        {
+          customerName: '马鞍山牧场',
+          productName: '智能膜环',
+          installer: '郑福超',
+          planQuantity: 2000,
+          completedQuantity: 2000,
+          installStartTime: '2024-09-01',
+          expectedEndTime: '2024-09-20',
+          actualEndTime: '2024-09-15',
+          planDays: 20,
+          actualDays: 15,
+          completionRate: 133,
+          personCount: 1700
+        },
+        {
+          customerName: '新希望',
+          productName: '显示大屏',
+          installer: '韩佳维',
+          planQuantity: 3000,
+          completedQuantity: 3000,
+          installStartTime: '2024-08-10',
+          expectedEndTime: '2024-08-20',
+          actualEndTime: '2024-08-20',
+          planDays: 11,
+          actualDays: 11,
+          completionRate: 100,
+          personCount: 1600
+        },
+        {
+          customerName: '宝塔牧场',
+          productName: '车载控制器',
+          installer: '卫承乾',
+          planQuantity: 4000,
+          completedQuantity: 4000,
+          installStartTime: '2024-10-05',
+          expectedEndTime: '2024-10-20',
+          actualEndTime: '2024-10-20',
+          planDays: 16,
+          actualDays: 16,
+          completionRate: 100,
+          personCount: 1600
+        },
+        {
+          customerName: '泰安牧场',
+          productName: '智能膜环',
+          installer: '王建国',
+          planQuantity: 3500,
+          completedQuantity: 3500,
+          installStartTime: '2024-10-01',
+          expectedEndTime: '2024-10-25',
+          actualEndTime: '2024-10-23',
+          planDays: 25,
+          actualDays: 23,
+          completionRate: 109,
+          personCount: 1820
+        },
+        {
+          customerName: '云牧场',
+          productName: '精准阉割',
+          installer: '李明',
+          planQuantity: 2800,
+          completedQuantity: 2800,
+          installStartTime: '2024-09-15',
+          expectedEndTime: '2024-10-05',
+          actualEndTime: '2024-10-08',
+          planDays: 21,
+          actualDays: 24,
+          completionRate: 88,
+          personCount: 1550
+        },
+        {
+          customerName: '宝塔牧场二场',
+          productName: '佳沃评分',
+          installer: '张伟',
+          planQuantity: 1800,
+          completedQuantity: 1800,
+          installStartTime: '2024-09-10',
+          expectedEndTime: '2024-09-30',
+          actualEndTime: '2024-09-28',
+          planDays: 21,
+          actualDays: 19,
+          completionRate: 111,
+          personCount: 1680
+        },
+        {
+          customerName: '五河牧场',
+          productName: '智能喷淋',
+          installer: '刘强',
+          planQuantity: 2500,
+          completedQuantity: 2500,
+          installStartTime: '2024-08-20',
+          expectedEndTime: '2024-09-10',
+          actualEndTime: '2024-09-10',
+          planDays: 22,
+          actualDays: 22,
+          completionRate: 100,
+          personCount: 1450
+        },
+        {
+          customerName: '和祥牧场',
+          productName: '智能称重',
+          installer: '赵四',
+          planQuantity: 3200,
+          completedQuantity: 3200,
+          installStartTime: '2024-09-05',
+          expectedEndTime: '2024-09-25',
+          actualEndTime: '2024-09-22',
+          planDays: 21,
+          actualDays: 18,
+          completionRate: 117,
+          personCount: 1900
+        },
+        {
+          customerName: '现代牧业四场',
+          productName: '智能膜环',
+          installer: '孙立',
+          planQuantity: 4200,
+          completedQuantity: 4200,
+          installStartTime: '2024-08-15',
+          expectedEndTime: '2024-09-15',
+          actualEndTime: '2024-09-18',
+          planDays: 32,
+          actualDays: 35,
+          completionRate: 91,
+          personCount: 1650
+        },
+        {
+          customerName: '金牛牧场',
+          productName: '体况评分',
+          installer: '周强',
+          planQuantity: 2800,
+          completedQuantity: 2800,
+          installStartTime: '2024-09-20',
+          expectedEndTime: '2024-10-10',
+          actualEndTime: '2024-10-08',
+          planDays: 21,
+          actualDays: 19,
+          completionRate: 111,
+          personCount: 1580
+        },
+        {
+          customerName: '双峰牧场',
+          productName: '智能喷淋',
+          installer: '吴勇',
+          planQuantity: 3600,
+          completedQuantity: 3600,
+          installStartTime: '2024-10-01',
+          expectedEndTime: '2024-10-25',
+          actualEndTime: '2024-10-28',
+          planDays: 25,
+          actualDays: 28,
+          completionRate: 89,
+          personCount: 1750
+        }
+      ]
+    }
+  },
+  computed: {
+    displayData() {
+      return this.isExpanded ? this.tableData : this.tableData.slice(0, 10)
+    }
+  },
+  created() {
+    this.initFilterOptions()
+  },
+  methods: {
+    initFilterOptions() {
+      // 初始化货品选项
+      const products = [...new Set(this.tableData.map(item => item.productName))]
+      this.productOptions = products.map(product => ({
+        label: product,
+        value: product
+      }))
+
+      // 初始化月份选项
+      const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
+      this.monthOptions = months.map((month, index) => ({
+        label: month,
+        value: index + 1
+      }))
+
+      // 初始化人员选项
+      const personnel = [...new Set(this.tableData.map(item => item.installer))]
+      this.personnelOptions = personnel.map(person => ({
+        label: person,
+        value: person
+      }))
+
+      // 初始化客户选项
+      const customers = [...new Set(this.tableData.map(item => item.customerName))]
+      this.customerOptions = customers.map(customer => ({
+        label: customer,
+        value: customer
+      }))
+    },
+    handleFilterChange() {
+      // 处理筛选条件变化
+      console.log('Filter changed:', {
+        product: this.productFilter,
+        month: this.monthFilter,
+        personnel: this.personnelFilter,
+        customer: this.customerFilter
+      })
+    },
+    getWorkDaysColor(row) {
+      if (row.actualDays > row.planDays) {
+        return '#F56C6C'  // 红色
+      } else if (row.actualDays < row.planDays) {
+        return '#67C23A'  // 绿色
+      }
+      return '#409EFF'  // 蓝色
+    },
+    getCompletionRateColor(row) {
+      if (row.completionRate < 100) {
+        return '#F56C6C'  // 红色
+      } else if (row.completionRate > 100) {
+        return '#67C23A'  // 绿色
+      }
+      return '#409EFF'  // 蓝色
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.box-card {
+  margin-top: 20px;
+}
+
+.header-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.header-title {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+
+  .update-time {
+    color: #666;
+  }
+}
+
+.filter-section {
+  display: flex;
+  gap: 10px;
+
+  .el-select {
+    width: 120px;
+  }
+}
+
+.expand-button {
+  text-align: center;
+  border-top: 1px solid #EBEEF5;
+  margin-top: -1px;
+  
+  .el-button {
+    font-size: 13px;
+    color: #909399;
+    padding: 8px;
+    
+    .button-content {
+      display: inline-flex;
+      align-items: center;
+      position: relative;
+      
+      i {
+        font-size: 12px;
+        color: #C0C4CC;
+        transition: all 0.3s;
+      }
+
+      .expand-text {
+        max-width: 0;
+        overflow: hidden;
+        white-space: nowrap;
+        transition: all 0.3s ease-in-out;
+        opacity: 0;
+      }
+    }
+    
+    &:hover {
+      color: #409EFF;
+      
+      .button-content {
+        i {
+          color: #409EFF;
+          margin-right: 4px;
+        }
+
+        .expand-text {
+          max-width: 100px;
+          opacity: 1;
+        }
+      }
+    }
+  }
+}
+
+:deep(.el-table) {
+  font-size: 12px;
+  
+  .el-table__header th {
+    padding: 8px 0;
+    background-color: #f5f7fa;
+  }
+  
+  .el-table__body td {
+    padding: 8px 0;
+    background-color: #fff;
+  }
+
+  // 添加表格行的hover效果
+  .el-table__body tr:hover > td {
+    background-color: #f5f7fa !important;
+  }
+}
+
+// 添加表格内容的过渡效果
+:deep(.el-table__body-wrapper) {
+  transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+</style> 

src/views/productManagement/installationCompletedSummary/index.vue

@@ -0,0 +1,154 @@
+<template>
+  <div class="app-container">
+    <!-- 顶部标题栏 -->
+    <div class="page-header">
+      <div class="page-title">服务汇总</div>
+      <div class="page-time">时间：{{ currentTime }}</div>
+    </div>
+
+    <!-- 已安装统计表格 -->
+    <installation-statistics :update-time="updateTime" />
+  </div>
+</template>
+
+<script>
+import InstallationStatistics from "./components/InstallationStatistics.vue";
+import { GetDataByName, GetDataByNames } from "@/api/common";
+
+export default {
+  name: "InstallationSummary",
+  components: {
+    InstallationStatistics,
+  },
+  data() {
+    return {
+      currentTime: "",
+      updateTime: "",
+      dialogVisible: false,
+      tableData: [],
+      unassignedOrders: [],
+      chartData: {
+        labels: [
+          "智能膜环",
+          "智能喷淋",
+          "精准阉割",
+          "奶牛称重",
+          "车载控制器",
+          "大屏",
+        ],
+        datasets: [
+          {
+            label: "计划量",
+            data: [900, 850, 900, 700, 500, 30],
+            backgroundColor: "#409EFF",
+            order: 2,
+          },
+          {
+            label: "完成量",
+            data: [800, 820, 850, 680, 200, 20],
+            backgroundColor: "#FF9F43",
+            order: 2,
+          },
+          {
+            label: "完成率",
+            data: [88.9, 96.5, 94.4, 97.1, 40.0, 66.7],
+            type: "line",
+            borderColor: "#67C23A",
+            borderWidth: 2,
+            fill: false,
+            yAxisID: "percentage",
+            order: 1,
+          },
+        ],
+      },
+    };
+  },
+  created() {
+    this.getTableData();
+    setInterval(this.updateCurrentTime, 1000);
+    this.updateCurrentTime();
+    this.getUpdateTime();
+  },
+  methods: {
+    updateCurrentTime() {
+      const now = new Date();
+      const year = now.getFullYear();
+      const month = (now.getMonth() + 1).toString().padStart(2, "0");
+      const day = now.getDate().toString().padStart(2, "0");
+      const hours = now.getHours().toString().padStart(2, "0");
+      const minutes = now.getMinutes().toString().padStart(2, "0");
+      const seconds = now.getSeconds().toString().padStart(2, "0");
+      this.currentTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+    },
+    async getUpdateTime() {
+      try {
+        const now = new Date();
+        const month = (now.getMonth() + 1).toString().padStart(2, "0");
+        const day = now.getDate().toString().padStart(2, "0");
+        const hours = now.getHours().toString().padStart(2, "0");
+        const minutes = now.getMinutes().toString().padStart(2, "0");
+        const seconds = now.getSeconds().toString().padStart(2, "0");
+
+        this.updateTime = `${month}/${day} ${hours}:${minutes}:${seconds}更新`;
+      } catch (error) {
+        console.error("获取更新时间失败:", error);
+      }
+    },
+    async getTableData() {
+      const send_select_list = {
+        name: "getInstallOrderOverview",
+        offset: 0,
+        pagecount: 0,
+        parammaps: {},
+      };
+      try {
+        console.log("获取安装概况表格数据");
+        const response = await GetDataByName(send_select_list);
+        this.tableData = response.data.list || [];
+      } catch (error) {
+        console.error("获取表格数据失败:", error);
+        this.$message.error("获取表格数据失败");
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.page-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px 24px;
+  background: #fff;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05);
+  margin-bottom: 24px;
+  border-radius: 8px;
+  transition: all 0.3s ease;
+
+  .page-title {
+    font-size: 20px;
+    font-weight: 600;
+    color: #1f2d3d;
+    position: relative;
+    padding-left: 16px;
+
+    &::before {
+      content: "";
+      position: absolute;
+      left: 0;
+      top: 50%;
+      transform: translateY(-50%);
+      width: 4px;
+      height: 22px;
+      background: #409eff;
+      border-radius: 4px;
+    }
+  }
+
+  .page-time {
+    color: #606266;
+    font-size: 14px;
+  }
+}
+</style>

src/views/productManagement/installationSummary/components/InstallationTable.vue

@@ -19,46 +19,74 @@
     <div class="table-container">
       <el-table
         v-loading="loading"
-        :data="displayData"
+        :data="tableData"
         style="width: 100%"
         border
         size="small"
+        :height="tableData.length > 10 ? 450 : null"
+        :header-cell-style="{ background: '#f5f7fa' }"
         @sort-change="handleSortChange"
       >
         <el-table-column
           prop="customerName"
           label="客户名称"
-          min-width="110"
+          min-width="150"
           align="center"
           sortable="custom"
         />
         <el-table-column
-          prop="productName"
-          label="安装货品"
+          prop="projectName"
+          label="项目名称"
           min-width="110"
           align="center"
           sortable="custom"
         />
         <el-table-column
-          prop="installer"
-          label="安装人员"
-          width="100"
+          prop="goodsName"
+          label="货品名称"
+          min-width="110"
           align="center"
+          sortable="custom"
         />
         <el-table-column
-          prop="status"
+          prop="serviceStaffNames"
+          label="服务人员"
+          width="150"
+          align="center"
+        >
+          <template slot-scope="scope">
+            <div class="product-tags">
+              <template v-if="scope.row.serviceStaffNames">
+                <el-tag
+                  v-for="(item, index) in scope.row.serviceStaffNames.split(
+                    ','
+                  )"
+                  :key="index"
+                  size="mini"
+                  :type="['success', 'warning', 'danger', 'primary'][index % 4]"
+                  effect="light"
+                  :class="{ 'long-text': item.length > 10 }"
+                >
+                  {{ item }}
+                </el-tag>
+              </template>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="statusName"
           label="单据状态"
-          width="100"
+          width="110"
           align="center"
           sortable="custom"
         >
           <template slot-scope="scope">
             <el-tag
-              :type="getStatusType(scope.row.status)"
+              :type="getStatusType(scope.row.statusName)"
               size="mini"
               effect="plain"
             >
-              {{ scope.row.status }}
+              {{ scope.row.statusName }}
             </el-tag>
           </template>
         </el-table-column>
@@ -77,22 +105,22 @@
                     <div
                       class="progress-inner"
                       :style="{
-                        width:
-                          Math.round(
-                            (scope.row.progress / scope.row.total) * 100
-                          ) + '%',
-                        backgroundColor: getProgressColor(scope.row.status),
+                        width: Math.round(scope.row.rate) + '%',
+                        backgroundColor: getProgressColor(scope.row.statusName),
                       }"
                     >
-                      <span class="progress-text" v-if="scope.row.progress > 0">
-                        {{ scope.row.progress }}
+                      <span
+                        class="progress-text"
+                        v-if="scope.row.shippedQuantity > 0"
+                      >
+                        {{ scope.row.shippedQuantity }}
                       </span>
                     </div>
                     <span class="total-text">
                       {{
-                        scope.row.progress === 0
-                          ? scope.row.total
-                          : scope.row.total
+                        scope.row.rate === 0
+                          ? scope.row.orderQuantity
+                          : scope.row.orderQuantity
                       }}
                     </span>
                   </div>
@@ -101,35 +129,35 @@
             </div>
           </template>
         </el-table-column>
+        <el-table-column prop="orderQuantity" label="计划量" align="center" />
         <el-table-column
-          prop="total"
-          label="计划量"
-          width="85"
+          prop="shippedQuantity"
+          label="已完成量"
           align="center"
         />
         <el-table-column
-          prop="finished"
-          label="已完成量"
-          width="85"
+          prop="unshippedQuantity"
+          label="未完成量"
           align="center"
         />
         <el-table-column
-          prop="unfinished"
-          label="未完成量"
-          width="85"
+          prop="yesterdayFinished"
+          label="昨日完成量"
+          align="center"
+        />
+        <el-table-column
+          prop="todayFinished"
+          label="今日完成量"
           align="center"
         />
         <el-table-column
           prop="rate"
           label="完成率"
-          width="100"
           align="center"
           sortable="custom"
         >
           <template slot-scope="scope">
-            {{
-              ((scope.row.finished / scope.row.total) * 100).toFixed(1) + "%"
-            }}
+            {{ parseInt(scope.row.rate) + "%" }}
           </template>
         </el-table-column>
         <el-table-column
@@ -139,37 +167,30 @@
           align="center"
         >
           <template slot-scope="scope">
-            <span
-              :style="{ color: scope.row.remainingDays < 0 ? '#F56C6C' : '' }"
+            <template
+              v-if="
+                scope.row.remainingTime !== null &&
+                scope.row.remainingTime !== undefined
+              "
             >
-              {{
-                scope.row.remainingDays > 0
-                  ? scope.row.remainingDays + "天"
-                  : "超期" + Math.abs(scope.row.remainingDays) + "天"
-              }}
-            </span>
+              <span
+                :class="{
+                  'normal-time': scope.row.remainingTime > 3,
+                  'warning-time':
+                    scope.row.remainingTime >= 0 &&
+                    scope.row.remainingTime <= 3,
+                  'overdue-time': scope.row.remainingTime < 0,
+                }"
+              >
+                <template v-if="scope.row.remainingTime < 0">
+                  已逾期 {{ Math.abs(scope.row.remainingTime) }} 天
+                </template>
+                <template v-else> {{ scope.row.remainingTime }} 天 </template>
+              </span>
+            </template>
           </template>
         </el-table-column>
       </el-table>
-      <div
-        class="expand-button"
-        v-if="
-          (tableData.length > 0 ? tableData.length : defaultData.length) > 10
-        "
-      >
-        <el-button
-          type="text"
-          @click="isExpanded = !isExpanded"
-          class="expand-btn"
-        >
-          <div class="button-content">
-            <i :class="['el-icon-arrow-' + (isExpanded ? 'up' : 'down')]"></i>
-            <span class="expand-text">{{
-              isExpanded ? "收起" : "展开更多"
-            }}</span>
-          </div>
-        </el-button>
-      </div>
     </div>
   </el-card>
 </template>
@@ -199,151 +220,7 @@ export default {
         order: "", // 排序的方向
       },
       // 示例数据
-      defaultData: [
-        {
-          customerName: "现代牧业二场",
-          productName: "智能膜环",
-          installer: "张明星",
-          status: "进行中",
-          progress: 900,
-          total: 4000,
-          finished: 900,
-          unfinished: 3100,
-          remainingDays: 7,
-        },
-        {
-          customerName: "现代牧业和林",
-          productName: "精准阉割",
-          installer: "陈希多",
-          status: "进行中",
-          progress: 170,
-          total: 350,
-          finished: 170,
-          unfinished: 180,
-          remainingDays: 8,
-        },
-        {
-          customerName: "现代牧业三场",
-          productName: "精准阉割",
-          installer: "李九联",
-          status: "已完成",
-          progress: 200,
-          total: 200,
-          finished: 200,
-          unfinished: 0,
-          remainingDays: 3,
-        },
-        {
-          customerName: "蜂谷牧场",
-          productName: "佳沃评分",
-          installer: "李季冬",
-          status: "已超期",
-          progress: 70,
-          total: 150,
-          finished: 70,
-          unfinished: 80,
-          remainingDays: -5,
-        },
-        {
-          customerName: "海丰牧场",
-          productName: "佳沃评分",
-          installer: "谭性成",
-          status: "进行中",
-          progress: 1,
-          total: 30,
-          finished: 1,
-          unfinished: 29,
-          remainingDays: 10,
-        },
-        {
-          customerName: "大丰牧场",
-          productName: "精准阉割",
-          installer: "柯凡",
-          status: "未开始",
-          progress: 0,
-          total: 50,
-          finished: 0,
-          unfinished: 50,
-          remainingDays: 20,
-        },
-        {
-          customerName: "马鞍山牧场",
-          productName: "智能膜环",
-          installer: "郑福超",
-          status: "进行中",
-          progress: 200,
-          total: 500,
-          finished: 200,
-          unfinished: 300,
-          remainingDays: 5,
-        },
-        {
-          customerName: "新希望",
-          productName: "显示大屏",
-          installer: "韩佳维",
-          status: "进行中",
-          progress: 20,
-          total: 30,
-          finished: 20,
-          unfinished: 10,
-          remainingDays: 10,
-        },
-        {
-          customerName: "泰安牧场",
-          productName: "智能膜环",
-          installer: "王建国",
-          status: "已完成",
-          progress: 300,
-          total: 300,
-          finished: 300,
-          unfinished: 0,
-          remainingDays: 2,
-        },
-        {
-          customerName: "云牧场",
-          productName: "精准阉割",
-          installer: "李明",
-          status: "已超期",
-          progress: 150,
-          total: 400,
-          finished: 150,
-          unfinished: 250,
-          remainingDays: -3,
-        },
-        {
-          customerName: "宝塔牧场",
-          productName: "佳沃评分",
-          installer: "张伟",
-          status: "进行中",
-          progress: 80,
-          total: 200,
-          finished: 80,
-          unfinished: 120,
-          remainingDays: 15,
-        },
-        {
-          customerName: "五河牧场",
-          productName: "智能喷淋",
-          installer: "刘强",
-          status: "未开始",
-          progress: 0,
-          total: 100,
-          finished: 0,
-          unfinished: 100,
-          remainingDays: 12,
-        },
-        {
-          customerName: "和祥牧场",
-          productName: "智能称重",
-          installer: "赵四",
-          status: "进行中",
-          progress: 50,
-          total: 150,
-          finished: 50,
-          unfinished: 100,
-          remainingDays: 8,
-        },
-      ],
+      defaultData: [],
     };
   },
   computed: {
@@ -381,50 +258,30 @@ export default {
     this.initData();
   },
   methods: {
-    getStatusType(status) {
-      switch (status) {
-        case "进行中":
-          return "primary";
-        case "已完成":
-          return "success";
-        case "已超期":
-          return "danger";
-        case "未开始":
-          return "info";
-        default:
-          return "info";
-      }
+    getStatusType(statusName) {
+      const statusMap = {
+        未接单: "info",
+        处理中: "primary",
+        已完成: "success",
+        已完成未验收: "warning",
+        接单驳回: "danger",
+      };
+      return statusMap[statusName] || "info";
     },
-    getProgressColor(status) {
-      switch (status) {
-        case "进行中":
-          return "#409EFF";
-        case "已完成":
-          return "#67C23A";
-        case "已超期":
-          return "#F56C6C";
-        case "未开始":
-          return "#909399";
-        default:
-          return "#909399";
-      }
+    getProgressColor(statusName) {
+      // 根据状态返回对应的颜色
+      const statusColorMap = {
+        未接单: "#909399", // 灰色
+        处理中: "#409eff", // 蓝色
+        已完成未验收: "#e6a23c", // 橙色
+        已完成: "#67c23a", // 绿色
+        接单驳回: "#f56c6c", // 红色
+      };
+
+      return statusColorMap[statusName] || "#909399";
     },
     async initData() {
-      try {
-        this.loading = true;
-        // TODO: 后端接口完成后替换此处
-        // const { data: installationData } = await getInstallationList()
-        // this.localTableData = installationData
-
-        // 模拟接口调用
-        await new Promise((resolve) => setTimeout(resolve, 500));
-        this.localTableData = this.defaultData;
-      } catch (error) {
-        console.error("初始化数据失败:", error);
-        this.$message.error("获取数据失败");
-      } finally {
-        this.loading = false;
-      }
+      this.defaultData = this.tableData;
     },
     handleSortChange({ prop, order }) {
       this.sortConfig = { prop, order };
@@ -442,53 +299,53 @@ export default {
   position: relative;
 }
 
-.expand-button {
-  text-align: center;
-  border-top: 1px solid #ebeef5;
-  margin-top: -1px;
-
-  .el-button {
-    font-size: 13px;
-    color: #909399;
-    padding: 8px;
-
-    .button-content {
-      display: inline-flex;
-      align-items: center;
-      position: relative;
-
-      i {
-        font-size: 12px;
-        color: #c0c4cc;
-        transition: all 0.3s;
-      }
+// .expand-button {
+//   text-align: center;
+//   border-top: 1px solid #ebeef5;
+//   margin-top: -1px;
 
-      .expand-text {
-        max-width: 0;
-        overflow: hidden;
-        white-space: nowrap;
-        transition: all 0.3s ease-in-out;
-        opacity: 0;
-      }
-    }
+//   .el-button {
+//     font-size: 13px;
+//     color: #909399;
+//     padding: 8px;
 
-    &:hover {
-      color: #409eff;
+//     .button-content {
+//       display: inline-flex;
+//       align-items: center;
+//       position: relative;
 
-      .button-content {
-        i {
-          color: #409eff;
-          margin-right: 4px;
-        }
+//       i {
+//         font-size: 12px;
+//         color: #c0c4cc;
+//         transition: all 0.3s;
+//       }
 
-        .expand-text {
-          max-width: 100px;
-          opacity: 1;
-        }
-      }
-    }
-  }
-}
+//       .expand-text {
+//         max-width: 0;
+//         overflow: hidden;
+//         white-space: nowrap;
+//         transition: all 0.3s ease-in-out;
+//         opacity: 0;
+//       }
+//     }
+
+//     &:hover {
+//       color: #409eff;
+
+//       .button-content {
+//         i {
+//           color: #409eff;
+//           margin-right: 4px;
+//         }
+
+//         .expand-text {
+//           max-width: 100px;
+//           opacity: 1;
+//         }
+//       }
+//     }
+//   }
+// }
 
 .progress-wrapper {
   padding: 6px 0;
@@ -547,6 +404,12 @@ export default {
 :deep(.el-table) {
   font-size: 12px;
 
+  .el-table__header-wrapper {
+    position: sticky;
+    top: 0;
+    z-index: 1;
+  }
+
   .el-table__header th {
     padding: 8px 0;
     background-color: #f5f7fa;
@@ -562,6 +425,39 @@ export default {
   }
 }
 
+:deep(.el-table__body-wrapper) {
+  overflow-y: auto;
+  &::-webkit-scrollbar {
+    width: 6px;
+    height: 6px;
+  }
+  &::-webkit-scrollbar-thumb {
+    border-radius: 3px;
+    background: #c0c4cc;
+  }
+  &::-webkit-scrollbar-track {
+    border-radius: 3px;
+    background: #f5f7fa;
+  }
+}
+
+:deep(.normal-time) {
+  color: #606266;
+  font-size: 13px;
+}
+
+:deep(.warning-time) {
+  color: #f56c6c;
+  font-size: 15px;
+  font-weight: bold;
+}
+
+:deep(.overdue-time) {
+  color: #f56c6c;
+  font-size: 15px;
+  font-weight: bold;
+}
+
 // 添加表格内容的过渡效果
 :deep(.el-table__body-wrapper) {
   transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);

src/views/productManagement/installationSummary/components/StatisticsPanel.vue

@@ -5,7 +5,12 @@
         <svg-icon :icon-class="item.icon" class="icon" />
       </div>
       <div class="stat-info">
-        <count-to :start-val="0" :end-val="item.value" :duration="2000" class="num"/>
+        <count-to
+          :start-val="0"
+          :end-val="item.value"
+          :duration="2000"
+          class="num"
+        />
         <div class="text">{{ item.text }}</div>
       </div>
     </div>
@@ -13,75 +18,50 @@
 </template>
 
 <script>
-import CountTo from 'vue-count-to'
-// import { getStatisticsData } from '@/api/installation' // 后续需要添加此API
+import CountTo from "vue-count-to";
+import { GetDataByName, GetDataByNames } from "@/api/common";
 
 export default {
-  name: 'StatisticsPanel',
+  name: "StatisticsPanel",
   components: {
-    CountTo
+    CountTo,
   },
   data() {
     return {
-      // 示例数据作为默认值
-      defaultData: [
-        { icon: 'order-total', value: 20, text: '本月总订单' },
-        { icon: 'order-produced', value: 5, text: '本月已安装订单' },
-        { icon: 'order-producing', value: 8, text: '正在安装订单' },
-        { icon: 'order-unproduced', value: 7, text: '未安装订单' },
-        { icon: 'order-total-count', value: 1000, text: '订单总量' },
-        { icon: 'order-completed', value: 5000, text: '已完成量' },
-        { icon: 'order-uncompleted', value: 5000, text: '未完成量' }
-      ],
-      statisticsData: []
-    }
+      statisticsData: [],
+    };
   },
   created() {
     // 初始化时获取数据
-    this.initData()
-    // 每隔5分钟刷新一次数据
-    this.startDataRefresh()
+    this.initData();
   },
   beforeDestroy() {
     // 组件销毁前清除定时器
     if (this.refreshTimer) {
-      clearInterval(this.refreshTimer)
+      clearInterval(this.refreshTimer);
     }
   },
   methods: {
     async initData() {
+      const send_select_list = [
+        {
+          name: "getStatisticsPanelNumsOfInstall",
+          offset: 0,
+          pagecount: 0,
+          parammaps: {},
+        },
+      ];
       try {
-        // 先使用示例数据
-        this.statisticsData = this.defaultData
-        // 获取后端数据
-        await this.fetchData()
-      } catch (error) {
-        console.error('初始化统计数据失败:', error)
-      }
-    },
-    async fetchData() {
-      try {
-        // TODO: 后端接口完成后替换此处
-        // const { data } = await getStatisticsData()
-        // this.statisticsData = data
-        
-        // 模拟接口调用
-        await new Promise(resolve => setTimeout(resolve, 1000))
-        // 这里暂时使用示例数据，后续替换为实际接口数据
-        this.statisticsData = this.defaultData
+        const response = await GetDataByNames(send_select_list);
+        this.statisticsData =
+          response.data.getStatisticsPanelNumsOfInstall.list || [];
       } catch (error) {
-        console.error('获取统计数据失败:', error)
-        this.$message.error('获取统计数据失败')
+        console.error("获取数据失败:", error);
+        throw error;
       }
     },
-    startDataRefresh() {
-      // 每5分钟刷新一次数据
-      this.refreshTimer = setInterval(() => {
-        this.fetchData()
-      }, 5 * 60 * 1000)
-    }
-  }
-}
+  },
+};
 </script>
 
 <style lang="scss" scoped>
@@ -111,12 +91,12 @@ export default {
       .icon-wrapper {
         box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
         .icon {
-          color: #409EFF;
+          color: #409eff;
         }
       }
       .stat-info {
         .num {
-          color: #409EFF;
+          color: #409eff;
         }
       }
     }
@@ -167,4 +147,4 @@ export default {
     }
   }
 }
-</style> 
+</style>

src/views/productManagement/installationSummary/index.vue

@@ -9,7 +9,7 @@
     <!-- 顶部统计卡片 -->
     <statistics-panel />
 
-    <!-- 安装概况表格 -->
+    <!-- 服务概况表格 -->
     <installation-table
       :table-data="tableData"
       :update-time="updateTime"
@@ -18,10 +18,10 @@
     />
 
     <!-- 已安装统计表格 -->
-    <installation-statistics :update-time="updateTime" />
+    <!-- <installation-statistics :update-time="updateTime" /> -->
 
     <!-- 货品安装情况 -->
-    <installation-status-chart @filter-change="handleFilterChange" />
+    <!-- <installation-status-chart @filter-change="handleFilterChange" /> -->
   </div>
 </template>
 
@@ -30,6 +30,7 @@ import StatisticsPanel from "./components/StatisticsPanel";
 import InstallationTable from "./components/InstallationTable";
 import InstallationStatusChart from "./components/InstallationStatusChart";
 import InstallationStatistics from "./components/InstallationStatistics.vue";
+import { GetDataByName, GetDataByNames } from "@/api/common";
 
 export default {
   name: "InstallationSummary",
@@ -86,7 +87,7 @@ export default {
     this.updateCurrentTime();
     setInterval(this.updateCurrentTime, 1000);
     this.getUpdateTime();
-    setInterval(this.getUpdateTime, 60000);
+    // setInterval(this.getUpdateTime, 60000);
     this.getTableData();
   },
   methods: {
@@ -107,7 +108,8 @@ export default {
         const day = now.getDate().toString().padStart(2, "0");
         const hours = now.getHours().toString().padStart(2, "0");
         const minutes = now.getMinutes().toString().padStart(2, "0");
-        this.updateTime = `${month}/${day} ${hours}:${minutes}更新`;
+        const seconds = now.getSeconds().toString().padStart(2, "0");
+        this.updateTime = `${month}/${day} ${hours}:${minutes}:${seconds}更新`;
       } catch (error) {
         console.error("获取更新时间失败:", error);
       }
@@ -128,8 +130,17 @@ export default {
       console.log("进度条被点击:", row);
     },
     async getTableData() {
+      const send_select_list = {
+        name: "getInstallOrderOverview",
+        offset: 0,
+        pagecount: 0,
+        parammaps: {},
+      };
       try {
         console.log("获取安装概况表格数据");
+
+        const response = await GetDataByName(send_select_list);
+        this.tableData = response.data.list || [];
       } catch (error) {
         console.error("获取表格数据失败:", error);
         this.$message.error("获取表格数据失败");

src/views/productManagement/productionSummary/components/DeliveryStatusTable.vue

@@ -52,7 +52,15 @@
         :height="displayData.length > 10 ? 450 : null"
         :header-cell-style="{ background: '#f5f7fa' }"
       >
-        <el-table-column type="index" label="序号" width="50" align="center" />
+        <el-table-column type="index" label="序号" width="50" align="center">
+          <template slot-scope="scope">
+            <span>{{
+              scope.$index +
+              (queryParams.pageNum - 1) * queryParams.pageSize +
+              1
+            }}</span>
+          </template>
+        </el-table-column>
         <el-table-column
           prop="deliveryStatusName"
           label="发货状态"
@@ -116,22 +124,40 @@
           </template>
         </el-table-column>
       </el-table>
+
+      <!-- 添加分页组件 -->
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        :page-sizes="[10, 20, 50, 100]"
+        :auto-scroll="false"
+        @pagination="handlePagination"
+      />
     </div>
   </el-card>
 </template>
 
 <script>
 import { GetDataByName, GetDataByNames } from "@/api/common";
+import Pagination from "@/components/Pagination";
 
 export default {
   name: "DeliveryStatusTable",
+  components: {
+    Pagination,
+  },
   data() {
     return {
       loading: false,
       updateTime: "",
+      total: 0,
       queryParams: {
         status: "未发货",
         customerName: "",
+        pageNum: 1,
+        pageSize: 10,
       },
       defaultData: [],
     };
@@ -177,6 +203,10 @@ export default {
     async fetchTableData() {
       const params = {
         name: "getContractDeliveryStatus",
+        page: this.queryParams.pageNum,
+        offset: this.queryParams.pageNum,
+        pagecount: this.queryParams.pageSize,
+        returntype: "Map",
         parammaps: {
           statusName: this.queryParams.status || "",
           customerName: this.queryParams.customerName || "",
@@ -187,6 +217,7 @@ export default {
         const response = await GetDataByName(params);
         if (response && response.data) {
           this.defaultData = response.data.list || [];
+          this.total = response.data.total || 0;
         } else {
           throw new Error("接口返回数据格式错误");
         }
@@ -196,6 +227,7 @@ export default {
       }
     },
     async handleFilter() {
+      this.queryParams.pageNum = 1;
       this.loading = true;
       try {
         await this.fetchTableData();
@@ -205,6 +237,18 @@ export default {
         this.loading = false;
       }
     },
+    async handlePagination(val) {
+      this.loading = true;
+      try {
+        this.queryParams.pageNum = val.page;
+        this.queryParams.pageSize = val.limit;
+        await this.fetchTableData();
+      } catch (error) {
+        this.$message.error("获取数据失败：" + error.message);
+      } finally {
+        this.loading = false;
+      }
+    },
   },
 };
 </script>

src/views/productManagement/productionSummary/components/OrderProductionTable.vue

@@ -20,7 +20,6 @@
         size="small"
         :height="localTableData.length > 10 ? 450 : null"
         :header-cell-style="{ background: '#f5f7fa' }"
-        @sort-change="handleSortChange"
       >
         <el-table-column type="index" label="序号" width="50" align="center" />
         <el-table-column
@@ -34,7 +33,7 @@
           label="货品名称"
           min-width="110"
           align="center"
-          sortable="custom"
+          sortable
         />
         <el-table-column
           prop="process"
@@ -47,7 +46,7 @@
           label="单据状态"
           width="100"
           align="center"
-          sortable="custom"
+          sortable
         >
           <template slot-scope="scope">
             <el-tag
@@ -64,7 +63,7 @@
           label="进度"
           width="250"
           align="center"
-          sortable="custom"
+          sortable
         >
           <template slot-scope="scope">
             <div
@@ -148,7 +147,7 @@
           label="完成率"
           width="100"
           align="center"
-          sortable="custom"
+          sortable
         >
           <template slot-scope="scope">
             {{
@@ -174,14 +173,16 @@
           <template slot-scope="scope">
             <span
               :style="{
-                color: scope.row.remainingTime < 0 ? '#F56C6C' : '',
-                'font-size': scope.row.remainingTime < 0 ? 'larger' : null,
+                color: scope.row.remainingTime < 3 ? '#F56C6C' : '',
+                'font-size': scope.row.remainingTime < 3 ? 'larger' : null,
               }"
             >
               {{
-                scope.row.remainingTime > 0
-                  ? scope.row.remainingTime + "天"
-                  : "超期" + (Math.abs(scope.row.remainingTime) || "") + "天"
+                scope.row.remainingTime
+                  ? scope.row.remainingTime >= 0
+                    ? scope.row.remainingTime + "天"
+                    : "超期" + (Math.abs(scope.row.remainingTime) || "") + "天"
+                  : ""
               }}
             </span>
           </template>
@@ -200,11 +201,8 @@ export default {
     return {
       loading: false,
       localTableData: [],
-      sortConfig: {
-        prop: "",
-        order: "",
-      },
       tooltip: null,
+      tooltipTimeout: null,
     };
   },
   props: {
@@ -213,49 +211,21 @@ export default {
       required: true,
     },
   },
-  computed: {
-    tableData() {
-      let data = this.localTableData.length;
-
-      if (this.sortConfig.prop && this.sortConfig.order) {
-        const { prop, order } = this.sortConfig;
-        data = data.sort((a, b) => {
-          let aValue = a[prop];
-          let bValue = b[prop];
-
-          if (prop === "rate") {
-            aValue = (a.finished / a.total) * 100;
-            bValue = (b.finished / b.total) * 100;
-          }
-
-          return order === "ascending"
-            ? aValue > bValue
-              ? 1
-              : -1
-            : aValue < bValue
-            ? 1
-            : -1;
-        });
-      }
-
-      return data;
-    },
-  },
   created() {
     this.initData();
   },
   methods: {
     getStatusType(status) {
       switch (status) {
-        case "已完成":
+        case "生产完成":
           return "success";
-        case "接单驳回":
+        case "待生产":
           return "warning";
         case "生产中":
           return "primary";
-        case "已超期":
+        case "已关单":
           return "danger";
-        case "待接单":
+        case "未生产":
           return "info";
         default:
           return "info";
@@ -263,16 +233,16 @@ export default {
     },
     getProgressColor(status) {
       switch (status) {
-        case "已完成":
+        case "生产完成":
           return "#67C23A";
-        case "接单驳回":
-          return "#E6A23C";
+        case "未生产":
+          return "#909399";
         case "生产中":
           return "#409EFF";
-        case "已超期":
+        case "已关单":
           return "#F56C6C";
-        case "待接单":
-          return "#909399";
+        case "待生产":
+          return "#E6A23C";
         default:
           return "#909399";
       }
@@ -309,10 +279,11 @@ export default {
         this.loading = false;
       }
     },
-    handleSortChange({ prop, order }) {
-      this.sortConfig = { prop, order };
-    },
     showTooltip(event, percentage) {
+      // 清除之前的tooltip和定时器
+      this.hideTooltip();
+
+      // 创建新的tooltip
       this.tooltip = document.createElement("div");
       this.tooltip.className = "progress-tooltip";
       this.tooltip.textContent = percentage + "%";
@@ -326,24 +297,46 @@ export default {
         rect.left + rect.width / 2 - tooltipRect.width / 2 + "px";
       this.tooltip.style.top = rect.top - tooltipRect.height - 8 + "px";
 
-      setTimeout(() => {
-        this.tooltip.classList.add("show");
-      }, 0);
+      // 使用 requestAnimationFrame 确保动画流畅
+      requestAnimationFrame(() => {
+        if (this.tooltip) {
+          this.tooltip.classList.add("show");
+        }
+      });
+
+      // 添加安全清理机制
+      this.tooltipTimeout = setTimeout(() => {
+        this.hideTooltip();
+      }, 3000); // 3秒后自动清理
     },
     hideTooltip() {
+      // 清除定时器
+      if (this.tooltipTimeout) {
+        clearTimeout(this.tooltipTimeout);
+        this.tooltipTimeout = null;
+      }
+
+      // 清除tooltip
       if (this.tooltip) {
         this.tooltip.classList.remove("show");
+        const tooltipToRemove = this.tooltip;
+
         setTimeout(() => {
-          if (this.tooltip && this.tooltip.parentNode) {
-            this.tooltip.parentNode.removeChild(this.tooltip);
+          if (tooltipToRemove && tooltipToRemove.parentNode) {
+            tooltipToRemove.parentNode.removeChild(tooltipToRemove);
           }
-          this.tooltip = null;
         }, 200);
+
+        this.tooltip = null;
       }
     },
   },
   beforeDestroy() {
+    // 组件销毁时清理所有相关资源
     this.hideTooltip();
+    if (this.tooltipTimeout) {
+      clearTimeout(this.tooltipTimeout);
+    }
   },
 };
 </script>

src/views/productManagement/productionSummary/components/ProductProductionTable.vue

@@ -20,7 +20,6 @@
         size="small"
         :height="localTableData.length > 10 ? 450 : null"
         :header-cell-style="{ background: '#f5f7fa' }"
-        @sort-change="handleSortChange"
       >
         <el-table-column type="index" label="序号" width="50" align="center" />
         <el-table-column
@@ -28,14 +27,21 @@
           label="货品名称"
           width="150"
           align="center"
-          sortable="custom"
+          sortable
+        />
+        <el-table-column
+          prop="model"
+          label="货品型号"
+          width="80"
+          align="center"
+          sortable
         />
         <el-table-column
           prop="orderStatus"
           label="货品状态"
           width="100"
           align="center"
-          sortable="custom"
+          sortable
         >
           <template slot-scope="scope">
             <el-tag
@@ -51,7 +57,8 @@
           prop="progress"
           label="进度"
           align="center"
-          sortable="custom"
+          width="250"
+          sortable
         >
           <template slot-scope="scope">
             <div
@@ -100,43 +107,28 @@
             </div>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="totalQuantity"
-          label="计划量"
-          width="100"
-          align="center"
-        />
+        <el-table-column prop="totalQuantity" label="计划量" align="center" />
         <el-table-column
           prop="installedQuantity"
           label="已完成量"
-          width="100"
           align="center"
         />
         <el-table-column
           prop="uninstalledQuantity"
           label="未完成量"
-          width="100"
           align="center"
         />
         <el-table-column
           prop="yesterdayQuantity"
           label="昨日完成量"
-          width="100"
           align="center"
         />
         <el-table-column
           prop="todayQuantity"
           label="今日完成量"
-          width="100"
           align="center"
         />
-        <el-table-column
-          prop="rate"
-          label="完成率"
-          width="100"
-          align="center"
-          sortable="custom"
-        >
+        <el-table-column prop="rate" label="完成率" align="center" sortable>
           <template slot-scope="scope">
             {{
               (
@@ -160,12 +152,8 @@ export default {
     return {
       loading: false,
       localTableData: [],
-      sortConfig: {
-        prop: "",
-        order: "",
-      },
-
       tooltip: null,
+      tooltipTimeout: null,
     };
   },
   props: {
@@ -174,24 +162,21 @@ export default {
       required: true,
     },
   },
-  computed: {
-    tableData() {},
-  },
   created() {
     this.initData();
   },
   methods: {
     getStatusType(status) {
       switch (status) {
-        case "已完成":
+        case "生产完成":
           return "success";
-        case "接单驳回":
+        case "待生产":
           return "warning";
-        case "接单驳回":
-          return "#E6A23C";
+        case "未生产":
+          return "info";
         case "生产中":
           return "primary";
-        case "已超期":
+        case "已关单":
           return "danger";
         case "未开始":
           return "info";
@@ -201,13 +186,15 @@ export default {
     },
     getProgressColor(status) {
       switch (status) {
-        case "已完成":
+        case "生产完成":
           return "#67C23A";
+        case "待生产":
+          return "#E6A23C";
         case "生产中":
           return "#409EFF";
-        case "已超期":
+        case "已关单":
           return "#F56C6C";
-        case "未开始":
+        case "未生产":
           return "#909399";
         default:
           return "#909399";
@@ -243,39 +230,17 @@ export default {
         this.loading = false;
       }
     },
-    handleSortChange({ prop, order }) {
-      this.sortConfig = { prop, order };
-      this.sortData();
-    },
-    sortData() {
-      const { prop, order } = this.sortConfig;
-      if (prop && order) {
-        this.localTableData.sort((a, b) => {
-          let aValue = a[prop];
-          let bValue = b[prop];
-
-          if (prop === "rate" || prop === "progress") {
-            aValue = (a.installedQuantity / a.totalQuantity) * 100;
-            bValue = (b.installedQuantity / b.totalQuantity) * 100;
-          } else if (prop === "goodsName" || prop === "orderStatus") {
-            aValue = aValue.toLowerCase();
-            bValue = bValue.toLowerCase();
-          }
-          console.log(prop, aValue, bValue);
-          return order === "ascending" ? aValue - bValue : bValue - aValue;
-        });
-      }
-    },
     showTooltip(event, percentage) {
-      // 创建tooltip元素
+      // 清除之前的tooltip和定时器
+      this.hideTooltip();
+
+      // 创建新的tooltip
       this.tooltip = document.createElement("div");
       this.tooltip.className = "progress-tooltip";
       this.tooltip.textContent = percentage + "%";
 
-      // 将tooltip添加到body
       document.body.appendChild(this.tooltip);
 
-      // 计算位置
       const rect = event.target.getBoundingClientRect();
       const tooltipRect = this.tooltip.getBoundingClientRect();
 
@@ -283,26 +248,46 @@ export default {
         rect.left + rect.width / 2 - tooltipRect.width / 2 + "px";
       this.tooltip.style.top = rect.top - tooltipRect.height - 8 + "px";
 
-      // 添加显示动画class
-      setTimeout(() => {
-        this.tooltip.classList.add("show");
-      }, 0);
+      // 使用 requestAnimationFrame 确保动画流畅
+      requestAnimationFrame(() => {
+        if (this.tooltip) {
+          this.tooltip.classList.add("show");
+        }
+      });
+
+      // 添加安全清理机制
+      this.tooltipTimeout = setTimeout(() => {
+        this.hideTooltip();
+      }, 3000); // 3秒后自动清理
     },
     hideTooltip() {
+      // 清除定时器
+      if (this.tooltipTimeout) {
+        clearTimeout(this.tooltipTimeout);
+        this.tooltipTimeout = null;
+      }
+
+      // 清除tooltip
       if (this.tooltip) {
         this.tooltip.classList.remove("show");
+        const tooltipToRemove = this.tooltip;
+
         setTimeout(() => {
-          if (this.tooltip && this.tooltip.parentNode) {
-            this.tooltip.parentNode.removeChild(this.tooltip);
+          if (tooltipToRemove && tooltipToRemove.parentNode) {
+            tooltipToRemove.parentNode.removeChild(tooltipToRemove);
           }
-          this.tooltip = null;
         }, 200);
+
+        this.tooltip = null;
       }
     },
   },
   beforeDestroy() {
-    // 组件销毁时确保tooltip被移除
+    // 组件销毁时清理所有相关资源
     this.hideTooltip();
+    if (this.tooltipTimeout) {
+      clearTimeout(this.tooltipTimeout);
+    }
   },
 };
 </script>

src/views/productManagement/productionSummary/components/ProductionTable.vue

@@ -238,272 +238,9 @@ export default {
         order: "", // 排序的方向
       },
       // 按货品查询的示例数据
-      productDefaultData: [
-        {
-          productName: "智能游环",
-          status: "进行中",
-          progress: 900,
-          total: 4000,
-          finished: 900,
-          unfinished: 3100,
-          yesterdayFinished: 3100,
-          todayFinished: 3100,
-          rate: "22.5%",
-        },
-        {
-          productName: "智能喷淋",
-          status: "进行中",
-          progress: 170,
-          total: 350,
-          finished: 170,
-          unfinished: 180,
-          yesterdayFinished: 180,
-          todayFinished: 180,
-          rate: "48.5%",
-        },
-        {
-          productName: "精准铜喷",
-          status: "进行中",
-          progress: 180,
-          total: 200,
-          finished: 180,
-          unfinished: 20,
-          yesterdayFinished: 20,
-          todayFinished: 20,
-          rate: "90%",
-        },
-        {
-          productName: "休闲评分",
-          status: "已超期",
-          progress: 70,
-          total: 150,
-          finished: 70,
-          unfinished: 80,
-          yesterdayFinished: 80,
-          todayFinished: 80,
-          rate: "46.6%",
-        },
-        {
-          productName: "显示大屏",
-          status: "进行中",
-          progress: 1,
-          total: 30,
-          finished: 1,
-          unfinished: 29,
-          yesterdayFinished: 29,
-          todayFinished: 29,
-          rate: "3%",
-        },
-        {
-          productName: "车载控制器",
-          status: "未开始",
-          progress: 0,
-          total: 50,
-          finished: 0,
-          unfinished: 50,
-          yesterdayFinished: 50,
-          todayFinished: 50,
-          rate: "0%",
-        },
-      ],
+      productDefaultData: [],
       // 原有的按订单查询数据改名为 orderDefaultData
-      orderDefaultData: [
-        {
-          orderNo: "DD20240001",
-          productName: "包装材料A型",
-          process: "包装",
-          status: "进行中",
-          progress: 900,
-          total: 4000,
-          finished: 900,
-          unfinished: 3100,
-          yesterdayFinished: 100,
-          todayFinished: 50,
-          rate: "22.5%",
-          producer: "张三",
-          remainingDays: 7,
-        },
-        {
-          orderNo: "DD20240002",
-          productName: "塑料外壳B型",
-          process: "注塑",
-          status: "已超期",
-          progress: 1500,
-          total: 2000,
-          finished: 1500,
-          unfinished: 500,
-          yesterdayFinished: 200,
-          todayFinished: 150,
-          rate: "75%",
-          producer: "李四",
-          remainingDays: -3,
-        },
-        {
-          orderNo: "DD20240003",
-          productName: "金属零件C型",
-          process: "冲压",
-          status: "未开始",
-          progress: 0,
-          total: 3000,
-          finished: 0,
-          unfinished: 3000,
-          yesterdayFinished: 0,
-          todayFinished: 0,
-          rate: "0%",
-          producer: "王五",
-          remainingDays: 15,
-        },
-        {
-          orderNo: "DD20240004",
-          productName: "电子元件D型",
-          process: "组装",
-          status: "进行中",
-          progress: 2000,
-          total: 5000,
-          finished: 2000,
-          unfinished: 3000,
-          yesterdayFinished: 300,
-          todayFinished: 200,
-          rate: "40%",
-          producer: "赵六",
-          remainingDays: 10,
-        },
-        {
-          orderNo: "DD20240005",
-          productName: "橡胶配件E型",
-          process: "成型",
-          status: "已超期",
-          progress: 800,
-          total: 1000,
-          finished: 800,
-          unfinished: 200,
-          yesterdayFinished: 80,
-          todayFinished: 40,
-          rate: "80%",
-          producer: "孙七",
-          remainingDays: -5,
-        },
-        {
-          orderNo: "DD20240006",
-          productName: "电路板F型",
-          process: "焊接",
-          status: "进行中",
-          progress: 1200,
-          total: 3500,
-          finished: 1200,
-          unfinished: 2300,
-          yesterdayFinished: 150,
-          todayFinished: 100,
-          rate: "34.3%",
-          producer: "周八",
-          remainingDays: 8,
-        },
-        {
-          orderNo: "DD20240007",
-          productName: "传感器G型",
-          process: "测试",
-          status: "未开始",
-          progress: 0,
-          total: 2500,
-          finished: 0,
-          unfinished: 2500,
-          yesterdayFinished: 0,
-          todayFinished: 0,
-          rate: "0%",
-          producer: "吴九",
-          remainingDays: 12,
-        },
-        {
-          orderNo: "DD20240008",
-          productName: "控制器H型",
-          process: "调试",
-          status: "进行中",
-          progress: 600,
-          total: 1500,
-          finished: 600,
-          unfinished: 900,
-          yesterdayFinished: 120,
-          todayFinished: 80,
-          rate: "40%",
-          producer: "郑十",
-          remainingDays: 6,
-        },
-        {
-          orderNo: "DD20240009",
-          productName: "显示屏I型",
-          process: "组装",
-          status: "已超期",
-          progress: 400,
-          total: 800,
-          finished: 400,
-          unfinished: 400,
-          yesterdayFinished: 50,
-          todayFinished: 30,
-          rate: "50%",
-          producer: "张三",
-          remainingDays: -2,
-        },
-        {
-          orderNo: "DD20240010",
-          productName: "机箱J型",
-          process: "冲压",
-          status: "进行中",
-          progress: 1800,
-          total: 4500,
-          finished: 1800,
-          unfinished: 2700,
-          yesterdayFinished: 250,
-          todayFinished: 180,
-          rate: "40%",
-          producer: "李四",
-          remainingDays: 9,
-        },
-        {
-          orderNo: "DD20240011",
-          productName: "散热器K型",
-          process: "成型",
-          status: "未开始",
-          progress: 0,
-          total: 1200,
-          finished: 0,
-          unfinished: 1200,
-          yesterdayFinished: 0,
-          todayFinished: 0,
-          rate: "0%",
-          producer: "王五",
-          remainingDays: 14,
-        },
-        {
-          orderNo: "DD20240012",
-          productName: "电源L型",
-          process: "测试",
-          status: "已超期",
-          progress: 300,
-          total: 600,
-          finished: 300,
-          unfinished: 300,
-          yesterdayFinished: 40,
-          todayFinished: 20,
-          rate: "50%",
-          producer: "赵六",
-          remainingDays: -4,
-        },
-        {
-          orderNo: "DD20240013",
-          productName: "连接器M型",
-          process: "焊接",
-          status: "进行中",
-          progress: 700,
-          total: 2000,
-          finished: 700,
-          unfinished: 1300,
-          yesterdayFinished: 90,
-          todayFinished: 60,
-          rate: "35%",
-          producer: "孙七",
-          remainingDays: 11,
-        },
-      ],
+      orderDefaultData: [],
     };
   },
   props: {

src/views/productManagement/productionSummary/index.vue

@@ -9,63 +9,78 @@
     <!-- 顶部统计卡片 -->
     <statistics-panel :statistics-data="statisticsPanelData" />
 
-    <!-- 按订单查询表格 -->
-    <order-production-table
-      v-if="queryType === 'order'"
-      :update-time="updateTime"
-      @progress-click="handleProgressClick"
-      @data-loaded="handleDataLoaded"
-    >
-      <template #query-buttons>
-        <el-button-group>
-          <el-button
-            type="primary"
-            size="small"
-            :plain="queryType !== 'order'"
-            @click="switchQueryType('order')"
-          >
-            按订单查询
-          </el-button>
-          <el-button
-            type="primary"
-            size="small"
-            :plain="queryType !== 'product'"
-            @click="switchQueryType('product')"
-          >
-            按货品查询
-          </el-button>
-        </el-button-group>
-      </template>
-    </order-production-table>
+    <!-- 使用keep-alive缓存组件 -->
+    <keep-alive>
+      <div class="table-container">
+        <!-- 使用v-show替代v-if -->
+        <order-production-table
+          ref="orderTable"
+          v-show="queryType === 'order'"
+          :update-time="updateTime"
+          @progress-click="handleProgressClick"
+          @data-loaded="handleDataLoaded"
+        >
+          <template #query-buttons>
+            <el-button-group>
+              <el-button
+                type="primary"
+                size="small"
+                :plain="queryType !== 'order'"
+                :loading="isLoading"
+                :disabled="isLoading"
+                @click="switchQueryType('order')"
+              >
+                按订单查询
+              </el-button>
+              <el-button
+                type="primary"
+                size="small"
+                :plain="queryType !== 'product'"
+                :loading="isLoading"
+                :disabled="isLoading"
+                @click="switchQueryType('product')"
+              >
+                按货品查询
+              </el-button>
+            </el-button-group>
+          </template>
+        </order-production-table>
 
-    <!-- 按货品查询表格 -->
-    <product-production-table
-      v-else
-      :update-time="updateTime"
-      @progress-click="handleProgressClick"
-      @data-loaded="handleDataLoaded"
-    >
-      <template #query-buttons>
-        <el-button-group>
-          <el-button
-            type="primary"
-            size="small"
-            :plain="queryType !== 'order'"
-            @click="switchQueryType('order')"
-          >
-            按订单查询
-          </el-button>
-          <el-button
-            type="primary"
-            size="small"
-            :plain="queryType !== 'product'"
-            @click="switchQueryType('product')"
-          >
-            按货品查询
-          </el-button>
-        </el-button-group>
-      </template>
-    </product-production-table>
+        <!-- 按货品查询表格 -->
+        <product-production-table
+          ref="productTable"
+          v-show="queryType === 'product'"
+          :update-time="updateTime"
+          @progress-click="handleProgressClick"
+          @data-loaded="handleDataLoaded"
+        >
+          <template #query-buttons>
+            <el-button-group>
+              <el-button
+                type="primary"
+                size="small"
+                :plain="queryType !== 'order'"
+                :loading="isLoading"
+                :disabled="isLoading"
+                @click="switchQueryType('order')"
+              >
+                按订单查询
+              </el-button>
+              <el-button
+                type="primary"
+                size="small"
+                :plain="queryType !== 'product'"
+                :loading="isLoading"
+                :disabled="isLoading"
+                @click="switchQueryType('product')"
+              >
+                按货品查询
+              </el-button>
+            </el-button-group>
+          </template>
+        </product-production-table>
+      </div>
+    </keep-alive>
 
     <!-- 发货状态表格 -->
     <delivery-status-table />
@@ -100,20 +115,13 @@ export default {
       dialogVisible: false,
       statisticsPanelData: [],
       queryType: "order", // 默认按订单查询
-      autoPlayTimer: null, // 自动轮播定时器
-      manualTimer: null, // 手动模式定时器
-      isAutoPlay: true, // 是否为自动轮播模式
+      isLoading: false,
     };
   },
   created() {
     this.updateCurrentTime();
     setInterval(this.updateCurrentTime, 1000);
     this.getTableData();
-    this.startAutoPlay(); // 启动自动轮播
-  },
-  beforeDestroy() {
-    // 组件销毁前清除定时器
-    this.clearTimers();
   },
   methods: {
     updateCurrentTime() {
@@ -151,39 +159,62 @@ export default {
     handleProgressClick(row) {
       console.log("进度条被点击:", row);
     },
-    getTableData() {
+    async switchQueryType(type) {
+      if (this.queryType === type || this.isLoading) return;
+
+      this.isLoading = true;
+      this.queryType = type;
+
+      try {
+        // 获取统计面板数据
+        //await this.getTableData();
+
+        // 使用ref刷新对应表格数据
+        await this.$nextTick();
+        if (type === "order" && this.$refs.orderTable?.initData) {
+          await this.$refs.orderTable.initData();
+        } else if (type === "product" && this.$refs.productTable?.initData) {
+          await this.$refs.productTable.initData();
+        }
+      } catch (error) {
+        console.error("切换查询类型失败:", error);
+        this.$message.error("切换查询类型失败");
+      } finally {
+        this.isLoading = false;
+      }
+    },
+    async getTableData() {
       const send_select_list = [
         {
-          name: "getStatisticsPanelNums",
-          offset: 0,
-          pagecount: 0,
-          parammaps: {},
-        },
-        {
-          name: "getDictListSelect",
-          offset: 0,
-          pagecount: 0,
-          parammaps: {
-            pid: "79",
-          },
-        },
-        {
-          name: "getInstallationOrderToDoNum",
+          name: "getStatisticsPanelNumsOfProduction",
           offset: 0,
           pagecount: 0,
           parammaps: {},
         },
+        // {
+        //   name: "getDictListSelect",
+        //   offset: 0,
+        //   pagecount: 0,
+        //   parammaps: {
+        //     pid: "79",
+        //   },
+        // },
+        // {
+        //   name: "getInstallationOrderToDoNum",
+        //   offset: 0,
+        //   pagecount: 0,
+        //   parammaps: {},
+        // },
       ];
 
-      GetDataByNames(send_select_list)
-        .then((response) => {
-          // 处理服务人员数据
-          this.statisticsPanelData =
-            response.data.getStatisticsPanelNums.list || [];
-        })
-        .catch((error) => {
-          console.error("获取下拉框数据失败:", error);
-        });
+      try {
+        const response = await GetDataByNames(send_select_list);
+        this.statisticsPanelData =
+          response.data.getStatisticsPanelNumsOfProduction.list || [];
+      } catch (error) {
+        console.error("获取数据失败:", error);
+        throw error;
+      }
     },
     handleFilterChange({ month, product }) {
       console.log("筛选条件变更:", month, product);
@@ -197,76 +228,6 @@ export default {
         this.$message.error("获取图表数据失败");
       }
     },
-    // 切换查询类型
-    switchQueryType(type) {
-      if (this.queryType === type) return;
-
-      this.queryType = type;
-      this.clearTimers(); // 清除现有定时器
-      this.isAutoPlay = false;
-
-      // 提示进入手动模式
-      this.$message({
-        message: "已切换为手动模式，5分钟后恢复自动轮播",
-        type: "info",
-        duration: 3000,
-      });
-
-      // 设置5分钟后恢复自动轮播
-      this.manualTimer = setTimeout(() => {
-        this.startAutoPlay();
-        // 提示恢复自动模式
-        this.$message({
-          message: "已恢复自动轮播模式",
-          type: "success",
-          duration: 3000,
-        });
-      }, 5 * 60 * 1000);
-    },
-
-    // 启动自动轮播
-    startAutoPlay() {
-      this.clearTimers(); // 先清除现有定时器
-      this.isAutoPlay = true;
-
-      if (this.isAutoPlay) {
-        // 首次启动时提示
-        this.$message({
-          message: "自动轮播模式：每1分钟自动切换视图",
-          type: "success",
-          duration: 3000,
-        });
-      }
-
-      // 每分钟切换一次
-      this.autoPlayTimer = setInterval(() => {
-        this.queryType = this.queryType === "order" ? "product" : "order";
-      }, 60 * 1000);
-    },
-
-    // 清除所有定时器
-    clearTimers() {
-      if (this.autoPlayTimer) {
-        clearInterval(this.autoPlayTimer);
-        this.autoPlayTimer = null;
-      }
-      if (this.manualTimer) {
-        clearTimeout(this.manualTimer);
-        this.manualTimer = null;
-      }
-    },
-  },
-  watch: {
-    queryType(newVal) {
-      // 视图切换时的提示
-      if (this.isAutoPlay) {
-        this.$message({
-          message: `自动切换至${newVal === "order" ? "按订单" : "按货品"}视图`,
-          type: "info",
-          duration: 2000,
-        });
-      }
-    },
   },
 };
 </script>
@@ -351,6 +312,15 @@ export default {
         box-shadow: 0 4px 12px rgba(64, 158, 255, 0.3);
       }
     }
+
+    &[disabled] {
+      cursor: not-allowed;
+      opacity: 0.7;
+      &:hover {
+        transform: none;
+        box-shadow: none;
+      }
+    }
   }
 }
 
@@ -371,4 +341,16 @@ export default {
     transform: scale(1);
   }
 }
+
+.table-container {
+  position: relative;
+  margin-bottom: 24px;
+}
+
+// 添加切换动画
+.table-container {
+  > * {
+    transition: opacity 0.2s ease;
+  }
+}
 </style>