feat: 本次提交更新内容如下

计划列表构建完成

nkebao/src/pages/scenarios/plan/list/index.tsx

@@ -24,6 +24,7 @@ import {
   ClockCircleOutlined,
   DownOutlined,
 } from "@ant-design/icons";
+import { LeftOutline } from "antd-mobile-icons";
 
 import Layout from "@/components/Layout/Layout";
 import {
@@ -35,6 +36,7 @@ import {
 } from "./api";
 import style from "./index.module.scss";
 import { Task, ApiSettings, PlanDetail } from "./data";
+import PlanApi from "./planApi";
 
 const ScenarioList: React.FC = () => {
   const { scenarioId, scenarioName } = useParams<{
@@ -217,20 +219,12 @@ const ScenarioList: React.FC = () => {
       }
     } catch (error) {
       Toast.show({
-        content: "获取API设置失败",
+        content: "获取计划接口失败",
         position: "top",
       });
     }
   };
 
-  const handleCopyApiUrl = (url: string) => {
-    navigator.clipboard.writeText(url);
-    Toast.show({
-      content: "API地址已复制到剪贴板",
-      position: "top",
-    });
-  };
-
   const handleCreateNewPlan = () => {
     navigate(`/scenarios/new/${scenarioId}`);
   };
@@ -294,31 +288,31 @@ const ScenarioList: React.FC = () => {
   const getActionMenu = (task: Task) => [
     {
       key: "edit",
-      text: "编辑",
+      text: "编辑计划",
       icon: <EditOutlined />,
       onClick: () => {
         setShowActionMenu(null);
         navigate(`/scenarios/edit/${task.id}`);
       },
     },
-    {
-      key: "settings",
-      text: "API设置",
-      icon: <SettingOutlined />,
-      onClick: () => {
-        setShowActionMenu(null);
-        handleOpenApiSettings(task.id);
-      },
-    },
     {
       key: "copy",
-      text: "复制",
+      text: "复制计划",
       icon: <CopyOutlined />,
       onClick: () => {
         setShowActionMenu(null);
         handleCopyPlan(task.id);
       },
     },
+    {
+      key: "settings",
+      text: "计划接口",
+      icon: <SettingOutlined />,
+      onClick: () => {
+        setShowActionMenu(null);
+        handleOpenApiSettings(task.id);
+      },
+    },
     {
       key: "qrcode",
       text: "二维码",
@@ -330,7 +324,7 @@ const ScenarioList: React.FC = () => {
     },
     {
       key: "delete",
-      text: "删除",
+      text: "删除计划",
       icon: <DeleteOutlined />,
       onClick: () => {
         setShowActionMenu(null);
@@ -355,7 +349,14 @@ const ScenarioList: React.FC = () => {
           <NavBar
             back={null}
             style={{ background: "#fff" }}
-            left={<div className={style["nav-title"]}>{scenarioName}</div>}
+            left={
+              <div className={style["nav-title"]}>
+                <span style={{ verticalAlign: "middle" }}>
+                  <LeftOutline onClick={() => navigate(-1)} fontSize={24} />
+                </span>
+                {scenarioName}
+              </div>
+            }
             right={
               <Button
                 size="small"
@@ -504,81 +505,14 @@ const ScenarioList: React.FC = () => {
           )}
         </div>
 
-        {/* API设置弹窗 */}
-        <Popup
+        {/* 计划接口弹窗 */}
+        <PlanApi
           visible={showApiDialog}
-          onMaskClick={() => setShowApiDialog(false)}
-          position="bottom"
-          bodyStyle={{ height: "70vh" }}
-        >
-          <div className={style["api-dialog"]}>
-            <div className={style["dialog-header"]}>
-              <h3>API设置</h3>
-              <Button size="small" onClick={() => setShowApiDialog(false)}>
-                关闭
-              </Button>
-            </div>
-            <div className={style["dialog-content"]}>
-              <div className={style["api-item"]}>
-                <label>API Key:</label>
-                <div className={style["input-with-button"]}>
-                  <Input value={currentApiSettings.apiKey} disabled />
-                  <Button
-                    size="mini"
-                    onClick={() => handleCopyApiUrl(currentApiSettings.apiKey)}
-                  >
-                    复制
-                  </Button>
-                </div>
-                <div className={style["api-tip"]}>
-                  <strong>安全提示：</strong>
-                  请妥善保管API密钥，不要在客户端代码中暴露。建议在服务器端使用该密钥。
-                </div>
-              </div>
-              <div className={style["api-item"]}>
-                <label>Webhook URL:</label>
-                <div className={style["input-with-button"]}>
-                  <Input value={currentApiSettings.webhookUrl} disabled />
-                  <Button
-                    size="mini"
-                    onClick={() =>
-                      handleCopyApiUrl(currentApiSettings.webhookUrl)
-                    }
-                  >
-                    复制
-                  </Button>
-                </div>
-                <div className={style["api-params"]}>
-                  <div className={style["param-section"]}>
-                    <h4>必要参数</h4>
-                    <div className={style["param-list"]}>
-                      <div>
-                        <code>name</code> - 客户姓名
-                      </div>
-                      <div>
-                        <code>phone</code> - 手机号码
-                      </div>
-                    </div>
-                  </div>
-                  <div className={style["param-section"]}>
-                    <h4>可选参数</h4>
-                    <div className={style["param-list"]}>
-                      <div>
-                        <code>source</code> - 来源标识
-                      </div>
-                      <div>
-                        <code>remark</code> - 备注信息
-                      </div>
-                      <div>
-                        <code>tags</code> - 客户标签
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </Popup>
+          onClose={() => setShowApiDialog(false)}
+          apiKey={currentApiSettings.apiKey}
+          webhookUrl={currentApiSettings.webhookUrl}
+          taskId={currentApiSettings.taskId}
+        />
 
         {/* 操作菜单弹窗 */}
         <Popup