Merge branch 'yongpxu-dev' into yongxu-dev3

# Conflicts: # nkebao/AI_ICON_GUIDE.md resolved by yongpxu-dev version # nkebao/ICON_DETAILED_MAPPING.md resolved by yongpxu-dev version # nkebao/ICON_MAPPING_GUIDE.md resolved by yongpxu-dev version # nkebao/ICON_QUICK_REFERENCE.md resolved by yongpxu-dev version # nkebao/index.html resolved by yongpxu-dev version
2025-08-04 10:04:17 +08:00
parent fe62708aa3 05783db2b1
commit 73407ceb8d
58 changed files with 2939 additions and 1468 deletions
--- a/ckApp/.gitignore
+++ b/ckApp/.gitignore
@@ -0,0 +1 @@
+unpackage
--- a/ckApp/App.vue
+++ b/ckApp/App.vue
@@ -0,0 +1,7 @@
+<script>
+	export default {}
+</script>
+
+<style>
+	/*每个页面公共css */
+</style>
--- a/ckApp/index.html
+++ b/ckApp/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <script>
+      var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
+        CSS.supports('top: constant(a)'))
+      document.write(
+        '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
+        (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+    </script>
+    <title></title>
+    <!--preload-links-->
+    <!--app-context-->
+  </head>
+  <body>
+    <div id="app"><!--app-html--></div>
+    <script type="module" src="/main.js"></script>
+  </body>
+</html>
--- a/ckApp/main.js
+++ b/ckApp/main.js
@@ -0,0 +1,22 @@
+import App from './App'
+
+// #ifndef VUE3
+import Vue from 'vue'
+import './uni.promisify.adaptor'
+Vue.config.productionTip = false
+App.mpType = 'app'
+const app = new Vue({
+  ...App
+})
+app.$mount()
+// #endif
+
+// #ifdef VUE3
+import { createSSRApp } from 'vue'
+export function createApp() {
+  const app = createSSRApp(App)
+  return {
+    app
+  }
+}
+// #endif
--- a/ckApp/manifest.json
+++ b/ckApp/manifest.json
@@ -0,0 +1,74 @@
+{
+    "name" : "ckApp",
+    "appid" : "__UNI__2B34F1A",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueStyleCompiler" : "uni-app",
+        "compilerVersion" : 3,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {},
+        /* 应用发布信息 */
+        "distribute" : {
+            /* android打包配置 */
+            "android" : {
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            /* ios打包配置 */
+            "ios" : {
+                "dSYMs" : false
+            },
+            /* SDK配置 */
+            "sdkConfigs" : {}
+        }
+    },
+    /* 快应用特有相关 */
+    "quickapp" : {},
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "",
+        "setting" : {
+            "urlCheck" : false
+        },
+        "usingComponents" : true
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "vueVersion" : "3"
+}
--- a/ckApp/pages.json
+++ b/ckApp/pages.json
@@ -0,0 +1,24 @@
+{
+	"pages": [ 
+		{
+			"path": "pages/index/index",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/index/test",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom"
+			}
+		}
+	],
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarBackgroundColor": "#F8F8F8",
+		"backgroundColor": "#F8F8F8"
+	},
+	"uniIdRouter": {}
+}
--- a/ckApp/pages/index/index.vue
+++ b/ckApp/pages/index/index.vue
@@ -0,0 +1,100 @@
+<template>
+	<web-view 
+		ref="webviewRef"
+		:src="iframeUrl" 
+		@message="handleMessage"
+		:fullscreen="true"
+	></web-view>
+</template>
+
+<script>
+	import { getTopSafeAreaHeightAsync } from '@utils/common';
+	const TYPE_EMUE = {
+		CONNECT: 0,
+		DATA: 1,
+		FUNCTION: 2,
+		CONFIG: 3,
+	}
+	export default {
+		data() {
+			return {
+				baseUrl: 'https://kr-op.quwanzhi.com/init', 
+				iframeUrl: '', // 动态构建的 URL
+				receivedMessages: [],
+				messageId: 0,
+				urlParams: {}
+			}
+		},
+		onLoad() {
+			this.sendBaseConfig()
+		},
+		methods: {
+			// 构建 iframe URL，包含参数
+			buildIframeUrl() {
+				const params = [];
+				Object.keys(this.urlParams).forEach(key => {
+					const value = this.urlParams[key];
+					if (value !== null && value !== undefined) {
+						const encodedKey = encodeURIComponent(key);
+						const encodedValue = encodeURIComponent(String(value));
+						params.push(`${encodedKey}=${encodedValue}`);
+					}
+				});
+				const queryString = params.join('&');
+				this.iframeUrl = queryString ? `${this.baseUrl}?${queryString}` : this.baseUrl;
+			},
+			// 发送消息到 iframe（通过URL传参）
+			async sendMessageToIframe() {
+				const paddingTop = await getTopSafeAreaHeightAsync();
+				this.messageId++;
+				const message = {
+					type: TYPE_EMUE.DATA, // 数据类型：0数据交互 1App功能调用
+					data: {
+						id: this.messageId,
+						content: `Hello，我是 App 发送的消息 ${this.messageId}`,
+						timestamp: Date.now(),
+						paddingTop: paddingTop
+					}
+				};
+				
+				// 将消息添加到URL参数中
+				this.urlParams.message = encodeURIComponent(JSON.stringify(message));
+				this.buildIframeUrl();
+				console.log('[App]SendMessage=>\n' + JSON.stringify(message));
+			},
+			// 发送消息到 iframe（通过URL传参）
+			async sendBaseConfig() {
+				const message = {
+					type: TYPE_EMUE.CONFIG, 
+					data: {
+						paddingTop: await getTopSafeAreaHeightAsync(),
+						appId: '1234567890',
+						appName: '存客宝',
+						appVersion: '1.0.0',
+					}
+				};
+				
+				// 将消息添加到URL参数中
+				this.urlParams.message = encodeURIComponent(JSON.stringify(message));
+				this.buildIframeUrl();
+				console.log('[App]SendMessage=>\n' + JSON.stringify(message));
+			},
+			// 接收 web-view 发送的消息
+			handleMessage(event) {
+				console.log("event", event);
+				const [ResDetail] = event.detail.data;
+				this.receivedMessages.push(`[${new Date().toLocaleTimeString()}] ${JSON.stringify(ResDetail)}`);
+				
+				switch (ResDetail.type) {
+					case TYPE_EMUE.DATA:
+						console.log('[App]ReceiveMessage=>\n' + JSON.stringify(ResDetail.data));
+						break;
+					case TYPE_EMUE.FUNCTION:
+						console.log('[App]ReceiveMessage=>\n' + JSON.stringify(ResDetail.data));
+						break;
+					
+				}
+			}
+		}
+	}
+</script>
--- a/ckApp/pages/index/test.vue
+++ b/ckApp/pages/index/test.vue
@@ -0,0 +1,304 @@
+<template>
+	<view class="content">
+		<!-- iframe 容器 -->
+		<view class="iframe-container">
+			<web-view 
+				ref="webviewRef"
+				:src="iframeUrl" 
+				@message="handleMessage"
+				:fullscreen="false"
+				:webview-styles="{
+					width:'100%',
+					height:'406px'
+				}"
+			></web-view>
+		</view>
+	
+
+		<!-- 消息控制区域 -->
+		<view class="message-controls">
+			<text class="control-title">消息控制：</text>
+			<view class="control-buttons">
+				<button @click="sendMessageToIframe" class="btn-send">发送消息到iframe</button>
+			</view>
+		</view>
+
+
+		<!-- 消息显示区域 -->
+		<view class="message-area">
+			<text class="message-title">接收到的消息：</text>
+			<view class="message-list">
+				<view v-for="(msg, index) in receivedMessages" :key="index" class="message-item">
+					<text class="message-text">{{msg}}</text>
+				</view>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	import { getTopSafeAreaHeightAsync } from '@utils/common';
+	const TYPE_EMUE = {
+		CONNECT: 0,
+		DATA: 1,
+		FUNCTION: 2,
+		
+	}
+	export default {
+		data() {
+			return {
+				baseUrl: 'https://kr-op.quwanzhi.com/init', 
+				iframeUrl: '', // 动态构建的 URL
+				receivedMessages: [],
+				messageId: 0,
+				urlParams: {}
+			}
+		},
+		onLoad() {
+			this.buildIframeUrl();
+			setTimeout(() => {
+				this.sendMessageToIframeConnect()
+			}, 1000);
+		},
+		methods: {
+			// 构建 iframe URL，包含参数
+			buildIframeUrl() {
+				const params = [];
+				Object.keys(this.urlParams).forEach(key => {
+					const value = this.urlParams[key];
+					if (value !== null && value !== undefined) {
+						const encodedKey = encodeURIComponent(key);
+						const encodedValue = encodeURIComponent(String(value));
+						params.push(`${encodedKey}=${encodedValue}`);
+					}
+				});
+				const queryString = params.join('&');
+				this.iframeUrl = queryString ? `${this.baseUrl}?${queryString}` : this.baseUrl;
+			},
+			// 发送消息到 iframe（通过URL传参）
+			async sendMessageToIframe() {
+				const paddingTop = await getTopSafeAreaHeightAsync();
+				this.messageId++;
+				const message = {
+					type: TYPE_EMUE.DATA, // 数据类型：0数据交互 1App功能调用
+					data: {
+						id: this.messageId,
+						content: `Hello，我是 App 发送的消息 ${this.messageId}`,
+						timestamp: Date.now(),
+						paddingTop: paddingTop
+					}
+				};
+				
+				// 将消息添加到URL参数中
+				this.urlParams.message = encodeURIComponent(JSON.stringify(message));
+				this.buildIframeUrl();
+				console.log('[App]SendMessage=>\n' + JSON.stringify(message));
+			},
+			// 发送消息到 iframe（通过URL传参）
+			async sendMessageToIframeConnect() {
+				const message = {
+					type: TYPE_EMUE.CONNECT, 
+					data: {
+						action: 'ping',
+						content: '联通测试通过',
+						timestamp: Date.now()
+					}
+				};
+				
+				// 将消息添加到URL参数中
+				this.urlParams.message = encodeURIComponent(JSON.stringify(message));
+				this.buildIframeUrl();
+				console.log('[App]SendMessage=>\n' + JSON.stringify(message));
+			},
+			// 接收 web-view 发送的消息
+			handleMessage(event) {
+				console.log("event", event);
+				const [ResDetail] = event.detail.data;
+				this.receivedMessages.push(`[${new Date().toLocaleTimeString()}] ${JSON.stringify(ResDetail)}`);
+				
+				switch (ResDetail.type) {
+					case TYPE_EMUE.DATA:
+						console.log('[App]ReceiveMessage=>\n' + JSON.stringify(ResDetail.data));
+						break;
+					case TYPE_EMUE.FUNCTION:
+						console.log('[App]ReceiveMessage=>\n' + JSON.stringify(ResDetail.data));
+						break;
+					
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content {
+		display: flex;
+		flex-direction: column;
+		height: 100vh;
+		background-color: #f8f9fa;
+	}
+
+
+	.iframe-container {
+		overflow: hidden;
+		background: white;
+		position: relative;
+		margin: 20rpx;
+		border-radius: 20rpx;
+		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
+		height: 800rpx;
+		:deep(web-view) {
+			width: 100% !important;
+			height: 100% !important;
+			border: none !important;
+			outline: none !important;
+			box-shadow: none !important;
+		}
+		
+		:deep(iframe) {
+			border: none !important;
+			outline: none !important;
+			box-shadow: none !important;
+		}
+	}
+
+	.message-controls {
+		padding: 20rpx;
+		background: #f0f0f0;
+		border-bottom: 2rpx solid #e0e0e0;
+		display: flex;
+		flex-direction: column;
+		gap: 16rpx;
+	}
+
+	.control-title {
+		font-size: 28rpx;
+		color: #333;
+		font-weight: 600;
+		margin-bottom: 16rpx;
+		padding-bottom: 16rpx;
+		border-bottom: 2rpx solid #d0d0d0;
+	}
+
+	.control-buttons {
+		display: flex;
+		gap: 16rpx;
+	}
+
+	.btn-send {
+		flex: 1;
+		background: linear-gradient(135deg, #188eee 0%, #096dd9 100%);
+		color: white;
+		border: none;
+		border-radius: 20rpx;
+		padding: 20rpx 16rpx;
+		font-size: 26rpx;
+		font-weight: 600;
+		cursor: pointer;
+		transition: all 0.3s ease;
+		box-shadow: 0 4rpx 12rpx rgba(24, 142, 238, 0.3);
+
+		&:active {
+			transform: translateY(2rpx);
+			box-shadow: 0 2rpx 8rpx rgba(24, 142, 238, 0.4);
+		}
+
+		&:hover {
+			background: linear-gradient(135deg, #096dd9 0%, #0050b3 100%);
+		}
+	}
+
+	.message-area {
+		flex: 1;
+		padding: 20rpx;
+		background: white;
+		overflow: hidden;
+		display: flex;
+		flex-direction: column;
+	}
+
+	.message-title {
+		font-size: 28rpx;
+		color: #333;
+		margin-bottom: 20rpx;
+		display: block;
+		font-weight: 600;
+		border-bottom: 2rpx solid #f0f0f0;
+		padding-bottom: 16rpx;
+	}
+
+	.message-list {
+		flex: 1;
+		overflow-y: auto;
+		border: 2rpx solid #f0f0f0;
+		border-radius: 16rpx;
+		padding: 16rpx;
+		background: #fafafa;
+
+		&::-webkit-scrollbar {
+			width: 8rpx;
+		}
+
+		&::-webkit-scrollbar-track {
+			background: #f1f1f1;
+			border-radius: 4rpx;
+		}
+
+		&::-webkit-scrollbar-thumb {
+			background: #c1c1c1;
+			border-radius: 4rpx;
+
+			&:hover {
+				background: #a8a8a8;
+			}
+		}
+	}
+
+	.message-item {
+		background: white;
+		padding: 20rpx;
+		margin-bottom: 16rpx;
+		border-radius: 12rpx;
+		border-left: 6rpx solid #188eee;
+		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);
+		transition: all 0.3s ease;
+
+		&:last-child {
+			margin-bottom: 0;
+		}
+
+		&:hover {
+			transform: translateX(4rpx);
+			box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.12);
+		}
+	}
+
+	.message-text {
+		font-size: 24rpx;
+		color: #333;
+		word-break: break-all;
+		line-height: 1.5;
+		font-family: "Courier New", monospace;
+	}
+
+	@media (max-width: 768rpx) {
+		.content {
+			padding: 0;
+		}
+
+		.iframe-container {
+			margin: 16rpx;
+			border-radius: 16rpx;
+		}
+
+		.message-area {
+			padding: 16rpx;
+		}
+
+		.message-item {
+			padding: 16rpx;
+			margin-bottom: 12rpx;
+		}
+	}
+</style>
--- a/ckApp/static/logo.png
+++ b/ckApp/static/logo.png
--- a/ckApp/uni.promisify.adaptor.js
+++ b/ckApp/uni.promisify.adaptor.js
@@ -0,0 +1,13 @@
+uni.addInterceptor({
+  returnValue (res) {
+    if (!(!!res && (typeof res === "object" || typeof res === "function") && typeof res.then === "function")) {
+      return res;
+    }
+    return new Promise((resolve, reject) => {
+      res.then((res) => {
+        if (!res) return resolve(res) 
+        return res[0] ? reject(res[0]) : resolve(res[1])
+      });
+    });
+  },
+});
--- a/ckApp/uni.scss
+++ b/ckApp/uni.scss
@@ -0,0 +1,76 @@
+/**
+ * 这里是uni-app内置的常用样式变量
+ *
+ * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
+ * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
+ *
+ */
+
+/**
+ * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
+ *
+ * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
+ */
+
+/* 颜色变量 */
+
+/* 行为相关颜色 */
+$uni-color-primary: #007aff;
+$uni-color-success: #4cd964;
+$uni-color-warning: #f0ad4e;
+$uni-color-error: #dd524d;
+
+/* 文字基本颜色 */
+$uni-text-color:#333;//基本色
+$uni-text-color-inverse:#fff;//反色
+$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
+$uni-text-color-placeholder: #808080;
+$uni-text-color-disable:#c0c0c0;
+
+/* 背景颜色 */
+$uni-bg-color:#ffffff;
+$uni-bg-color-grey:#f8f8f8;
+$uni-bg-color-hover:#f1f1f1;//点击状态颜色
+$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
+
+/* 边框颜色 */
+$uni-border-color:#c8c7cc;
+
+/* 尺寸变量 */
+
+/* 文字尺寸 */
+$uni-font-size-sm:12px;
+$uni-font-size-base:14px;
+$uni-font-size-lg:16px;
+
+/* 图片尺寸 */
+$uni-img-size-sm:20px;
+$uni-img-size-base:26px;
+$uni-img-size-lg:40px;
+
+/* Border Radius */
+$uni-border-radius-sm: 2px;
+$uni-border-radius-base: 3px;
+$uni-border-radius-lg: 6px;
+$uni-border-radius-circle: 50%;
+
+/* 水平间距 */
+$uni-spacing-row-sm: 5px;
+$uni-spacing-row-base: 10px;
+$uni-spacing-row-lg: 15px;
+
+/* 垂直间距 */
+$uni-spacing-col-sm: 4px;
+$uni-spacing-col-base: 8px;
+$uni-spacing-col-lg: 12px;
+
+/* 透明度 */
+$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
+
+/* 文章场景相关 */
+$uni-color-title: #2C405A; // 文章标题颜色
+$uni-font-size-title:20px;
+$uni-color-subtitle: #555555; // 二级标题颜色
+$uni-font-size-subtitle:26px;
+$uni-color-paragraph: #3F536E; // 文章段落颜色
+$uni-font-size-paragraph:15px;
--- a/ckApp/utils/common.js
+++ b/ckApp/utils/common.js
@@ -0,0 +1,36 @@
+/**
+ * 异步获取设备顶部安全区域高度
+ * @returns {Promise<number>} 顶部安全区域高度
+ */
+export function getTopSafeAreaHeightAsync() {
+    return new Promise((resolve, reject) => {
+      uni.getSystemInfo({
+        success: (res) => {
+          try {
+            const safeAreaInsets = res.safeAreaInsets;
+            
+            if (safeAreaInsets && safeAreaInsets.top !== undefined) {
+              resolve(safeAreaInsets.top);
+              return;
+            }
+            
+            if (res.safeArea) {
+              const safeArea = res.safeArea;
+              const statusBarHeight = res.statusBarHeight || 0;
+              const topSafeHeight = safeArea.top - statusBarHeight;
+              resolve(Math.max(0, topSafeHeight));
+              return;
+            }
+            
+            resolve(`${res.statusBarHeight*2 || 0}px`);
+            
+          } catch (error) {
+            reject(error);
+          }
+        },
+        fail: (error) => {
+          reject(error);
+        }
+      });
+    });
+  }
--- a/ckApp/vite.config.js
+++ b/ckApp/vite.config.js
@@ -0,0 +1,29 @@
+import { defineConfig } from 'vite'
+import uni from '@dcloudio/vite-plugin-uni'
+import { resolve } from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [uni()],
+  resolve: {
+    alias: {
+      // 根目录别名
+      '@': resolve(__dirname, '/'),
+      '@root': resolve(__dirname, '/'),
+      
+      // 页面和组件别名
+      '@pages': resolve(__dirname, 'pages'),
+      '@components': resolve(__dirname, 'components'),
+      
+      // 工具和配置别名
+      '@utils': resolve(__dirname, 'utils'),
+    }
+  },
+  css: {
+    preprocessorOptions: {
+      scss: {
+        additionalData: `@import "@/uni.scss";`
+      }
+    }
+  }
+}) 
--- a/nkebao/.env.development
+++ b/nkebao/.env.development
@@ -1,4 +1,4 @@
 # 基础环境变量示例
-VITE_API_BASE_URL=http://www.yishi.com
-# VITE_API_BASE_URL=https://ckbapi.quwanzhi.com
+# VITE_API_BASE_URL=http://www.yishi.com
+VITE_API_BASE_URL=https://ckbapi.quwanzhi.com
 VITE_APP_TITLE=Nkebao Base
--- a/nkebao/AI_ICON_GUIDE.md
+++ b/nkebao/AI_ICON_GUIDE.md
@@ -1,274 +0,0 @@
-# AI图标使用指南
-
-## 概述
-
-本文档为AI助手提供标准化的图标选择和使用流程，确保在代码生成时使用正确的图标包和图标名称。
-
-## AI使用流程
-
-### 1. 项目类型判断
-首先判断项目类型：
- **PC端项目**: 使用 `@ant-design/icons`
- **移动端项目**: 使用 `antd-mobile-icons`
-
-### 2. 图标查找流程
-1. 根据功能需求确定图标类型
-2. 在对应图标包中查找合适的图标
-3. 如果图标不存在，查找替代方案
-4. 使用正确的导入语法
-
-### 3. 代码生成模板
-
-#### PC端项目模板
-```typescript
-import {
-  // 导航类
-  HomeOutlined,
-  UserOutlined,
-  SettingOutlined,
-  
-  // 操作类
-  PlusOutlined,
-  EditOutlined,
-  DeleteOutlined,
-  CopyOutlined,
-  SearchOutlined,
-  ReloadOutlined,
-  
-  // 状态类
-  CheckOutlined,
-  CloseOutlined,
-  CheckCircleOutlined,
-  CloseCircleOutlined,
-  ExclamationCircleOutlined,
-  InfoCircleOutlined,
-  LoadingOutlined,
-  
-  // 方向类
-  UpOutlined,
-  DownOutlined,
-  LeftOutlined,
-  RightOutlined,
-  ArrowLeftOutlined,
-  
-  // 其他
-  MessageOutlined,
-  CalendarOutlined,
-  ClockCircleOutlined,
-  PictureOutlined,
-  FileOutlined,
-  CameraOutlined,
-  QrcodeOutlined,
-} from '@ant-design/icons';
-```
-
-#### 移动端项目模板
-```typescript
-import {
-  // 导航类
-  HomeOutline,
-  UserOutline,
-  SettingOutline,
-  
-  // 操作类
-  AddOutline,
-  EditSOutline,
-  DeleteOutline,
-  CopyOutline,
-  SearchOutline,
-  RefreshOutline,
-  
-  // 状态类
-  CheckOutline,
-  CloseOutline,
-  CheckCircleOutline,
-  CloseCircleOutline,
-  ExclamationCircleOutline,
-  InfoCircleOutline,
-  LoadingOutline,
-  
-  // 方向类
-  UpOutline,
-  DownOutline,
-  LeftOutline,
-  RightOutline,
-  
-  // 其他
-  MessageOutline,
-  CalendarOutline,
-  ClockCircleOutline,
-  PictureOutline,
-  FileOutline,
-  CameraOutline,
-  QrCodeOutline,
-} from 'antd-mobile-icons';
-```
-
-## 功能到图标映射
-
-### 基础功能映射
-| 功能需求 | PC端图标 | 移动端图标 | 说明 |
-|---------|---------|-----------|------|
-| 添加/新建 | PlusOutlined | AddOutline | 通用添加功能 |
-| 编辑/修改 | EditOutlined | EditSOutline | 编辑功能 |
-| 删除/移除 | DeleteOutlined | DeleteOutline | 删除功能 |
-| 复制/克隆 | CopyOutlined | CopyOutline | 复制功能 |
-| 搜索/查找 | SearchOutlined | SearchOutline | 搜索功能 |
-| 刷新/重新加载 | ReloadOutlined | RefreshOutline | 刷新功能 |
-| 设置/配置 | SettingOutlined | SettingOutline | 设置功能 |
-| 用户/个人 | UserOutlined | UserOutline | 用户相关 |
-| 首页/主页 | HomeOutlined | HomeOutline | 首页导航 |
-| 返回/后退 | ArrowLeftOutlined | LeftOutline | 返回功能 |
-| 关闭/取消 | CloseOutlined | CloseOutline | 关闭功能 |
-| 确认/确定 | CheckOutlined | CheckOutline | 确认功能 |
-
-### 状态指示映射
-| 状态需求 | PC端图标 | 移动端图标 | 说明 |
-|---------|---------|-----------|------|
-| 成功/完成 | CheckCircleOutlined | CheckCircleOutline | 成功状态 |
-| 错误/失败 | CloseCircleOutlined | CloseCircleOutline | 错误状态 |
-| 警告/注意 | ExclamationCircleOutlined | ExclamationCircleOutline | 警告状态 |
-| 信息/提示 | InfoCircleOutlined | InfoCircleOutline | 信息提示 |
-| 加载/等待 | LoadingOutlined | LoadingOutline | 加载状态 |
-| 时间/等待 | ClockCircleOutlined | ClockCircleOutline | 时间相关 |
-
-### 方向导航映射
-| 方向需求 | PC端图标 | 移动端图标 | 说明 |
-|---------|---------|-----------|------|
-| 向上/上升 | UpOutlined | UpOutline | 向上方向 |
-| 向下/下降 | DownOutlined | DownOutline | 向下方向 |
-| 向左/后退 | LeftOutlined | LeftOutline | 向左方向 |
-| 向右/前进 | RightOutlined | RightOutline | 向右方向 |
-
-### 业务功能映射
-| 业务需求 | PC端图标 | 移动端图标 | 说明 |
-|---------|---------|-----------|------|
-| 消息/通知 | MessageOutlined | MessageOutline | 消息功能 |
-| 日历/日期 | CalendarOutlined | CalendarOutline | 日历功能 |
-| 图片/照片 | PictureOutlined | PictureOutline | 图片功能 |
-| 文件/文档 | FileOutlined | FileOutline | 文件功能 |
-| 相机/拍照 | CameraOutlined | CameraOutline | 相机功能 |
-| 二维码 | QrcodeOutlined | QrCodeOutline | 二维码功能 |
-| 微信/社交 | WechatOutlined | WechatOutline | 微信功能 |
-| 设备/手机 | MobileOutlined | MobileOutline | 设备功能 |
-| 团队/群组 | TeamOutlined | TeamOutline | 团队功能 |
-| 订单/购物 | ShoppingOutlined | ShoppingOutline | 订单功能 |
-| 支付/钱包 | PayCircleOutlined | PayCircleOutline | 支付功能 |
-
-## 特殊替换规则
-
-### 移动端不存在的图标替换
-| 原需求 | 替换方案 | 说明 |
-|--------|----------|------|
-| RiseOutlined | UpOutline | 上升趋势 |
-| ThumbsUpOutlined | LikeOutline | 点赞功能 |
-| ShareAltOutlined | LinkOutline | 分享功能 |
-| BarChartOutlined | PieOutline | 图表功能 |
-| LineChartOutlined | PieOutline | 图表功能 |
-| UserAddOutlined | UserOutline | 用户添加 |
-| Progress | 自定义div | 进度条组件 |
-
-### PC端不存在的图标替换
-| 原需求 | 替换方案 | 说明 |
-|--------|----------|------|
-| AntOutline | HomeOutlined | 蚂蚁图标 |
-| AppOutline | AppstoreOutlined | 应用图标 |
-
-## AI代码生成示例
-
-### 场景1: 移动端列表页面
-```typescript
-// AI应该生成的代码
-import {
-  AddOutline,        // 添加按钮
-  EditSOutline,      // 编辑按钮
-  DeleteOutline,     // 删除按钮
-  CopyOutline,       // 复制按钮
-  SearchOutline,     // 搜索框
-  RefreshOutline,    // 刷新按钮
-  UserOutline,       // 用户信息
-  CalendarOutline,   // 时间信息
-  UpOutline,         // 上升趋势（替换RiseOutlined）
-} from 'antd-mobile-icons';
-
-// 使用示例
-<Button>
-  <AddOutline /> 新建
-</Button>
-<Button>
-  <EditSOutline /> 编辑
-</Button>
-<Button color="danger">
-  <DeleteOutline /> 删除
-</Button>
-```
-
-### 场景2: PC端管理页面
-```typescript
-// AI应该生成的代码
-import {
-  PlusOutlined,      // 添加按钮
-  EditOutlined,      // 编辑按钮
-  DeleteOutlined,    // 删除按钮
-  CopyOutlined,      // 复制按钮
-  SearchOutlined,    // 搜索框
-  ReloadOutlined,    // 刷新按钮
-  UserOutlined,      // 用户信息
-  CalendarOutlined,  // 时间信息
-  RiseOutlined,      // 上升趋势（PC端存在）
-} from '@ant-design/icons';
-
-// 使用示例
-<Button icon={<PlusOutlined />}>新建</Button>
-<Button icon={<EditOutlined />}>编辑</Button>
-<Button icon={<DeleteOutlined />} danger>删除</Button>
-```
-
-## 错误检测和修正
-
-### 常见错误模式
-1. **混用图标包**: 同时导入PC端和移动端图标
-2. **使用不存在的图标**: 在移动端使用PC端特有的图标
-3. **命名错误**: 图标名称大小写错误
-4. **导入路径错误**: 使用错误的包名
-
-### 修正策略
-1. **统一图标包**: 根据项目类型选择单一图标包
-2. **查找替代**: 使用对照表查找替代图标
-3. **验证存在**: 确保图标在目标包中存在
-4. **测试验证**: 在代码中测试图标是否正常显示
-
-## AI使用检查清单
-
-### 代码生成前
- [ ] 确认项目类型（PC端/移动端）
- [ ] 选择对应的图标包
- [ ] 根据功能需求选择合适图标
- [ ] 检查图标是否存在
-
-### 代码生成中
- [ ] 使用正确的导入语法
- [ ] 图标名称大小写正确
- [ ] 避免混用不同包的图标
- [ ] 为不存在的图标提供替代方案
-
-### 代码生成后
- [ ] 验证图标导入正确
- [ ] 检查图标使用语法
- [ ] 确保样式设置合理
- [ ] 提供使用示例
-
-## 更新和维护
-
- 定期更新图标对照表
- 记录新发现的图标差异
- 更新替换规则
- 优化AI使用流程
-
-## 注意事项
-
-1. **优先使用语义化图标**: 选择最能表达功能的图标
-2. **保持一致性**: 在同一项目中保持图标风格一致
-3. **考虑可访问性**: 为图标添加适当的aria-label
-4. **性能优化**: 按需导入图标，避免全量导入
-5. **版本兼容**: 注意图标包版本与UI框架版本的兼容性 
--- a/nkebao/ICON_DETAILED_MAPPING.md
+++ b/nkebao/ICON_DETAILED_MAPPING.md
@@ -1,205 +0,0 @@
-# 详细图标对照表
-
-## 基础图标对照
-
-### 导航类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 首页 | HomeOutlined | HomeOutline | ✅ |
-| 返回 | ArrowLeftOutlined | LeftOutline | ✅ |
-| 菜单 | MenuOutlined | MenuOutline | ✅ |
-| 设置 | SettingOutlined | SettingOutline | ✅ |
-| 用户 | UserOutlined | UserOutline | ✅ |
-| 个人中心 | UserOutlined | UserOutline | ✅ |
-
-### 操作类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 添加 | PlusOutlined | AddOutline | ✅ |
-| 编辑 | EditOutlined | EditSOutline | ✅ |
-| 删除 | DeleteOutlined | DeleteOutline | ✅ |
-| 复制 | CopyOutlined | CopyOutline | ✅ |
-| 保存 | SaveOutlined | SaveOutline | ✅ |
-| 刷新 | ReloadOutlined | RefreshOutline | ✅ |
-| 搜索 | SearchOutlined | SearchOutline | ✅ |
-| 关闭 | CloseOutlined | CloseOutline | ✅ |
-| 确认 | CheckOutlined | CheckOutline | ✅ |
-| 取消 | CloseOutlined | CloseOutline | ✅ |
-
-### 状态类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 成功 | CheckCircleOutlined | CheckCircleOutline | ✅ |
-| 错误 | CloseCircleOutlined | CloseCircleOutline | ✅ |
-| 警告 | ExclamationCircleOutlined | ExclamationCircleOutline | ✅ |
-| 信息 | InfoCircleOutlined | InfoCircleOutline | ✅ |
-| 加载 | LoadingOutlined | LoadingOutline | ✅ |
-| 等待 | ClockCircleOutlined | ClockCircleOutline | ✅ |
-
-### 方向类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 向上 | UpOutlined | UpOutline | ✅ |
-| 向下 | DownOutlined | DownOutline | ✅ |
-| 向左 | LeftOutlined | LeftOutline | ✅ |
-| 向右 | RightOutlined | RightOutline | ✅ |
-| 向上圆形 | UpCircleOutlined | UpCircleOutline | ✅ |
-| 向下圆形 | DownCircleOutlined | DownCircleOutline | ✅ |
-
-### 通信类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 消息 | MessageOutlined | MessageOutline | ✅ |
-| 邮件 | MailOutlined | MailOutline | ✅ |
-| 电话 | PhoneOutlined | PhoneOutline | ✅ |
-| 视频 | VideoCameraOutlined | VideoCameraOutline | ✅ |
-| 语音 | AudioOutlined | AudioOutline | ✅ |
-
-### 媒体类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 图片 | PictureOutlined | PictureOutline | ✅ |
-| 文件 | FileOutlined | FileOutline | ✅ |
-| 文件夹 | FolderOutlined | FolderOutline | ✅ |
-| 相机 | CameraOutlined | CameraOutline | ✅ |
-| 二维码 | QrcodeOutlined | QrCodeOutline | ✅ |
-
-### 时间类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 日历 | CalendarOutlined | CalendarOutline | ✅ |
-| 时钟 | ClockCircleOutlined | ClockCircleOutline | ✅ |
-| 历史 | HistoryOutlined | HistoryOutline | ✅ |
-
-### 数据类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 统计 | BarChartOutlined | BarChartOutline | ✅ |
-| 饼图 | PieChartOutlined | PieChartOutline | ✅ |
-| 折线图 | LineChartOutlined | LineChartOutline | ✅ |
-| 表格 | TableOutlined | TableOutline | ✅ |
-| 列表 | UnorderedListOutlined | UnorderedListOutline | ✅ |
-
-## 特殊图标对照
-
-### 业务相关
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 设备 | MobileOutlined | MobileOutline | ✅ |
-| 微信 | WechatOutlined | WechatOutline | ✅ |
-| 群组 | TeamOutlined | TeamOutline | ✅ |
-| 客户 | UserAddOutlined | UserAddOutline | ❌ |
-| 订单 | ShoppingOutlined | ShoppingOutline | ✅ |
-| 支付 | PayCircleOutlined | PayCircleOutline | ✅ |
-
-### 工具类
-| 功能 | PC端 | 移动端 | 状态 |
-|------|------|--------|------|
-| 工具 | ToolOutlined | ToolOutline | ✅ |
-| 配置 | SettingOutlined | SettingOutline | ✅ |
-| 帮助 | QuestionCircleOutlined | QuestionCircleOutline | ✅ |
-| 反馈 | MessageOutlined | MessageOutline | ✅ |
-| 分享 | ShareAltOutlined | ShareOutline | ❌ |
-
-## 不存在的图标替换方案
-
-### PC端存在但移动端不存在的图标
-| PC端图标 | 推荐替换 | 说明 |
-|----------|----------|------|
-| UserAddOutlined | UserOutline | 用户添加功能 |
-| ShareAltOutlined | LinkOutline | 分享功能 |
-| RiseOutlined | UpOutline | 上升趋势 |
-| ThumbsUpOutlined | LikeOutline | 点赞功能 |
-| BarChartOutlined | PieOutline | 图表功能 |
-| LineChartOutlined | PieOutline | 图表功能 |
-
-### 移动端存在但PC端不存在的图标
-| 移动端图标 | 推荐替换 | 说明 |
-|------------|----------|------|
-| AntOutline | HomeOutlined | 蚂蚁图标 |
-| AppOutline | AppstoreOutlined | 应用图标 |
-
-## 使用规范
-
-### 1. 导入规范
-```typescript
-// PC端项目
-import {
-  HomeOutlined,
-  UserOutlined,
-  SettingOutlined,
-} from '@ant-design/icons';
-
-// 移动端项目
-import {
-  HomeOutline,
-  UserOutline,
-  SettingOutline,
-} from 'antd-mobile-icons';
-```
-
-### 2. 命名规范
- PC端：使用 `Outlined` 后缀
- 移动端：使用 `Outline` 后缀
- 保持语义化命名
-
-### 3. 使用建议
- 优先使用语义明确的图标
- 保持图标风格一致性
- 考虑图标在不同尺寸下的清晰度
- 为图标添加适当的aria-label
-
-### 4. 错误处理
-当图标不存在时：
-1. 查找语义相近的图标
-2. 使用通用图标（如QuestionOutlined）
-3. 考虑使用文字替代
-4. 创建自定义图标组件
-
-## 项目中的实际应用
-
-### 场景获客模块使用的图标
-```typescript
-// 移动端项目中的图标使用
-import {
-  AddOutline,        // 添加
-  UpOutline,         // 上升趋势（替换RiseOutline）
-  UserOutline,       // 用户
-  CalendarOutline,   // 日历
-  CopyOutline,       // 复制
-  DeleteOutline,     // 删除
-  EditSOutline,      // 编辑
-  SettingOutline,    // 设置
-  SearchOutline,     // 搜索
-  RefreshOutline,    // 刷新
-  QrCodeOutline,     // 二维码
-} from 'antd-mobile-icons';
-```
-
-### 工作台模块使用的图标
-```typescript
-// 移动端项目中的图标使用
-import {
-  LikeOutline,       // 点赞（替换ThumbsUpOutline）
-  LinkOutline,       // 链接（替换ShareOutline）
-  PieOutline,        // 饼图（替换BarChartOutline/LineChartOutline）
-  UserOutline,       // 用户
-  TeamOutline,       // 团队
-  MessageOutline,    // 消息
-} from 'antd-mobile-icons';
-```
-
-## 更新和维护
-
-1. **定期检查**: 定期检查新版本中新增的图标
-2. **文档更新**: 及时更新图标对照表
-3. **团队协作**: 团队成员共享图标使用规范
-4. **代码审查**: 在代码审查中检查图标使用是否正确
-
-## 注意事项
-
-1. **包版本**: 确保图标包版本与UI框架版本兼容
-2. **按需导入**: 避免全量导入图标，影响打包体积
-3. **样式覆盖**: 可以通过CSS自定义图标样式
-4. **无障碍**: 为图标添加适当的无障碍属性
-5. **性能**: 大量使用图标时注意性能优化 
--- a/nkebao/ICON_MAPPING_GUIDE.md
+++ b/nkebao/ICON_MAPPING_GUIDE.md
@@ -1,230 +0,0 @@
-# PC端与移动端图标对照文档
-
-## 概述
-
-本文档记录了PC端（@ant-design/icons）和移动端（antd-mobile-icons）的图标名称对照，以及正确的导入方式。
-
-## 导入方式
-
-### PC端图标 (@ant-design/icons)
-```typescript
-import {
-  HomeOutlined,
-  UserOutlined,
-  SettingOutlined,
-  // ... 其他图标
-} from '@ant-design/icons';
-```
-
-### 移动端图标 (antd-mobile-icons)
-```typescript
-import {
-  AntOutline,
-  ArrowDownCircleOutline,
-  UserOutline,
-  // ... 其他图标
-} from 'antd-mobile-icons';
-```
-
-## 图标对照表
-
-### 常用图标对照
-
-| 功能描述 | PC端图标 | 移动端图标 | 备注 |
-|---------|---------|-----------|------|
-| 首页 | HomeOutlined | HomeOutline | 完全对应 |
-| 用户 | UserOutlined | UserOutline | 完全对应 |
-| 设置 | SettingOutlined | SettingOutline | 完全对应 |
-| 搜索 | SearchOutlined | SearchOutline | 完全对应 |
-| 添加 | PlusOutlined | AddOutline | 完全对应 |
-| 编辑 | EditOutlined | EditSOutline | 移动端略有不同 |
-| 删除 | DeleteOutlined | DeleteOutline | 完全对应 |
-| 复制 | CopyOutlined | CopyOutline | 完全对应 |
-| 刷新 | ReloadOutlined | RefreshOutline | 完全对应 |
-| 二维码 | QrcodeOutlined | QrCodeOutline | 完全对应 |
-| 日历 | CalendarOutlined | CalendarOutline | 完全对应 |
-| 时钟 | ClockCircleOutlined | ClockCircleOutline | 完全对应 |
-| 箭头向上 | UpOutlined | UpOutline | 完全对应 |
-| 箭头向下 | DownOutlined | DownOutline | 完全对应 |
-| 箭头向左 | LeftOutlined | LeftOutline | 完全对应 |
-| 箭头向右 | RightOutlined | RightOutline | 完全对应 |
-| 返回 | ArrowLeftOutlined | LeftOutline | 移动端使用LeftOutline |
-| 关闭 | CloseOutlined | CloseOutline | 完全对应 |
-| 检查 | CheckOutlined | CheckOutline | 完全对应 |
-| 警告 | ExclamationCircleOutlined | ExclamationCircleOutline | 完全对应 |
-| 信息 | InfoCircleOutlined | InfoCircleOutline | 完全对应 |
-| 成功 | CheckCircleOutlined | CheckCircleOutline | 完全对应 |
-| 错误 | CloseCircleOutlined | CloseCircleOutline | 完全对应 |
-
-### 方向性图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 向上 | UpOutlined | UpOutline |
-| 向下 | DownOutlined | DownOutline |
-| 向左 | LeftOutlined | LeftOutline |
-| 向右 | RightOutlined | RightOutline |
-| 向上圆形 | UpCircleOutlined | UpCircleOutline |
-| 向下圆形 | DownCircleOutlined | DownCircleOutline |
-| 向左圆形 | LeftCircleOutlined | LeftCircleOutline |
-| 向右圆形 | RightCircleOutlined | RightCircleOutline |
-
-### 编辑类图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 编辑 | EditOutlined | EditSOutline |
-| 删除 | DeleteOutlined | DeleteOutline |
-| 复制 | CopyOutlined | CopyOutline |
-| 剪切 | ScissorOutlined | ScissorOutline |
-| 撤销 | UndoOutlined | UndoOutline |
-| 重做 | RedoOutlined | RedoOutline |
-| 保存 | SaveOutlined | SaveOutline |
-
-### 通信类图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 消息 | MessageOutlined | MessageOutline |
-| 邮件 | MailOutlined | MailOutline |
-| 电话 | PhoneOutlined | PhoneOutline |
-| 视频通话 | VideoCameraOutlined | VideoCameraOutline |
-| 语音 | AudioOutlined | AudioOutline |
-
-### 媒体类图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 图片 | PictureOutlined | PictureOutline |
-| 视频 | VideoCameraOutlined | VideoCameraOutline |
-| 音频 | AudioOutlined | AudioOutline |
-| 文件 | FileOutlined | FileOutline |
-| 文件夹 | FolderOutlined | FolderOutline |
-| 相机 | CameraOutlined | CameraOutline |
-
-### 导航类图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 菜单 | MenuOutlined | MenuOutline |
-| 汉堡菜单 | MenuFoldOutlined | MenuOutline |
-| 展开菜单 | MenuUnfoldOutlined | MenuOutline |
-| 面包屑 | BreadcrumbOutlined | BreadcrumbOutline |
-| 分页 | PaginationOutlined | PaginationOutline |
-
-### 数据展示类图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 表格 | TableOutlined | TableOutline |
-| 列表 | UnorderedListOutlined | UnorderedListOutline |
-| 卡片 | CreditCardOutlined | CreditCardOutline |
-| 统计 | BarChartOutlined | BarChartOutline |
-| 饼图 | PieChartOutlined | PieChartOutline |
-| 折线图 | LineChartOutlined | LineChartOutline |
-| 仪表盘 | DashboardOutlined | DashboardOutline |
-
-### 反馈类图标
-
-| 功能描述 | PC端图标 | 移动端图标 |
-|---------|---------|-----------|
-| 成功 | CheckCircleOutlined | CheckCircleOutline |
-| 错误 | CloseCircleOutlined | CloseCircleOutline |
-| 警告 | ExclamationCircleOutlined | ExclamationCircleOutline |
-| 信息 | InfoCircleOutlined | InfoCircleOutline |
-| 加载 | LoadingOutlined | LoadingOutline |
-| 等待 | ClockCircleOutlined | ClockCircleOutline |
-
-## 使用建议
-
-### 1. 项目类型判断
- **PC端项目**: 使用 `@ant-design/icons`
- **移动端项目**: 使用 `antd-mobile-icons`
-
-### 2. 图标选择原则
- 优先选择语义化图标
- 保持图标风格一致性
- 考虑图标在不同尺寸下的清晰度
-
-### 3. 常见错误避免
- 不要混用PC端和移动端图标
- 注意图标名称的大小写
- 确保图标在对应包中存在
-
-### 4. 图标替换策略
-当某个图标在目标包中不存在时：
-1. 查找语义相近的图标
-2. 使用通用图标（如QuestionOutlined）
-3. 考虑使用文字替代
-4. 创建自定义图标组件
-
-## 实际项目中的使用示例
-
-### PC端项目示例
-```typescript
-import {
-  HomeOutlined,
-  UserOutlined,
-  SettingOutlined,
-  SearchOutlined,
-  PlusOutlined,
-  EditOutlined,
-  DeleteOutlined,
-  CopyOutlined,
-  ReloadOutlined,
-  QrcodeOutlined,
-  CalendarOutlined,
-  ClockCircleOutlined,
-  UpOutlined,
-  DownOutlined,
-  LeftOutlined,
-  RightOutlined,
-  CloseOutlined,
-  CheckOutlined,
-  ExclamationCircleOutlined,
-  InfoCircleOutlined,
-  CheckCircleOutlined,
-  CloseCircleOutlined,
-} from '@ant-design/icons';
-```
-
-### 移动端项目示例
-```typescript
-import {
-  HomeOutline,
-  UserOutline,
-  SettingOutline,
-  SearchOutline,
-  AddOutline,
-  EditSOutline,
-  DeleteOutline,
-  CopyOutline,
-  RefreshOutline,
-  QrCodeOutline,
-  CalendarOutline,
-  ClockCircleOutline,
-  UpOutline,
-  DownOutline,
-  LeftOutline,
-  RightOutline,
-  CloseOutline,
-  CheckOutline,
-  ExclamationCircleOutline,
-  InfoCircleOutline,
-  CheckCircleOutline,
-  CloseCircleOutline,
-} from 'antd-mobile-icons';
-```
-
-## 注意事项
-
-1. **包依赖**: 确保项目中已安装对应的图标包
-2. **版本兼容**: 注意图标包版本与UI框架版本的兼容性
-3. **性能考虑**: 按需导入图标，避免全量导入
-4. **样式覆盖**: 可以通过CSS自定义图标颜色和大小
-5. **无障碍**: 为图标添加适当的aria-label属性
-
-## 更新记录
-
- 2024-01-XX: 初始版本，包含常用图标对照
- 后续根据实际使用情况持续更新 
--- a/nkebao/ICON_QUICK_REFERENCE.md
+++ b/nkebao/ICON_QUICK_REFERENCE.md
@@ -1,271 +0,0 @@
-# 图标快速参考表
-
-## 快速查找
-
-### 🔍 按功能查找
-
-| 功能 | PC端 | 移动端 | 导入方式 |
-|------|------|--------|----------|
-| **添加** | PlusOutlined | AddOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **编辑** | EditOutlined | EditSOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **删除** | DeleteOutlined | DeleteOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **复制** | CopyOutlined | CopyOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **搜索** | SearchOutlined | SearchOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **刷新** | ReloadOutlined | RefreshOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **设置** | SettingOutlined | SettingOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **用户** | UserOutlined | UserOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **首页** | HomeOutlined | HomeOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **返回** | ArrowLeftOutlined | LeftOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **关闭** | CloseOutlined | CloseOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **确认** | CheckOutlined | CheckOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **成功** | CheckCircleOutlined | CheckCircleOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **错误** | CloseCircleOutlined | CloseCircleOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **警告** | ExclamationCircleOutlined | ExclamationCircleOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **信息** | InfoCircleOutlined | InfoCircleOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **加载** | LoadingOutlined | LoadingOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **向上** | UpOutlined | UpOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **向下** | DownOutlined | DownOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **向左** | LeftOutlined | LeftOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **向右** | RightOutlined | RightOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **消息** | MessageOutlined | MessageOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **电话** | PhoneOutlined | PhoneOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **日历** | CalendarOutlined | CalendarOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **时钟** | ClockCircleOutlined | ClockCircleOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **图片** | PictureOutlined | PictureOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **文件** | FileOutlined | FileOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **相机** | CameraOutlined | CameraOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **二维码** | QrcodeOutlined | QrCodeOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **微信** | WechatOutlined | WechatOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **设备** | MobileOutlined | MobileOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **团队** | TeamOutlined | TeamOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **订单** | ShoppingOutlined | ShoppingOutline | `@ant-design/icons` / `antd-mobile-icons` |
-| **支付** | PayCircleOutlined | PayCircleOutline | `@ant-design/icons` / `antd-mobile-icons` |
-
-### 🔄 常见替换
-
-| 原图标 | 替换为 | 说明 |
-|--------|--------|------|
-| RiseOutlined | UpOutline | 上升趋势 |
-| ThumbsUpOutlined | LikeOutline | 点赞功能 |
-| ShareAltOutlined | LinkOutline | 分享功能 |
-| BarChartOutlined | PieOutline | 图表功能 |
-| LineChartOutlined | PieOutline | 图表功能 |
-| UserAddOutlined | UserOutline | 用户添加 |
-| SettingOutline | SettingOutline | 设置（移动端） |
-
-## 导入模板
-
-### PC端项目模板
-```typescript
-import {
-  HomeOutlined,
-  UserOutlined,
-  SettingOutlined,
-  SearchOutlined,
-  PlusOutlined,
-  EditOutlined,
-  DeleteOutlined,
-  CopyOutlined,
-  ReloadOutlined,
-  CloseOutlined,
-  CheckOutlined,
-  UpOutlined,
-  DownOutlined,
-  LeftOutlined,
-  RightOutlined,
-  MessageOutlined,
-  CalendarOutlined,
-  ClockCircleOutlined,
-  PictureOutlined,
-  FileOutlined,
-  CameraOutlined,
-  QrcodeOutlined,
-  WechatOutlined,
-  MobileOutlined,
-  TeamOutlined,
-  ShoppingOutlined,
-  PayCircleOutlined,
-  CheckCircleOutlined,
-  CloseCircleOutlined,
-  ExclamationCircleOutlined,
-  InfoCircleOutlined,
-  LoadingOutlined,
-} from '@ant-design/icons';
-```
-
-### 移动端项目模板
-```typescript
-import {
-  HomeOutline,
-  UserOutline,
-  SettingOutline,
-  SearchOutline,
-  AddOutline,
-  EditSOutline,
-  DeleteOutline,
-  CopyOutline,
-  RefreshOutline,
-  CloseOutline,
-  CheckOutline,
-  UpOutline,
-  DownOutline,
-  LeftOutline,
-  RightOutline,
-  MessageOutline,
-  CalendarOutline,
-  ClockCircleOutline,
-  PictureOutline,
-  FileOutline,
-  CameraOutline,
-  QrCodeOutline,
-  WechatOutline,
-  MobileOutline,
-  TeamOutline,
-  ShoppingOutline,
-  PayCircleOutline,
-  CheckCircleOutline,
-  CloseCircleOutline,
-  ExclamationCircleOutline,
-  InfoCircleOutline,
-  LoadingOutline,
-} from 'antd-mobile-icons';
-```
-
-## 使用示例
-
-### 基础使用
-```typescript
-// PC端
-import { HomeOutlined, UserOutlined } from '@ant-design/icons';
-
-<HomeOutlined style={{ fontSize: 16, color: '#1890ff' }} />
-<UserOutlined style={{ fontSize: 16, color: '#52c41a' }} />
-
-// 移动端
-import { HomeOutline, UserOutline } from 'antd-mobile-icons';
-
-<HomeOutline style={{ fontSize: 16, color: '#1890ff' }} />
-<UserOutline style={{ fontSize: 16, color: '#52c41a' }} />
-```
-
-### 按钮中使用
-```typescript
-// PC端
-import { PlusOutlined, EditOutlined } from '@ant-design/icons';
-
-<Button icon={<PlusOutlined />}>添加</Button>
-<Button icon={<EditOutlined />}>编辑</Button>
-
-// 移动端
-import { AddOutline, EditSOutline } from 'antd-mobile-icons';
-
-<Button>
-  <AddOutline /> 添加
-</Button>
-<Button>
-  <EditSOutline /> 编辑
-</Button>
-```
-
-### 列表中使用
-```typescript
-// PC端
-import { DeleteOutlined, CopyOutlined } from '@ant-design/icons';
-
-<Button icon={<DeleteOutlined />} danger>删除</Button>
-<Button icon={<CopyOutlined />}>复制</Button>
-
-// 移动端
-import { DeleteOutline, CopyOutline } from 'antd-mobile-icons';
-
-<Button color="danger">
-  <DeleteOutline /> 删除
-</Button>
-<Button>
-  <CopyOutline /> 复制
-</Button>
-```
-
-## 常见错误
-
-### ❌ 错误示例
-```typescript
-// 错误：混用PC端和移动端图标
-import { HomeOutlined } from '@ant-design/icons';  // PC端
-import { UserOutline } from 'antd-mobile-icons';   // 移动端
-
-// 错误：使用不存在的图标
-import { RiseOutlined } from 'antd-mobile-icons';  // 不存在
-import { UserAddOutline } from 'antd-mobile-icons'; // 不存在
-```
-
-### ✅ 正确示例
-```typescript
-// 正确：统一使用移动端图标
-import { 
-  HomeOutline, 
-  UserOutline, 
-  UpOutline,      // 替换RiseOutlined
-  UserOutline     // 替换UserAddOutline
-} from 'antd-mobile-icons';
-
-// 正确：统一使用PC端图标
-import { 
-  HomeOutlined, 
-  UserOutlined, 
-  RiseOutlined,   // PC端存在
-  UserAddOutlined // PC端存在
-} from '@ant-design/icons';
-```
-
-## 快速检查清单
-
-### 开发前检查
- [ ] 确认项目类型（PC端/移动端）
- [ ] 选择对应的图标包
- [ ] 检查图标是否存在
- [ ] 准备替换方案
-
-### 开发中检查
- [ ] 使用正确的导入方式
- [ ] 图标名称大小写正确
- [ ] 避免混用不同包的图标
- [ ] 为图标添加适当的样式
-
-### 开发后检查
- [ ] 图标显示正常
- [ ] 样式符合设计要求
- [ ] 无障碍属性完整
- [ ] 性能影响最小
-
-## 紧急替换方案
-
-当遇到图标不存在时，使用以下通用图标：
-
-```typescript
-// 移动端通用图标
-import {
-  QuestionCircleOutline,  // 通用问号
-  AppOutline,             // 通用应用
-  ToolOutline,            // 通用工具
-  SettingOutline,         // 通用设置
-  UserOutline,            // 通用用户
-} from 'antd-mobile-icons';
-
-// PC端通用图标
-import {
-  QuestionCircleOutlined, // 通用问号
-  AppstoreOutlined,       // 通用应用
-  ToolOutlined,           // 通用工具
-  SettingOutlined,        // 通用设置
-  UserOutlined,           // 通用用户
-} from '@ant-design/icons';
-```
-
-## 更新日志
-
- 2024-01-XX: 初始版本
- 添加常用图标对照
- 添加错误示例和正确示例
- 添加快速检查清单
- 添加紧急替换方案 
--- a/nkebao/index.html
+++ b/nkebao/index.html
@@ -1,13 +1,19 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Nkebao Base</title>
-    <style>html{font-size:16px;}</style>
+    <style>
+      html {
+        font-size: 16px;
+      }
+    </style>
+    <!-- 引入 uni-app web-view SDK（必须） -->
+    <script type="text/javascript" src="./websdk.js"></script>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
-</html> 
+</html>
--- a/nkebao/package-lock.json
+++ b/nkebao/package-lock.json
@@ -10,6 +10,7 @@
      "license": "MIT",
      "dependencies": {
        "@ant-design/icons": "^5.6.1",
+        "@capacitor/android": "^7.4.2",
        "antd": "^5.13.1",
        "antd-mobile": "^5.39.1",
        "axios": "^1.6.7",
@@ -444,6 +445,25 @@
        "node": ">=6.9.0"
      }
    },
+    "node_modules/@capacitor/android": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/@capacitor/android/-/android-7.4.2.tgz",
+      "integrity": "sha512-FZ7M9NwFkljR7EP5eXiE32mAIfZNcYw2CzRMCG3rQu0u0ZaIoeOeq5/oK4YcDnGpNmu8jpngKJqZ+9OiSQSwDg==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@capacitor/core": "^7.4.0"
+      }
+    },
+    "node_modules/@capacitor/core": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/@capacitor/core/-/core-7.4.2.tgz",
+      "integrity": "sha512-akCf9A1FUR8AWTtmgGjHEq6LmGsjA2U7igaJ9PxiCBfyxKqlDbuGHrlNdpvHEjV5tUPH3KYtkze6gtFcNKPU9A==",
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
    "node_modules/@emotion/hash": {
      "version": "0.8.0",
      "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
--- a/nkebao/public/manifest.json
+++ b/nkebao/public/manifest.json
@@ -0,0 +1,30 @@
+{
+  "name": "Cunkebao",
+  "short_name": "Cunkebao",
+  "description": "Cunkebao Mobile App",
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone",
+  "orientation": "portrait",
+  "scope": "/",
+  "start_url": "/",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "logo.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any maskable"
+    }
+  ]
+} 
--- a/nkebao/public/websdk.js
+++ b/nkebao/public/websdk.js
@@ -0,0 +1,308 @@
+!(function (e, n) {
+  "object" == typeof exports && "undefined" != typeof module
+    ? (module.exports = n())
+    : "function" == typeof define && define.amd
+      ? define(n)
+      : ((e = e || self).uni = n());
+})(this, function () {
+  "use strict";
+  try {
+    var e = {};
+    (Object.defineProperty(e, "passive", {
+      get: function () {
+        !0;
+      },
+    }),
+      window.addEventListener("test-passive", null, e));
+  } catch (e) {}
+  var n = Object.prototype.hasOwnProperty;
+  function i(e, i) {
+    return n.call(e, i);
+  }
+  var t = [];
+  function o() {
+    return window.__dcloud_weex_postMessage || window.__dcloud_weex_;
+  }
+  function a() {
+    return window.__uniapp_x_postMessage || window.__uniapp_x_;
+  }
+  var r = function (e, n) {
+      var i = { options: { timestamp: +new Date() }, name: e, arg: n };
+      if (a()) {
+        if ("postMessage" === e) {
+          var r = { data: n };
+          return window.__uniapp_x_postMessage
+            ? window.__uniapp_x_postMessage(r)
+            : window.__uniapp_x_.postMessage(JSON.stringify(r));
+        }
+        var d = {
+          type: "WEB_INVOKE_APPSERVICE",
+          args: { data: i, webviewIds: t },
+        };
+        window.__uniapp_x_postMessage
+          ? window.__uniapp_x_postMessageToService(d)
+          : window.__uniapp_x_.postMessageToService(JSON.stringify(d));
+      } else if (o()) {
+        if ("postMessage" === e) {
+          var s = { data: [n] };
+          return window.__dcloud_weex_postMessage
+            ? window.__dcloud_weex_postMessage(s)
+            : window.__dcloud_weex_.postMessage(JSON.stringify(s));
+        }
+        var w = {
+          type: "WEB_INVOKE_APPSERVICE",
+          args: { data: i, webviewIds: t },
+        };
+        window.__dcloud_weex_postMessage
+          ? window.__dcloud_weex_postMessageToService(w)
+          : window.__dcloud_weex_.postMessageToService(JSON.stringify(w));
+      } else {
+        if (!window.plus)
+          return window.parent.postMessage(
+            { type: "WEB_INVOKE_APPSERVICE", data: i, pageId: "" },
+            "*",
+          );
+        if (0 === t.length) {
+          var u = plus.webview.currentWebview();
+          if (!u) throw new Error("plus.webview.currentWebview() is undefined");
+          var g = u.parent(),
+            v = "";
+          ((v = g ? g.id : u.id), t.push(v));
+        }
+        if (plus.webview.getWebviewById("__uniapp__service"))
+          plus.webview.postMessageToUniNView(
+            { type: "WEB_INVOKE_APPSERVICE", args: { data: i, webviewIds: t } },
+            "__uniapp__service",
+          );
+        else {
+          var c = JSON.stringify(i);
+          plus.webview
+            .getLaunchWebview()
+            .evalJS(
+              'UniPlusBridge.subscribeHandler("'
+                .concat("WEB_INVOKE_APPSERVICE", '",')
+                .concat(c, ",")
+                .concat(JSON.stringify(t), ");"),
+            );
+        }
+      }
+    },
+    d = {
+      navigateTo: function () {
+        var e =
+            arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
+          n = e.url;
+        r("navigateTo", { url: encodeURI(n) });
+      },
+      navigateBack: function () {
+        var e =
+            arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
+          n = e.delta;
+        r("navigateBack", { delta: parseInt(n) || 1 });
+      },
+      switchTab: function () {
+        var e =
+            arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
+          n = e.url;
+        r("switchTab", { url: encodeURI(n) });
+      },
+      reLaunch: function () {
+        var e =
+            arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
+          n = e.url;
+        r("reLaunch", { url: encodeURI(n) });
+      },
+      redirectTo: function () {
+        var e =
+            arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {},
+          n = e.url;
+        r("redirectTo", { url: encodeURI(n) });
+      },
+      getEnv: function (e) {
+        a()
+          ? e({ uvue: !0 })
+          : o()
+            ? e({ nvue: !0 })
+            : window.plus
+              ? e({ plus: !0 })
+              : e({ h5: !0 });
+      },
+      postMessage: function () {
+        var e =
+          arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {};
+        r("postMessage", e.data || {});
+      },
+    },
+    s = /uni-app/i.test(navigator.userAgent),
+    w = /Html5Plus/i.test(navigator.userAgent),
+    u = /complete|loaded|interactive/;
+  var g =
+    window.my &&
+    navigator.userAgent.indexOf(
+      ["t", "n", "e", "i", "l", "C", "y", "a", "p", "i", "l", "A"]
+        .reverse()
+        .join(""),
+    ) > -1;
+  var v =
+    window.swan && window.swan.webView && /swan/i.test(navigator.userAgent);
+  var c =
+    window.qq &&
+    window.qq.miniProgram &&
+    /QQ/i.test(navigator.userAgent) &&
+    /miniProgram/i.test(navigator.userAgent);
+  var p =
+    window.tt &&
+    window.tt.miniProgram &&
+    /toutiaomicroapp/i.test(navigator.userAgent);
+  var _ =
+    window.wx &&
+    window.wx.miniProgram &&
+    /micromessenger/i.test(navigator.userAgent) &&
+    /miniProgram/i.test(navigator.userAgent);
+  var m = window.qa && /quickapp/i.test(navigator.userAgent);
+  var f =
+    window.ks &&
+    window.ks.miniProgram &&
+    /micromessenger/i.test(navigator.userAgent) &&
+    /miniProgram/i.test(navigator.userAgent);
+  var l =
+    window.tt &&
+    window.tt.miniProgram &&
+    /Lark|Feishu/i.test(navigator.userAgent);
+  var E =
+    window.jd && window.jd.miniProgram && /jdmp/i.test(navigator.userAgent);
+  var x =
+    window.xhs &&
+    window.xhs.miniProgram &&
+    /xhsminiapp/i.test(navigator.userAgent);
+  for (
+    var S,
+      h = function () {
+        ((window.UniAppJSBridge = !0),
+          document.dispatchEvent(
+            new CustomEvent("UniAppJSBridgeReady", {
+              bubbles: !0,
+              cancelable: !0,
+            }),
+          ));
+      },
+      y = [
+        function (e) {
+          if (s || w)
+            return (
+              window.__uniapp_x_postMessage ||
+              window.__uniapp_x_ ||
+              window.__dcloud_weex_postMessage ||
+              window.__dcloud_weex_
+                ? document.addEventListener("DOMContentLoaded", e)
+                : window.plus && u.test(document.readyState)
+                  ? setTimeout(e, 0)
+                  : document.addEventListener("plusready", e),
+              d
+            );
+        },
+        function (e) {
+          if (_)
+            return (
+              window.WeixinJSBridge && window.WeixinJSBridge.invoke
+                ? setTimeout(e, 0)
+                : document.addEventListener("WeixinJSBridgeReady", e),
+              window.wx.miniProgram
+            );
+        },
+        function (e) {
+          if (c)
+            return (
+              window.QQJSBridge && window.QQJSBridge.invoke
+                ? setTimeout(e, 0)
+                : document.addEventListener("QQJSBridgeReady", e),
+              window.qq.miniProgram
+            );
+        },
+        function (e) {
+          if (g) {
+            document.addEventListener("DOMContentLoaded", e);
+            var n = window.my;
+            return {
+              navigateTo: n.navigateTo,
+              navigateBack: n.navigateBack,
+              switchTab: n.switchTab,
+              reLaunch: n.reLaunch,
+              redirectTo: n.redirectTo,
+              postMessage: n.postMessage,
+              getEnv: n.getEnv,
+            };
+          }
+        },
+        function (e) {
+          if (v)
+            return (
+              document.addEventListener("DOMContentLoaded", e),
+              window.swan.webView
+            );
+        },
+        function (e) {
+          if (p)
+            return (
+              document.addEventListener("DOMContentLoaded", e),
+              window.tt.miniProgram
+            );
+        },
+        function (e) {
+          if (m) {
+            window.QaJSBridge && window.QaJSBridge.invoke
+              ? setTimeout(e, 0)
+              : document.addEventListener("QaJSBridgeReady", e);
+            var n = window.qa;
+            return {
+              navigateTo: n.navigateTo,
+              navigateBack: n.navigateBack,
+              switchTab: n.switchTab,
+              reLaunch: n.reLaunch,
+              redirectTo: n.redirectTo,
+              postMessage: n.postMessage,
+              getEnv: n.getEnv,
+            };
+          }
+        },
+        function (e) {
+          if (f)
+            return (
+              window.WeixinJSBridge && window.WeixinJSBridge.invoke
+                ? setTimeout(e, 0)
+                : document.addEventListener("WeixinJSBridgeReady", e),
+              window.ks.miniProgram
+            );
+        },
+        function (e) {
+          if (l)
+            return (
+              document.addEventListener("DOMContentLoaded", e),
+              window.tt.miniProgram
+            );
+        },
+        function (e) {
+          if (E)
+            return (
+              window.JDJSBridgeReady && window.JDJSBridgeReady.invoke
+                ? setTimeout(e, 0)
+                : document.addEventListener("JDJSBridgeReady", e),
+              window.jd.miniProgram
+            );
+        },
+        function (e) {
+          if (x) return window.xhs.miniProgram;
+        },
+        function (e) {
+          return (document.addEventListener("DOMContentLoaded", e), d);
+        },
+      ],
+      M = 0;
+    M < y.length && !(S = y[M](h));
+    M++
+  );
+  S || (S = {});
+  var P = "undefined" != typeof uni ? uni : {};
+  if (!P.navigateTo) for (var b in S) i(S, b) && (P[b] = S[b]);
+  return ((P.webView = S), P);
+});
--- a/nkebao/src/components/NavCommon/index.tsx
+++ b/nkebao/src/components/NavCommon/index.tsx
@@ -1,40 +1,61 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { NavBar } from "antd-mobile";
 import { ArrowLeftOutlined } from "@ant-design/icons";
 import { useNavigate } from "react-router-dom";
-
+import { getSafeAreaHeight } from "@/utils/common";
 interface NavCommonProps {
  title: string;
  backFn?: () => void;
  right?: React.ReactNode;
+  left?: React.ReactNode;
 }

-const NavCommon: React.FC<NavCommonProps> = ({ title, backFn, right }) => {
+const NavCommon: React.FC<NavCommonProps> = ({
+  title,
+  backFn,
+  right,
+  left,
+}) => {
  const navigate = useNavigate();
+  const [paddingTop, setPaddingTop] = useState("0px");
+  useEffect(() => {
+    setPaddingTop(getSafeAreaHeight() + "px");
+  }, []);
+
  return (
-    <NavBar
-      back={null}
-      style={{ background: "#fff" }}
-      left={
-        <div className="nav-title">
-          <ArrowLeftOutlined
-            twoToneColor="#1677ff"
-            onClick={() => {
-              if (backFn) {
-                backFn();
-              } else {
-                navigate(-1);
-              }
-            }}
-          />
-        </div>
-      }
-      right={right}
+    <div
+      style={{
+        paddingTop: paddingTop,
+        background: "#fff",
+      }}
    >
-      <span style={{ color: "var(--primary-color)", fontWeight: 600 }}>
-        {title}
-      </span>
-    </NavBar>
+      <NavBar
+        back={null}
+        left={
+          left ? (
+            left
+          ) : (
+            <div className="nav-title">
+              <ArrowLeftOutlined
+                twoToneColor="#1677ff"
+                onClick={() => {
+                  if (backFn) {
+                    backFn();
+                  } else {
+                    navigate(-1);
+                  }
+                }}
+              />
+            </div>
+          )
+        }
+        right={right}
+      >
+        <span style={{ color: "var(--primary-color)", fontWeight: 600 }}>
+          {title}
+        </span>
+      </NavBar>
+    </div>
  );
 };

--- a/nkebao/src/pages/iframe/index.module.scss
+++ b/nkebao/src/pages/iframe/index.module.scss
@@ -0,0 +1,323 @@
+.iframe-debug-page {
+  min-height: 100vh;
+  background: var(--primary-gradient);
+  padding: 20px;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+}
+
+.header {
+  text-align: center;
+  color: white;
+  margin-bottom: 30px;
+
+  h1 {
+    font-size: 2.5rem;
+    margin: 0 0 10px 0;
+    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
+  }
+
+  p {
+    font-size: 1.1rem;
+    margin: 0;
+    opacity: 0.9;
+  }
+}
+
+.content {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 30px;
+  margin-bottom: 30px;
+
+  @media (max-width: 768px) {
+    grid-template-columns: 1fr;
+    gap: 20px;
+  }
+}
+
+.control-panel,
+.message-panel {
+  background: white;
+  border-radius: 15px;
+  padding: 25px;
+  box-shadow: 0 10px 30px var(--primary-shadow);
+
+  h3 {
+    margin: 0 0 20px 0;
+    color: #333;
+    font-size: 1.3rem;
+    border-bottom: 2px solid var(--primary-color);
+    padding-bottom: 10px;
+  }
+}
+
+.input-group {
+  display: flex;
+  gap: 10px;
+  margin-bottom: 20px;
+
+  @media (max-width: 480px) {
+    flex-direction: column;
+  }
+}
+
+.button-group {
+  display: flex;
+  gap: 10px;
+  flex-wrap: wrap;
+}
+
+.btn {
+  padding: 12px 20px;
+  border: none;
+  border-radius: 8px;
+  font-size: 1rem;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+
+  &:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+  }
+
+  &:active {
+    transform: translateY(0);
+  }
+
+  &.btn-primary {
+    background: var(--primary-gradient);
+    color: white;
+
+    &:hover {
+      background: linear-gradient(
+        135deg,
+        var(--primary-color-dark) 0%,
+        var(--primary-color) 100%
+      );
+    }
+  }
+
+  &.btn-secondary {
+    background: linear-gradient(
+      135deg,
+      var(--primary-color-light) 0%,
+      var(--primary-color) 100%
+    );
+    color: white;
+
+    &:hover {
+      background: linear-gradient(
+        135deg,
+        var(--primary-color) 0%,
+        var(--primary-color-dark) 100%
+      );
+    }
+  }
+
+  &.btn-danger {
+    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a52 100%);
+    color: white;
+
+    &:hover {
+      background: linear-gradient(135deg, #ee5a52 0%, #d63031 100%);
+    }
+  }
+}
+
+.message-list {
+  max-height: 400px;
+  overflow-y: auto;
+  border: 1px solid #e1e5e9;
+  border-radius: 8px;
+  padding: 10px;
+  background: #f8f9fa;
+  font-size: 12px;
+}
+
+.no-messages {
+  text-align: center;
+  color: #6c757d;
+  font-style: italic;
+  padding: 20px;
+}
+
+.message-item {
+  background: white;
+  padding: 12px 15px;
+  margin-bottom: 8px;
+  border-radius: 6px;
+  border-left: 4px solid var(--primary-color);
+  box-shadow: 0 2px 4px var(--primary-shadow-light);
+  font-size: 12px;
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.message-text {
+  font-family: "Courier New", monospace;
+  font-size: 12px;
+  color: #333;
+  word-break: break-all;
+  line-height: 1.4;
+}
+
+.info-panel {
+  background: white;
+  border-radius: 15px;
+  padding: 25px;
+  box-shadow: 0 10px 30px var(--primary-shadow);
+
+  h3 {
+    margin: 0 0 20px 0;
+    color: #333;
+    font-size: 1.3rem;
+    border-bottom: 2px solid var(--primary-color);
+    padding-bottom: 10px;
+  }
+}
+
+.info-item {
+  margin-bottom: 12px;
+  padding: 10px;
+  background: #f8f9fa;
+  border-radius: 6px;
+  border-left: 3px solid var(--primary-color);
+
+  strong {
+    color: #495057;
+    margin-right: 8px;
+  }
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+// 滚动条样式
+.message-list::-webkit-scrollbar {
+  width: 8px;
+}
+
+.message-list::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 4px;
+}
+
+.message-list::-webkit-scrollbar-thumb {
+  background: #c1c1c1;
+  border-radius: 4px;
+
+  &:hover {
+    background: #a8a8a8;
+  }
+}
+
+// 响应式设计
+@media (max-width: 768px) {
+  .iframe-debug-page {
+    padding: 15px;
+  }
+
+  .header h1 {
+    font-size: 2rem;
+  }
+
+  .control-panel,
+  .message-panel,
+  .info-panel {
+    padding: 20px;
+  }
+
+  .btn {
+    padding: 10px 16px;
+    font-size: 0.9rem;
+  }
+}
+
+@media (max-width: 480px) {
+  .header h1 {
+    font-size: 1.8rem;
+  }
+
+  .content {
+    gap: 15px;
+  }
+
+  .control-panel,
+  .message-panel,
+  .info-panel {
+    padding: 15px;
+  }
+
+  .button-group {
+    flex-direction: column;
+  }
+
+  .btn {
+    width: 100%;
+  }
+}
+
+// URL 参数区域样式
+.url-params-section {
+  margin-top: 20px;
+  padding-top: 20px;
+  border-top: 2px solid #e1e5e9;
+
+  h4 {
+    margin: 0 0 15px 0;
+    color: #333;
+    font-size: 1.1rem;
+    font-weight: 600;
+  }
+}
+
+.no-params {
+  color: #666;
+  font-style: italic;
+  text-align: center;
+  padding: 20px;
+  background: #f8f9fa;
+  border-radius: 8px;
+  border: 2px dashed #dee2e6;
+}
+
+.params-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.param-item {
+  display: flex;
+  align-items: center;
+  padding: 10px 15px;
+  background: #f8f9fa;
+  border-radius: 8px;
+  border-left: 4px solid var(--primary-color);
+  transition: all 0.3s ease;
+
+  &:hover {
+    background: #e9ecef;
+    transform: translateX(5px);
+  }
+}
+
+.param-key {
+  font-weight: 600;
+  color: #333;
+  min-width: 80px;
+  margin-right: 10px;
+}
+
+.param-value {
+  color: #666;
+  font-family: "Courier New", monospace;
+  word-break: break-all;
+  flex: 1;
+}
--- a/nkebao/src/pages/iframe/index.tsx
+++ b/nkebao/src/pages/iframe/index.tsx
@@ -0,0 +1,242 @@
+import React, { useState, useEffect } from "react";
+import style from "./index.module.scss";
+import Layout from "@/components/Layout/Layout";
+import NavCommon from "@/components/NavCommon";
+import { LoadingOutlined, CheckCircleOutlined } from "@ant-design/icons";
+import { Input } from "antd";
+// 声明全局的 uni 对象
+declare global {
+  interface Window {
+    uni: any;
+  }
+}
+
+interface Message {
+  type: number; // 数据类型：0数据交互 1App功能调用
+  data: any;
+}
+
+const TYPE_EMUE = {
+  CONNECT: 0,
+  DATA: 1,
+  FUNCTION: 2,
+  CONFIG: 3,
+};
+const IframeDebugPage: React.FC = () => {
+  const [receivedMessages, setReceivedMessages] = useState<string[]>([]);
+  const [messageId, setMessageId] = useState(0);
+  const [inputMessage, setInputMessage] = useState("");
+  const [connectStatus, setConnectStatus] = useState(false);
+
+  // 解析 URL 参数中的消息
+  const parseUrlMessage = () => {
+    const search = window.location.search.substring(1);
+    let messageParam = null;
+
+    if (search) {
+      const pairs = search.split("&");
+      for (const pair of pairs) {
+        const [key, value] = pair.split("=");
+        if (key === "message" && value) {
+          messageParam = decodeURIComponent(value);
+          break;
+        }
+      }
+    }
+
+    if (messageParam) {
+      try {
+        const message = JSON.parse(decodeURIComponent(messageParam));
+        console.log("[存客宝]ReceiveMessage=>\n" + JSON.stringify(message));
+        handleReceivedMessage(message);
+        // 清除URL中的message参数
+        const newUrl =
+          window.location.pathname +
+          window.location.search
+            .replace(/[?&]message=[^&]*/, "")
+            .replace(/^&/, "?");
+        window.history.replaceState({}, "", newUrl);
+      } catch (e) {
+        console.error("解析URL消息失败:", e);
+      }
+    }
+  };
+
+  useEffect(() => {
+    parseUrlMessage();
+    // 监听 SDK 初始化完成事件
+  }, []);
+
+  // 处理接收到的消息
+  const handleReceivedMessage = (message: Message) => {
+    const messageText = `[${new Date().toLocaleTimeString()}] 收到: ${JSON.stringify(message)}`;
+    setReceivedMessages(prev => [...prev, messageText]);
+    console.log("message.type", message.type);
+    if ([TYPE_EMUE.CONNECT].includes(message.type)) {
+      setConnectStatus(true);
+    }
+  };
+
+  // 向 App 发送消息
+  const sendMessageToParent = (message: Message) => {
+    if (window.uni && window.uni.postMessage) {
+      try {
+        window.uni.postMessage({
+          data: message,
+        });
+        console.log("[存客宝]SendMessage=>\n" + JSON.stringify(message));
+      } catch (e) {
+        console.error(
+          "[存客宝]SendMessage=>\n" + JSON.stringify(message) + "发送失败:",
+          e,
+        );
+      }
+    } else {
+      console.error(
+        "[存客宝]SendMessage=>\n" + JSON.stringify(message) + "无法发送消息",
+      );
+    }
+  };
+
+  // 发送自定义消息到 App
+  const sendCustomMessage = () => {
+    if (!inputMessage.trim()) return;
+
+    const newMessageId = messageId + 1;
+    setMessageId(newMessageId);
+
+    const message: Message = {
+      type: TYPE_EMUE.DATA, // 数据交互
+      data: {
+        id: newMessageId,
+        content: inputMessage,
+        source: "存客宝消息源",
+        timestamp: Date.now(),
+      },
+    };
+
+    sendMessageToParent(message);
+    setInputMessage("");
+  };
+
+  // 发送测试消息到 App
+  const sendTestMessage = () => {
+    const newMessageId = messageId + 1;
+    setMessageId(newMessageId);
+
+    const message: Message = {
+      type: TYPE_EMUE.DATA, // 数据交互
+      data: {
+        id: newMessageId,
+        action: "ping",
+        content: `存客宝测试消息 ${newMessageId}`,
+        random: Math.random(),
+      },
+    };
+
+    sendMessageToParent(message);
+  };
+
+  // 发送App功能调用消息
+  const sendAppFunctionCall = () => {
+    const message: Message = {
+      type: 1, // App功能调用
+      data: {
+        action: "showToast",
+        params: {
+          title: "来自H5的功能调用",
+          icon: "success",
+        },
+      },
+    };
+
+    sendMessageToParent(message);
+  };
+
+  // 清空消息列表
+  const clearMessages = () => {
+    setInputMessage("");
+    setReceivedMessages([]);
+  };
+
+  return (
+    <Layout
+      header={
+        <NavCommon
+          title="iframe调试"
+          right={
+            connectStatus ? (
+              <CheckCircleOutlined style={{ color: "green" }} />
+            ) : (
+              <span>
+                <span style={{ marginRight: 4, fontSize: 12 }}>连接中...</span>
+                <LoadingOutlined />
+              </span>
+            )
+          }
+        />
+      }
+    >
+      <div className={style["iframe-debug-page"]}>
+        <div className={style.content}>
+          <div className={style["message-panel"]}>
+            <h4>接收到的消息</h4>
+            <div className={style["message-list"]}>
+              {receivedMessages.length === 0 ? (
+                <div className={style["no-messages"]}>暂无消息</div>
+              ) : (
+                receivedMessages.map((msg, index) => (
+                  <div key={index} className={style["message-item"]}>
+                    <span className={style["message-text"]}>{msg}</span>
+                  </div>
+                ))
+              )}
+            </div>
+          </div>
+
+          <div className={style["control-panel"]}>
+            <h4>控制面板</h4>
+
+            <div className={style["input-group"]}>
+              <Input
+                type="text"
+                value={inputMessage}
+                onChange={e => setInputMessage(e.target.value)}
+                placeholder="输入要发送的消息"
+              />
+              <button
+                onClick={sendCustomMessage}
+                className={`${style.btn} ${style["btn-primary"]}`}
+              >
+                发送消息
+              </button>
+            </div>
+
+            <div className={style["button-group"]}>
+              <button
+                onClick={sendTestMessage}
+                className={`${style.btn} ${style["btn-secondary"]}`}
+              >
+                发送测试消息
+              </button>
+              <button
+                onClick={sendAppFunctionCall}
+                className={`${style.btn} ${style["btn-warning"]}`}
+              >
+                功能调用
+              </button>
+              <button
+                onClick={clearMessages}
+                className={`${style.btn} ${style["btn-danger"]}`}
+              >
+                清空消息
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </Layout>
+  );
+};
+
+export default IframeDebugPage;
--- a/nkebao/src/pages/iframe/init.tsx
+++ b/nkebao/src/pages/iframe/init.tsx
@@ -0,0 +1,227 @@
+import React, { useState, useEffect } from "react";
+import style from "./index.module.scss";
+import Layout from "@/components/Layout/Layout";
+import NavCommon from "@/components/NavCommon";
+import { Input } from "antd";
+import { useNavigate } from "react-router-dom";
+
+// 声明全局的 uni 对象
+declare global {
+  interface Window {
+    uni: any;
+  }
+}
+
+interface Message {
+  type: number; // 数据类型：0数据交互 1App功能调用
+  data: any;
+}
+
+const TYPE_EMUE = {
+  CONNECT: 0,
+  DATA: 1,
+  FUNCTION: 2,
+  CONFIG: 3,
+};
+const IframeDebugPage: React.FC = () => {
+  const [receivedMessages, setReceivedMessages] = useState<string[]>([]);
+  const [messageId, setMessageId] = useState(0);
+  const [inputMessage, setInputMessage] = useState("");
+  const navigate = useNavigate();
+  // 解析 URL 参数中的消息
+  const parseUrlMessage = () => {
+    const search = window.location.search.substring(1);
+    let messageParam = null;
+
+    if (search) {
+      const pairs = search.split("&");
+      for (const pair of pairs) {
+        const [key, value] = pair.split("=");
+        if (key === "message" && value) {
+          messageParam = decodeURIComponent(value);
+          break;
+        }
+      }
+    }
+
+    if (messageParam) {
+      try {
+        const message = JSON.parse(decodeURIComponent(messageParam));
+        console.log("[存客宝]ReceiveMessage=>\n" + JSON.stringify(message));
+        handleReceivedMessage(message);
+        // 清除URL中的message参数
+        const newUrl =
+          window.location.pathname +
+          window.location.search
+            .replace(/[?&]message=[^&]*/, "")
+            .replace(/^&/, "?");
+        window.history.replaceState({}, "", newUrl);
+      } catch (e) {
+        console.error("解析URL消息失败:", e);
+      }
+    }
+  };
+
+  useEffect(() => {
+    parseUrlMessage();
+    // 监听 SDK 初始化完成事件
+  }, []);
+
+  // 处理接收到的消息
+  const handleReceivedMessage = (message: Message) => {
+    const messageText = `[${new Date().toLocaleTimeString()}] 收到: ${JSON.stringify(message)}`;
+    setReceivedMessages(prev => [...prev, messageText]);
+    console.log("message.type", message.type);
+    if ([TYPE_EMUE.CONFIG].includes(message.type)) {
+      localStorage.setItem("paddingTop", message.data.paddingTop);
+      navigate("/");
+    }
+  };
+
+  // 向 App 发送消息
+  const sendMessageToParent = (message: Message) => {
+    if (window.uni && window.uni.postMessage) {
+      try {
+        window.uni.postMessage({
+          data: message,
+        });
+        console.log("[存客宝]SendMessage=>\n" + JSON.stringify(message));
+      } catch (e) {
+        console.error(
+          "[存客宝]SendMessage=>\n" + JSON.stringify(message) + "发送失败:",
+          e,
+        );
+      }
+    } else {
+      console.error(
+        "[存客宝]SendMessage=>\n" + JSON.stringify(message) + "无法发送消息",
+      );
+    }
+  };
+
+  // 发送自定义消息到 App
+  const sendCustomMessage = () => {
+    if (!inputMessage.trim()) return;
+
+    const newMessageId = messageId + 1;
+    setMessageId(newMessageId);
+
+    const message: Message = {
+      type: TYPE_EMUE.DATA, // 数据交互
+      data: {
+        id: newMessageId,
+        content: inputMessage,
+        source: "存客宝消息源",
+        timestamp: Date.now(),
+      },
+    };
+
+    sendMessageToParent(message);
+    setInputMessage("");
+  };
+
+  // 发送测试消息到 App
+  const sendTestMessage = () => {
+    const newMessageId = messageId + 1;
+    setMessageId(newMessageId);
+
+    const message: Message = {
+      type: TYPE_EMUE.DATA, // 数据交互
+      data: {
+        id: newMessageId,
+        action: "ping",
+        content: `存客宝测试消息 ${newMessageId}`,
+        random: Math.random(),
+      },
+    };
+
+    sendMessageToParent(message);
+  };
+
+  // 发送App功能调用消息
+  const sendAppFunctionCall = () => {
+    const message: Message = {
+      type: 1, // App功能调用
+      data: {
+        action: "showToast",
+        params: {
+          title: "来自H5的功能调用",
+          icon: "success",
+        },
+      },
+    };
+
+    sendMessageToParent(message);
+  };
+
+  // 清空消息列表
+  const clearMessages = () => {
+    setInputMessage("");
+    setReceivedMessages([]);
+  };
+
+  return (
+    <Layout header={<NavCommon title="iframe调试" />}>
+      <div className={style["iframe-debug-page"]}>
+        <div className={style.content}>
+          <div className={style["message-panel"]}>
+            <h4>接收到的消息</h4>
+            <div className={style["message-list"]}>
+              {receivedMessages.length === 0 ? (
+                <div className={style["no-messages"]}>暂无消息</div>
+              ) : (
+                receivedMessages.map((msg, index) => (
+                  <div key={index} className={style["message-item"]}>
+                    <span className={style["message-text"]}>{msg}</span>
+                  </div>
+                ))
+              )}
+            </div>
+          </div>
+
+          <div className={style["control-panel"]}>
+            <h4>控制面板</h4>
+
+            <div className={style["input-group"]}>
+              <Input
+                type="text"
+                value={inputMessage}
+                onChange={e => setInputMessage(e.target.value)}
+                placeholder="输入要发送的消息"
+              />
+              <button
+                onClick={sendCustomMessage}
+                className={`${style.btn} ${style["btn-primary"]}`}
+              >
+                发送消息
+              </button>
+            </div>
+
+            <div className={style["button-group"]}>
+              <button
+                onClick={sendTestMessage}
+                className={`${style.btn} ${style["btn-secondary"]}`}
+              >
+                发送测试消息
+              </button>
+              <button
+                onClick={sendAppFunctionCall}
+                className={`${style.btn} ${style["btn-warning"]}`}
+              >
+                功能调用
+              </button>
+              <button
+                onClick={clearMessages}
+                className={`${style.btn} ${style["btn-danger"]}`}
+              >
+                清空消息
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </Layout>
+  );
+};
+
+export default IframeDebugPage;
--- a/nkebao/src/pages/login/login.module.scss
+++ b/nkebao/src/pages/login/login.module.scss
@@ -116,10 +116,6 @@
  margin: 0;
 }

-.form-container {
-  margin-bottom: 20px;
-}
-
 // 标签页样式
 .tab-container {
  display: flex;
--- a/nkebao/src/pages/login/login.tsx
+++ b/nkebao/src/pages/login/login.tsx
@@ -9,6 +9,8 @@ import {
 import { useUserStore } from "@/store/module/user";
 import { loginWithPassword, loginWithCode, sendVerificationCode } from "./api";
 import style from "./login.module.scss";
+import Layout from "@/components/Layout/Layout";
+import NavCommon from "@/components/NavCommon";

 const Login: React.FC = () => {
  const [form] = Form.useForm();
@@ -137,9 +139,11 @@ const Login: React.FC = () => {
  const handleAppleLogin = () => {
    Toast.show({ content: "Apple登录功能开发中", position: "top" });
  };
-
+  const paddingTop = localStorage.getItem("paddingTop") || "44px";
  return (
    <div className={style["login-page"]}>
+      <div style={{ height: paddingTop }}></div>
+      <div style={{ height: "80px" }}></div>
      {/* 背景装饰 */}
      <div className={style["bg-decoration"]}>
        <div className={style["bg-circle"]}></div>
--- a/nkebao/src/pages/mobile/home/index.tsx
+++ b/nkebao/src/pages/mobile/home/index.tsx
@@ -1,10 +1,8 @@
 import React, { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { NavBar } from "antd-mobile";
+import NavCommon from "@/components/NavCommon";
 import {
-  BellOutlined,
  MobileOutlined,
-  UserOutlined,
  MessageOutlined,
  TeamOutlined,
  RiseOutlined,
@@ -27,13 +25,6 @@ interface DashboardData {
  aliveWechatNum?: number;
 }

-interface TodayStatsData {
-  momentsNum?: number;
-  groupPushNum?: number;
-  passRate?: string;
-  sysActive?: string;
-}
-
 interface SevenDayStatsData {
  date?: string[];
  allNum?: number[];
@@ -146,13 +137,7 @@ const Home: React.FC = () => {

  return (
    <Layout
-      header={
-        <NavBar back={null} style={{ background: "#fff" }}>
-          <div className={style["nav-title"]}>
-            <span className={style["nav-text"]}>存客宝</span>
-          </div>
-        </NavBar>
-      }
+      header={<NavCommon left={<></>} title="存客宝" />}
      footer={<MeauMobile activeKey="home" />}
      loading={isLoading}
    >
--- a/nkebao/src/pages/mobile/mine/devices/DeviceDetail.tsx
+++ b/nkebao/src/pages/mobile/mine/devices/DeviceDetail.tsx
@@ -1,7 +1,15 @@
 import React, { useEffect, useState, useCallback, useRef } from "react";
 import { useParams, useNavigate } from "react-router-dom";
-import { NavBar, Tabs, Switch, Toast, SpinLoading, Button } from "antd-mobile";
-import { SettingOutlined, RedoOutlined } from "@ant-design/icons";
+import {
+  NavBar,
+  Tabs,
+  Switch,
+  Toast,
+  SpinLoading,
+  Button,
+  Avatar,
+} from "antd-mobile";
+import { SettingOutlined, RedoOutlined, UserOutlined } from "@ant-design/icons";
 import Layout from "@/components/Layout/Layout";
 import {
  fetchDeviceDetail,
@@ -262,15 +270,32 @@ const DeviceDetail: React.FC = () => {
                        navigate(`/wechat-accounts/detail/${acc.wechatId}`);
                      }}
                    >
-                      <img
-                        src={acc.avatar || "/placeholder.svg"}
+                      <Avatar
+                        src={acc.avatar}
                        alt={acc.nickname}
                        style={{
                          width: 40,
                          height: 40,
-                          borderRadius: 20,
                          background: "#eee",
                        }}
+                        fallback={
+                          <div
+                            style={{
+                              width: 40,
+                              height: 40,
+                              display: "flex",
+                              alignItems: "center",
+                              justifyContent: "center",
+                              background:
+                                "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
+                              color: "white",
+                              fontSize: 16,
+                              borderRadius: "50%",
+                            }}
+                          >
+                            <UserOutlined />
+                          </div>
+                        }
                      />
                      <div style={{ flex: 1 }}>
                        <div style={{ fontWeight: 500 }}>{acc.nickname}</div>
--- a/nkebao/src/pages/mobile/mine/main/index.tsx
+++ b/nkebao/src/pages/mobile/mine/main/index.tsx
@@ -1,13 +1,11 @@
 import React, { useState, useEffect } from "react";
 import { useNavigate } from "react-router-dom";
-import { Card, NavBar, List, Button, Dialog, Toast } from "antd-mobile";
+import { Card, NavBar, List, Button } from "antd-mobile";
 import {
-  LogoutOutlined,
  PhoneOutlined,
  MessageOutlined,
  DatabaseOutlined,
  FolderOpenOutlined,
-  BellOutlined,
  SettingOutlined,
 } from "@ant-design/icons";
 import MeauMobile from "@/components/MeauMobile/MeauMoible";
@@ -15,6 +13,7 @@ import Layout from "@/components/Layout/Layout";
 import style from "./index.module.scss";
 import { useUserStore } from "@/store/module/user";
 import { getDashboard } from "./api";
+import NavCommon from "@/components/NavCommon";
 const Mine: React.FC = () => {
  const navigate = useNavigate();
  const { user } = useUserStore();
@@ -25,7 +24,6 @@ const Mine: React.FC = () => {
    content: 156,
    balance: 0,
  });
-  const [showLogoutDialog, setShowLogoutDialog] = useState(false);

  // 用户信息
  const currentUserInfo = {
@@ -102,19 +100,6 @@ const Mine: React.FC = () => {
    loadStats();
  }, []);

-  const handleLogout = () => {
-    // 清除本地存储的用户信息
-    localStorage.removeItem("token");
-    localStorage.removeItem("token_expired");
-    localStorage.removeItem("userInfo");
-    setShowLogoutDialog(false);
-    navigate("/login");
-    Toast.show({
-      content: "退出成功",
-      position: "top",
-    });
-  };
-
  const handleFunctionClick = (path: string) => {
    navigate(path);
  };
@@ -140,13 +125,7 @@ const Mine: React.FC = () => {

  return (
    <Layout
-      header={
-        <NavBar back={null} style={{ background: "#fff" }}>
-          <div style={{ color: "var(--primary-color)", fontWeight: 600 }}>
-            我的
-          </div>
-        </NavBar>
-      }
+      header={<NavCommon title="我的" />}
      footer={<MeauMobile activeKey="mine" />}
    >
      <div className={style["mine-page"]}>
@@ -227,42 +206,7 @@ const Mine: React.FC = () => {
            ))}
          </List>
        </Card>
-
-        {/* 退出登录按钮 */}
-        <Button
-          block
-          color="danger"
-          fill="outline"
-          className={style["logout-btn"]}
-          onClick={() => setShowLogoutDialog(true)}
-        >
-          <LogoutOutlined style={{ marginRight: "8px" }} />
-          退出登录
-        </Button>
      </div>
-
-      {/* 退出登录确认对话框 */}
-      <Dialog
-        content="您确定要退出登录吗？退出后需要重新登录才能使用完整功能。"
-        visible={showLogoutDialog}
-        closeOnAction
-        actions={[
-          [
-            {
-              key: "cancel",
-              text: "取消",
-            },
-            {
-              key: "confirm",
-              text: "确认退出",
-              bold: true,
-              danger: true,
-              onClick: handleLogout,
-            },
-          ],
-        ]}
-        onClose={() => setShowLogoutDialog(false)}
-      />
    </Layout>
  );
 };
--- a/nkebao/src/pages/mobile/mine/setting/SecuritySetting.tsx
+++ b/nkebao/src/pages/mobile/mine/setting/SecuritySetting.tsx
@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { NavBar, List, Button, Dialog, Toast, Card, Input } from "antd-mobile";
+import { NavBar, List, Dialog, Toast, Card, Input } from "antd-mobile";
 import {
  LockOutlined,
  MobileOutlined,
@@ -10,7 +10,7 @@ import {
 import Layout from "@/components/Layout/Layout";
 import { useUserStore } from "@/store/module/user";
 import style from "./index.module.scss";
-
+import NavCommon from "@/components/NavCommon";
 const SecuritySetting: React.FC = () => {
  const navigate = useNavigate();
  const { user } = useUserStore();
@@ -92,15 +92,7 @@ const SecuritySetting: React.FC = () => {
  ];

  return (
-    <Layout
-      header={
-        <NavBar onBack={() => navigate(-1)} style={{ background: "#fff" }}>
-          <span style={{ color: "var(--primary-color)", fontWeight: 600 }}>
-            安全设置
-          </span>
-        </NavBar>
-      }
-    >
+    <Layout header={<NavCommon title="安全设置" />}>
      <div className={style["setting-page"]}>
        {/* 安全提示卡片 */}
        <Card className={style["security-tip-card"]}>
@@ -125,9 +117,7 @@ const SecuritySetting: React.FC = () => {
                prefix={item.icon}
                title={item.title}
                description={item.description}
-                extra={<RightOutlined style={{ color: "#ccc" }} />}
                onClick={item.onClick}
-                arrow
              />
            ))}
          </List>
@@ -163,30 +153,36 @@ const SecuritySetting: React.FC = () => {
        title="修改密码"
        content={
          <div className={style["password-form"]}>
-            <Input
-              type="password"
-              placeholder="请输入当前密码"
-              value={passwordForm.oldPassword}
-              onChange={value =>
-                setPasswordForm(prev => ({ ...prev, oldPassword: value }))
-              }
-            />
-            <Input
-              type="password"
-              placeholder="请输入新密码"
-              value={passwordForm.newPassword}
-              onChange={value =>
-                setPasswordForm(prev => ({ ...prev, newPassword: value }))
-              }
-            />
-            <Input
-              type="password"
-              placeholder="请确认新密码"
-              value={passwordForm.confirmPassword}
-              onChange={value =>
-                setPasswordForm(prev => ({ ...prev, confirmPassword: value }))
-              }
-            />
+            <div className={style["line"]}>
+              <Input
+                type="password"
+                placeholder="请输入当前密码"
+                value={passwordForm.oldPassword}
+                onChange={value =>
+                  setPasswordForm(prev => ({ ...prev, oldPassword: value }))
+                }
+              />
+            </div>
+            <div className={style["line"]}>
+              <Input
+                type="password"
+                placeholder="请输入新密码"
+                value={passwordForm.newPassword}
+                onChange={value =>
+                  setPasswordForm(prev => ({ ...prev, newPassword: value }))
+                }
+              />
+            </div>
+            <div className={style["line"]}>
+              <Input
+                type="password"
+                placeholder="请确认新密码"
+                value={passwordForm.confirmPassword}
+                onChange={value =>
+                  setPasswordForm(prev => ({ ...prev, confirmPassword: value }))
+                }
+              />
+            </div>
          </div>
        }
        closeOnAction
--- a/nkebao/src/pages/mobile/mine/setting/index.module.scss
+++ b/nkebao/src/pages/mobile/mine/setting/index.module.scss
@@ -1,30 +1,39 @@
 .save-buttons {
  padding: 12px;
-  background: #fff;
 }
 .setting-page {
  padding: 12px;

  .user-card {
-    margin-bottom: 12px;
-    border-radius: 12px;
+    margin-bottom: 16px;
+    border-radius: 16px;
    overflow: hidden;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+    background: linear-gradient(
+      135deg,
+      var(--primary-color) 0%,
+      var(--primary-color-dark) 100%
+    );
+    position: relative;

    .user-info {
      display: flex;
      align-items: center;
-      padding: 16px;
+      padding: 20px;
      gap: 16px;
+      position: relative;
+      z-index: 1;

      .avatar {
-        width: 60px;
-        height: 60px;
-        border-radius: 30px;
+        width: 70px;
+        height: 70px;
+        border-radius: 35px;
        overflow: hidden;
        flex-shrink: 0;
-        background: #f0f0f0;
-        border: 2px solid #e0e0e0;
+        background: rgba(255, 255, 255, 0.2);
+        border: 3px solid rgba(255, 255, 255, 0.3);
+        position: relative;
+        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);

        img {
          width: 100%;
@@ -35,13 +44,18 @@
        .avatar-placeholder {
          width: 100%;
          height: 100%;
-          background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+          background: linear-gradient(
+            135deg,
+            var(--primary-color) 0%,
+            var(--primary-color-dark) 100%
+          );
          display: flex;
          align-items: center;
          justify-content: center;
          color: white;
-          font-size: 24px;
+          font-size: 28px;
          font-weight: bold;
+          text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
        }
      }

@@ -50,19 +64,20 @@
        min-width: 0;

        .username {
-          font-size: 18px;
-          font-weight: 600;
-          color: #333;
-          margin-bottom: 4px;
+          font-size: 20px;
+          font-weight: 700;
+          color: white;
+          margin-bottom: 6px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
+          text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
        }

        .account {
          font-size: 14px;
-          color: #666;
-          margin-bottom: 4px;
+          color: rgba(255, 255, 255, 0.8);
+          margin-bottom: 6px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
@@ -70,99 +85,205 @@

        .role {
          font-size: 12px;
-          color: #999;
-          background: #f0f0f0;
-          padding: 2px 8px;
-          border-radius: 10px;
+          color: rgba(255, 255, 255, 0.9);
+          background: rgba(255, 255, 255, 0.2);
+          padding: 4px 12px;
+          border-radius: 12px;
          display: inline-block;
+          backdrop-filter: blur(10px);
+          border: 1px solid rgba(255, 255, 255, 0.3);
        }
      }
+
+      .user-actions {
+        flex-shrink: 0;
+      }
    }
  }

  .setting-group {
-    margin-bottom: 12px;
-    border-radius: 12px;
+    margin-bottom: 16px;
+    border-radius: 16px;
    overflow: hidden;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
+    background: white;
+    border: 1px solid rgba(0, 0, 0, 0.05);

    .group-title {
-      padding: 12px 16px 8px;
-      font-size: 14px;
-      font-weight: 600;
-      color: #666;
-      background: #fafafa;
+      padding: 16px 20px 12px;
+      font-size: 15px;
+      font-weight: 700;
+      color: #333;
+      background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
      border-bottom: 1px solid #f0f0f0;
+      display: flex;
+      align-items: center;
+      gap: 8px;
+
+      .group-icon {
+        font-size: 16px;
+      }
    }

-    :global(.adm-list) {
-      --border-inner: solid 1px #f0f0f0;
-      --border-top: none;
-      --border-bottom: none;
-      --adm-font-size-main: 16px;
-      --adm-color-text: #333;
-      --adm-color-text-secondary: #666;
+    .setting-list {
+      :global(.adm-list) {
+        --border-inner: solid 1px #f0f0f0;
+        --border-top: none;
+        --border-bottom: none;
+        --adm-font-size-main: 16px;
+        --adm-color-text: #333;
+        --adm-color-text-secondary: #666;

-      .adm-list-item {
-        padding: 16px;
-        min-height: 56px;
+        .adm-list-item {
+          padding: 16px 20px;
+          min-height: 64px;
+          transition: all 0.2s ease;
+          position: relative;

-        .adm-list-item-content {
-          padding: 0;
-        }
-
-        .adm-list-item-content-prefix {
-          margin-right: 12px;
-          font-size: 20px;
-          color: var(--primary-color);
-        }
-
-        .adm-list-item-content-main {
-          flex: 1;
-          min-width: 0;
-
-          .adm-list-item-content-main-title {
-            font-size: 16px;
-            font-weight: 500;
-            color: #333;
-            margin-bottom: 4px;
+          &:hover {
+            background: #f8f9fa;
+            transform: translateX(4px);
          }

-          .adm-list-item-content-main-description {
-            font-size: 14px;
-            color: #666;
-            line-height: 1.4;
+          &:active {
+            background: #e9ecef;
+            transform: scale(0.98);
          }
-        }

-        .adm-list-item-content-extra {
-          margin-left: 8px;
-        }
+          .adm-list-item-content {
+            padding: 0;
+          }

-        &:last-child {
-          border-bottom: none;
-        }
+          .adm-list-item-content-prefix {
+            margin-right: 16px;
+          }

-        &:active {
-          background-color: #f5f5f5;
+          .adm-list-item-content-main {
+            flex: 1;
+            min-width: 0;
+
+            .adm-list-item-content-main-title {
+              font-size: 16px;
+              font-weight: 600;
+              color: #333;
+              margin-bottom: 4px;
+            }
+
+            .adm-list-item-content-main-description {
+              font-size: 14px;
+              color: #666;
+              line-height: 1.4;
+            }
+          }
+
+          .adm-list-item-content-extra {
+            margin-left: 8px;
+          }
+
+          &:last-child {
+            border-bottom: none;
+          }
        }
      }
    }
  }

+  .setting-icon {
+    width: 40px;
+    height: 40px;
+    border-radius: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 18px;
+    background: rgba(24, 144, 255, 0.1);
+    color: var(--primary-color);
+    transition: all 0.2s ease;
+
+    &:hover {
+      transform: scale(1.1);
+      background: rgba(24, 144, 255, 0.2);
+    }
+  }
+
+  .setting-title {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .setting-badge {
+    background: #ff4d4f;
+    color: white;
+    font-size: 10px;
+    padding: 2px 6px;
+    border-radius: 8px;
+    font-weight: 500;
+  }
+
+  .setting-item {
+    transition: all 0.2s ease;
+  }
+
  .version-info {
-    text-align: center;
-    padding: 24px 16px;
-    color: #999;
-    font-size: 12px;
-    line-height: 1.6;
+    .version-card {
+      background: white;
+      border-radius: 16px;
+      padding: 24px;
+      margin-bottom: 16px;
+      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
+      display: flex;
+      align-items: center;
+      gap: 16px;

-    span {
-      display: block;
-      margin-bottom: 4px;
+      .app-logo {
+        flex-shrink: 0;
+        width: 60px;
+        height: 60px;
+        img {
+          width: 100%;
+          height: 100%;
+          object-fit: cover;
+        }
+      }

-      &:last-child {
-        margin-bottom: 0;
+      .version-details {
+        flex: 1;
+        text-align: left;
+
+        .app-name {
+          font-size: 18px;
+          font-weight: 700;
+          color: #333;
+          margin-bottom: 4px;
+        }
+
+        .version-text {
+          font-size: 14px;
+          color: #666;
+          margin-bottom: 2px;
+        }
+
+        .build-info {
+          font-size: 12px;
+          color: #999;
+        }
+      }
+    }
+
+    .copyright {
+      color: #999;
+      font-size: 12px;
+      line-height: 1.6;
+      text-align: center;
+      span {
+        display: block;
+        margin-bottom: 4px;
+
+        &:last-child {
+          margin-bottom: 0;
+          color: #ccc;
+        }
      }
    }
  }
@@ -252,7 +373,9 @@
    flex-direction: column;
    gap: 12px;
    padding: 16px 0;
-
+    .line {
+      margin-bottom: 12px;
+    }
    :global(.adm-input) {
      border: 1px solid #d9d9d9;
      border-radius: 8px;
--- a/nkebao/src/pages/mobile/mine/setting/index.tsx
+++ b/nkebao/src/pages/mobile/mine/setting/index.tsx
@@ -7,12 +7,15 @@ import {
  InfoCircleOutlined,
  LogoutOutlined,
  SettingOutlined,
+  LockOutlined,
+  HeartOutlined,
+  StarOutlined,
 } from "@ant-design/icons";
 import Layout from "@/components/Layout/Layout";
 import { useUserStore } from "@/store/module/user";
 import { useSettingsStore } from "@/store/module/settings";
 import style from "./index.module.scss";
-
+import NavCommon from "@/components/NavCommon";
 interface SettingItem {
  id: string;
  title: string;
@@ -22,6 +25,8 @@ interface SettingItem {
  value?: boolean;
  path?: string;
  onClick?: () => void;
+  badge?: string;
+  color?: string;
 }

 const Setting: React.FC = () => {
@@ -29,15 +34,11 @@ const Setting: React.FC = () => {
  const { user, logout } = useUserStore();
  const { settings, updateSetting } = useSettingsStore();
  const [showLogoutDialog, setShowLogoutDialog] = useState(false);
+  const [avatarError, setAvatarError] = useState(false);

-  // 处理开关变化
-  const handleSwitchChange = (key: keyof typeof settings, value: boolean) => {
-    updateSetting(key, value);
-
-    Toast.show({
-      content: `设置已${value ? "开启" : "关闭"}`,
-      position: "top",
-    });
+  // 处理头像加载错误
+  const handleAvatarError = () => {
+    setAvatarError(true);
  };

  // 退出登录
@@ -78,6 +79,7 @@ const Setting: React.FC = () => {
          icon: <UserOutlined />,
          type: "navigate",
          path: "/userSet",
+          color: "var(--primary-color)",
        },
        {
          id: "security",
@@ -86,12 +88,22 @@ const Setting: React.FC = () => {
          icon: <SafetyOutlined />,
          type: "navigate",
          path: "/security",
+          color: "var(--primary-color)",
        },
      ],
    },
    {
-      title: "其他",
+      title: "应用设置",
      items: [
+        {
+          id: "privacy",
+          title: "隐私保护",
+          description: "数据隐私、权限管理",
+          icon: <LockOutlined />,
+          type: "navigate",
+          path: "/privacy",
+          color: "var(--primary-color)",
+        },
        {
          id: "clearCache",
          title: "清除缓存",
@@ -99,15 +111,14 @@ const Setting: React.FC = () => {
          icon: <SettingOutlined />,
          type: "button",
          onClick: handleClearCache,
+          color: "var(--primary-color)",
+          badge: "2.3MB",
        },
-        {
-          id: "privacy",
-          title: "用户隐私协议",
-          description: "查看用户隐私协议和数据处理说明",
-          icon: <InfoCircleOutlined />,
-          type: "navigate",
-          path: "/privacy",
-        },
+      ],
+    },
+    {
+      title: "其他",
+      items: [
        {
          id: "about",
          title: "关于我们",
@@ -115,6 +126,7 @@ const Setting: React.FC = () => {
          icon: <InfoCircleOutlined />,
          type: "navigate",
          path: "/about",
+          color: "var(--primary-color)",
        },
        {
          id: "logout",
@@ -123,6 +135,7 @@ const Setting: React.FC = () => {
          icon: <LogoutOutlined />,
          type: "button",
          onClick: () => setShowLogoutDialog(true),
+          color: "#ff4d4f",
        },
      ],
    },
@@ -143,37 +156,55 @@ const Setting: React.FC = () => {
    return (
      <List.Item
        key={item.id}
-        prefix={item.icon}
-        title={item.title}
+        prefix={
+          <div
+            className={style["setting-icon"]}
+            style={{
+              color: item.color || "var(--primary-color)",
+              background: `${item.color || "var(--primary-color)"}15`,
+            }}
+          >
+            {item.icon}
+          </div>
+        }
+        title={
+          <div className={style["setting-title"]}>
+            {item.title}
+            {item.badge && (
+              <span className={style["setting-badge"]}>{item.badge}</span>
+            )}
+          </div>
+        }
        description={item.description}
        extra={
          item.type === "switch" ? (
-            <Switch checked={item.value} onChange={() => item.onClick?.()} />
+            <Switch
+              checked={item.value}
+              onChange={() => item.onClick?.()}
+              style={
+                {
+                  "--checked-color": item.color || "var(--primary-color)",
+                } as React.CSSProperties
+              }
+            />
          ) : null
        }
        onClick={handleClick}
        arrow={item.type === "navigate"}
+        className={style["setting-item"]}
      />
    );
  };

  return (
-    <Layout
-      header={
-        <NavBar onBack={() => navigate(-1)} style={{ background: "#fff" }}>
-          <span style={{ color: "var(--primary-color)", fontWeight: 600 }}>
-            设置
-          </span>
-        </NavBar>
-      }
-    >
+    <Layout header={<NavCommon title="设置" />}>
      <div className={style["setting-page"]}>
        {/* 用户信息卡片 */}
        <Card className={style["user-card"]}>
          <div className={style["user-info"]}>
            <div className={style["avatar"]}>
-              {user?.avatar ? (
-                <img src={user.avatar} alt="头像" />
+              {user?.avatar && !avatarError ? (
+                <img src={user.avatar} alt="头像" onError={handleAvatarError} />
              ) : (
                <div className={style["avatar-placeholder"]}>
                  {user?.username?.charAt(0) || "用"}
@@ -191,21 +222,54 @@ const Setting: React.FC = () => {
                {user?.isAdmin === 1 ? "管理员" : "普通用户"}
              </div>
            </div>
+            <div className={style["user-actions"]}>
+              <Button
+                size="small"
+                fill="outline"
+                onClick={() => navigate("/userSet")}
+                style={{
+                  color: "#fff",
+                  borderColor: "#fff",
+                  fontSize: "12px",
+                  padding: "4px 8px",
+                  height: "auto",
+                }}
+              >
+                编辑
+              </Button>
+            </div>
          </div>
        </Card>

        {/* 设置列表 */}
        {settingGroups.map((group, groupIndex) => (
          <Card key={groupIndex} className={style["setting-group"]}>
-            <div className={style["group-title"]}>{group.title}</div>
-            <List>{group.items.map(renderSettingItem)}</List>
+            <div className={style["group-title"]}>
+              <span className={style["group-icon"]}>⚙️</span>
+              {group.title}
+            </div>
+            <List className={style["setting-list"]}>
+              {group.items.map(renderSettingItem)}
+            </List>
          </Card>
        ))}

        {/* 版本信息 */}
        <div className={style["version-info"]}>
-          <span>版本 1.0.0</span>
-          <span>© 2024 存客宝管理系统</span>
+          <div className={style["version-card"]}>
+            <div className={style["app-logo"]}>
+              <img src="/public/logo.png" alt="" />
+            </div>
+            <div className={style["version-details"]}>
+              <div className={style["app-name"]}>存客宝</div>
+              <div className={style["version-text"]}>版本 3.0.0</div>
+              <div className={style["build-info"]}>Build 2025-7-30</div>
+            </div>
+          </div>
+          <div className={style["copyright"]}>
+            <span>© 2024 存客宝管理系统</span>
+            <span>让客户管理更简单</span>
+          </div>
        </div>
      </div>

--- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/api.ts
+++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/api.ts
@@ -1,13 +1,7 @@
 import request from "@/api/request";
-import type {
-  TrafficPoolUserDetail,
-  UserJourneyResponse,
-  UserTagsResponse,
-} from "./data";
+import type { UserTagsResponse } from "./data";

-export function getTrafficPoolDetail(
-  wechatId: string,
-): Promise<TrafficPoolUserDetail> {
+export function getTrafficPoolDetail(wechatId: string) {
  return request("/v1/wechats/getWechatInfo", { wechatId }, "GET");
 }

@@ -16,7 +10,7 @@ export function getUserJourney(params: {
  page: number;
  pageSize: number;
  userId: string;
-}): Promise<UserJourneyResponse> {
+}) {
  return request("/v1/traffic/pool/getUserJourney", params, "GET");
 }

--- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/data.ts
+++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/data.ts
@@ -30,3 +30,79 @@ export interface TrafficPoolUserDetail {
    value?: number;
  }>;
 }
+
+// 扩展的用户详情类型
+export interface ExtendedUserDetail extends TrafficPoolUserDetail {
+  userInfo: {
+    nickname: string;
+    avatar: string;
+    wechatId: string;
+    friendShip: {
+      totalFriend: number;
+      maleFriend: number;
+      femaleFriend: number;
+      unknowFriend: number;
+    };
+  };
+  rfmScore: {
+    recency: number;
+    frequency: number;
+    monetary: number;
+    totalScore: number;
+  };
+  trafficPools: {
+    currentPool: string;
+    availablePools: string[];
+  };
+  userTags: Array<{
+    id: string;
+    name: string;
+    color: string;
+    type: string;
+  }>;
+  valueTags: Array<{
+    id: string;
+    name: string;
+    color: string;
+    icon: string;
+    rfmScore: number;
+    valueLevel: string;
+  }>;
+  restrictions?: Array<{
+    id: string;
+    reason: string;
+    level: number;
+    date: number | null;
+  }>;
+}
+
+// 互动记录类型
+export interface InteractionRecord {
+  id: string;
+  type: string;
+  content: string;
+  timestamp: string;
+  value?: number;
+}
+
+// 用户旅程记录类型
+export interface UserJourneyRecord {
+  id: string;
+  type: number;
+  remark: string;
+  createTime: string;
+}
+
+// 用户标签响应类型
+export interface UserTagsResponse {
+  wechat: string[];
+  siteLabels: UserTagItem[];
+}
+
+// 用户标签项类型
+export interface UserTagItem {
+  id: string;
+  name: string;
+  color?: string;
+  type?: string;
+}
--- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.module.scss
+++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.module.scss
@@ -47,6 +47,18 @@
    flex-shrink: 0;
  }

+  .avatarFallback {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: white;
+    font-size: 24px;
+    border-radius: 50%;
+  }
+
  .userDetails {
    flex: 1;
    min-width: 0;
@@ -343,7 +355,7 @@
  flex-direction: column;
  align-items: center;
  justify-content: center;
-  padding: 60px 16px;
+  padding: 20px 16px;
  text-align: center;
 }

@@ -353,14 +365,14 @@
 }

 .emptyText {
-  font-size: 16px;
+  font-size: 14px;
  color: #666;
-  margin-bottom: 8px;
+  margin-bottom: 4px;
  font-weight: 500;
 }

 .emptyDesc {
-  font-size: 14px;
+  font-size: 12px;
  color: #999;
  line-height: 1.4;
 }
--- a/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.tsx
+++ b/nkebao/src/pages/mobile/mine/traffic-pool/detail/index.tsx
@@ -1,20 +1,9 @@
 import React, { useEffect, useState } from "react";
 import { useParams, useNavigate } from "react-router-dom";
-import {
-  Card,
-  Button,
-  Avatar,
-  Tag,
-  Tabs,
-  List,
-  Badge,
-  SpinLoading,
-} from "antd-mobile";
+import { Card, Button, Avatar, Tag, List, SpinLoading } from "antd-mobile";
 import {
  UserOutlined,
  CrownOutlined,
-  PlusOutlined,
-  CloseOutlined,
  EyeOutlined,
  DollarOutlined,
  MobileOutlined,
@@ -26,9 +15,7 @@ import Layout from "@/components/Layout/Layout";
 import NavCommon from "@/components/NavCommon";
 import { getTrafficPoolDetail, getUserJourney, getUserTags } from "./api";
 import type {
-  TrafficPoolUserDetail,
  ExtendedUserDetail,
-  InteractionRecord,
  UserJourneyRecord,
  UserTagsResponse,
  UserTagItem,
@@ -52,6 +39,7 @@ const TrafficPoolDetail: React.FC = () => {
  // 用户标签相关状态
  const [tagsLoading, setTagsLoading] = useState(false);
  const [userTagsList, setUserTagsList] = useState<UserTagItem[]>([]);
+  const [wechatTagsList, setWechatTagsList] = useState<string[]>([]);

  useEffect(() => {
    if (!wxid) return;
@@ -61,6 +49,8 @@ const TrafficPoolDetail: React.FC = () => {
        // 将API数据转换为扩展的用户详情数据
        const extendedUser: ExtendedUserDetail = {
          ...res,
+          // 添加userInfo属性
+          userInfo: res.userInfo,
          // 模拟RFM评分数据
          rfmScore: {
            recency: 5,
@@ -92,6 +82,8 @@ const TrafficPoolDetail: React.FC = () => {
            },
          ],
        };
+        console.log(extendedUser);
+
        setUser(extendedUser);
      })
      .finally(() => setLoading(false));
@@ -131,6 +123,7 @@ const TrafficPoolDetail: React.FC = () => {
    try {
      const response: UserTagsResponse = await getUserTags(userId);
      setUserTagsList(response.siteLabels || []);
+      setWechatTagsList(response.wechat || []);
    } catch (error) {
      console.error("获取用户标签失败:", error);
    } finally {
@@ -149,10 +142,6 @@ const TrafficPoolDetail: React.FC = () => {
    }
  };

-  const handleClose = () => {
-    navigate(-1);
-  };
-
  const getJourneyTypeIcon = (type: number) => {
    switch (type) {
      case 0: // 浏览
@@ -207,32 +196,6 @@ const TrafficPoolDetail: React.FC = () => {
    }
  };

-  const formatCurrency = (amount: number) => {
-    return `¥${amount.toLocaleString()}`;
-  };
-
-  const getGenderText = (gender: number) => {
-    switch (gender) {
-      case 1:
-        return "男";
-      case 2:
-        return "女";
-      default:
-        return "未知";
-    }
-  };
-
-  const getGenderColor = (gender: number) => {
-    switch (gender) {
-      case 1:
-        return "#1677ff";
-      case 2:
-        return "#eb2f96";
-      default:
-        return "#999";
-    }
-  };
-
  const getRestrictionLevelText = (level: number) => {
    switch (level) {
      case 1:
@@ -297,7 +260,11 @@ const TrafficPoolDetail: React.FC = () => {
              <Avatar
                src={user.userInfo.avatar}
                className={styles.avatar}
-                fallback={<UserOutlined />}
+                fallback={
+                  <div className={styles.avatarFallback}>
+                    <UserOutlined />
+                  </div>
+                }
              />
              <div className={styles.userDetails}>
                <div className={styles.nickname}>{user.userInfo.nickname}</div>
@@ -617,20 +584,22 @@ const TrafficPoolDetail: React.FC = () => {

          {activeTab === "tags" && (
            <div className={styles.tabContent}>
-              {/* 用户标签 */}
-              <Card title="用户标签" className={styles.infoCard}>
+              {/* 站内标签 */}
+              <Card title="站内标签" className={styles.infoCard}>
                {tagsLoading && userTagsList.length === 0 ? (
                  <div className={styles.loadingContainer}>
-                    <SpinLoading color="primary" style={{ fontSize: 24 }} />
+                    <SpinLoading color="primary" style={{ fontSize: 20 }} />
                    <div className={styles.loadingText}>加载中...</div>
                  </div>
                ) : userTagsList.length === 0 ? (
                  <div className={styles.emptyState}>
                    <div className={styles.emptyIcon}>
-                      <TagOutlined style={{ fontSize: 48, color: "#ccc" }} />
+                      <TagOutlined style={{ fontSize: 36, color: "#ccc" }} />
+                    </div>
+                    <div className={styles.emptyText}>暂无站内标签</div>
+                    <div className={styles.emptyDesc}>
+                      该用户还没有任何站内标签
                    </div>
-                    <div className={styles.emptyText}>暂无用户标签</div>
-                    <div className={styles.emptyDesc}>该用户还没有任何标签</div>
                  </div>
                ) : (
                  <div className={styles.tagsSection}>
@@ -648,6 +617,39 @@ const TrafficPoolDetail: React.FC = () => {
                )}
              </Card>

+              {/* 微信标签 */}
+              <Card title="微信标签" className={styles.infoCard}>
+                {tagsLoading && wechatTagsList.length === 0 ? (
+                  <div className={styles.loadingContainer}>
+                    <SpinLoading color="primary" style={{ fontSize: 24 }} />
+                    <div className={styles.loadingText}>加载中...</div>
+                  </div>
+                ) : wechatTagsList.length === 0 ? (
+                  <div className={styles.emptyState}>
+                    <div className={styles.emptyIcon}>
+                      <TagOutlined style={{ fontSize: 48, color: "#ccc" }} />
+                    </div>
+                    <div className={styles.emptyText}>暂无微信标签</div>
+                    <div className={styles.emptyDesc}>
+                      该用户还没有任何微信标签
+                    </div>
+                  </div>
+                ) : (
+                  <div className={styles.tagsSection}>
+                    {wechatTagsList.map((tag, index) => (
+                      <Tag
+                        key={index}
+                        color="danger"
+                        fill="outline"
+                        className={styles.tagItem}
+                      >
+                        {tag}
+                      </Tag>
+                    ))}
+                  </div>
+                )}
+              </Card>
+
              {/* 价值标签 */}
              <Card title="价值标签" className={styles.infoCard}>
                {user.valueTags && user.valueTags.length > 0 ? (
--- a/nkebao/src/pages/mobile/mine/traffic-pool/list/api.ts
+++ b/nkebao/src/pages/mobile/mine/traffic-pool/list/api.ts
@@ -1,6 +1,4 @@
 import request from "@/api/request";
-import type { TrafficPoolListResponse, DeviceOption } from "./data";
-import { fetchDeviceList } from "@/pages/guide/api";

 // 获取流量池列表
 export function fetchTrafficPoolList(params: {
@@ -11,16 +9,6 @@ export function fetchTrafficPoolList(params: {
  return request("/v1/traffic/pool", params, "GET");
 }

-// 获取设备列表（真实接口）
-export async function fetchDeviceOptions(): Promise<DeviceOption[]> {
-  const res = await fetchDeviceList({ page: 1, limit: 100 });
-  // 假设返回 { list: [{ id, name, ... }], ... }
-  return (res.list || []).map((item: any) => ({
-    id: String(item.id),
-    name: item.name,
-  }));
-}
-
 // 获取分组列表（如无真实接口可用mock）
 export async function fetchPackageOptions(): Promise<any[]> {
  // TODO: 替换为真实接口
--- a/nkebao/src/pages/mobile/mine/traffic-pool/list/dataAnyx.tsx
+++ b/nkebao/src/pages/mobile/mine/traffic-pool/list/dataAnyx.tsx
@@ -1,9 +1,5 @@
 import { useState, useEffect, useMemo } from "react";
-import {
-  fetchTrafficPoolList,
-  fetchDeviceOptions,
-  fetchPackageOptions,
-} from "./api";
+import { fetchTrafficPoolList, fetchPackageOptions } from "./api";
 import type {
  TrafficPoolUser,
  DeviceOption,
@@ -69,7 +65,6 @@ export function useTrafficPoolListLogic() {

  // 获取筛选项
  useEffect(() => {
-    fetchDeviceOptions().then(setDeviceOptions);
    fetchPackageOptions().then(setPackageOptions);
  }, []);

--- a/nkebao/src/pages/mobile/scenarios/list/index.module.scss
+++ b/nkebao/src/pages/mobile/scenarios/list/index.module.scss
@@ -35,7 +35,13 @@
  min-height: 100vh;
  padding: 0 0 60px 0;
 }
-
+.error {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 50px 30px;
+}
 // 错误提示
 .error-notice {
  margin-bottom: 12px;
--- a/nkebao/src/pages/mobile/scenarios/list/index.tsx
+++ b/nkebao/src/pages/mobile/scenarios/list/index.tsx
@@ -1,8 +1,9 @@
 import React, { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
-import { NavBar, Button, Toast } from "antd-mobile";
+import { Button, Toast } from "antd-mobile";
 import { PlusOutlined, RiseOutlined } from "@ant-design/icons";
 import MeauMobile from "@/components/MeauMobile/MeauMoible";
+import NavCommon from "@/components/NavCommon";
 import Layout from "@/components/Layout/Layout";
 import { getScenarios } from "./api";
 import style from "./index.module.scss";
@@ -17,17 +18,6 @@ interface Scenario {
  status: number;
 }

-const scenarioDescriptions: Record<string, string> = {
-  douyin: "通过抖音平台进行精准获客",
-  xiaohongshu: "利用小红书平台进行内容营销获客",
-  gongzhonghao: "通过微信公众号进行获客",
-  haibao: "通过海报分享进行获客",
-  phone: "通过电话营销进行获客",
-  weixinqun: "通过微信群进行获客",
-  payment: "通过付款码进行获客",
-  api: "通过API接口进行获客",
-};
-
 const Scene: React.FC = () => {
  const navigate = useNavigate();
  const [scenarios, setScenarios] = useState<Scenario[]>([]);
@@ -79,13 +69,17 @@ const Scene: React.FC = () => {
    return (
      <Layout
        header={
-          <NavBar back={null} style={{ background: "#fff" }}>
-            <div className="nav-title">场景获客</div>
-            <Button size="small" color="primary" onClick={handleNewPlan}>
-              <PlusOutlined /> 新建计划
-            </Button>
-          </NavBar>
+          <NavCommon
+            left={<></>}
+            title="场景获客"
+            right={
+              <Button size="small" color="primary" onClick={handleNewPlan}>
+                <PlusOutlined /> 新建计划
+              </Button>
+            }
+          />
        }
+        footer={<MeauMobile activeKey="scenarios" />}
      >
        <div className={style["error"]}>
          <div className={style["error-text"]}>{error}</div>
@@ -101,10 +95,9 @@ const Scene: React.FC = () => {
    <Layout
      loading={loading}
      header={
-        <NavBar
-          back={null}
-          style={{ background: "#fff" }}
+        <NavCommon
          left={<div className="nav-title">场景获客</div>}
+          title={""}
          right={
            <Button
              size="small"
@@ -115,7 +108,7 @@ const Scene: React.FC = () => {
              <PlusOutlined /> 新建计划
            </Button>
          }
-        ></NavBar>
+        />
      }
      footer={<MeauMobile activeKey="scenarios" />}
    >
--- a/nkebao/src/pages/mobile/scenarios/plan/list/index.module.scss
+++ b/nkebao/src/pages/mobile/scenarios/plan/list/index.module.scss
@@ -39,6 +39,47 @@
  gap: 12px;
 }

+.pagination-container {
+  display: flex;
+  justify-content: center;
+  padding: 14px 0;
+  background: white;
+  border-radius: 12px;
+  margin-top: 16px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+
+  :global(.ant-pagination) {
+    .ant-pagination-item {
+      border-radius: 6px;
+      border: 1px solid #d9d9d9;
+
+      &:hover {
+        border-color: var(--primary-color);
+      }
+
+      &.ant-pagination-item-active {
+        background: var(--primary-color);
+        border-color: var(--primary-color);
+
+        a {
+          color: white;
+        }
+      }
+    }
+
+    .ant-pagination-prev,
+    .ant-pagination-next {
+      border-radius: 6px;
+      border: 1px solid #d9d9d9;
+
+      &:hover {
+        border-color: var(--primary-color);
+        color: var(--primary-color);
+      }
+    }
+  }
+}
+
 .plan-item {
  background: white;
  border-radius: 12px;
--- a/nkebao/src/pages/mobile/scenarios/plan/list/index.tsx
+++ b/nkebao/src/pages/mobile/scenarios/plan/list/index.tsx
@@ -1,7 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useParams, useNavigate } from "react-router-dom";
 import {
-  NavBar,
  Button,
  Toast,
  SpinLoading,
@@ -10,7 +9,7 @@ import {
  Card,
  Tag,
 } from "antd-mobile";
-import { Input } from "antd";
+import { Input, Pagination } from "antd";
 import {
  PlusOutlined,
  CopyOutlined,
@@ -22,7 +21,6 @@ import {
  EditOutlined,
  MoreOutlined,
  ClockCircleOutlined,
-  DownOutlined,
 } from "@ant-design/icons";
 import NavCommon from "@/components/NavCommon";
 import Layout from "@/components/Layout/Layout";
@@ -157,6 +155,12 @@ const ScenarioList: React.FC = () => {
    await fetchPlanList(currentPage + 1, true);
  };

+  // 分页改变处理
+  const handlePageChange = async (page: number) => {
+    setCurrentPage(page);
+    await fetchPlanList(page, false);
+  };
+
  const handleCopyPlan = async (taskId: string) => {
    const taskToCopy = tasks.find(task => task.id === taskId);
    if (!taskToCopy) return;
@@ -252,6 +256,21 @@ const ScenarioList: React.FC = () => {
    }
  };

+  // 卡片点击处理 - 执行二维码动作
+  const handleCardClick = (taskId: string, event: React.MouseEvent) => {
+    // 检查点击是否在更多按钮区域内
+    const target = event.target as HTMLElement;
+    const moreButton = target.closest(`.${style["more-btn"]}`);
+
+    // 如果点击的是更多按钮或其子元素，不执行卡片点击动作
+    if (moreButton) {
+      return;
+    }
+
+    // 执行二维码动作
+    handleShowQrCode(taskId);
+  };
+
  const getStatusColor = (status: number) => {
    switch (status) {
      case 1:
@@ -389,6 +408,18 @@ const ScenarioList: React.FC = () => {
        </>
      }
      loading={loading}
+      footer={
+        <div className={style["pagination-container"]}>
+          <Pagination
+            total={total}
+            pageSize={pageSize}
+            current={currentPage}
+            onChange={handlePageChange}
+            showSizeChanger={false}
+            showQuickJumper={false}
+          />
+        </div>
+      }
    >
      <div className={style["scenario-list-page"]}>
        {/* 计划列表 */}
@@ -409,7 +440,11 @@ const ScenarioList: React.FC = () => {
          ) : (
            <>
              {filteredTasks.map(task => (
-                <Card key={task.id} className={style["plan-item"]}>
+                <Card
+                  key={task.id}
+                  className={style["plan-item"]}
+                  onClick={e => handleCardClick(task.id, e)}
+                >
                  {/* 头部：标题、状态和操作菜单 */}
                  <div className={style["plan-header"]}>
                    <div className={style["plan-name"]}>{task.name}</div>
@@ -421,7 +456,10 @@ const ScenarioList: React.FC = () => {
                        size="mini"
                        fill="none"
                        className={style["more-btn"]}
-                        onClick={() => setShowActionMenu(task.id)}
+                        onClick={e => {
+                          e.stopPropagation(); // 阻止事件冒泡
+                          setShowActionMenu(task.id);
+                        }}
                      >
                        <MoreOutlined />
                      </Button>
@@ -465,39 +503,6 @@ const ScenarioList: React.FC = () => {
                  </div>
                </Card>
              ))}
-
-              {/* 加载更多按钮 */}
-              {hasMore && (
-                <div className={style["load-more-container"]}>
-                  <Button
-                    color="primary"
-                    fill="outline"
-                    size="large"
-                    onClick={handleLoadMore}
-                    loading={loadingMore}
-                    className={style["load-more-btn"]}
-                  >
-                    {loadingMore ? (
-                      <>
-                        <SpinLoading color="primary" />
-                        加载中...
-                      </>
-                    ) : (
-                      <>
-                        <DownOutlined />
-                        加载更多
-                      </>
-                    )}
-                  </Button>
-                </div>
-              )}
-
-              {/* 没有更多数据提示 */}
-              {!hasMore && filteredTasks.length > 0 && (
-                <div className={style["no-more-data"]}>
-                  <span>没有更多数据了</span>
-                </div>
-              )}
            </>
          )}
        </div>
--- a/nkebao/src/pages/mobile/test/index.tsx
+++ b/nkebao/src/pages/mobile/test/index.tsx
@@ -0,0 +1,59 @@
+import React from "react";
+import { Card, Button, Space, Typography, Tag } from "antd";
+import { MessageOutlined, SelectOutlined } from "@ant-design/icons";
+import { useNavigate } from "react-router-dom";
+import { isDevelopment } from "@/utils/env";
+import Layout from "@/components/Layout/Layout";
+import NavCommon from "@/components/NavCommon";
+
+const { Title, Text } = Typography;
+
+const TestIndex: React.FC = () => {
+  const navigate = useNavigate();
+
+  return (
+    <Layout header={<NavCommon title="测试页面" />}>
+      <div style={{ padding: "20px", maxWidth: "800px", margin: "0 auto" }}>
+        <Title level={2}>
+          测试页面
+          {isDevelopment && (
+            <Tag color="orange" style={{ marginLeft: 8, fontSize: "12px" }}>
+              开发环境
+            </Tag>
+          )}
+        </Title>
+
+        <Space direction="vertical" style={{ width: "100%" }} size="large">
+          <Card title="组件测试" size="small">
+            <Space direction="vertical" style={{ width: "100%" }}>
+              <Button
+                type="primary"
+                icon={<MessageOutlined />}
+                size="large"
+                block
+                onClick={() => navigate("/test/postMessage")}
+              >
+                UniApp桥接测试
+              </Button>
+
+              <Button
+                icon={<SelectOutlined />}
+                size="large"
+                block
+                onClick={() => navigate("/test/select")}
+              >
+                选择组件测试
+              </Button>
+            </Space>
+          </Card>
+
+          <Card title="说明" size="small">
+            <Text>这里提供各种功能的测试页面，方便开发和调试。</Text>
+          </Card>
+        </Space>
+      </div>
+    </Layout>
+  );
+};
+
+export default TestIndex;
--- a/nkebao/src/pages/mobile/component-test/index.tsx
+++ b/nkebao/src/pages/mobile/component-test/index.tsx
@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { NavBar, Tabs } from "antd-mobile";
+import { NavBar, Tabs, Tag } from "antd-mobile";
 import { ArrowLeftOutlined } from "@ant-design/icons";
 import { useNavigate } from "react-router-dom";
 import Layout from "@/components/Layout/Layout";
@@ -9,6 +9,7 @@ import FriendSelection from "@/components/FriendSelection";
 import GroupSelection from "@/components/GroupSelection";
 import ContentLibrarySelection from "@/components/ContentLibrarySelection";
 import AccountSelection from "@/components/AccountSelection";
+import { isDevelopment } from "@/utils/env";

 const ComponentTest: React.FC = () => {
  const navigate = useNavigate();
@@ -26,11 +27,19 @@ const ComponentTest: React.FC = () => {
  // 内容库选择状态
  const [selectedLibraries, setSelectedLibraries] = useState<string[]>([]);

-  const [selectedAccounts, setSelectedAccounts] = useState<string[]>([]);
+  const [selectedAccounts, setSelectedAccounts] = useState<number[]>([]);

  return (
    <Layout header={<NavCommon title="组件调试" />}>
      <div style={{ padding: 16 }}>
+        {isDevelopment && (
+          <div style={{ marginBottom: 16, textAlign: "center" }}>
+            <Tag color="orange" style={{ fontSize: "12px" }}>
+              开发环境 - 组件测试
+            </Tag>
+          </div>
+        )}
+
        <Tabs activeKey={activeTab} onChange={setActiveTab}>
          <Tabs.Tab title="设备选择" key="devices">
            <div style={{ padding: "16px 0" }}>
--- a/nkebao/src/pages/mobile/workspace/main/index.module.scss
+++ b/nkebao/src/pages/mobile/workspace/main/index.module.scss
@@ -1,7 +1,5 @@
 .workspace {
-  padding: 16px;
-  background-color: #f5f5f5;
-  min-height: 100vh;
+  padding: 12px;
 }

 .section {
--- a/nkebao/src/pages/mobile/workspace/main/index.tsx
+++ b/nkebao/src/pages/mobile/workspace/main/index.tsx
@@ -3,19 +3,15 @@ import { Link } from "react-router-dom";
 import { Card, NavBar, Badge } from "antd-mobile";
 import {
  LikeOutlined,
-  MessageOutlined,
  SendOutlined,
  TeamOutlined,
  LinkOutlined,
-  AppstoreOutlined,
-  PieChartOutlined,
-  BarChartOutlined,
  ClockCircleOutlined,
 } from "@ant-design/icons";
 import Layout from "@/components/Layout/Layout";
 import MeauMobile from "@/components/MeauMobile/MeauMoible";
 import styles from "./index.module.scss";
-
+import NavCommon from "@/components/NavCommon";
 const Workspace: React.FC = () => {
  // 常用功能
  const commonFeatures = [
@@ -75,60 +71,9 @@ const Workspace: React.FC = () => {
    },
  ];

-  // AI智能助手
-  const aiFeatures = [
-    {
-      id: "ai-analyzer",
-      name: "AI数据分析",
-      description: "智能分析客户行为特征",
-      icon: (
-        <BarChartOutlined
-          className={styles.icon}
-          style={{ color: "#531dab" }}
-        />
-      ),
-      path: "/workspace/ai-analyzer",
-      bgColor: "#f0f0ff",
-      isNew: true,
-    },
-    {
-      id: "ai-strategy",
-      name: "AI策略优化",
-      description: "智能优化获客策略",
-      icon: (
-        <AppstoreOutlined
-          className={styles.icon}
-          style={{ color: "#13c2c2" }}
-        />
-      ),
-      path: "/workspace/ai-strategy",
-      bgColor: "#e6fffb",
-      isNew: true,
-    },
-    {
-      id: "ai-forecast",
-      name: "AI销售预测",
-      description: "智能预测销售趋势",
-      icon: (
-        <PieChartOutlined
-          className={styles.icon}
-          style={{ color: "#d48806" }}
-        />
-      ),
-      path: "/workspace/ai-forecast",
-      bgColor: "#fffbe6",
-    },
-  ];
-
  return (
    <Layout
-      header={
-        <NavBar back={null} style={{ background: "#fff" }}>
-          <div style={{ color: "var(--primary-color)", fontWeight: 600 }}>
-            工作台
-          </div>
-        </NavBar>
-      }
+      header={<NavCommon left={<></>} title="工作台" />}
      footer={<MeauMobile activeKey="workspace" />}
    >
      <div className={styles.workspace}>
--- a/nkebao/src/router/module/component-test.tsx
+++ b/nkebao/src/router/module/component-test.tsx
@@ -1,11 +0,0 @@
-import ComponentTest from "@/pages/mobile/component-test";
-
-const componentTestRoutes = [
-  {
-    path: "/component-test",
-    element: <ComponentTest />,
-    auth: true,
-  },
-];
-
-export default componentTestRoutes;
--- a/nkebao/src/router/module/iframe.tsx
+++ b/nkebao/src/router/module/iframe.tsx
@@ -0,0 +1,12 @@
+import IframeDebugPage from "@/pages/iframe";
+
+// iframe 调试路由
+const iframeRoutes = [
+  {
+    path: "/iframe",
+    element: <IframeDebugPage />,
+    auth: false, // 不需要认证，方便调试
+  },
+];
+
+export default iframeRoutes;
--- a/nkebao/src/router/module/index.tsx
+++ b/nkebao/src/router/module/index.tsx
@@ -1,4 +1,5 @@
 import Home from "@/pages/mobile/home/index";
+import Init from "@/pages/iframe/init";

 const routes = [
  // 基础路由
@@ -7,6 +8,11 @@ const routes = [
    element: <Home />,
    auth: true, // 需要登录
  },
+  {
+    path: "/init",
+    element: <Init />,
+    auth: false, // 需要登录
+  },
 ];

 export default routes;
--- a/nkebao/src/router/module/test.tsx
+++ b/nkebao/src/router/module/test.tsx
@@ -0,0 +1,22 @@
+import SelectTest from "@/pages/mobile/test/select";
+import PostMessageTest from "@/pages/mobile/test/postMessage";
+import TestIndex from "@/pages/mobile/test/index";
+import { DEV_FEATURES } from "@/utils/env";
+
+// 只在开发环境启用测试路由
+const componentTestRoutes = DEV_FEATURES.SHOW_TEST_PAGES
+  ? [
+      {
+        path: "/test",
+        element: <TestIndex />,
+        auth: true,
+      },
+      {
+        path: "/test/select",
+        element: <SelectTest />,
+        auth: true,
+      },
+    ]
+  : [];
+
+export default componentTestRoutes;
--- a/nkebao/src/store/module/app.ts
+++ b/nkebao/src/store/module/app.ts
@@ -0,0 +1,130 @@
+import { createPersistStore } from "@/store/createPersistStore";
+
+export interface AppState {
+  // 应用状态
+  isLoading: boolean;
+  isOnline: boolean;
+  lastActiveTime: number;
+
+  // 主题设置
+  theme: "light" | "dark" | "auto";
+
+  // 缓存设置
+  cacheEnabled: boolean;
+  cacheExpiry: number; // 缓存过期时间（毫秒）
+
+  // 调试设置
+  debugMode: boolean;
+  logLevel: "error" | "warn" | "info" | "debug";
+}
+
+interface AppStoreState {
+  app: AppState;
+  setAppState: (app: Partial<AppState>) => void;
+  setLoading: (loading: boolean) => void;
+  setOnline: (online: boolean) => void;
+  setTheme: (theme: AppState["theme"]) => void;
+  setDebugMode: (debug: boolean) => void;
+  updateLastActiveTime: () => void;
+  resetAppState: () => void;
+}
+
+// 默认应用状态
+const defaultAppState: AppState = {
+  isLoading: false,
+  isOnline: navigator.onLine,
+  lastActiveTime: Date.now(),
+  theme: "auto",
+  cacheEnabled: true,
+  cacheExpiry: 24 * 60 * 60 * 1000, // 24小时
+  debugMode: false,
+  logLevel: "info",
+};
+
+export const useAppStore = createPersistStore<AppStoreState>(
+  (set, get) => ({
+    app: defaultAppState,
+
+    setAppState: newAppState =>
+      set(state => ({
+        app: { ...state.app, ...newAppState },
+      })),
+
+    setLoading: loading =>
+      set(state => ({
+        app: { ...state.app, isLoading: loading },
+      })),
+
+    setOnline: online =>
+      set(state => ({
+        app: { ...state.app, isOnline: online },
+      })),
+
+    setTheme: theme =>
+      set(state => ({
+        app: { ...state.app, theme },
+      })),
+
+    setDebugMode: debug =>
+      set(state => ({
+        app: { ...state.app, debugMode: debug },
+      })),
+
+    updateLastActiveTime: () =>
+      set(state => ({
+        app: { ...state.app, lastActiveTime: Date.now() },
+      })),
+
+    resetAppState: () => set({ app: defaultAppState }),
+  }),
+  "app-store",
+  state => ({
+    app: state.app,
+  }),
+);
+
+// 应用状态工具函数
+export const getAppState = (): AppState => {
+  const { app } = useAppStore.getState();
+  return app;
+};
+
+export const setAppLoading = (loading: boolean): void => {
+  const { setLoading } = useAppStore.getState();
+  setLoading(loading);
+};
+
+export const setAppTheme = (theme: AppState["theme"]): void => {
+  const { setTheme } = useAppStore.getState();
+  setTheme(theme);
+};
+
+export const toggleDebugMode = (): void => {
+  const { app, setDebugMode } = useAppStore.getState();
+  setDebugMode(!app.debugMode);
+};
+
+// 监听网络状态变化
+if (typeof window !== "undefined") {
+  window.addEventListener("online", () => {
+    const { setOnline } = useAppStore.getState();
+    setOnline(true);
+  });
+
+  window.addEventListener("offline", () => {
+    const { setOnline } = useAppStore.getState();
+    setOnline(false);
+  });
+
+  // 监听用户活动
+  const updateLastActive = () => {
+    const { updateLastActiveTime } = useAppStore.getState();
+    updateLastActiveTime();
+  };
+
+  ["mousedown", "mousemove", "keypress", "scroll", "touchstart"].forEach(
+    event => {
+      document.addEventListener(event, updateLastActive, true);
+    },
+  );
+}
--- a/nkebao/src/styles/global.scss
+++ b/nkebao/src/styles/global.scss
@@ -160,6 +160,17 @@ textarea {
 }

 /* 6. 移动端/PC端兼容基础样式 */
+
+// 安全区域CSS变量定义
+:root {
+  --safe-area-top: 0px;
+  --safe-area-bottom: 0px;
+  --safe-area-left: 0px;
+  --safe-area-right: 0px;
+  --status-bar-height: 0px;
+  --nav-bar-height: 44px;
+}
+
 html,
 body {
  height: 100%;
--- a/nkebao/src/utils/common.ts
+++ b/nkebao/src/utils/common.ts
@@ -35,3 +35,36 @@ export const comfirm = (
    });
  });
 };
+
+export function getSafeAreaHeight() {
+  // 1. 优先使用 CSS 环境变量
+  if (CSS.supports("padding-top", "env(safe-area-inset-top)")) {
+    const safeAreaTop = getComputedStyle(
+      document.documentElement,
+    ).getPropertyValue("env(safe-area-inset-top)");
+    const height = parseInt(safeAreaTop) || 0;
+    if (height > 0) return height;
+  }
+
+  // 2. 设备检测
+  const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
+  const isAndroid = /Android/.test(navigator.userAgent);
+
+  if (isIOS) {
+    // iOS 设备
+    const isIPhoneX = window.screen.height >= 812;
+    return isIPhoneX ? 44 : 20;
+  } else if (isAndroid) {
+    // Android 设备
+    return 24;
+  }
+
+  // 3. 默认值
+  return 0;
+}
+// 设置全局 CSS 变量
+export function initSafeArea() {
+  const root = document.documentElement;
+  const height = getSafeAreaHeight();
+  root.style.setProperty("--safe-area-top", `${height}px`);
+}
--- a/nkebao/src/utils/env.ts
+++ b/nkebao/src/utils/env.ts
@@ -0,0 +1,46 @@
+// 环境配置
+export const isDevelopment = import.meta.env.DEV;
+export const isProduction = import.meta.env.PROD;
+export const isTest = import.meta.env.MODE === "test";
+
+// 开发环境特性开关
+export const DEV_FEATURES = {
+  // 是否显示测试页面
+  SHOW_TEST_PAGES: isDevelopment,
+
+  // 是否启用调试日志
+  ENABLE_DEBUG_LOGS: isDevelopment,
+
+  // 是否显示开发工具
+  SHOW_DEV_TOOLS: isDevelopment,
+
+  // 是否启用Mock数据
+  ENABLE_MOCK_DATA: isDevelopment,
+};
+
+// 获取环境变量
+export const getEnvVar = (key: string, defaultValue?: string): string => {
+  return import.meta.env[key] || defaultValue || "";
+};
+
+// 环境信息
+export const ENV_INFO = {
+  MODE: import.meta.env.MODE,
+  DEV: import.meta.env.DEV,
+  PROD: import.meta.env.PROD,
+  VITE_APP_TITLE: getEnvVar("VITE_APP_TITLE", "存客宝"),
+  VITE_API_BASE_URL: getEnvVar("VITE_API_BASE_URL", ""),
+  VITE_APP_VERSION: getEnvVar("VITE_APP_VERSION", "1.0.0"),
+};
+
+// 开发环境检查
+export const checkDevEnvironment = () => {
+  if (isDevelopment) {
+    // console.log("🚀 开发环境已启用");
+    // console.log("📋 环境信息:", ENV_INFO);
+    // console.log("⚙️ 开发特性:", DEV_FEATURES);
+  }
+};
+
+// 初始化环境检查
+checkDevEnvironment();
--- a/nkebao/vite-pwa.config.ts
+++ b/nkebao/vite-pwa.config.ts
@@ -0,0 +1,58 @@
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+import { VitePWA } from "vite-plugin-pwa";
+
+export default defineConfig({
+  plugins: [
+    react(),
+    VitePWA({
+      registerType: "autoUpdate",
+      workbox: {
+        globPatterns: ["**/*.{js,css,html,ico,png,svg}"],
+        runtimeCaching: [
+          {
+            urlPattern: /^https:\/\/api\./,
+            handler: "NetworkFirst",
+            options: {
+              cacheName: "api-cache",
+              expiration: {
+                maxEntries: 100,
+                maxAgeSeconds: 60 * 60 * 24 * 7, // 7 days
+              },
+            },
+          },
+        ],
+      },
+      manifest: {
+        name: "Cunkebao",
+        short_name: "Cunkebao",
+        description: "Cunkebao Mobile App",
+        theme_color: "#ffffff",
+        background_color: "#ffffff",
+        display: "standalone",
+        orientation: "portrait",
+        scope: "/",
+        start_url: "/",
+        icons: [
+          {
+            src: "favicon.ico",
+            sizes: "64x64 32x32 24x24 16x16",
+            type: "image/x-icon",
+          },
+          {
+            src: "logo.png",
+            sizes: "192x192",
+            type: "image/png",
+            purpose: "any maskable",
+          },
+          {
+            src: "logo.png",
+            sizes: "512x512",
+            type: "image/png",
+            purpose: "any maskable",
+          },
+        ],
+      },
+    }),
+  ],
+});
--- a/nkebao/vite.config.ts
+++ b/nkebao/vite.config.ts
@@ -11,6 +11,7 @@ export default defineConfig({
  },
  server: {
    open: true,
+    port: 3000,
  },
  build: {
    chunkSizeWarningLimit: 2000,