{header && {header} }
- {children}
+
+ {loading ? (
+
{footer && }
);
diff --git a/nkebao/src/components/Layout/layout.module.scss b/nkebao/src/components/Layout/layout.module.scss
index 796b26365..ed336f6fe 100644
--- a/nkebao/src/components/Layout/layout.module.scss
+++ b/nkebao/src/components/Layout/layout.module.scss
@@ -8,4 +8,21 @@
.container main {
flex: 1;
overflow: auto;
+}
+
+.loadingContainer {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 100%;
+ min-height: 300px;
+ background: rgba(255, 255, 255, 0.8);
+}
+
+.loadingText {
+ margin-top: 16px;
+ color: #666;
+ font-size: 14px;
+ text-align: center;
}
\ No newline at end of file
diff --git a/nkebao/src/components/MeauMobile/MeauMoible.tsx b/nkebao/src/components/MeauMobile/MeauMoible.tsx
index 52a71d209..5f6f80869 100644
--- a/nkebao/src/components/MeauMobile/MeauMoible.tsx
+++ b/nkebao/src/components/MeauMobile/MeauMoible.tsx
@@ -1,81 +1,81 @@
-import React, { useState, useEffect } from "react";
-import { TabBar } from "antd-mobile";
-import {
- AppOutline,
- ShopbagOutline,
- PieOutline,
- UserOutline,
-} from "antd-mobile-icons";
-import { useLocation, useNavigate } from "react-router-dom";
-
-const tabs = [
- {
- key: "home",
- title: "首页",
- icon:
+
+ ) : (
+ children
+ )}
+ 加载中...
+
- {title}
-
- }
- right={
- showAddButton ? (
-
- ) : undefined
- }
- />
- }
- footer={showFooter ?
-
- {title}页面
-此页面正在开发中...
-
+ {title}
+
+ }
+ right={
+ showAddButton ? (
+
+ ) : undefined
+ }
+ />
+ }
+ footer={showFooter ?
+
+ {title}页面
+此页面正在开发中...
+场景详情
+
+ }
+ footer={
+
+ 加载场景数据中...
+
+ {/* 场景信息卡片 */}
+ {scenario && (
+
+
+ )}
+
+ {/* 搜索栏 */}
+ setShowApiDialog(false)}
+ position="bottom"
+ bodyStyle={{ height: "60vh" }}
+ >
+
+
+ {/* 二维码弹窗 */}
+ setShowQrDialog(false)}
+ position="bottom"
+ >
+
+
+
+
+ {scenario.name}
+
+ {scenario.description}
+
+
+
+
+
+
+
+
+
+
+ {/* 计划列表 */}
+
+
+
+ -
+ {filteredTasks.length === 0 ? (
+
+
+ ) : (
+ filteredTasks.map((task) => (
+
+ {searchTerm ? "没有找到匹配的计划" : "暂无计划"}
+
+
+
+
+
+
+ {getStatusText(task.status)}
+
+
+ {task.name}
+
+ 创建时间: {task.created_at}
+ {task.total_customers !== undefined && (
+ 总获客: {task.total_customers}
+ )}
+ {task.today_customers !== undefined && (
+ 今日获客: {task.today_customers}
+ )}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ API设置
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 小程序二维码
+ +
+ {qrLoading ? (
+ 
+ ) : (
+
+
+
+ ) : qrImg ? (
+ 生成二维码中...
+ 二维码生成失败
+ )}
+
+ {isEdit ? "编辑计划" : "新建计划"}
+
+
+ }
+ footer={
+
+ 加载数据中...
+
+ {/* 步骤指示器 */}
+
+
+
+ {steps.map((step) => (
+
+
+
+ {/* 步骤内容 */}
+ {renderStepContent()}
+
+
+ );
+ }
+
+ return (
+ 加载数据中...
+
+
+
+
+
+ {/* 操作按钮 */}
+
+ );
+};
+
+export default BasicSettings;
diff --git a/nkebao/src/pages/scenarios/new/steps/FriendRequestSettings.module.scss b/nkebao/src/pages/scenarios/new/steps/FriendRequestSettings.module.scss
new file mode 100644
index 000000000..67047ef14
--- /dev/null
+++ b/nkebao/src/pages/scenarios/new/steps/FriendRequestSettings.module.scss
@@ -0,0 +1,56 @@
+.friend-request-settings {
+ padding: 16px 0;
+}
+
+.form-card {
+ margin-bottom: 20px;
+ border-radius: 12px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.form-item {
+ margin-bottom: 20px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .adm-form-item-label {
+ font-size: 14px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 8px;
+ }
+
+ .adm-input {
+ border-radius: 8px;
+ }
+
+ .adm-selector {
+ border-radius: 8px;
+ }
+
+ .adm-text-area {
+ border-radius: 8px;
+ }
+}
+
+.actions {
+ padding: 20px 0;
+}
+
+.prev-btn {
+ flex: 1;
+ height: 48px;
+ border-radius: 24px;
+ font-size: 16px;
+ font-weight: 500;
+}
+
+.next-btn {
+ flex: 1;
+ height: 48px;
+ border-radius: 24px;
+ font-size: 16px;
+ font-weight: 500;
+}
\ No newline at end of file
diff --git a/nkebao/src/pages/scenarios/new/steps/FriendRequestSettings.tsx b/nkebao/src/pages/scenarios/new/steps/FriendRequestSettings.tsx
new file mode 100644
index 000000000..fcb0bb63b
--- /dev/null
+++ b/nkebao/src/pages/scenarios/new/steps/FriendRequestSettings.tsx
@@ -0,0 +1,113 @@
+import React from "react";
+import {
+ Form,
+ Input,
+ Selector,
+ Button,
+ Card,
+ Space,
+ TextArea,
+} from "antd-mobile";
+import style from "./FriendRequestSettings.module.scss";
+
+interface FriendRequestSettingsProps {
+ formData: any;
+ onChange: (data: any) => void;
+ onNext: () => void;
+ onPrev: () => void;
+}
+
+const FriendRequestSettings: React.FC
+
+
+
+
+