fix: 全局权限优化 — 7 项问题修复

1. 菜单权限修复：补充 10 个菜单的 permission 字段 + 修复 menu_service 回退逻辑（admin 直接跳过过滤，非 admin 无关联则不显示）+ 收紧前端过滤 2. 管理员重置密码：新增 POST /users/{id}/reset-password 端点 + 前端按钮 3. 告警处理人姓名：AlertResponse 添加 acknowledged_by_name 字段 4. Tab 权限过滤：PatientDetail 6 个 Tab 按权限过滤 + 状态字段 Tooltip 5. 消息中心 UI：添加 Popconfirm/AuthButton，移除 inline isDark
2026-05-15 19:00:48 +08:00
parent 9319203e09
commit 8763e10d6e
17 changed files with 451 additions and 69 deletions
--- a/apps/web/src/api/health/alerts.ts
+++ b/apps/web/src/api/health/alerts.ts
@@ -12,6 +12,7 @@ export interface Alert {
  detail?: Record<string, unknown>;
  status: string;
  acknowledged_by?: string;
+  acknowledged_by_name?: string;
  acknowledged_at?: string;
  resolved_at?: string;
  created_at: string;
--- a/apps/web/src/api/users.ts
+++ b/apps/web/src/api/users.ts
@@ -48,3 +48,7 @@ export async function deleteUser(id: string) {
 export async function assignRoles(userId: string, roleIds: string[]) {
  await client.post(`/users/${userId}/roles`, { role_ids: roleIds });
 }
+
+export async function resetPassword(id: string, req: { new_password: string; version: number }) {
+  await client.post(`/users/${id}/reset-password`, req);
+}
--- a/apps/web/src/layouts/MainLayout.tsx
+++ b/apps/web/src/layouts/MainLayout.tsx
@@ -179,7 +179,7 @@ const CollapsibleSubGroup = memo(function CollapsibleSubGroup({
  const hasActive = visibleChildren.some((c) => currentPath === (c.path || c.id));

  useEffect(() => {
-    if (hasActive) setExpanded(true);
+    if (hasActive) setExpanded(true); // eslint-disable-line react-hooks/set-state-in-effect -- 初始展开包含活跃菜单的分组
  }, [hasActive]);

  if (collapsed) {
@@ -397,7 +397,7 @@ export default function MainLayout({ children }: { children: React.ReactNode })
        if (!cancelled) {
          // 根据用户权限过滤菜单：菜单项声明 permission 时，用户必须有对应权限
          const perms = useAuthStore.getState().permissions;
-          const isAdmin = useAuthStore.getState().user?.roles?.some((r: string) => r === 'admin') ?? false;
+          const isAdmin = useAuthStore.getState().user?.roles?.some((r) => typeof r === 'object' && r.code === 'admin') ?? false;
          if (isAdmin) {
            setDynamicMenus(menus);
          } else {
@@ -408,10 +408,11 @@ export default function MainLayout({ children }: { children: React.ReactNode })
                  children: m.children ? filterByPerm(m.children) : undefined,
                }))
                .filter((m) => {
-                  if (!m.permission) return true;
+                  if (m.menu_type === 'directory') return true;
+                  if (!m.permission) return false;
                  return perms.includes(m.permission);
                })
-                .filter((m) => m.menu_type === 'directory' || !m.children || m.children.length > 0 || !m.permission || perms.includes(m.permission));
+                .filter((m) => m.menu_type === 'directory' || (m.children && m.children.length > 0) || (m.permission && perms.includes(m.permission)));
            setDynamicMenus(filterByPerm(menus));
          }
        }
--- a/apps/web/src/pages/Users.tsx
+++ b/apps/web/src/pages/Users.tsx
@@ -8,6 +8,8 @@ import {
  Tag,
  Popconfirm,
  Checkbox,
+  Modal,
+  message,
 } from 'antd';
 import {
  PlusOutlined,
@@ -17,6 +19,7 @@ import {
  SafetyCertificateOutlined,
  StopOutlined,
  CheckCircleOutlined,
+  KeyOutlined,
 } from '@ant-design/icons';
 import {
  listUsers,
@@ -24,6 +27,7 @@ import {
  updateUser,
  deleteUser,
  assignRoles,
+  resetPassword,
  type CreateUserRequest,
  type UpdateUserRequest,
 } from '../api/users';
@@ -31,6 +35,7 @@ import { listRoles, type RoleInfo } from '../api/roles';
 import type { UserInfo } from '../api/auth';
 import { PageContainer } from '../components/PageContainer';
 import { DrawerForm } from '../components/DrawerForm';
+import { AuthButton } from '../components/AuthButton';
 import { useCrudDrawer } from '../hooks/useCrudDrawer';
 import { usePaginatedData } from '../hooks/usePaginatedData';
 import { useApiRequest } from '../hooks/useApiRequest';
@@ -101,6 +106,39 @@ export default function Users() {
    setRoleDrawerOpen(true);
  };

+  // 重置密码
+  const [resetModalOpen, setResetModalOpen] = useState(false);
+  const [resetTarget, setResetTarget] = useState<UserInfo | null>(null);
+  const [resetLoading, setResetLoading] = useState(false);
+  const [resetForm] = Form.useForm();
+
+  const openResetModal = (user: UserInfo) => {
+    setResetTarget(user);
+    resetForm.resetFields();
+    setResetModalOpen(true);
+  };
+
+  const handleResetPassword = async () => {
+    try {
+      const values = await resetForm.validateFields();
+      if (!resetTarget) return;
+      setResetLoading(true);
+      await resetPassword(resetTarget.id, {
+        new_password: values.new_password,
+        version: resetTarget.version,
+      });
+      message.success('密码已重置');
+      setResetModalOpen(false);
+      resetForm.resetFields();
+      refresh();
+    } catch (error) {
+      if (error && typeof error === 'object' && 'errorFields' in error) return; // 表单校验失败，忽略
+      throw error;
+    } finally {
+      setResetLoading(false);
+    }
+  };
+
  const columns = [
    {
      title: '用户', dataIndex: 'username', key: 'username',
@@ -145,6 +183,9 @@ export default function Users() {
          <Button size="small" type="text" icon={<EditOutlined />} onClick={() => userDrawer.openEdit(record, (r) => ({
            username: r.username, display_name: r.display_name, email: r.email, phone: r.phone,
          }))} style={{ color: isDark ? '#94a3b8' : '#475569' }} />
+          <AuthButton code="user.reset-password">
+            <Button size="small" type="text" icon={<KeyOutlined />} onClick={() => openResetModal(record)} style={{ color: isDark ? '#94a3b8' : '#475569' }} />
+          </AuthButton>
          <Button size="small" type="text" icon={<SafetyCertificateOutlined />} onClick={() => openRoleDrawer(record)} style={{ color: isDark ? '#94a3b8' : '#475569' }} />
          {record.status === 'active' ? (
            <Popconfirm title="确定禁用此用户？" onConfirm={() => handleToggleStatus(record.id, 'disabled')}>
@@ -237,6 +278,49 @@ export default function Users() {
          </Checkbox.Group>
        </div>
      </DrawerForm>
+
+      {/* 重置密码 Modal */}
+      <Modal
+        title={`重置密码 - ${resetTarget?.username || ''}`}
+        open={resetModalOpen}
+        onCancel={() => setResetModalOpen(false)}
+        onOk={handleResetPassword}
+        confirmLoading={resetLoading}
+        okText="确认重置"
+        cancelText="取消"
+        destroyOnClose
+      >
+        <Form form={resetForm} layout="vertical" style={{ marginTop: 16 }}>
+          <Form.Item
+            name="new_password"
+            label="新密码"
+            rules={[
+              { required: true, message: '请输入新密码' },
+              { min: 6, message: '密码至少6位' },
+            ]}
+          >
+            <Input.Password placeholder="请输入新密码" />
+          </Form.Item>
+          <Form.Item
+            name="confirm_password"
+            label="确认密码"
+            dependencies={['new_password']}
+            rules={[
+              { required: true, message: '请确认新密码' },
+              ({ getFieldValue }) => ({
+                validator(_, value) {
+                  if (!value || getFieldValue('new_password') === value) {
+                    return Promise.resolve();
+                  }
+                  return Promise.reject(new Error('两次输入的密码不一致'));
+                },
+              }),
+            ]}
+          >
+            <Input.Password placeholder="请再次输入新密码" />
+          </Form.Item>
+        </Form>
+      </Modal>
    </PageContainer>
  );
 }
--- a/apps/web/src/pages/health/PatientDetail.tsx
+++ b/apps/web/src/pages/health/PatientDetail.tsx
@@ -14,8 +14,10 @@ import {
  DatePicker,
  message,
  Spin,
+  Tooltip,
 } from 'antd';
-import { ArrowLeftOutlined, EditOutlined } from '@ant-design/icons';
+import { ArrowLeftOutlined, EditOutlined, InfoCircleOutlined } from '@ant-design/icons';
+import { useAuthStore } from '../../stores/auth';
 import { patientApi } from '../../api/health/patients';
 import { AuthButton } from '../../components/AuthButton';
 import { CopilotBadge } from '../../components/Copilot';
@@ -57,6 +59,22 @@ export default function PatientDetail() {
  const [editModalOpen, setEditModalOpen] = useState(false);
  const [form] = Form.useForm();
  const isDark = useThemeMode();
+  const permissions = useAuthStore((s) => s.permissions);
+
+  /** Tab 权限映射：无权限码的 tab 始终可见 */
+  const TAB_PERMISSIONS: Record<string, string | undefined> = {
+    info: undefined,
+    family: 'health.patient.manage',
+    health: 'health.health-data.list',
+    followup: 'health.follow-up.list',
+    points: 'health.points.list',
+    ai: 'ai.analysis.list',
+  };
+
+  const hasPermission = (code: string | undefined): boolean => {
+    if (!code) return true;
+    return permissions.includes(code);
+  };

  // --- 加载患者基本信息 ---
  const fetchPatient = useCallback(async () => {
@@ -268,10 +286,24 @@ export default function PatientDetail() {
                  <Descriptions.Item label="身份证号">
                    {patient.id_number || '-'}
                  </Descriptions.Item>
-                  <Descriptions.Item label="状态">
+                  <Descriptions.Item label={
+                    <Space size={4}>
+                      <span>状态</span>
+                      <Tooltip title="active=活跃 | inactive=停诊 | deceased=已故。停诊/已故会触发对应业务事件。">
+                        <InfoCircleOutlined style={{ color: 'var(--ant-color-text-quaternary)', fontSize: 12 }} />
+                      </Tooltip>
+                    </Space>
+                  }>
                    <StatusTag status={patient.status} />
                  </Descriptions.Item>
-                  <Descriptions.Item label="认证状态">
+                  <Descriptions.Item label={
+                    <Space size={4}>
+                      <span>认证状态</span>
+                      <Tooltip title="pending=待认证 | verified=已认证 | rejected=已驳回。已认证会触发 PATIENT_VERIFIED 事件。">
+                        <InfoCircleOutlined style={{ color: 'var(--ant-color-text-quaternary)', fontSize: 12 }} />
+                      </Tooltip>
+                    </Space>
+                  }>
                    <StatusTag status={patient.verification_status} />
                  </Descriptions.Item>
                  <Descriptions.Item label="来源">
@@ -351,7 +383,7 @@ export default function PatientDetail() {
                </Space>
              ) : null,
            },
-          ]}
+          ].filter((tab) => hasPermission(TAB_PERMISSIONS[tab.key]))}
        />
      </Card>

--- a/apps/web/src/pages/health/components/AlertDetailPanel.tsx
+++ b/apps/web/src/pages/health/components/AlertDetailPanel.tsx
@@ -173,7 +173,7 @@ export function AlertDetailPanel({
        {alert.acknowledged_by && (
          <Descriptions.Item label="处理人" span={2}>
            <Typography.Text style={{ fontSize: 12 }}>
-              {alert.acknowledged_by}
+              {alert.acknowledged_by_name || `${alert.acknowledged_by.slice(0, 8)}...`}
            </Typography.Text>
          </Descriptions.Item>
        )}
--- a/apps/web/src/pages/messages/MessageTemplates.tsx
+++ b/apps/web/src/pages/messages/MessageTemplates.tsx
@@ -1,9 +1,9 @@
 import { useEffect, useState, useCallback } from 'react';
-import { Table, Button, Modal, Form, Input, Select, message, Tag } from 'antd';
+import { Table, Button, Modal, Form, Input, Select, message, Tag, Card } from 'antd';
 import { PlusOutlined } from '@ant-design/icons';
 import type { ColumnsType } from 'antd/es/table';
 import { listTemplates, createTemplate, type MessageTemplateInfo } from '../../api/messageTemplates';
-import { useThemeMode } from '../../hooks/useThemeMode';
+import { AuthButton } from '../../components/AuthButton';

 const channelMap: Record<string, { label: string; color: string }> = {
  in_app: { label: '站内', color: '#2563eb' },
@@ -19,7 +19,6 @@ export default function MessageTemplates() {
  const [loading, setLoading] = useState(false);
  const [modalOpen, setModalOpen] = useState(false);
  const [form] = Form.useForm();
-  const isDark = useThemeMode();

  const fetchData = useCallback(async (p = page) => {
    setLoading(true);
@@ -64,9 +63,9 @@ export default function MessageTemplates() {
      key: 'code',
      render: (v: string) => (
        <Tag style={{
-          background: isDark ? '#0f172a' : '#f8fafc',
+          background: 'var(--ant-color-fill-quaternary)',
          border: 'none',
-          color: isDark ? '#94a3b8' : '#475569',
+          color: 'var(--ant-color-text-secondary)',
          fontFamily: 'monospace',
          fontSize: 12,
        }}>
@@ -111,7 +110,7 @@ export default function MessageTemplates() {
      key: 'created_at',
      width: 180,
      render: (v: string) => (
-        <span style={{ color: isDark ? '#475569' : '#94a3b8', fontSize: 13 }}>{v}</span>
+        <span style={{ color: 'var(--ant-color-text-secondary)', fontSize: 13 }}>{v}</span>
      ),
    },
  ];
@@ -124,20 +123,17 @@ export default function MessageTemplates() {
        alignItems: 'center',
        marginBottom: 16,
      }}>
-        <span style={{ fontSize: 13, color: isDark ? '#475569' : '#94a3b8' }}>
+        <span style={{ fontSize: 13, color: 'var(--ant-color-text-secondary)' }}>
          共 {total} 个模板
        </span>
-        <Button type="primary" icon={<PlusOutlined />} onClick={() => setModalOpen(true)}>
-          新建模板
-        </Button>
+        <AuthButton code="message.manage">
+          <Button type="primary" icon={<PlusOutlined />} onClick={() => setModalOpen(true)}>
+            新建模板
+          </Button>
+        </AuthButton>
      </div>

-      <div style={{
-        background: isDark ? '#111827' : '#FFFFFF',
-        borderRadius: 12,
-        border: `1px solid ${isDark ? '#0f172a' : '#f8fafc'}`,
-        overflow: 'hidden',
-      }}>
+      <Card styles={{ body: { padding: 0 } }}>
        <Table
          columns={columns}
          dataSource={data}
@@ -151,7 +147,7 @@ export default function MessageTemplates() {
            showTotal: (t) => `共 ${t} 条记录`,
          }}
        />
-      </div>
+      </Card>

      <Modal
        title="新建消息模板"
--- a/apps/web/src/pages/messages/NotificationList.tsx
+++ b/apps/web/src/pages/messages/NotificationList.tsx
@@ -1,9 +1,9 @@
 import { useEffect, useState, useMemo, useCallback, useRef } from 'react';
-import { Table, Button, Tag, Space, Modal, Typography, message } from 'antd';
+import { Table, Button, Tag, Space, Modal, Typography, Popconfirm, Card, message } from 'antd';
 import { CheckOutlined, DeleteOutlined, EyeOutlined } from '@ant-design/icons';
 import type { ColumnsType } from 'antd/es/table';
 import { listMessages, markRead, markAllRead, deleteMessage, type MessageInfo, type MessageQuery } from '../../api/messages';
-import { useThemeMode } from '../../hooks/useThemeMode';
+import { AuthButton } from '../../components/AuthButton';

 const { Paragraph } = Typography;

@@ -32,7 +32,6 @@ export default function NotificationList({ queryFilter }: Props) {
  const [total, setTotal] = useState(0);
  const [page, setPage] = useState(1);
  const [loading, setLoading] = useState(false);
-  const isDark = useThemeMode();

  const fetchData = useCallback(async (p = page, filter?: MessageQuery) => {
    setLoading(true);
@@ -93,7 +92,7 @@ export default function NotificationList({ queryFilter }: Props) {
      content: (
        <div>
          <Paragraph>{record.body}</Paragraph>
-          <div style={{ marginTop: 8, color: isDark ? '#475569' : '#94a3b8', fontSize: 12 }}>
+          <div style={{ marginTop: 8, color: 'var(--ant-color-text-secondary)', fontSize: 12 }}>
            {formatDateTime(record.created_at)}
          </div>
        </div>
@@ -114,7 +113,7 @@ export default function NotificationList({ queryFilter }: Props) {
          style={{
            fontWeight: record.is_read ? 400 : 600,
            cursor: 'pointer',
-            color: record.is_read ? (isDark ? '#94a3b8' : '#475569') : 'inherit',
+            color: record.is_read ? 'var(--ant-color-text-secondary)' : 'inherit',
          }}
          onClick={() => showDetail(record)}
        >
@@ -156,7 +155,7 @@ export default function NotificationList({ queryFilter }: Props) {
      dataIndex: 'sender_type',
      key: 'sender_type',
      width: 80,
-      render: (s: string) => <span style={{ color: isDark ? '#475569' : '#94a3b8' }}>{s === 'system' ? '系统' : '用户'}</span>,
+      render: (s: string) => <span style={{ color: 'var(--ant-color-text-secondary)' }}>{s === 'system' ? '系统' : '用户'}</span>,
    },
    {
      title: '状态',
@@ -165,9 +164,9 @@ export default function NotificationList({ queryFilter }: Props) {
      width: 80,
      render: (r: boolean) => (
        <Tag style={{
-          background: r ? (isDark ? '#0f172a' : '#f8fafc') : '#eff6ff',
+          background: r ? 'var(--ant-color-fill-quaternary)' : '#eff6ff',
          border: 'none',
-          color: r ? (isDark ? '#475569' : '#94a3b8') : '#2563eb',
+          color: r ? 'var(--ant-color-text-secondary)' : '#2563eb',
          fontWeight: 500,
        }}>
          {r ? '已读' : '未读'}
@@ -180,7 +179,7 @@ export default function NotificationList({ queryFilter }: Props) {
      key: 'created_at',
      width: 180,
      render: (v: string) => (
-        <span style={{ color: isDark ? '#475569' : '#94a3b8', fontSize: 13 }}>{formatDateTime(v)}</span>
+        <span style={{ color: 'var(--ant-color-text-secondary)', fontSize: 13 }}>{formatDateTime(v)}</span>
      ),
    },
    {
@@ -203,15 +202,21 @@ export default function NotificationList({ queryFilter }: Props) {
            size="small"
            icon={<EyeOutlined />}
            onClick={() => showDetail(record)}
-            style={{ color: isDark ? '#475569' : '#94a3b8' }}
-          />
-          <Button
-            type="text"
-            size="small"
-            danger
-            icon={<DeleteOutlined />}
-            onClick={() => handleDelete(record.id)}
+            style={{ color: 'var(--ant-color-text-secondary)' }}
          />
+          <AuthButton code="message.manage">
+            <Popconfirm
+              title="确定删除此消息？"
+              onConfirm={() => handleDelete(record.id)}
+            >
+              <Button
+                type="text"
+                size="small"
+                danger
+                icon={<DeleteOutlined />}
+              />
+            </Popconfirm>
+          </AuthButton>
        </Space>
      ),
    },
@@ -225,20 +230,17 @@ export default function NotificationList({ queryFilter }: Props) {
        alignItems: 'center',
        marginBottom: 16,
      }}>
-        <span style={{ fontSize: 13, color: isDark ? '#475569' : '#94a3b8' }}>
+        <span style={{ fontSize: 13, color: 'var(--ant-color-text-secondary)' }}>
          共 {total} 条消息
        </span>
-        <Button icon={<CheckOutlined />} onClick={handleMarkAllRead}>
-          全部标记已读
-        </Button>
+        <AuthButton code="message.manage">
+          <Button icon={<CheckOutlined />} onClick={handleMarkAllRead}>
+            全部标记已读
+          </Button>
+        </AuthButton>
      </div>

-      <div style={{
-        background: isDark ? '#111827' : '#FFFFFF',
-        borderRadius: 12,
-        border: `1px solid ${isDark ? '#0f172a' : '#f8fafc'}`,
-        overflow: 'hidden',
-      }}>
+      <Card styles={{ body: { padding: 0 } }}>
        <Table
          columns={columns}
          dataSource={data}
@@ -252,7 +254,7 @@ export default function NotificationList({ queryFilter }: Props) {
            showTotal: (t) => `共 ${t} 条记录`,
          }}
        />
-      </div>
+      </Card>
    </div>
  );
 }