feat(media): Cascade\Device

src/pages/media/Cascade/index.tsx

@@ -1,6 +1,99 @@
 import { PageContainer } from '@ant-design/pro-layout';
+import BaseService from '@/utils/BaseService';
+import { useIntl } from '@@/plugin-locale/localeExports';
+import { useRef } from 'react';
+import type { ActionType, ProColumns } from '@jetlinks/pro-table';
+import { Tooltip } from 'antd';
+import { ArrowDownOutlined, BugOutlined, EditOutlined, MinusOutlined } from '@ant-design/icons';
+import BaseCrud from '@/components/BaseCrud';
+import type { CascadeItem } from '@/pages/media/Cascade/typings';
 
+export const service = new BaseService<CascadeItem>('media/gb28181-cascade');
 const Cascade = () => {
-  return <PageContainer>Cascade</PageContainer>;
+  const intl = useIntl();
+  const actionRef = useRef<ActionType>();
+
+  const columns: ProColumns<CascadeItem>[] = [
+    {
+      dataIndex: 'index',
+      valueType: 'indexBorder',
+      width: 48,
+    },
+    {
+      dataIndex: 'name',
+      title: '名称',
+    },
+    {
+      dataIndex: 'networkType',
+      title: '类型',
+    },
+    {
+      dataIndex: 'state',
+      title: '状态',
+      render: (text, record) => record.status.value,
+    },
+    {
+      title: '操作',
+      valueType: 'option',
+      align: 'center',
+      width: 200,
+      render: (text, record) => [
+        <a onClick={() => console.log(record)}>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.data.option.edit',
+              defaultMessage: '编辑',
+            })}
+          >
+            <EditOutlined />
+          </Tooltip>
+        </a>,
+        <a>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.data.option.remove',
+              defaultMessage: '删除',
+            })}
+          >
+            <MinusOutlined />
+          </Tooltip>
+        </a>,
+        <a>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.data.option.download',
+              defaultMessage: '下载配置',
+            })}
+          >
+            <ArrowDownOutlined />
+          </Tooltip>
+        </a>,
+        <a>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.notice.option.debug',
+              defaultMessage: '调试',
+            })}
+          >
+            <BugOutlined />
+          </Tooltip>
+        </a>,
+      ],
+    },
+  ];
+
+  const schema = {};
+
+  return (
+    <PageContainer>
+      <BaseCrud
+        columns={columns}
+        service={service}
+        title="模拟测试"
+        schema={schema}
+        actionRef={actionRef}
+      />
+    </PageContainer>
+  );
 };
 export default Cascade;

src/pages/media/Cascade/typings.d.ts

@@ -1,4 +1,32 @@
-type Item = {
-  id: string;
+import type { BaseItem, State } from '@/utils/typings';
+
+type SipConfig = {
+  catalogEach: number;
+  charset: string;
+  clusterNodeId: string;
+  domain: string;
+  firmware: string;
+  hostAndPort: string;
+  keepaliveInterval: number;
+  keepaliveTimeoutTimes: number;
+  localAddress: string;
+  localSipId: string;
+  manufacturer: string;
+  model: string;
   name: string;
+  password: string;
+  port: number;
+  publicAddress: string;
+  publicPort: number;
+  sipId: string;
+  stackName: string;
+  transport: string;
+  user: string;
 };
+type CascadeItem = {
+  mediaServerId: string;
+  onlineStatus: State;
+  proxyStream: boolean;
+  sipConfigs: Partial<SipConfig>[];
+  status: State;
+} & BaseItem;

src/pages/media/Device/index.tsx

@@ -1,6 +1,135 @@
 import { PageContainer } from '@ant-design/pro-layout';
+import { useIntl } from '@@/plugin-locale/localeExports';
+import { useRef } from 'react';
+import type { ActionType, ProColumns } from '@jetlinks/pro-table';
+import { Tooltip } from 'antd';
+import { ArrowDownOutlined, BugOutlined, EditOutlined, MinusOutlined } from '@ant-design/icons';
+import BaseCrud from '@/components/BaseCrud';
+import BaseService from '@/utils/BaseService';
+import type { DeviceItem } from '@/pages/media/Device/typings';
 
+export const service = new BaseService<DeviceItem>('media/device');
 const Device = () => {
-  return <PageContainer>Device</PageContainer>;
+  const intl = useIntl();
+  const actionRef = useRef<ActionType>();
+
+  const columns: ProColumns<DeviceItem>[] = [
+    {
+      dataIndex: 'index',
+      valueType: 'indexBorder',
+      width: 48,
+    },
+    {
+      dataIndex: 'name',
+      title: '名称',
+    },
+    {
+      dataIndex: 'transport',
+      title: '信令传输',
+    },
+    {
+      dataIndex: 'streamMode',
+      title: '流传输模式',
+    },
+    {
+      dataIndex: 'channelNumber',
+      title: '通道数',
+    },
+    {
+      dataIndex: 'state',
+      title: '状态',
+      render: (text, record) => record.state.value,
+    },
+    {
+      dataIndex: 'host',
+      title: 'IP',
+    },
+    {
+      dataIndex: '端口',
+      title: 'port',
+    },
+    {
+      dataIndex: 'manufacturer',
+      title: '设备厂家',
+    },
+    {
+      dataIndex: 'model',
+      title: '型号',
+    },
+    {
+      dataIndex: 'firmware',
+      title: '固件版本',
+    },
+    {
+      dataIndex: 'networkType',
+      title: '类型',
+    },
+    {
+      dataIndex: 'state',
+      title: '状态',
+      render: (text, record) => record.state.value,
+    },
+    {
+      title: '操作',
+      valueType: 'option',
+      align: 'center',
+      width: 200,
+      render: (text, record) => [
+        <a onClick={() => console.log(record)}>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.data.option.edit',
+              defaultMessage: '编辑',
+            })}
+          >
+            <EditOutlined />
+          </Tooltip>
+        </a>,
+        <a>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.data.option.remove',
+              defaultMessage: '删除',
+            })}
+          >
+            <MinusOutlined />
+          </Tooltip>
+        </a>,
+        <a>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.data.option.download',
+              defaultMessage: '下载配置',
+            })}
+          >
+            <ArrowDownOutlined />
+          </Tooltip>
+        </a>,
+        <a>
+          <Tooltip
+            title={intl.formatMessage({
+              id: 'pages.notice.option.debug',
+              defaultMessage: '调试',
+            })}
+          >
+            <BugOutlined />
+          </Tooltip>
+        </a>,
+      ],
+    },
+  ];
+
+  const schema = {};
+  return (
+    <PageContainer>
+      <BaseCrud
+        columns={columns}
+        service={service}
+        title="国标设备"
+        schema={schema}
+        actionRef={actionRef}
+      />
+    </PageContainer>
+  );
 };
 export default Device;

src/pages/media/Device/typings.d.ts

@@ -1,4 +1,16 @@
-type Item = {
-  id: string;
-  name: string;
-};
+import type { BaseItem, State } from '@/utils/typings';
+
+type DeviceItem = {
+  channelNumber: number;
+  createTime: number;
+  firmware: string;
+  gatewayId: string;
+  host: string;
+  manufacturer: string;
+  model: string;
+  port: number;
+  provider: string;
+  state: State;
+  streamMode: string;
+  transport: string;
+} & BaseItem;