From 56c4f53923375dc005c25530ee253b1e178a1c6c Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期日, 18 二月 2024 08:42:52 +0800
Subject: [PATCH] #

---
 zy-asrs-flow/src/pages/system/host/index.jsx |  176 ++++++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 files changed, 163 insertions(+), 13 deletions(-)

diff --git a/zy-asrs-flow/src/pages/system/host/index.jsx b/zy-asrs-flow/src/pages/system/host/index.jsx
index 5081bb7..bf04e23 100644
--- a/zy-asrs-flow/src/pages/system/host/index.jsx
+++ b/zy-asrs-flow/src/pages/system/host/index.jsx
@@ -1,16 +1,166 @@
-import React from 'react';
-import {
-    PageContainer,
-} from '@ant-design/pro-components';
+import { EllipsisOutlined, SearchOutlined } from '@ant-design/icons';
+import { ProTable, TableDropdown } from '@ant-design/pro-components';
+import { Button, Dropdown, Input } from 'antd';
 
-const User = () => {
-    return (
-        <>
-            <PageContainer>
-                <h1>Hello world</h1>
-            </PageContainer>
-        </>
-    )
+const valueEnum = {
+  0: 'close',
+  1: 'running',
+  2: 'online',
+  3: 'error',
+};
+
+const tableListDataSource = [];
+
+const creators = ['浠樺皬灏�', '鏇蹭附涓�', '鏋椾笢涓�', '闄堝竻甯�', '鍏兼煇鏌�'];
+
+for (let i = 0; i < 5; i += 1) {
+  tableListDataSource.push({
+    key: i,
+    name: 'AppName',
+    containers: Math.floor(Math.random() * 20),
+    creator: creators[Math.floor(Math.random() * creators.length)],
+    status: valueEnum[((Math.floor(Math.random() * 10) % 4) + '')],
+    createdAt: Date.now() - Math.floor(Math.random() * 2000),
+    money: Math.floor(Math.random() * 2000) * i,
+    progress: Math.ceil(Math.random() * 100) + 1,
+    memo:
+      i % 2 === 1
+        ? '寰堥暱寰堥暱寰堥暱寰堥暱寰堥暱寰堥暱寰堥暱鐨勬枃瀛楄灞曠ず浣嗘槸瑕佺暀涓嬪熬宸�'
+        : '绠�鐭娉ㄦ枃妗�',
+  });
 }
 
-export default User;
+const columns = [
+  {
+    title: '鎺掑簭',
+    dataIndex: 'index',
+    valueType: 'indexBorder',
+    width: 48,
+  },
+  {
+    title: '搴旂敤鍚嶇О',
+    dataIndex: 'name',
+    render: (_) => <a>{_}</a>,
+    // 鑷畾涔夌瓫閫夐」鍔熻兘鍏蜂綋瀹炵幇璇峰弬鑰� https://ant.design/components/table-cn/#components-table-demo-custom-filter-panel
+    filterDropdown: () => (
+      <div style={{ padding: 8 }}>
+        <Input style={{ width: 188, marginBlockEnd: 8, display: 'block' }} />
+      </div>
+    ),
+    filterIcon: (filtered) => (
+      <SearchOutlined style={{ color: filtered ? '#1890ff' : undefined }} />
+    ),
+  },
+  {
+    title: '鍒涘缓鑰�',
+    dataIndex: 'creator',
+    valueEnum: {
+      all: { text: '鍏ㄩ儴' },
+      浠樺皬灏�: { text: '浠樺皬灏�' },
+      鏇蹭附涓�: { text: '鏇蹭附涓�' },
+      鏋椾笢涓�: { text: '鏋椾笢涓�' },
+      闄堝竻甯�: { text: '闄堝竻甯�' },
+      鍏兼煇鏌�: { text: '鍏兼煇鏌�' },
+    },
+  },
+  {
+    title: '鐘舵��',
+    dataIndex: 'status',
+    initialValue: 'all',
+    filters: true,
+    onFilter: true,
+    valueEnum: {
+      all: { text: '鍏ㄩ儴', status: 'Default' },
+      close: { text: '鍏抽棴', status: 'Default' },
+      running: { text: '杩愯涓�', status: 'Processing' },
+      online: { text: '宸蹭笂绾�', status: 'Success' },
+      error: { text: '寮傚父', status: 'Error' },
+    },
+  },
+  {
+    title: '澶囨敞',
+    dataIndex: 'memo',
+    ellipsis: true,
+    copyable: true,
+  },
+  {
+    title: '鎿嶄綔',
+    width: 180,
+    key: 'option',
+    valueType: 'option',
+    render: () => [
+      <a key="link">閾捐矾</a>,
+      <a key="link2">鎶ヨ</a>,
+      <a key="link3">鐩戞帶</a>,
+      <TableDropdown
+        key="actionGroup"
+        menus={[
+          { key: 'copy', name: '澶嶅埗' },
+          { key: 'delete', name: '鍒犻櫎' },
+        ]}
+      />,
+    ],
+  },
+];
+
+export default () => {
+  return (
+    <ProTable
+      columns={columns}
+      request={(params, sorter, filter) => {
+        // 琛ㄥ崟鎼滅储椤逛細浠� params 浼犲叆锛屼紶閫掔粰鍚庣鎺ュ彛銆�
+        console.log(params, sorter, filter);
+        return Promise.resolve({
+          data: tableListDataSource,
+          success: true,
+        });
+      }}
+      rowKey="key"
+      pagination={{
+        showQuickJumper: true,
+      }}
+      search={{
+        layout: 'vertical',
+        defaultCollapsed: false,
+      }}
+      dateFormatter="string"
+      toolbar={{
+        title: '楂樼骇琛ㄦ牸',
+        tooltip: '杩欐槸涓�涓爣棰樻彁绀�',
+      }}
+      toolBarRender={() => [
+        <Button key="danger" danger>
+          鍗遍櫓鎸夐挳
+        </Button>,
+        <Button key="show">鏌ョ湅鏃ュ織</Button>,
+        <Button type="primary" key="primary">
+          鍒涘缓搴旂敤
+        </Button>,
+
+        <Dropdown
+          key="menu"
+          menu={{
+            items: [
+              {
+                label: '1st item',
+                key: '1',
+              },
+              {
+                label: '2nd item',
+                key: '2',
+              },
+              {
+                label: '3rd item',
+                key: '3',
+              },
+            ],
+          }}
+        >
+          <Button>
+            <EllipsisOutlined />
+          </Button>
+        </Dropdown>,
+      ]}
+    />
+  );
+};
\ No newline at end of file

--
Gitblit v1.9.1