车间能级提升-智能设备管理系统
baoshiwei
2025-07-11 1524fa42ddf01fd72207a8a4b4667a48e4f233aa
eims-ui/apps/web-antd/src/views/eims/predictive-maintenance/index.vue
@@ -4,7 +4,7 @@
      <!-- 设备健康状态可视化 -->
      <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
        <Card title="设备健康度分布" >
        <Card title="设备健康度评分" >
          <!-- 这里将放置健康度分布图表 -->
          <div ref="chartRef" class="h-64 w-full"></div>
        </Card>
@@ -43,7 +43,7 @@
        <div class="grid grid-cols-1 gap-4">
            <!-- 这里将放置预警表格 -->
            <a-table :columns="warningColumns" :data-source="warningData" :pagination="false" class="w-full">
            <Table :columns="warningColumns" :data-source="warningData" :pagination="false" class="w-full">
              <template #bodyCell="{ column, record }">
                <template v-if="column.key === 'status'">
                  <a-tag :color="getStatusColor(record.status)">
@@ -55,7 +55,7 @@
                  <a-button type="link" @click="generateWorkOrder(record)" :disabled="record.maintenanceSuggestion === '暂无建议'">生成工单</a-button>
                </template>
              </template>
            </a-table>
            </Table>
          </div>
      </Card>
@@ -64,7 +64,7 @@
      <div class="grid grid-cols-2 gap-4 mb-6">
        <!-- 设备部件寿命预测 -->
        <Card title="设备部件寿命预测">
          <a-table :columns="lifePredictionColumns" :data-source="lifePredictionData" :pagination="false" class="w-full">
          <Table :columns="lifePredictionColumns" :data-source="lifePredictionData" :pagination="false" class="w-full">
            <template #bodyCell="{ column, record }">
              <template v-if="column.key === 'lifeStatus'">
                <a-tag :color="getLifeStatusColor(record.remainingDays)">
@@ -75,12 +75,12 @@
                <a-button type="link" @click="showLifePredictionDetail(record)">详情</a-button>
              </template>
            </template>
          </a-table>
          </Table>
        </Card>
        <!-- 备件库存与预警 -->
        <Card title="备件库存与预警">
          <a-table :columns="sparePartColumns" :data-source="sparePartData" :pagination="false" class="w-full">
          <Table :columns="sparePartColumns" :data-source="sparePartData" :pagination="false" class="w-full">
            <template #bodyCell="{ column, record }">
              <template v-if="column.key === 'stockStatus'">
                <a-tag :color="getStockStatusColor(record.currentStock, record.safetyStock)">
@@ -91,7 +91,7 @@
                <a-button type="link" @click="showSparePartDetail(record)">详情</a-button>
              </template>
            </template>
          </a-table>
          </Table>
        </Card>
      </div>
@@ -103,7 +103,7 @@
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { Page } from '@vben/common-ui';
import { Card, Table, Tag, Button, Form, Input, Textarea, Select, message } from 'ant-design-vue';
import { Button, Card, Form, Input, message, Select, Table, Tag } from 'ant-design-vue';
import * as echarts from 'echarts';
const chartRef = ref<HTMLElement | null>(null);
@@ -362,10 +362,8 @@
      },
      xAxis: {
        type: 'category',
        data: ['90%-100%', '80%-90%', '70%-80%', '60%-70%', '50%-60%', '40%-50%', '30%-40%', '20%-30%', '10%-20%', '0%-10%'],
        axisLabel: {
          rotate: 45
        }
        data: ['10分', '9分', '8分', '7分', '6分', '5分', '4分', '3分', '2分', '1分'],
      },
      yAxis: {
        type: 'value',
@@ -385,13 +383,12 @@
            { value: 21, itemStyle: { color: '#52c41a' } },
            { value: 8, itemStyle: { color: '#faad14' } },
            { value: 5, itemStyle: { color: '#faad14' } },
            { value: 3, itemStyle: { color: '#faad14' } },
            { value: 1, itemStyle: { color: '#ff4d4f' } },
            { value: 1, itemStyle: { color: '#ff4d4f' } }
          ],
          label: {
            show: true,
            position: 'top'
            position: 'top',
            formatter: '{c}台'
          }
        }
      ]