From 236176d5ffe50956f92c713cf0f6d4c54390a332 Mon Sep 17 00:00:00 2001
From: chenhao <chenhao2@unisinsight.com>
Date: Fri, 12 Jun 2026 17:36:52 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E4=BC=9A?=
 =?UTF-8?q?=E8=AE=AE=E9=A2=84=E8=A7=88=E9=A1=B5=E9=9D=A2=E7=9A=84=E5=88=86?=
 =?UTF-8?q?=E4=BA=AB=E8=AE=BE=E7=BD=AE=E6=A0=B7=E5=BC=8F=E5=92=8C=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 更新 `MeetingPreviewView.css`，移除未使用的类并优化样式
- 在 `MeetingPreviewView.tsx` 中添加密码修改模态框，支持访问密码的设置和修改
- 优化分享设置的显示逻辑，新增紧凑模式和密码显示功能
---
 .../components/preview/MeetingPreviewView.css | 66 ++++++++++------
 .../components/preview/MeetingPreviewView.tsx | 75 +++++++++++++++----
 2 files changed, 103 insertions(+), 38 deletions(-)

diff --git a/imeeting-h5/src/components/preview/MeetingPreviewView.css b/imeeting-h5/src/components/preview/MeetingPreviewView.css
index 0c9c051..b68901e 100644
--- a/imeeting-h5/src/components/preview/MeetingPreviewView.css
+++ b/imeeting-h5/src/components/preview/MeetingPreviewView.css
@@ -72,7 +72,6 @@
 }
 
 .meeting-preview-collapsible-section,
-.meeting-preview-share-settings,
 .meeting-preview-content-card {
   background: var(--bg-surface);
   border-radius: 20px;
@@ -155,29 +154,53 @@
   font-weight: 600;
 }
 
-.meeting-preview-share-settings {
-  padding: 20px;
+.meeting-preview-share-settings-compact {
+  padding: 16px 20px;
   margin-bottom: 20px;
-}
-
-.meeting-preview-share-settings-title {
-  font-size: 18px;
-  font-weight: 800;
-  margin-bottom: 4px;
-}
-
-.meeting-preview-share-settings-desc {
-  color: var(--text-secondary);
-  margin-bottom: 16px;
-}
-
-.meeting-preview-share-settings-row {
+  background: var(--bg-surface);
+  border-radius: 20px;
+  border: 1px solid var(--border-color);
+  box-shadow: var(--card-shadow);
   display: flex;
-  gap: 12px;
+  align-items: center;
+  justify-content: center;
 }
 
-.meeting-preview-share-settings-row .ant-input-affix-wrapper {
+.share-password-display {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  width: 100%;
+}
+
+.share-password-label {
+  color: var(--text-secondary);
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+
+.share-password-value {
+  font-family: monospace;
+  font-weight: 800;
+  font-size: 15px;
+  background: #f8faff;
+  padding: 4px 12px;
+  border-radius: 8px;
+  border: 1px dashed var(--primary-blue);
+  color: var(--primary-blue);
+  flex: 1;
+  text-align: center;
+}
+
+.set-password-btn {
+  width: 100%;
   border-radius: 14px;
+  height: 48px;
+  font-weight: 600;
+  color: var(--primary-blue);
+  border-color: var(--primary-blue);
 }
 
 .meeting-preview-share-bar {
@@ -539,14 +562,11 @@
   }
 
   .meeting-preview-share-bar,
-  .meeting-preview-share-settings-row,
   .meeting-preview-catalog-item-title-row {
     flex-direction: column;
   }
 
-  .meeting-preview-share-bar .ant-btn,
-  .meeting-preview-share-settings-row .ant-btn,
-  .meeting-preview-share-settings-row .ant-input-affix-wrapper {
+  .meeting-preview-share-bar .ant-btn {
     width: 100%;
   }
 
diff --git a/imeeting-h5/src/components/preview/MeetingPreviewView.tsx b/imeeting-h5/src/components/preview/MeetingPreviewView.tsx
index 78ff32f..bac65f9 100644
--- a/imeeting-h5/src/components/preview/MeetingPreviewView.tsx
+++ b/imeeting-h5/src/components/preview/MeetingPreviewView.tsx
@@ -16,7 +16,7 @@ import {
   UpOutlined,
   UserOutlined,
 } from "@ant-design/icons";
-import {Alert, Button, Empty, Input, Tabs, message} from "antd";
+import {Alert, Button, Empty, Input, Tabs, message, Modal} from "antd";
 import dayjs from "dayjs";
 import ReactMarkdown from "react-markdown";
 
@@ -45,7 +45,7 @@ interface MeetingPreviewViewProps {
   sharePasswordDraft?: string;
   shareSaving?: boolean;
   onSharePasswordDraftChange?: (value: string) => void;
-  onSaveSharePassword?: () => void;
+  onSaveSharePassword?: () => void | Promise<void>;
   onCopyShareLink?: () => void | Promise<void>;
 }
 
@@ -174,6 +174,7 @@ export default function MeetingPreviewView({
   const [isMetricsExpanded, setIsMetricsExpanded] = useState(false);
   const [linkedTranscriptIds, setLinkedTranscriptIds] = useState<number[]>([]);
   const [linkedChapterKey, setLinkedChapterKey] = useState<string | null>(null);
+  const [isPasswordModalVisible, setIsPasswordModalVisible] = useState(false);
 
   const analysis = useMemo(
     () => buildMeetingAnalysis(meeting?.analysis, meeting?.summaryContent, meeting?.tags || ""),
@@ -397,20 +398,34 @@ export default function MeetingPreviewView({
           </div>
 
           {editableShare ? (
-            <div className="meeting-preview-share-settings">
-              <div className="meeting-preview-share-settings-title">{TEXT.shareSettings}</div>
-              <div className="meeting-preview-share-settings-desc">{TEXT.shareSettingsHint}</div>
-              <div className="meeting-preview-share-settings-row">
-                <Input.Password
-                  value={sharePasswordDraft}
-                  placeholder={TEXT.passwordPlaceholder}
-                  prefix={<LockOutlined/>}
-                  onChange={(event) => onSharePasswordDraftChange?.(event.target.value)}
-                />
-                <Button type="primary" loading={shareSaving} onClick={onSaveSharePassword}>
-                  {TEXT.saveSharePassword}
+            <div className="meeting-preview-share-settings-compact">
+              {meeting.accessPassword ? (
+                <div className="share-password-display">
+                  <span className="share-password-label">
+                    <LockOutlined style={{marginRight: 6}}/>
+                    访问密码
+                  </span>
+                  <span className="share-password-value">{meeting.accessPassword}</span>
+                  <Button type="link" size="small" onClick={() => {
+                    onSharePasswordDraftChange?.(meeting.accessPassword || "");
+                    setIsPasswordModalVisible(true);
+                  }}>
+                    修改 / 取消
+                  </Button>
+                </div>
+              ) : (
+                <Button
+                  type="dashed"
+                  icon={<LockOutlined/>}
+                  onClick={() => {
+                    onSharePasswordDraftChange?.("");
+                    setIsPasswordModalVisible(true);
+                  }}
+                  className="set-password-btn"
+                >
+                  设置分享访问密码
                 </Button>
-              </div>
+              )}
             </div>
           ) : null}
 
@@ -566,6 +581,36 @@ export default function MeetingPreviewView({
         </div>
       </div>
 
+      <Modal
+        title="设置访问密码"
+        open={isPasswordModalVisible}
+        onOk={async () => {
+          if (onSaveSharePassword) {
+            await onSaveSharePassword();
+          }
+          setIsPasswordModalVisible(false);
+        }}
+        onCancel={() => {
+          setIsPasswordModalVisible(false);
+          onSharePasswordDraftChange?.(meeting.accessPassword || "");
+        }}
+        confirmLoading={shareSaving}
+        okText="保存"
+        cancelText="取消"
+        destroyOnClose
+      >
+        <div style={{marginBottom: 16, color: "var(--text-secondary)"}}>
+          {TEXT.shareSettingsHint}
+        </div>
+        <Input.Password
+          value={sharePasswordDraft}
+          placeholder={TEXT.passwordPlaceholder}
+          prefix={<LockOutlined/>}
+          onChange={(event) => onSharePasswordDraftChange?.(event.target.value)}
+          allowClear
+        />
+      </Modal>
+
       {playbackAudioUrl ? (
         <div className="meeting-preview-audio-player-inline"
              style={{display: pageTab === "transcript" ? "flex" : "none"}}>