修复会议管理的列表分页和声纹注册优化

frontend/src/pages/business/Meetings.tsx

@@ -499,6 +499,11 @@ const Meetings: React.FC = () => {
 
   const activeFilterCount = (statusFilter !== ALL_STATUS_FILTER ? 1 : 0) + (searchTitle ? 1 : 0);
 
+  const handlePaginationChange = (page: number, pageSize: number) => {
+    setCurrent(pageSize !== size ? 1 : page);
+    setSize(pageSize);
+  };
+
   const handleDisplayModeChange = (mode: "card" | "list") => {
     setDisplayMode(mode);
     setSize(mode === "card" ? 8 : 10);
@@ -557,6 +562,13 @@ const Meetings: React.FC = () => {
     void fetchData();
   }, [current, size, searchTitle, viewType, statusFilter]);
 
+  useEffect(() => {
+    const maxPage = Math.max(1, Math.ceil(total / size));
+    if (current > maxPage) {
+      setCurrent(maxPage);
+    }
+  }, [current, size, total]);
+
   useEffect(() => {
     const trackedMeetings = data.filter(shouldTrackGenerationProgress);
     if (trackedMeetings.length === 0) {
@@ -930,8 +942,9 @@ const Meetings: React.FC = () => {
         style={{ flex: 1, minHeight: 0, overflow: "hidden", display: "flex", flexDirection: "column", border: 'none', background: 'transparent' }}
         styles={{ body: { padding: 0, flex: 1, display: "flex", flexDirection: "column", overflow: "hidden" } }}
       >
-        <div className="app-page__table-wrap" style={{ flex: 1, minHeight: 0, overflowY: "auto", overflowX: "hidden", padding: "4px" }}>
+        <div className="app-page__table-wrap" style={{ flex: 1, minHeight: 0, overflow: "hidden", padding: "4px" }}>
           {displayMode === "card" ? (
+            <div style={{ height: "100%", minHeight: 0, overflowY: "auto", overflowX: "hidden" }}>
               <Skeleton loading={loading} active paragraph={{ rows: 8 }}>
                 <List
                   grid={{ gutter: [20, 20], xs: 1, sm: 2, md: 2, lg: 3, xl: 4, xxl: 4 }}
@@ -955,14 +968,16 @@ const Meetings: React.FC = () => {
                   locale={{ emptyText: <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="开启您的第一场会议分析" /> }}
                 />
               </Skeleton>
+            </div>
           ) : (
             <Table
+              className="meetings-list-table"
               columns={tableColumns}
               dataSource={data}
               rowKey="id"
               loading={loading}
               pagination={false}
-              scroll={{ x: "max-content" }}
+              scroll={{ x: "max-content", y: "calc(100vh - 430px)" }}
               onRow={(record) => ({ onClick: () => handleOpenMeeting(record), style: { cursor: "pointer" } })}
               locale={{ emptyText: <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="开启您的第一场会议分析" /> }}
             />
@@ -970,7 +985,7 @@ const Meetings: React.FC = () => {
         </div>
 
         <div style={{ padding: "16px 4px 0", flexShrink: 0, display: 'flex', justifyContent: 'center' }}>
-          <AppPagination current={current} pageSize={size} total={total} onChange={(p, s) => { setCurrent(p); setSize(s); }} />
+          <AppPagination current={current} pageSize={size} total={total} onChange={handlePaginationChange} />
         </div>
       </Card>
 
@@ -990,6 +1005,17 @@ const Meetings: React.FC = () => {
         .meeting-card-v2:hover .view-detail-text { max-width: 60px; opacity: 1; margin-left: 6px; }
         .status-bar-active { animation: statusBreathing 2s infinite ease-in-out; }
         @keyframes statusBreathing { 0% { opacity: 1; } 50% { opacity: 0.4; } 100% { opacity: 1; } }
+        .meetings-list-table.ant-table-wrapper,
+        .meetings-list-table.ant-table-wrapper .ant-spin-nested-loading,
+        .meetings-list-table.ant-table-wrapper .ant-spin-container,
+        .meetings-list-table.ant-table-wrapper .ant-table,
+        .meetings-list-table.ant-table-wrapper .ant-table-container {
+          height: 100%;
+          min-height: 0;
+        }
+        .meetings-list-table.ant-table-wrapper .ant-table-body {
+          max-height: calc(100vh - 430px) !important;
+        }
         
         /* Premium Button Styles */
         .ant-btn-primary:not(.ant-btn-dangerous) {

frontend/src/pages/business/SpeakerReg.tsx

@@ -30,6 +30,31 @@ const REG_CONTENT =
   'iMeeting 智能会议系统，助力高效办公，让每一场讨论都有据可查。我正在进行声纹注册，以确保会议识别的准确性。';
 const DEFAULT_DURATION = 15;
 const DEFAULT_PAGE_SIZE = 8;
+const AUDIO_EXT_PATTERN = /\.(mp3|wav|m4a|aac|ogg|flac|webm)$/i;
+
+const SPEAKER_STATUS_META: Record<number, { label: string; color: string }> = {
+  1: { label: '已保存', color: 'default' },
+  2: { label: '注册中', color: 'processing' },
+  3: { label: '已注册', color: 'success' },
+  4: { label: '本地已保存，声纹同步失败', color: 'error' }
+};
+
+const getSpeakerStatusMeta = (status?: number) => {
+  return SPEAKER_STATUS_META[Number(status)] || SPEAKER_STATUS_META[1];
+};
+
+const isAudioFile = (file: File) => {
+  return file.type.startsWith('audio/') || AUDIO_EXT_PATTERN.test(file.name);
+};
+
+const buildResourceUrl = (prefix: string, resourcePath?: string) => {
+  if (!resourcePath) {
+    return '';
+  }
+  const normalizedPrefix = prefix.endsWith('/') ? prefix : `${prefix}/`;
+  const normalizedPath = resourcePath.startsWith('/') ? resourcePath.slice(1) : resourcePath;
+  return `${normalizedPrefix}${normalizedPath}`;
+};
 
 const SpeakerReg: React.FC = () => {
   const { message } = App.useApp();
@@ -48,26 +73,36 @@ const SpeakerReg: React.FC = () => {
   const [userOptions, setUserOptions] = useState<SysUser[]>([]);
   const [editingSpeaker, setEditingSpeaker] = useState<SpeakerVO | null>(null);
   const [seconds, setSeconds] = useState(0);
-  const timerRef = useRef<any>(null);
+  const timerRef = useRef<ReturnType<typeof setInterval> | null>(null);
-  const autoStopTimerRef = useRef<any>(null);
+  const autoStopTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const mediaRecorderRef = useRef<MediaRecorder | null>(null);
   const audioChunksRef = useRef<Blob[]>([]);
+  const mountedRef = useRef(true);
   const { profile } = useAuth();
   const isAdmin = !!(profile?.isAdmin || profile?.isPlatformAdmin);
 
   const resourcePrefix = useMemo(() => {
+    try {
       const configStr = sessionStorage.getItem('platformConfig');
       if (configStr) {
         const config = JSON.parse(configStr);
         return config.resourcePrefix || '/api/static/';
       }
+    } catch (err) {
+      console.warn('Parse platformConfig failed', err);
+    }
     return '/api/static/';
   }, []);
 
   useEffect(() => {
     void fetchUsers();
     return () => {
+      mountedRef.current = false;
       stopTimer();
+      if (mediaRecorderRef.current?.state === 'recording') {
+        mediaRecorderRef.current.stop();
+      }
+      mediaRecorderRef.current?.stream.getTracks().forEach(track => track.stop());
     };
   }, []);
 
@@ -90,7 +125,7 @@ const SpeakerReg: React.FC = () => {
     }
     form.setFieldValue('userId', profile.userId);
     form.setFieldValue('name', profile.displayName);
-  }, [form, isAdmin, profile?.userId]);
+  }, [form, isAdmin, profile?.displayName, profile?.userId]);
 
   const fetchSpeakers = async (page = current, size = pageSize, name = queryName) => {
     setListLoading(true);
@@ -132,10 +167,8 @@ const SpeakerReg: React.FC = () => {
 
   const resetAudioState = () => {
     setAudioBlob(null);
-    if (audioUrl) {
-      URL.revokeObjectURL(audioUrl);
-    }
     setAudioUrl(null);
+    setSeconds(0);
   };
 
   const resetFormState = () => {
@@ -143,6 +176,7 @@ const SpeakerReg: React.FC = () => {
     form.resetFields(['id', 'name', 'userId', 'remark']);
     if (!isAdmin && profile?.userId) {
       form.setFieldValue('userId', profile.userId);
+      form.setFieldValue('name', profile.displayName);
     }
     resetAudioState();
   };
@@ -171,6 +205,14 @@ const SpeakerReg: React.FC = () => {
   };
 
   const startRecording = async () => {
+    if (loading) {
+      message.warning('声纹正在提交，请稍后再录制');
+      return;
+    }
+    if (!navigator.mediaDevices?.getUserMedia || typeof MediaRecorder === 'undefined') {
+      message.error('当前浏览器不支持录音，请使用音频文件上传');
+      return;
+    }
     try {
       const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
       const mediaRecorder = new MediaRecorder(stream);
@@ -184,6 +226,9 @@ const SpeakerReg: React.FC = () => {
       };
 
       mediaRecorder.onstop = () => {
+        if (!mountedRef.current) {
+          return;
+        }
         const blob = new Blob(audioChunksRef.current, { type: 'audio/wav' });
         resetAudioState();
         setAudioBlob(blob);
@@ -212,7 +257,15 @@ const SpeakerReg: React.FC = () => {
 
   const uploadProps: UploadProps = {
     beforeUpload: file => {
-      const isAudio = file.type.startsWith('audio/');
+      if (recording) {
+        message.warning('请先停止录音，再上传音频文件');
+        return Upload.LIST_IGNORE;
+      }
+      if (loading) {
+        message.warning('声纹正在提交，请稍后再上传');
+        return Upload.LIST_IGNORE;
+      }
+      const isAudio = isAudioFile(file);
       if (!isAudio) {
         message.error('只能上传音频文件');
         return Upload.LIST_IGNORE;
@@ -222,6 +275,7 @@ const SpeakerReg: React.FC = () => {
       setAudioUrl(URL.createObjectURL(file));
       return false;
     },
+    disabled: recording || loading,
     showUploadList: false
   };
 
@@ -262,6 +316,9 @@ const SpeakerReg: React.FC = () => {
     try {
       await deleteSpeaker(speaker.id);
       message.success('声纹已删除');
+      if (editingSpeaker?.id === speaker.id) {
+        resetFormState();
+      }
       if (speakers.length === 1 && current > 1) {
         setCurrent(current - 1);
       } else {
@@ -284,7 +341,7 @@ const SpeakerReg: React.FC = () => {
     resetAudioState();
   };
 
-  const handleUserChange = (userId: number) => {
+  const handleUserChange = (userId?: number) => {
     const selectedUser = userOptions.find(u => u.userId === userId);
     if (selectedUser) {
       form.setFieldValue('name', selectedUser.displayName || selectedUser.username);
@@ -569,6 +626,9 @@ const SpeakerReg: React.FC = () => {
                         <button
                           className={`btn-record ${recording ? 'recording' : 'idle'}`}
                           onClick={recording ? stopRecording : startRecording}
+                          disabled={loading}
+                          type="button"
+                          aria-label={recording ? '停止录制声纹样本' : '开始录制声纹样本'}
                         >
                           {recording ? <StopOutlined style={{ fontSize: 24 }} /> : <AudioOutlined style={{ fontSize: 24 }} />}
                         </button>
@@ -678,14 +738,16 @@ const SpeakerReg: React.FC = () => {
                   style={{ marginTop: 40 }}
                 />
               ) : (
-                speakers.map((s) => (
+                speakers.map((s) => {
+                  const statusMeta = getSpeakerStatusMeta(s.status);
+                  return (
                   <div className="speaker-card" key={s.id}>
                     <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 8 }}>
                       <div style={{ flex: 1, minWidth: 0 }}>
                         <Text strong style={{ fontSize: 15 }} ellipsis>{s.name}</Text>
                         <div style={{ display: 'flex', gap: 8, marginTop: 4, alignItems: 'center' }}>
-                          <Tag color={s.status === 3 ? 'success' : 'processing'} bordered={false} style={{ margin: 0, fontSize: 11, borderRadius: 4 }}>
+                          <Tag color={statusMeta.color} bordered={false} style={{ margin: 0, fontSize: 11, borderRadius: 4 }}>
-                            {s.status === 3 ? '已就绪' : '处理中'}
+                            {statusMeta.label}
                           </Tag>
                           {s.userId && <Text type="secondary" style={{ fontSize: 11 }}><UserOutlined /> ID:{s.userId}</Text>}
                         </div>
@@ -705,7 +767,7 @@ const SpeakerReg: React.FC = () => {
                     )}
 
                     <audio
-                      src={`${resourcePrefix}${s.voicePath}`}
+                      src={buildResourceUrl(resourcePrefix, s.voicePath)}
                       controls
                       controlsList="nodownload"
                       style={{ width: '100%', height: 28, marginTop: 4 }}
@@ -716,7 +778,8 @@ const SpeakerReg: React.FC = () => {
                       <span>{((s.voiceSize || 0) / 1024).toFixed(1)} KB</span>
                     </div>
                   </div>
-                ))
+                  );
+                })
               )}
             </Spin>
           </div>