diff --git a/nkebao/src/pages/mobile/mine/main/index.tsx b/nkebao/src/pages/mobile/mine/main/index.tsx
index 605dc1ec..4f98d71e 100644
--- 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, Toast } 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";
+
 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);
   };
@@ -227,42 +212,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>
   );
 };
diff --git a/nkebao/src/pages/mobile/mine/setting/SecuritySetting.tsx b/nkebao/src/pages/mobile/mine/setting/SecuritySetting.tsx
index bdd371b9..9ae89537 100644
--- 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
diff --git a/nkebao/src/pages/mobile/mine/setting/index.module.scss b/nkebao/src/pages/mobile/mine/setting/index.module.scss
index d3cc2ff5..ef57738d 100644
--- 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;
diff --git a/nkebao/src/pages/mobile/mine/setting/index.tsx b/nkebao/src/pages/mobile/mine/setting/index.tsx
index 3f728d75..8090bdc2 100644
--- 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>