aios-management-web 0.1.0

package/src/pages/UserManagementPage.jsx

@@ -0,0 +1,25 @@
+import React from "react";
+import { Tabs } from "antd";
+
+import { AiosUsersPage } from "./AiosUsersPage.jsx";
+import { UsersPage } from "./UsersPage.jsx";
+
+export function UserManagementPage({ currentUser }) {
+  return (
+    <Tabs
+      defaultActiveKey="aiosUsers"
+      items={[
+        {
+          key: "aiosUsers",
+          label: "AIOS 用户",
+          children: <AiosUsersPage />
+        },
+        {
+          key: "users",
+          label: "AIOS 管理员",
+          children: <UsersPage currentUser={currentUser} />
+        }
+      ]}
+    />
+  );
+}

package/src/pages/UsersPage.jsx

@@ -0,0 +1,192 @@
+import React, { useEffect, useState } from "react";
+import { Button, Card, Form, Input, Modal, Select, Space, Table, Tag, message } from "antd";
+
+import { api } from "../app/api-client.js";
+import { CardTitleWithReload } from "../components/CardTitleWithReload.jsx";
+import { DeleteActionButton } from "../components/DeleteActionButton.jsx";
+
+function isBuiltinAdmin(row) {
+  return row.is_builtin || row.username === "aios";
+}
+
+function renderUserStatus(status) {
+  return <Tag color={status === "active" ? "green" : "default"}>{status === "active" ? "启用" : "停用"}</Tag>;
+}
+
+export function UsersPage({ currentUser }) {
+  const [items, setItems] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [editing, setEditing] = useState(null);
+  const [open, setOpen] = useState(false);
+  const [form] = Form.useForm();
+  const [messageApi, contextHolder] = message.useMessage();
+
+  const load = async () => {
+    setLoading(true);
+    try {
+      setItems(await api.get("/api/users?role=aios-admin"));
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    void load();
+  }, []);
+
+  const isSelf = (row) => Number(row.id) === Number(currentUser?.id);
+
+  return (
+    <>
+      {contextHolder}
+      <Card
+        className="page-card"
+        title={<CardTitleWithReload title="AIOS 管理员" loading={loading} onReload={() => load()} />}
+        extra={(
+          <Button
+            type="primary"
+            onClick={() => {
+              setEditing(null);
+              form.resetFields();
+              setOpen(true);
+            }}
+          >
+            新建管理员账号
+          </Button>
+        )}
+      >
+        <Table
+          rowKey="id"
+          dataSource={items}
+          loading={loading}
+          pagination={{
+            pageSize: 50,
+            showSizeChanger: false
+          }}
+          columns={[
+            { title: "用户名", dataIndex: "username" },
+            { title: "显示名", dataIndex: "display_name" },
+            { title: "状态", dataIndex: "status", render: renderUserStatus },
+            {
+              title: "操作",
+              render: (_, row) => (
+                <Space>
+                  {!isBuiltinAdmin(row) ? (
+                    <Button
+                      size="small"
+                      onClick={() => {
+                        setEditing(row);
+                        form.setFieldsValue({
+                          display_name: row.display_name,
+                          status: row.status
+                        });
+                        setOpen(true);
+                      }}
+                    >
+                      编辑
+                    </Button>
+                  ) : null}
+                  {!isBuiltinAdmin(row) ? (
+                    <Button
+                      size="small"
+                      onClick={async () => {
+                        try {
+                          await api.post(`/api/users/${row.id}/reset-password`, { password: "123456" });
+                          messageApi.success(`已将用户 ${row.username} 的密码重置为 123456`);
+                          await load();
+                        } catch (error) {
+                          messageApi.error(error.message || "重置密码失败");
+                        }
+                      }}
+                    >
+                      重置密码
+                    </Button>
+                  ) : null}
+                  <DeleteActionButton
+                    hidden={isBuiltinAdmin(row) || isSelf(row)}
+                    title={`确认删除管理员账号 ${row.username} 吗？`}
+                    description="删除后将无法恢复该管理员账号。"
+                    onConfirm={async () => {
+                      try {
+                        await api.delete(`/api/users/${row.id}`);
+                        messageApi.success(`已删除管理员账号 ${row.username}`);
+                        await load();
+                      } catch (error) {
+                        messageApi.error(error.message || "删除管理员账号失败");
+                      }
+                    }}
+                  />
+                </Space>
+              )
+            }
+          ]}
+        />
+        <Modal
+          open={open}
+          title={editing ? "编辑管理员账号" : "新建管理员账号"}
+          okText="确认"
+          cancelText="取消"
+          onCancel={() => {
+            setOpen(false);
+            form.resetFields();
+          }}
+          onOk={async () => {
+            try {
+              const values = await form.validateFields();
+              if (editing) {
+                await api.put(`/api/users/${editing.id}`, values);
+                messageApi.success(`已更新管理员账号 ${editing.username}`);
+              } else {
+                await api.post("/api/users", {
+                  username: values.username,
+                  display_name: values.display_name,
+                  password: values.password,
+                  role: "aios-admin"
+                });
+                messageApi.success(`已创建管理员账号 ${values.username}`);
+              }
+              setOpen(false);
+              form.resetFields();
+              await load();
+            } catch (error) {
+              if (error?.errorFields) {
+                return;
+              }
+              messageApi.error(error.message || "保存管理员账号失败");
+            }
+          }}
+        >
+          <Form form={form} layout="vertical">
+            {!editing ? (
+              <>
+                <Form.Item name="username" label="用户名" rules={[{ required: true, message: "请输入用户名" }]}>
+                  <Input />
+                </Form.Item>
+                <Form.Item name="display_name" label="显示名" rules={[{ required: true, message: "请输入显示名" }]}>
+                  <Input />
+                </Form.Item>
+                <Form.Item name="password" label="密码">
+                  <Input.Password placeholder="留空则默认使用 123456" />
+                </Form.Item>
+              </>
+            ) : (
+              <>
+                <Form.Item name="display_name" label="显示名" rules={[{ required: true, message: "请输入显示名" }]}>
+                  <Input />
+                </Form.Item>
+                <Form.Item name="status" label="状态" rules={[{ required: true, message: "请选择状态" }]}>
+                  <Select
+                    options={[
+                      { value: "active", label: "启用" },
+                      { value: "disabled", label: "停用" }
+                    ]}
+                  />
+                </Form.Item>
+              </>
+            )}
+          </Form>
+        </Modal>
+      </Card>
+    </>
+  );
+}

package/src/pages/system-logs/SystemLogsTabs.jsx

@@ -0,0 +1,362 @@
+import React, { useEffect, useState } from "react";
+import { Button, Card, Descriptions, Drawer, Space, Table, Tabs, Tag, message } from "antd";
+
+import { api } from "../../app/api-client.js";
+import { CardTitleWithReload } from "../../components/CardTitleWithReload.jsx";
+import { formatDateTime } from "../../utils/format.js";
+
+const jsonBlockStyle = {
+  margin: 0,
+  padding: 12,
+  borderRadius: 8,
+  background: "#fafafa",
+  border: "1px solid #f0f0f0",
+  overflowX: "auto",
+  whiteSpace: "pre-wrap",
+  wordBreak: "break-word",
+  fontSize: 12,
+  lineHeight: 1.6
+};
+
+function formatJson(value) {
+  if (value === undefined || value === null) {
+    return "-";
+  }
+
+  try {
+    return JSON.stringify(value, null, 2);
+  } catch {
+    return String(value);
+  }
+}
+
+function renderResultTag(value) {
+  if (value === null || value === undefined) {
+    return <Tag>处理中</Tag>;
+  }
+
+  return <Tag color={value ? "green" : "red"}>{value ? "成功" : "失败"}</Tag>;
+}
+
+function getSystemInvocationDetailItems(log) {
+  if (!log) {
+    return [];
+  }
+
+  return [
+    { key: "created_at", label: "时间", children: formatDateTime(log.created_at) },
+    { key: "provider", label: "提供方", children: log.provider || "-" },
+    { key: "application_name", label: "应用名", children: log.application_name || "-" },
+    { key: "command_name", label: "指令", children: log.command_name || "-" },
+    { key: "agent_slug", label: "数字员工", children: log.agent_slug || "-" },
+    { key: "session_id", label: "会话 ID", children: log.session_id || "-" },
+    { key: "trace_id", label: "请求追踪 ID", children: log.trace_id || "-" },
+    {
+      key: "response_time_ms",
+      label: "耗时",
+      children: typeof log.response_time_ms === "number" ? `${log.response_time_ms} ms` : "-"
+    },
+    {
+      key: "success",
+      label: "实际成功",
+      children: renderResultTag(log.success)
+    },
+    { key: "error_message", label: "错误", children: log.error_message || "-" }
+  ];
+}
+
+function getKernelInvocationDetailItems(log) {
+  if (!log) {
+    return [];
+  }
+
+  return [
+    { key: "request_id", label: "请求 ID", children: log.request_id || "-" },
+    { key: "created_at", label: "发送时间", children: formatDateTime(log.created_at) },
+    { key: "completed_at", label: "完成时间", children: formatDateTime(log.completed_at) },
+    { key: "action", label: "指令", children: log.action || "-" },
+    {
+      key: "ok",
+      label: "实际成功",
+      children: renderResultTag(log.ok)
+    },
+    {
+      key: "response_time_ms",
+      label: "耗时",
+      children: typeof log.response_time_ms === "number" ? `${log.response_time_ms} ms` : "-"
+    }
+  ];
+}
+
+export function SystemLogsTabs({ defaultActiveKey = "audit" }) {
+  const [messageApi, contextHolder] = message.useMessage();
+  const [auditItems, setAuditItems] = useState([]);
+  const [auditPage, setAuditPage] = useState(1);
+  const [auditPageSize] = useState(50);
+  const [auditTotal, setAuditTotal] = useState(0);
+  const [auditLoading, setAuditLoading] = useState(false);
+
+  const [systemLogs, setSystemLogs] = useState([]);
+  const [systemLogsLoading, setSystemLogsLoading] = useState(false);
+  const [systemLogDetail, setSystemLogDetail] = useState(null);
+  const [systemLogDetailOpen, setSystemLogDetailOpen] = useState(false);
+
+  const [kernelItems, setKernelItems] = useState([]);
+  const [kernelPage, setKernelPage] = useState(1);
+  const [kernelPageSize] = useState(50);
+  const [kernelTotal, setKernelTotal] = useState(0);
+  const [kernelLoading, setKernelLoading] = useState(false);
+  const [kernelDetail, setKernelDetail] = useState(null);
+  const [kernelDetailOpen, setKernelDetailOpen] = useState(false);
+
+  const reportLoadError = (error, fallbackMessage) => {
+    const normalized = api.normalizeError(error, fallbackMessage);
+    messageApi.error(normalized.message || fallbackMessage);
+  };
+
+  const loadAuditLogs = async (nextPage = auditPage) => {
+    setAuditLoading(true);
+    try {
+      const result = await api.get(`/api/audit-logs?page=${nextPage}&pageSize=${auditPageSize}`);
+      setAuditItems(result.items || []);
+      setAuditTotal(result.total || 0);
+      setAuditPage(result.page || nextPage);
+    } catch (error) {
+      reportLoadError(error, "加载审计日志失败");
+    } finally {
+      setAuditLoading(false);
+    }
+  };
+
+  const loadSystemInvocationLogs = async () => {
+    setSystemLogsLoading(true);
+    try {
+      const result = await api.get("/api/systems/logs");
+      setSystemLogs(Array.isArray(result) ? result : []);
+    } catch (error) {
+      reportLoadError(error, "加载业务系统调用日志失败");
+    } finally {
+      setSystemLogsLoading(false);
+    }
+  };
+
+  const loadKernelLogs = async (nextPage = kernelPage) => {
+    setKernelLoading(true);
+    try {
+      const result = await api.get(`/api/kernel/logs?page=${nextPage}&pageSize=${kernelPageSize}`);
+      setKernelItems(result.items || []);
+      setKernelTotal(result.total || 0);
+      setKernelPage(result.page || nextPage);
+    } catch (error) {
+      reportLoadError(error, "加载内核调用日志失败");
+    } finally {
+      setKernelLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    void Promise.all([
+      loadAuditLogs(1),
+      loadSystemInvocationLogs(),
+      loadKernelLogs(1)
+    ]);
+  }, []);
+
+  return (
+    <>
+      {contextHolder}
+      <Tabs
+        defaultActiveKey={defaultActiveKey}
+        items={[
+          {
+            key: "audit",
+            label: "审计日志",
+            children: (
+              <Card
+                className="page-card"
+                title={<CardTitleWithReload title="审计日志" loading={auditLoading} onReload={() => loadAuditLogs()} />}
+              >
+                <Table
+                  rowKey="id"
+                  loading={auditLoading}
+                  dataSource={auditItems}
+                  pagination={{
+                    current: auditPage,
+                    pageSize: auditPageSize,
+                    total: auditTotal,
+                    showSizeChanger: false,
+                    onChange: (nextPage) => {
+                      void loadAuditLogs(nextPage);
+                    }
+                  }}
+                  columns={[
+                    { title: "时间", dataIndex: "created_at", render: formatDateTime, width: 180 },
+                    { title: "操作人", dataIndex: "username", width: 160 },
+                    { title: "操作", dataIndex: "action", width: 220 },
+                    { title: "详情", dataIndex: "detail" }
+                  ]}
+                />
+              </Card>
+            )
+          },
+          {
+            key: "system",
+            label: "业务系统调用日志",
+            children: (
+              <Card
+                className="page-card"
+                title={<CardTitleWithReload title="业务系统调用日志" loading={systemLogsLoading} onReload={() => loadSystemInvocationLogs()} />}
+              >
+                <Table
+                  rowKey="trace_id"
+                  loading={systemLogsLoading}
+                  dataSource={systemLogs}
+                  pagination={{
+                    pageSize: 50,
+                    showSizeChanger: false
+                  }}
+                  columns={[
+                    { title: "时间", dataIndex: "created_at", render: formatDateTime },
+                    { title: "应用名", dataIndex: "application_name" },
+                    { title: "数字员工", dataIndex: "agent_slug", render: (value) => value || "-" },
+                    { title: "接口", render: (_, row) => `${row.provider}/${row.application_name}/${row.command_name}` },
+                    {
+                      title: "耗时",
+                      dataIndex: "response_time_ms",
+                      render: (value) => (typeof value === "number" ? `${value} ms` : "-")
+                    },
+                    {
+                      title: "实际成功",
+                      dataIndex: "success",
+                      render: renderResultTag
+                    },
+                    {
+                      title: "操作",
+                      render: (_, row) => (
+                        <Button
+                          size="small"
+                          onClick={() => {
+                            setSystemLogDetail(row);
+                            setSystemLogDetailOpen(true);
+                          }}
+                        >
+                          详情
+                        </Button>
+                      )
+                    }
+                  ]}
+                />
+              </Card>
+            )
+          },
+          {
+            key: "kernel",
+            label: "内核调用日志",
+            children: (
+              <Card
+                className="page-card"
+                title={<CardTitleWithReload title="内核调用日志" loading={kernelLoading} onReload={() => loadKernelLogs()} />}
+              >
+                <Table
+                  rowKey="request_id"
+                  loading={kernelLoading}
+                  dataSource={kernelItems}
+                  pagination={{
+                    current: kernelPage,
+                    pageSize: kernelPageSize,
+                    total: kernelTotal,
+                    showSizeChanger: false,
+                    onChange: (nextPage) => {
+                      void loadKernelLogs(nextPage);
+                    }
+                  }}
+                  columns={[
+                    { title: "请求 ID", dataIndex: "request_id" },
+                    { title: "发送时间", dataIndex: "created_at", render: formatDateTime, width: 180 },
+                    { title: "指令", dataIndex: "action" },
+                    {
+                      title: "实际成功",
+                      dataIndex: "ok",
+                      width: 120,
+                      render: renderResultTag
+                    },
+                    {
+                      title: "操作",
+                      width: 100,
+                      render: (_, row) => (
+                        <Button
+                          size="small"
+                          onClick={() => {
+                            setKernelDetail(row);
+                            setKernelDetailOpen(true);
+                          }}
+                        >
+                          详情
+                        </Button>
+                      )
+                    }
+                  ]}
+                />
+              </Card>
+            )
+          }
+        ]}
+      />
+      <Drawer
+        open={systemLogDetailOpen}
+        title="业务系统调用详情"
+        width={860}
+        onClose={() => {
+          setSystemLogDetailOpen(false);
+          setSystemLogDetail(null);
+        }}
+      >
+        <Space direction="vertical" size={16} style={{ width: "100%" }}>
+          <Card className="page-card" title="基本信息">
+            <Descriptions
+              bordered
+              size="small"
+              column={1}
+              items={getSystemInvocationDetailItems(systemLogDetail)}
+            />
+          </Card>
+          <Card className="page-card" title="请求参数">
+            <pre style={jsonBlockStyle}>{formatJson(systemLogDetail?.request_payload)}</pre>
+          </Card>
+          <Card className="page-card" title="返回结果">
+            <pre style={jsonBlockStyle}>{formatJson(systemLogDetail?.response_payload)}</pre>
+          </Card>
+        </Space>
+      </Drawer>
+      <Drawer
+        open={kernelDetailOpen}
+        title="内核调用详情"
+        width={860}
+        onClose={() => {
+          setKernelDetailOpen(false);
+          setKernelDetail(null);
+        }}
+      >
+        <Space direction="vertical" size={16} style={{ width: "100%" }}>
+          <Card className="page-card" title="基本信息">
+            <Descriptions
+              bordered
+              size="small"
+              column={1}
+              items={getKernelInvocationDetailItems(kernelDetail)}
+            />
+          </Card>
+          <Card className="page-card" title="参数">
+            <pre style={jsonBlockStyle}>{formatJson(kernelDetail?.params)}</pre>
+          </Card>
+          <Card className="page-card" title="返回结果">
+            <pre style={jsonBlockStyle}>{formatJson(kernelDetail?.result)}</pre>
+          </Card>
+          <Card className="page-card" title="错误">
+            <pre style={jsonBlockStyle}>{formatJson(kernelDetail?.error)}</pre>
+          </Card>
+        </Space>
+      </Drawer>
+    </>
+  );
+}