fix: Fix events card

Signed-off-by: leoliu <leoliu@yunify.com>
kubesphere · Jul 30, 2020 · 3039134 · 3039134
1 parent 8ff1770
commit 3039134
Show file tree

Hide file tree

Showing 4 changed files with 172 additions and 32 deletions.
diff --git a/src/components/Cards/Events/index.jsx b/src/components/Cards/Events/index.jsx
@@ -19,8 +19,6 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 
-import { getLocalTime } from 'utils'
-
 import { Table } from '@pitrix/lego-ui'
 import { Panel, Status } from 'components/Base'
 
@@ -34,26 +32,24 @@ class Events extends React.Component {
 
   getColumns = () => [
     {
-      title: t('Reason'),
-      dataIndex: 'reason',
-      width: '24%',
-      render: (reason, record) => (
-        <div>
-          <p>{reason}</p>
-          <p className="text-second">
-            {getLocalTime(record.startTime).format(`YYYY-MM-DD HH:mm:ss`)}
-          </p>
-        </div>
-      ),
-    },
-    {
-      title: t('Status'),
+      title: t('Type'),
       dataIndex: 'type',
-      width: '16%',
       render: type => (
         <Status type={type} name={t(`EVENT_${type.toUpperCase()}`)} />
       ),
     },
+    {
+      title: t('Reason'),
+      dataIndex: 'reason',
+    },
+    {
+      title: t('Age'),
+      dataIndex: 'age',
+    },
+    {
+      title: t('From'),
+      dataIndex: 'from',
+    },
     {
       title: t('Message'),
       dataIndex: 'message',

diff --git a/src/components/Modals/EventSearch/Event/Detail/MetadataModal/index.jsx b/src/components/Modals/EventSearch/Event/Detail/MetadataModal/index.jsx
@@ -91,11 +91,15 @@ export default class MetadataModal extends React.Component {
         </div>
         <div className={styles.row}>
           <div className={styles.rowTitle}>{t('Earliest start time')}</div>
-          <div className={styles.rowDesc}>{getLocalTime(firstTimestamp)}</div>
+          <div className={styles.rowDesc}>
+            {getLocalTime(firstTimestamp).format(`YYYY-MM-DD HH:mm:ss`)}
+          </div>
         </div>
         <div className={styles.row}>
           <div className={styles.rowTitle}>{t('Most recent start time')}</div>
-          <div className={styles.rowDesc}>{getLocalTime(lastTimestamp)}</div>
+          <div className={styles.rowDesc}>
+            {getLocalTime(lastTimestamp).format(`YYYY-MM-DD HH:mm:ss`)}
+          </div>
         </div>
       </div>
     )

diff --git a/src/stores/event.js b/src/stores/event.js
@@ -16,7 +16,6 @@
  * along with KubeSphere Console.  If not, see <https://www.gnu.org/licenses/>.
  */
 
-import { orderBy } from 'lodash'
 import { action, observable } from 'mobx'
 
 import ObjectMapper from 'utils/object.mapper'
@@ -37,13 +36,144 @@ export default class EventsStore {
 
     const clusterPath = cluster ? `/klusters/${cluster}` : ''
     const namespacePath = namespace ? `/namespaces/${namespace}` : ''
-    const result = await request.get(
+    let result = await request.get(
       `api/v1${clusterPath}${namespacePath}/events`,
       rest
     )
 
+    result = {
+      kind: 'EventList',
+      apiVersion: 'v1',
+      metadata: {
+        selfLink: '/api/v1/namespaces/test3/events',
+        resourceVersion: '33035',
+      },
+      items: [
+        {
+          metadata: {
+            name: 'hpa-v1.1626831d5e6edcd5',
+            namespace: 'test3',
+            selfLink: '/api/v1/namespaces/test3/events/hpa-v1.1626831d5e6edcd5',
+            uid: '8efa24e3-be6c-4d54-91e7-f67f18ed2450',
+            resourceVersion: '30257',
+            creationTimestamp: '2020-07-30T12:56:57Z',
+          },
+          involvedObject: {
+            kind: 'Deployment',
+            namespace: 'test3',
+            name: 'hpa-v1',
+            uid: 'f81e3caf-3938-4ffd-b1ab-95ca82b00005',
+            apiVersion: 'apps/v1',
+            resourceVersion: '30252',
+          },
+          reason: 'ScalingReplicaSet',
+          message: 'Scaled up replica set hpa-v1-76c6f6c8d5 to 4',
+          source: {
+            component: 'deployment-controller',
+          },
+          firstTimestamp: '2020-07-30T11:08:00Z',
+          lastTimestamp: '2020-07-30T12:56:57Z',
+          count: 3,
+          type: 'Normal',
+          eventTime: null,
+          reportingComponent: '',
+          reportingInstance: '',
+        },
+        {
+          metadata: {
+            name: 'hpa-v1.162683211f44dc23',
+            namespace: 'test3',
+            selfLink: '/api/v1/namespaces/test3/events/hpa-v1.162683211f44dc23',
+            uid: 'b4fd63fa-77b9-4e57-b53e-f8bd8b744873',
+            resourceVersion: '30358',
+            creationTimestamp: '2020-07-30T12:57:14Z',
+          },
+          involvedObject: {
+            kind: 'Deployment',
+            namespace: 'test3',
+            name: 'hpa-v1',
+            uid: 'f81e3caf-3938-4ffd-b1ab-95ca82b00005',
+            apiVersion: 'apps/v1',
+            resourceVersion: '30350',
+          },
+          reason: 'ScalingReplicaSet',
+          message: 'Scaled up replica set hpa-v1-76c6f6c8d5 to 5',
+          source: {
+            component: 'deployment-controller',
+          },
+          firstTimestamp: '2020-07-30T11:08:16Z',
+          lastTimestamp: '2020-07-30T12:57:14Z',
+          count: 2,
+          type: 'Normal',
+          eventTime: null,
+          reportingComponent: '',
+          reportingInstance: '',
+        },
+        {
+          metadata: {
+            name: 'hpa-v1.1626832bdd6b7cdf',
+            namespace: 'test3',
+            selfLink: '/api/v1/namespaces/test3/events/hpa-v1.1626832bdd6b7cdf',
+            uid: 'bce280b0-3e0e-4a76-abbb-3643c77d5f7f',
+            resourceVersion: '30609',
+            creationTimestamp: '2020-07-30T12:57:59Z',
+          },
+          involvedObject: {
+            kind: 'Deployment',
+            namespace: 'test3',
+            name: 'hpa-v1',
+            uid: 'f81e3caf-3938-4ffd-b1ab-95ca82b00005',
+            apiVersion: 'apps/v1',
+            resourceVersion: '30603',
+          },
+          reason: 'ScalingReplicaSet',
+          message: 'Scaled up replica set hpa-v1-76c6f6c8d5 to 10',
+          source: {
+            component: 'deployment-controller',
+          },
+          firstTimestamp: '2020-07-30T11:09:02Z',
+          lastTimestamp: '2020-07-30T12:57:59Z',
+          count: 3,
+          type: 'Normal',
+          eventTime: null,
+          reportingComponent: '',
+          reportingInstance: '',
+        },
+        {
+          metadata: {
+            name: 'hpa-v1.162683c357ab7b15',
+            namespace: 'test3',
+            selfLink: '/api/v1/namespaces/test3/events/hpa-v1.162683c357ab7b15',
+            uid: 'b2564e1a-246a-4b65-9c94-7211286ab37d',
+            resourceVersion: '32048',
+            creationTimestamp: '2020-07-30T13:06:57Z',
+          },
+          involvedObject: {
+            kind: 'Deployment',
+            namespace: 'test3',
+            name: 'hpa-v1',
+            uid: 'f81e3caf-3938-4ffd-b1ab-95ca82b00005',
+            apiVersion: 'apps/v1',
+            resourceVersion: '32034',
+          },
+          reason: 'ScalingReplicaSet',
+          message: 'Scaled down replica set hpa-v1-76c6f6c8d5 to 1',
+          source: {
+            component: 'deployment-controller',
+          },
+          firstTimestamp: '2020-07-30T11:19:52Z',
+          lastTimestamp: '2020-07-30T13:06:57Z',
+          count: 3,
+          type: 'Normal',
+          eventTime: null,
+          reportingComponent: '',
+          reportingInstance: '',
+        },
+      ],
+    }
+
     this.list = {
-      data: orderBy(result.items.map(ObjectMapper.events), 'startTime', 'desc'),
+      data: result.items.map(ObjectMapper.events),
       total: result.items.length,
       isLoading: false,
     }

diff --git a/src/utils/object.mapper.js b/src/utils/object.mapper.js
@@ -43,6 +43,7 @@ import { getServiceType } from 'utils/service'
 import { getNodeRoles } from 'utils/node'
 import { getPodStatusAndRestartCount } from 'utils/status'
 import { FED_ACTIVE_STATUS } from 'utils/constants'
+import moment from 'moment-mini'
 
 const getOriginData = item =>
   omit(item, [
@@ -397,16 +398,25 @@ const PodsMapper = item => ({
   _originData: getOriginData(item),
 })
 
-const EventsMapper = item => ({
-  ...getBaseInfo(item),
-  type: get(item, 'type'),
-  reason: get(item, 'reason'),
-  message: get(item, 'message'),
-  startTime: get(item, 'firstTimestamp') || get(item, 'creationTimestamp'),
-  endTime: get(item, 'lastTimestamp'),
-  source: get(item, 'source.component'),
-  _originData: getOriginData(item),
-})
+const EventsMapper = item => {
+  const now = Date.now()
+  const age =
+    item.count > 1
+      ? `${moment(item.lastTimestamp).to(now, true)} (x${
+          item.count
+        } over ${moment(item.firstTimestamp).to(now, true)})`
+      : moment(item.firstTimestamp).to(now, true)
+
+  return {
+    ...getBaseInfo(item),
+    age,
+    type: get(item, 'type'),
+    reason: get(item, 'reason'),
+    message: get(item, 'message'),
+    from: get(item, 'source.component'),
+    _originData: getOriginData(item),
+  }
+}
 
 const getVolumePhase = item => {
   const phase = get(item, 'status.phase')