(*)大屏调整

api/app/lib/controllers/homepage/index.js

@@ -209,10 +209,27 @@ function getRestfulInfo(opts) {
     }
 }
 
+function getQualityCheckAlarm(opts) {
+    return async function (ctx, next) {
+        const models = ctx.fs.dc.models;
+        try {
+            let alarms = await models.QualityCheckAlarm.findAll({})
+
+            ctx.status = 200;
+            ctx.body = alarms;
+        } catch (error) {
+            ctx.fs.logger.error(`path: ${ctx.path}, error: ${error}`);
+            ctx.status = 400;
+            ctx.body = { message: '获取预警列表失败' }
+        }
+    }
+}
+
 
 module.exports = {
     getNodeResources,
     getDataTotalTop5,
     getClusterInfo,
-    getRestfulInfo
+    getRestfulInfo,
+    getQualityCheckAlarm
 }

api/app/lib/index.js

@@ -99,5 +99,5 @@ module.exports.models = function (dc) {
    DbStatistics.belongsTo(DataSource, { foreignKey: 'sourceId', targetKey: 'id' });
    DataSource.hasMany(DbStatistics, { foreignKey: 'sourceId', sourceKey: 'id' })
 
-   RestfulApi.belongsTo(RestfulApiRecord, { foreignKey: 'restServiceId', targetKey: 'id' });
+   RestfulApiRecord.belongsTo(RestfulApi, { foreignKey: 'restServiceId', targetKey: 'id' });
 };

api/app/lib/models/quality_check_alarm.js

@@ -0,0 +1,62 @@
+/* eslint-disable*/
+
+'use strict';
+
+module.exports = dc => {
+  const DataTypes = dc.ORM;
+  const sequelize = dc.orm;
+  const QualityCheckAlarm = sequelize.define("qualityCheckAlarm", {
+    id: {
+      type: DataTypes.BIGINT,
+      allowNull: false,
+      defaultValue: null,
+      comment: null,
+      primaryKey: true,
+      field: "id",
+      autoIncrement: true
+    },
+    key: {
+      type: DataTypes.TEXT,
+      allowNull: true,
+      defaultValue: null,
+      comment: null,
+      primaryKey: false,
+      field: "key",
+      autoIncrement: false,
+      unique: "idx_unique_alarm_key"
+    },
+    content: {
+      type: DataTypes.TEXT,
+      allowNull: true,
+      defaultValue: null,
+      comment: null,
+      primaryKey: false,
+      field: "content",
+      autoIncrement: false
+    },
+    level: {
+      type: DataTypes.BIGINT,
+      allowNull: true,
+      defaultValue: null,
+      comment: null,
+      primaryKey: false,
+      field: "level",
+      autoIncrement: false
+    },
+    time: {
+      type: DataTypes.DATE,
+      allowNull: true,
+      defaultValue: null,
+      comment: null,
+      primaryKey: false,
+      field: "time",
+      autoIncrement: false
+    }
+  }, {
+    tableName: "t_quality_check_alarm",
+    comment: "",
+    indexes: []
+  });
+  dc.models.QualityCheckAlarm = QualityCheckAlarm;
+  return QualityCheckAlarm;
+};

api/app/lib/routes/homepage/index.js

@@ -15,4 +15,8 @@ module.exports = function (app, router, opts, AuthCode) {
 
     app.fs.api.logAttr['GET/homepage/restful/info'] = { content: '获取restful统计信息', visible: true };
     router.get('/homepage/restful/info', backups.getRestfulInfo(opts))
+
+    app.fs.api.logAttr['GET/homepage/alarms'] = { content: '获取预警列表', visible: true };
+    router.get('/homepage/alarms', backups.getQualityCheckAlarm(opts))
+
 };

web/client/src/sections/homePage/components/alarmList.js

@@ -2,28 +2,34 @@ import React, { useEffect, useState } from 'react'
 import Box from './public/table-card';
 import CarouselList from './public/carousel-list';
 import { Tooltip } from 'antd';
+import moment from 'moment';
+import NoData from './public/noData';
+import { useFsRequest } from '$utils';
 
 function AlarmList(props) {
     const { cardContentHeight } = props;
+    const { data: alarms = [] } = useFsRequest({
+        url: 'homepage/alarms',
+        pollingInterval: 1000 * 60,
+        cacheKey: 'alarms',
+    });
+
+
+    const data = alarms.map(s => {
+        return [
+            s.content,
+            s.level == 1 ? '一级' : s.level == 2 ? '二级' : s.level == 3 ? '三级' : '四级',
+            moment(s.time).format('YYYY-MM-DD HH:mm:ss')
+        ]
+    })
 
-    const data = [
-        ['预警内容预警内容预警内容预警内容预警内容', '一级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '二级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '三级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '四级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '一级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '三级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '四级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '二级', '2022-12-08 12:22:11'],
-        ['预警内容预警内容预警内容预警内容预警内容', '一级', '2022-12-08 12:22:11'],
-    ]
     const renderBody = () => {
         return <CarouselList
             header={['预警内容', '预警等级', '预警时间']}
             data={data?.map(s => {
                 return [
                     <Tooltip placement="top" title={s[0]}>
-                        {s[0].length > 20 ? s[0]?.taskNamesubstring(0, 20) + '...' : s[0]}
+                        {s[0].length > 20 ? s[0]?.substring(0, 20) + '...' : s[0]}
                     </Tooltip>,
                     <div style={{ color: s[1] == '一级' ? 'rgba(245, 27, 27, 1)' : s[1] == '二级' ? '#FF7900' : s[1] == '三级' ? '#FFCD00' : '#00DA9F' }}>{s[1]}</div>,
                     s[2]
@@ -37,7 +43,7 @@ function AlarmList(props) {
     }
 
     return <Box title={"预警列表"}>
-        {renderBody()}
+        {alarms?.length > 0 ? renderBody() : <NoData />}
     </Box>
 }
 

web/client/src/sections/homePage/components/hotspotData.js

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react'
 import Box from './public/table-card';
-import { Tooltip } from 'antd';
+import NoData from './public/noData';
 import './style.less';
 import { ApiTable, useFsRequest } from '$utils';
 function HotspotData(props) {
@@ -11,23 +11,29 @@ function HotspotData(props) {
         cacheKey: 'restfulInfo',
     });
 
-    const top3 = restfulInfo?.top3 || [{ name: '-', count: '-' }, { name: '-', count: '-' }, { name: '-', count: '-' }]
+    const top3 = restfulInfo?.top3
     return <Box title={"热点数据"} bodyPaddingTop={25}  >
-        <div className='hotspot_data_container'>
-            <div className='_img'></div>
-            <div className='_top1'>
-                <span className='hotspot_title' title={top3[0].name}>{top3[0].name?.length > 6 ? top3[0].name.substring(0, 6) + '...' : top3[0].name}</span>
-                <div className='hotspot_data_number'>{top3[0].count}</div>
-            </div>
-            <div className='_top2'>
-                <span className='hotspot_title' title={top3[2].name}>{top3[2].name?.length > 6 ? top3[2].name.substring(0, 6) + '...' : top3[2].name}</span>
-                <div className='hotspot_data_number'>{top3[2].count}</div>
-            </div>
-            <div className='_top3'>
-                <span className='hotspot_title' title={top3[1].name}>{top3[1].name?.length > 6 ? top3[1].name.substring(0, 6) + '...' : top3[1].name}</span>
-                <div className='hotspot_data_number'>{top3[1].count}</div>
-            </div>
-        </div>
+        {top3?.length > 0 ?
+            <div className='hotspot_data_container'>
+                <div className='_img'></div>
+                <div className='_top1'>
+                    <span className='hotspot_title' title={top3[0].name}>{top3[0].name?.length > 6 ? top3[0].name.substring(0, 6) + '...' : top3[0].name}</span>
+                    <div className='hotspot_data_number'>{top3[0].count}</div>
+                </div>
+                <div className='_top2'>
+                    {top3?.length > 2 && <>
+                        <span className='hotspot_title' title={top3[2].name}>{top3[2].name?.length > 6 ? top3[2].name.substring(0, 6) + '...' : top3[2].name}</span>
+                        <div className='hotspot_data_number'>{top3[2].count}</div>
+                    </>}
+                </div>
+                <div className='_top3'>
+                    {top3?.length > 1 && <>
+                        <span className='hotspot_title' title={top3[1].name}>{top3[1].name?.length > 6 ? top3[1].name.substring(0, 6) + '...' : top3[1].name}</span>
+                        <div className='hotspot_data_number'>{top3[1].count}</div>
+                    </>}
+                </div>
+            </div> : <NoData />
+        }
     </Box>
 }