detail.config.ts 6.68 KB
import { alarmLevel } from '/@/views/device/list/config/detail.config';
import { FormSchema } from '/@/components/Form';
import { BasicColumn } from '/@/components/Table';
import moment from 'moment';
import { findDictItemByCode } from '/@/api/system/dict';
import { AlarmStatus } from '/@/enums/alarmEnum';
import { Tag } from 'ant-design-vue';
import { h } from 'vue';
import { useI18n } from '/@/hooks/web/useI18n';

const { t } = useI18n();

export const getAlarmSearchSchemas = (deviceAlaramDetailMode?: boolean): FormSchema[] => {
  return [
    {
      field: 'status',
      label: t('monitor.alarm.log.search.alarmOkState'),
      component: 'Cascader',
      helpMessage: [t('monitor.alarm.log.search.message')],
      componentProps: {
        popupClassName: 'alarm-stauts-cascader',
        options: [
          {
            value: '0',
            label: t('monitor.alarm.log.search.cleanUp'),
            children: [
              {
                value: AlarmStatus.CLEARED_UN_ACK,
                label: t('enum.alarmStaus.CLEARED_UNACK'),
              },
              {
                value: AlarmStatus.CLEARED_ACK,
                label: t('enum.alarmStaus.CLEARED_ACK'),
              },
            ],
          },
          {
            value: '1',
            label: t('monitor.alarm.log.search.activation'),
            children: [
              {
                value: AlarmStatus.ACTIVE_UN_ACK,
                label: t('enum.alarmStaus.ACTIVE_UNACK'),
              },
              {
                value: AlarmStatus.ACTIVE_ACK,
                label: t('enum.alarmStaus.ACTIVE_ACK'),
              },
            ],
          },
        ],
      },
    },
    {
      field: 'alarmType',
      label: t('monitor.alarm.log.scenario'),
      component: 'Input',
      componentProps: {
        maxLength: 255,
      },
      dynamicRules: () => {
        return [
          {
            required: false,
            validator: (_, value) => {
              if (String(value).length > 255) {
                return Promise.reject(t('monitor.alarm.log.textRule'));
              }
              return Promise.resolve();
            },
          },
        ];
      },
    },
    {
      field: 'deviceName',
      label: t('monitor.alarm.log.device'),
      component: 'Input',
      componentProps: {
        maxLength: 255,
      },
      ifShow: () => !deviceAlaramDetailMode,
      dynamicRules: () => {
        return [
          {
            required: false,
            validator: (_, value) => {
              if (String(value).length > 255) {
                return Promise.reject(t('monitor.alarm.log.textRule'));
              }
              return Promise.resolve();
            },
          },
        ];
      },
    },
    {
      field: 'severity',
      label: t('monitor.alarm.log.level'),
      component: 'ApiSelect',
      componentProps: {
        api: findDictItemByCode,
        params: {
          dictCode: 'severity_type',
        },
        labelField: 'itemText',
        valueField: 'itemValue',
      },
    },
    {
      field: 'alarmTime',
      label: t('monitor.alarm.log.time'),
      component: 'RangePicker',
      colProps: { span: 12 },
      componentProps: {
        showTime: {
          defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')],
        },
      },
    },
  ];
};

export const alarmColumns: BasicColumn[] = [
  {
    title: t('monitor.alarm.log.table.state'),
    dataIndex: 'status',
    customRender({ record }: { record }) {
      const flag = !!record.cleared;
      return h(Tag, { color: flag ? 'green' : 'red' }, () =>
        flag ? t('monitor.alarm.log.search.cleanUp') : t('monitor.alarm.log.search.activation')
      );
    },
    width: 90,
  },
  {
    title: t('monitor.alarm.log.device'),
    dataIndex: 'deviceName',
    width: 180,
    customRender: ({ record }) => {
      const { deviceAlias, deviceName } = record || {};
      return deviceAlias || deviceName;
    },
  },
  {
    title: t('monitor.alarm.log.scenario'),
    dataIndex: 'type',
    width: 180,
  },
  {
    title: t('monitor.alarm.log.level'),
    dataIndex: 'severity',
    width: 90,
    format: (text) => alarmLevel(text),
  },
  {
    title: t('monitor.alarm.log.table.detail'),
    dataIndex: 'details',
    slots: { customRender: 'details' },
    width: 160,
  },
  {
    title: t('monitor.alarm.log.table.status'),
    dataIndex: 'ackStatus',
    customRender({ record }: { record }) {
      const flag = !!record.acknowledged;
      return h(Tag, { color: flag ? 'blue' : 'orange' }, () =>
        flag ? t('monitor.alarm.log.table.confirmed') : t('monitor.alarm.log.table.unconfirmed')
      );
    },
    width: 110,
  },
  {
    title: t('monitor.alarm.log.time'),
    dataIndex: 'createdTime',
    width: 130,
  },
];

export const alarmSchemasForm: FormSchema[] = [
  {
    field: 'deviceName',
    label: t('monitor.alarm.log.device'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },

  {
    field: 'startTs',
    label: t('monitor.alarm.log.form.startTime'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },
  {
    field: 'endTs',
    label: t('monitor.alarm.log.form.endTime'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },
  {
    field: 'ackTs',
    label: t('monitor.alarm.log.form.processTime'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    ifShow: ({ values }) => values.status === '激活已确认' || values.status === '清除已确认',
  },
  {
    field: 'clearTs',
    label: t('monitor.alarm.log.form.clearTime'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
    ifShow: ({ values }) => values.status === '清除已确认' || values.status === '清除未确认',
  },
  {
    field: 'type',
    label: t('monitor.alarm.log.scenario'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },
  {
    field: 'severity',
    label: t('monitor.alarm.log.form.severity'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },
  {
    field: 'status',
    label: t('monitor.alarm.log.form.state'),
    component: 'Input',
    componentProps: {
      disabled: true,
    },
  },
  // {
  //   field: 'details',
  //   label: t('monitor.alarm.log.form.detail'),
  //   component: 'InputTextArea',
  // },
];

export function getAlarmStatus({
  cleared,
  acknowledged,
}: Record<'cleared' | 'acknowledged', boolean>) {
  const status = cleared
    ? t('monitor.alarm.log.search.cleanUp')
    : t('monitor.alarm.log.search.activation');

  const ackStatus = acknowledged
    ? t('monitor.alarm.log.table.confirmed')
    : t('monitor.alarm.log.table.unconfirmed');

  return `${status}${ackStatus}`;
}