feat(eims): 更新预测性维护功能 - 新增设备数据定时更新功能 - 添加维护建议滚动显示 - 更新设备部件寿命预测数据 - 调整备件库存与预...

baoshiwei

6 天以前 7b4cd6ef04b358e0805846d49e3acf02d7eae5cb

 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>
@@ -63,8 +63,8 @@
      <!-- 备件信息 -->
      <div class="grid grid-cols-2 gap-4 mb-6">
        <!-- 设备部件寿命预测 -->
        <Card title="设备部件寿命预测">
          <a-table :columns="lifePredictionColumns" :data-source="lifePredictionData" :pagination="false" class="w-full">
        <Card title="设备部件寿命预测" :style="{ height: '500px' }">
          <Table :columns="lifePredictionColumns" :data-source="lifePredictionData" :pagination="false" :scroll="{ y: 340 }" 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">
        <Card title="备件库存与预警" :style="{ height: '500px' }">
          <Table :columns="sparePartColumns" :data-source="sparePartData" :pagination="false" :scroll="{ y: 340 }" 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);
@@ -140,7 +140,7 @@
    indicator: '真空压力',
    value: 32,
    threshold: 35,
    status: '中风险',
    status: '低风险',
    maintenanceSuggestion: '真空压力值低于设定值，建议检查或更换吸嘴',
    maintenanceType: '预防性维护',
  },
@@ -152,7 +152,7 @@
    indicator: '温度',
    value: 85,
    threshold: 80,
    status: '中风险',
    status: '低风险',
    maintenanceSuggestion: '建议对主轴进行润滑保养并检查冷却系统',
    maintenanceType: '润滑维护',
  },
@@ -221,12 +221,33 @@
    safetyStock: 10,
    predictedDemand: 2,
  },
  {
    key: '4',
    name: '喷码机油墨',
    currentStock: 1,
    safetyStock: 1,
    predictedDemand: 1,
  },
  {
    key: '4',
    name: '钢网清洗液',
    currentStock: 2,
    safetyStock: 1,
    predictedDemand: 1,
  },
  {
    key: '4',
    name: '十寸精密滤芯',
    currentStock: 20,
    safetyStock: 4,
    predictedDemand: 0,
  },
]);
const getStatusColor = (status) => {
  switch (status) {
    case '高风险': return 'red';
    case '中风险': return 'orange';
    case '低风险': return 'yellow';
    case '低风险': return 'blue';
    default: return 'green';
  }
};
@@ -245,7 +266,7 @@

const lifePredictionColumns = [
  { title: '设备名称', dataIndex: 'deviceName', key: 'deviceName' },
  { title: '部位名称', dataIndex: 'componentName', key: 'componentName' },
  // { title: '部位名称', dataIndex: 'componentName', key: 'componentName' },
  { title: '部件名称', dataIndex: 'name', key: 'name' },
  { title: '预测寿命 (天)', dataIndex: 'predictedLife', key: 'predictedLife' },
  { title: '剩余寿命 (天)', dataIndex: 'remainingDays', key: 'remainingDays' },
@@ -254,19 +275,25 @@
];

const lifePredictionData = ref([
    { key: '4', deviceName: '空压机', componentName: '电机', name: '传感器', predictedLife: 500, remainingDays: 10 },
      { key: '2', deviceName: 'CNC加工中心', componentName: '主轴', name: '齿轮', predictedLife: 730, remainingDays: 30 },
  { key: '1', deviceName: 'SMT贴片机', componentName: '传送带', name: '轴承', predictedLife: 365, remainingDays: 50 },
  { key: '1', deviceName: 'SMT贴片机', componentName: '传送带', name: '真空发生器', predictedLife: 700, remainingDays: 83 },
  { key: '1', deviceName: '包装机', componentName: '传送带', name: '发热丝', predictedLife: 260, remainingDays: 61 },
  { key: '1', deviceName: '激光打标机', componentName: '传送带', name: '冷却水', predictedLife: 180, remainingDays: 43 },
  { key: '1', deviceName: '钢网清洗机', componentName: '传送带', name: '清洗液', predictedLife: 180, remainingDays: 95 },
  { key: '1', deviceName: '钢网清洗机', componentName: '传送带', name: '滤芯', predictedLife: 180, remainingDays: 95 },
  { key: '1', deviceName: '端子机', componentName: '传送带', name: '刀片', predictedLife: 180, remainingDays: 112 },
  { key: '1', deviceName: '电脑剥线机', componentName: '传送带', name: '刀片', predictedLife: 180, remainingDays: 107 },

  { key: '3', deviceName: '注塑机', componentName: '液压系统', name: '滤芯', predictedLife: 180, remainingDays: 90 },

  { key: '5', deviceName: '焊接机器人', componentName: '焊枪', name: '焊嘴', predictedLife: 240, remainingDays: 60 }
  { key: '2', deviceName: 'CNC加工中心', componentName: '主轴', name: '刀筒夹', predictedLife: 1100, remainingDays: 130 },
  { key: '4', deviceName: '空压机', componentName: '安全阀', name: '安全阀', predictedLife: 365, remainingDays: 130 },
  { key: '1', deviceName: '喷码机', componentName: '传送带', name: '墨水', predictedLife: 365, remainingDays: 184 },
  { key: '3', deviceName: '注塑机', componentName: '液压系统', name: '液压油', predictedLife: 1100, remainingDays: 395 },
  { key: '5', deviceName: '焊接机器人', componentName: '焊枪', name: '烙铁芯', predictedLife: 1000, remainingDays: 512 }
]);

const getLifeStatus = (remainingDays) => {
  if (remainingDays <= 30) {
  if (remainingDays <= 90) {
    return '即将到期';
  } else if (remainingDays <= 90) {
  } else if (remainingDays <= 150) {
    return '中期预警';
  } else {
    return '寿命充足';
@@ -274,10 +301,10 @@
};

const getLifeStatusColor = (remainingDays) => {
  if (remainingDays <= 30) {
    return 'red';
  } else if (remainingDays <= 90) {
  if (remainingDays <= 90) {
    return 'orange';
  } else if (remainingDays <= 150) {
    return 'blue';
  } else {
    return 'green';
  }
@@ -290,7 +317,7 @@


const getStockStatus = (currentStock, safetyStock) => {
  if (currentStock <= safetyStock) {
  if (currentStock < safetyStock) {
    return '库存预警';
  } else {
    return '库存充足';
@@ -298,8 +325,8 @@
};

const getStockStatusColor = (currentStock, safetyStock) => {
  if (currentStock <= safetyStock) {
    return 'red';
  if (currentStock < safetyStock) {
    return 'orange';
  } else {
    return 'green';
  }
@@ -340,13 +367,13 @@
  // 根据设备名称不同跳转不同的详情页面
  if (record.name === 'SMT贴片机') {
    console.log('设备ID111:', record.name)
    router.push({ path: '/predictive/smt-detail', query: { deviceId: record.key } });
    router.push({ path: '/predictive/smt-detail', query: { deviceId: 15 } });
  } else if (record.name === 'CNC加工中心') {
    router.push({ path: '/predictive/cnc-detail', query: { deviceId: record.key } });
    router.push({ path: '/predictive/cnc-detail', query: { deviceId: 23 } });
  } else if (record.name === '注塑机') {
    router.push({ path: '/predictive/injection-detail', query: { deviceId: record.key } });
    router.push({ path: '/predictive/injection-detail', query: { deviceId: 181 } });
  } else {
    router.push({ path: '/predictive/air-compressor-detail', query: { deviceId: record.key } });
    router.push({ path: '/predictive/air-compressor-detail', query: { deviceId: 46 } });
  }
};

@@ -362,10 +389,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 +410,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}台'
          }
        }
      ]