From 7337506a06549933bba0e8af955fbbdb6f1422c0 Mon Sep 17 00:00:00 2001
From: "Ray.Hao" <1490493387@qq.com>
Date: Sun, 1 Dec 2024 18:48:26 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20:recycle:=20=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |   7 +-
 src/pages.json                                |  21 +-
 src/pages/index/index.vue                     |  11 +-
 src/pages/login/index.vue                     |  15 +-
 src/pages/mine/index.vue                      | 290 ++++-----------
 src/pages/mine/profile/index.vue              | 324 +----------------
 src/pages/mine/settings/account/index.vue     | 343 ++++++++++++++++++
 .../agreement}/index.vue                      |   0
 src/pages/mine/settings/index.vue             | 193 ++++++++++
 .../network}/index.vue                        |   4 +-
 .../mine/{ => settings}/privacy/index.vue     |   0
 src/pages/work/index.vue                      |  16 +-
 src/pages/work/role/index.vue                 |  28 +-
 src/pages/work/user/index.vue                 | 162 +++++----
 src/static/icons/dept.png                     | Bin 4710 -> 0 bytes
 src/static/icons/menu.png                     | Bin 3868 -> 0 bytes
 src/static/icons/monitor.png                  | Bin 3876 -> 0 bytes
 src/static/icons/more.png                     | Bin 5248 -> 0 bytes
 18 files changed, 780 insertions(+), 634 deletions(-)
 create mode 100644 src/pages/mine/settings/account/index.vue
 rename src/pages/mine/{user-agreement => settings/agreement}/index.vue (100%)
 create mode 100644 src/pages/mine/settings/index.vue
 rename src/pages/mine/{network-test => settings/network}/index.vue (99%)
 rename src/pages/mine/{ => settings}/privacy/index.vue (100%)
 delete mode 100644 src/static/icons/dept.png
 delete mode 100644 src/static/icons/menu.png
 delete mode 100644 src/static/icons/monitor.png
 delete mode 100644 src/static/icons/more.png

diff --git a/package.json b/package.json
index d7d11b6..8e03edf 100644
--- a/package.json
+++ b/package.json
@@ -89,10 +89,9 @@
     "@dcloudio/uni-mp-weixin": "3.0.0-4020420240722002",
     "@dcloudio/uni-mp-xhs": "3.0.0-4020420240722002",
     "@dcloudio/uni-quickapp-webview": "3.0.0-4020420240722002",
-    "@qiun/uni-ucharts": "2.5.0-20230101",
     "pinia": "^2.2.2",
-    "vue": "^3.4.21",
-    "wot-design-uni": "^1.3.11"
+    "vue": "^3.5.13",
+    "wot-design-uni": "^1.4.0"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.5.0",
@@ -117,7 +116,7 @@
     "postcss-html": "^1.7.0",
     "postcss-scss": "^4.0.9",
     "prettier": "^3.3.3",
-    "sass": "1.79.3",
+    "sass": "1.78.0",
     "sass-loader": "^16.0.2",
     "stylelint": "^16.9.0",
     "stylelint-config-html": "^1.1.0",
diff --git a/src/pages.json b/src/pages.json
index ff9fb4a..50a8202 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -33,21 +33,33 @@
       }
     },
     {
-      "path": "pages/mine/user-agreement/index",
+      "path": "pages/mine/settings/index",
+      "style": {
+        "navigationBarTitleText": "设置"
+      }
+    },
+    {
+      "path": "pages/mine/settings/account/index",
+      "style": {
+        "navigationBarTitleText": "账号和安全"
+      }
+    },
+    {
+      "path": "pages/mine/settings/agreement/index",
       "style": {
         "navigationBarTitleText": "用户协议"
       }
     },
     {
-      "path": "pages/mine/privacy/index",
+      "path": "pages/mine/settings/privacy/index",
       "style": {
         "navigationBarTitleText": "隐私政策"
       }
     },
     {
-      "path": "pages/mine/network-test/index",
+      "path": "pages/mine/settings/network/index",
       "style": {
-        "navigationBarTitleText": "网络测试"
+        "navigationBarTitleText": "网络检测"
       }
     },
     {
@@ -62,6 +74,7 @@
         "navigationBarTitleText": "个人资料"
       }
     },
+
     {
       "path": "pages/work/user/index",
       "style": {
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index 5806204..f3ee4aa 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -27,7 +27,7 @@
 
     <!-- 通知公告 -->
     <wd-notice-bar
-      class="mt-2"
+      custom-style="margin-top:10rpx"
       text="这是一条消息提示信息，这是一条消息提示信息，这是一条消息提示信息"
       prefix="check-outline"
       color="#34D19D"
@@ -35,7 +35,7 @@
     />
 
     <!-- 数据统计 -->
-    <wd-grid :column="2" class="mt-2" :gutter="2">
+    <wd-grid :column="2" custom-style="margin-top:10rpx" :gutter="2">
       <wd-grid-item
         v-for="(item, index) in visitStatsData"
         :key="index"
@@ -47,7 +47,7 @@
             <image class="w-80rpx h-80rpx rounded-8rpx" :src="item.icon" />
             <view class="ml-5 text-left">
               <view class="font-bold">{{ item.title }}</view>
-              <view class="mt-1">{{ item.todayCount }}</view>
+              <view class="mt-2">{{ item.todayCount }}</view>
             </view>
           </view>
         </view>
@@ -136,7 +136,10 @@ const chartData = ref({});
 // 日期范围
 const recentDaysRange = ref(7);
 
-const swiperList = ref(["https://oss.youlai.tech/blog/banner3.png"]);
+const swiperList = ref([
+  "https://oss.youlai.tech/blog/banner9.png",
+  "https://oss.youlai.tech/blog/banner8.png",
+]);
 
 // 快捷导航列表
 const navList = reactive([
diff --git a/src/pages/login/index.vue b/src/pages/login/index.vue
index 95e199e..cb45597 100644
--- a/src/pages/login/index.vue
+++ b/src/pages/login/index.vue
@@ -32,13 +32,9 @@
     <view class="agreement-text">
       <view class="agreement-links">
         <text class="normal-text">登录即同意</text>
-        <text class="link" @click="goToUserAgreement">《用户协议》</text>
+        <text class="link" @click="navigateToUserAgreement">《用户协议》</text>
         <text class="normal-text">和</text>
-        <text class="link" @click="goToPrivacy">《隐私政策》</text>
-      </view>
-      <view class="copyright">
-        <text class="copyright-text">Copyright © {{ getYear() }} 有来开源组织</text>
-        <text class="copyright-text">All Rights Reserved</text>
+        <text class="link" @click="navigateToPrivacy">《隐私政策》</text>
       </view>
     </view>
   </view>
@@ -75,19 +71,16 @@ const handleLogin = () => {
     }
   });
 };
-const goToUserAgreement = () => {
+const navigateToUserAgreement = () => {
   uni.navigateTo({
     url: "/pages/mine/user-agreement/index",
   });
 };
-const goToPrivacy = () => {
+const navigateToPrivacy = () => {
   uni.navigateTo({
     url: "/pages/mine/privacy/index",
   });
 };
-const getYear = () => {
-  return new Date().getFullYear();
-};
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/pages/mine/index.vue b/src/pages/mine/index.vue
index 0138a39..cdbaee4 100644
--- a/src/pages/mine/index.vue
+++ b/src/pages/mine/index.vue
@@ -1,269 +1,121 @@
 <template>
-  <view class="mine">
-    <!-- 个人资料 -->
-    <view class="header">
+  <view class="mine-container">
+    <view class="mine-header">
       <view class="flex items-center">
+        <!-- 头像 -->
         <image
           class="w-100rpx h-100rpx rounded-full"
           :src="isLogin ? userInfo!.avatar : defaultAvatar"
         />
-        <view class="ml-20rpx text-32rpx">
-          <text v-if="isLogin">{{ userInfo!.nickname }}</text>
-          <view v-else @click="goToLoginPage">
-            <text>您还未登录，请先</text>
-            <text class="cursor-pointer">
-              登录
-              <wd-icon name="arrow-right" />
-            </text>
+        <!-- 用户信息 -->
+        <view class="ml-20rpx">
+          <!-- 已登录 -->
+          <view v-if="isLogin">
+            <view class="text-32rpx">
+              {{ userInfo!.nickname }}
+            </view>
+            <view class="text-28rpx mt2">{{ userInfo?.username }}</view>
+          </view>
+          <!-- 未登录 -->
+          <view v-else @click="navigateToLoginPage">
+            <view class="login-tip">您还未登录，请先登录</view>
+            <view class="w180rpx mt-2">
+              <button class="login-btn" @click="navigateToLoginPage">登录</button>
+            </view>
           </view>
         </view>
       </view>
-      <view>
-        <text v-if="isLogin" class="cursor-pointer" @click="goToProfile">
-          个人信息
+      <!-- 编辑资料 -->
+      <view v-if="isLogin" class="cursor-pointer">
+        <wd-icon name="setting" />
+      </view>
+    </view>
+    <!-- 功能操作 -->
+    <wd-grid clickable custom-class="rounded-[10rpx] bg-white">
+      <wd-grid-item text="我的消息" icon="mail" @itemclick="handleItemclick" />
+      <wd-grid-item text="我的待办" icon="list" @itemclick="handleItemclick" />
+      <wd-grid-item text="我的收藏" icon="star" @itemclick="handleItemclick" />
+      <wd-grid-item text="浏览历史" icon="view" @itemclick="handleItemclick" />
+    </wd-grid>
+    <!-- 菜单列表 -->
+    <view class="mt40rpx">
+      <wd-cell-group border>
+        <wd-cell title="关于我们" icon="info-circle" clickable @click="navigateToAbout">
           <wd-icon name="arrow-right" />
-        </text>
-      </view>
-    </view>
-    <view class="relative -top-[50px] p-[40rpx]">
-      <!-- 功能操作 -->
-      <wd-grid clickable class="rounded-[10rpx] bg-white">
-        <wd-grid-item :to="{ path: '/group' }" icon="setting" text="交流群" />
-        <wd-grid-item :to="{ path: '/customer-service' }" icon="setting" text="在线客服" />
-        <wd-grid-item :to="{ path: '/feedback' }" icon="setting" text="反馈社区" />
-        <wd-grid-item :to="{ path: '/like-us' }" icon="setting" text="点赞我们" />
-      </wd-grid>
-      <!-- 菜单列表 -->
-      <view class="mt50rpx">
-        <wd-cell-group border>
-          <wd-cell title="常见问题" icon="help-circle" @click="goToFAQ">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-          <wd-cell title="关于我们" icon="warning" clickable @click="goToAbout">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-          <wd-cell title="用户协议" icon="user" clickable @click="goToUserAgreement">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-          <wd-cell title="隐私政策" icon="folder" clickable @click="goToPrivacy">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-          <wd-cell title="网络检测" icon="wifi" clickable @click="goToNetworkTest">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-          <wd-cell
-            title="清除缓存"
-            icon="delete"
-            :value="cacheSize"
-            clickable
-            @click="handleClearCache"
-          />
-          <wd-cell title="应用设置" icon="setting" clickable @click="goToSettings">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-          <wd-cell title="退出登录" icon="logout" clickable @click="handleLogout">
-            <wd-icon name="arrow-right" />
-          </wd-cell>
-        </wd-cell-group>
-      </view>
-    </view>
-    <!-- 全屏 loading -->
-    <view v-if="clearing" class="loading-mask">
-      <view class="loading-content">
-        <view class="loading-icon" />
-        <text class="loading-text">正在清理...</text>
-      </view>
+        </wd-cell>
+        <wd-cell title="常见问题" icon="help-circle" @click="navigateToFAQ">
+          <wd-icon name="arrow-right" />
+        </wd-cell>
+        <wd-cell title="问题反馈" icon="check-circle" clickable @click="navigateToAbout">
+          <wd-icon name="arrow-right" />
+        </wd-cell>
+        <wd-cell title="设置" icon="setting1" clickable @click="navigateToSettings">
+          <wd-icon name="arrow-right" />
+        </wd-cell>
+      </wd-cell-group>
     </view>
+
+    <wd-toast />
   </view>
 </template>
 
 <script lang="ts" setup>
+import { useToast } from "wot-design-uni";
 import { useUserStore } from "@/store/modules/user";
 
+const toast = useToast();
 const userStore = useUserStore();
 const userInfo = computed(() => userStore.userInfo);
 const isLogin = computed(() => !!userInfo.value);
 const defaultAvatar = "/static/images/default-avatar.png";
 
 // 登录
-const goToLoginPage = () => {
+const navigateToLoginPage = () => {
   uni.navigateTo({ url: "/pages/login/index" });
 };
 // 个人信息
-const goToProfile = () => {
+const navigateToProfile = () => {
   uni.navigateTo({ url: "/pages/mine/profile/index" });
 };
 
-// 用户协议
-const goToUserAgreement = () => {
-  uni.navigateTo({ url: "/pages/mine/user-agreement/index" });
-};
-// 隐私政策
-const goToPrivacy = () => {
-  uni.navigateTo({ url: "/pages/mine/privacy/index" });
-};
-// 网络测试
-const goToNetworkTest = () => {
-  uni.navigateTo({ url: "/pages/mine/network-test/index" });
-};
 // 常见问题
-const goToFAQ = () => {
+const navigateToFAQ = () => {
   uni.navigateTo({ url: "/pages/faq/index" });
 };
 // 关于我们
-const goToAbout = () => {
+const navigateToAbout = () => {
   uni.navigateTo({ url: "/pages/mine/about/index" });
 };
 // 应用设置
-const goToSettings = () => {
-  uni.showToast({
-    title: "建设中...",
-    icon: "none",
-  });
-  //uni.navigateTo({ url: "/pages/settings/index" });
-};
-// 退出登录
-const handleLogout = () => {
-  userStore.logout().then(() => {
-    uni.showToast({ title: "已退出登录", icon: "success" });
-  });
-};
-// 是否正在清理
-const clearing = ref(false);
-// 缓存大小
-const cacheSize = ref<any>("计算中...");
-// 获取缓存大小
-const getCacheSize = async () => {
-  try {
-    // #ifdef MP-WEIXIN
-    const res = await uni.getStorageInfo();
-    cacheSize.value = formatSize(res.currentSize);
-    // #endif
-    // #ifdef H5
-    cacheSize.value = formatSize(
-      Object.keys(localStorage).reduce((size, key) => size + localStorage[key].length, 0)
-    );
-    // #endif
-    if (!cacheSize.value) {
-      cacheSize.value = "0B";
-    }
-  } catch (error) {
-    console.error("获取缓存大小失败:", error);
-    cacheSize.value = "获取失败";
-  }
+const navigateToSettings = () => {
+  uni.navigateTo({ url: "/pages/mine/settings/index" });
 };
 
-// 格式化存储大小
-const formatSize = (size: number) => {
-  if (size < 1024) {
-    return size + "B";
-  } else if (size < 1024 * 1024) {
-    return (size / 1024).toFixed(2) + "KB";
-  } else {
-    return (size / 1024 / 1024).toFixed(2) + "MB";
-  }
+const handleItemclick = (item: any) => {
+  toast.show("建设中...");
 };
-
-// 处理清除缓存
-const handleClearCache = async () => {
-  if (cacheSize.value === "获取失败") {
-    uni.showToast({
-      title: "获取缓存信息失败，请稍后重试",
-      icon: "none",
-      duration: 2000,
-    });
-    return;
-  }
-  if (cacheSize.value === "0B") {
-    uni.showToast({
-      title: "暂无缓存需要清理",
-      icon: "none",
-      duration: 2000,
-    });
-    return;
-  }
-  if (clearing.value) {
-    return;
-  }
-
-  try {
-    clearing.value = true;
-    // 模拟清理过程
-    await new Promise((resolve) => setTimeout(resolve, 1500));
-    // 清除缓存
-    await uni.clearStorage();
-    // 更新缓存大小显示
-    await getCacheSize();
-    // 提示清理成功
-    uni.showToast({
-      title: "清理成功",
-      icon: "success",
-    });
-  } catch (error) {
-    uni.showToast({
-      title: "清理失败",
-      icon: "error",
-    });
-  } finally {
-    clearing.value = false;
-  }
-};
-onShow(() => {
-  getCacheSize();
-});
 </script>
 
 <style lang="scss" scoped>
-/* stylelint-disable selector-type-no-unknown */
-page {
-  background: #f8f8f8;
-}
-/* stylelint-enable selector-type-no-unknown */
-
-.mine {
-  height: 100%;
-  .header {
+.mine-container {
+  .mine-header {
     display: flex;
-    align-items: center;
+    align-items: start;
     justify-content: space-between;
-    padding: 50rpx 20rpx 100rpx 20rpx;
+
+    padding: 60rpx 20rpx;
     color: #fff;
-    background: linear-gradient(60deg, #165dff, #6aa1ff);
-  }
-}
-.loading-mask {
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 9999;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background-color: rgba(0, 0, 0, 0.4);
+    background: linear-gradient(60deg, #517cf0, #769ef5);
 
-  .loading-content {
-    padding: 30rpx 40rpx;
-    text-align: center;
-    background-color: rgba(255, 255, 255, 0.95);
-    border-radius: 12rpx;
-    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
-
-    .loading-icon {
-      width: 60rpx;
-      height: 60rpx;
-      margin: 0 auto 20rpx;
-      border: 4rpx solid #f3f3f3;
-      border-top: 4rpx solid #409eff;
-      border-radius: 50%;
-      animation: spin 1s linear infinite;
-    }
-
-    .loading-text {
+    .login-tip {
       font-size: 28rpx;
-      font-weight: 500;
-      color: #333;
+      color: #fff;
+    }
+    .login-btn {
+      line-height: 60rpx;
+      color: #4d80f0;
+      background-color: #fff;
+      border-radius: 10rpx;
     }
   }
 }
diff --git a/src/pages/mine/profile/index.vue b/src/pages/mine/profile/index.vue
index 2269c68..8ab1257 100644
--- a/src/pages/mine/profile/index.vue
+++ b/src/pages/mine/profile/index.vue
@@ -19,17 +19,12 @@
             />
           </view>
         </wd-cell>
-        <wd-cell
-          title="昵称"
-          :value="userProfile.nickname"
-          is-link
-          @click="handleOpenDialog(DialogType.ACCOUNT)"
-        />
+        <wd-cell title="昵称" :value="userProfile.nickname" is-link @click="handleOpenDialog()" />
         <wd-cell
           title="性别"
           :value="userProfile.gender === 1 ? '男' : userProfile.gender === 2 ? '女' : '未知'"
           is-link
-          @click="handleOpenDialog(DialogType.ACCOUNT)"
+          @click="handleOpenDialog()"
         />
         <wd-cell title="用户名" :value="userProfile.username" />
         <wd-cell title="部门" :value="userProfile.deptName" />
@@ -38,41 +33,12 @@
       </wd-cell-group>
     </view>
 
-    <view class="profile-card">
-      <wd-cell-group border>
-        <wd-cell
-          title="账户密码"
-          label="定期修改密码有助于保护账户安全"
-          value="修改"
-          is-link
-          @click="handleOpenDialog(DialogType.PASSWORD)"
-        />
-        <wd-cell
-          title="绑定手机"
-          :value="userProfile?.mobile"
-          is-link
-          @click="handleOpenDialog(DialogType.MOBILE)"
-        />
-        <wd-cell
-          title="绑定邮箱"
-          :value="userProfile?.email ? userProfile.email : '未绑定邮箱'"
-          is-link
-          @click="handleOpenDialog(DialogType.EMAIL)"
-        />
-      </wd-cell-group>
-    </view>
-
     <!--头像裁剪-->
     <wd-img-cropper v-model="avatarShow" :img-src="originalSrc" @confirm="handleAvatarConfirm" />
 
     <!--用户信息编辑弹出框-->
     <wd-popup v-model="dialog.visible" position="bottom">
-      <wd-form
-        v-if="dialog.type === DialogType.ACCOUNT"
-        ref="userProfileFormRef"
-        :model="userProfileForm"
-        custom-class="edit-form"
-      >
+      <wd-form ref="userProfileFormRef" :model="userProfileForm" custom-class="edit-form">
         <wd-cell-group border>
           <wd-input
             v-model="userProfileForm.nickname"
@@ -93,128 +59,6 @@
           <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
         </view>
       </wd-form>
-      <wd-form
-        v-if="dialog.type === DialogType.PASSWORD"
-        ref="passwordChangeFormRef"
-        :model="passwordChangeForm"
-        custom-class="edit-form"
-      >
-        <wd-cell-group border>
-          <wd-input
-            v-model="passwordChangeForm.oldPassword"
-            label="原密码"
-            label-width="160rpx"
-            show-password
-            clearable
-            placeholder="请输入原密码"
-            prop="oldPassword"
-            :rules="rules.oldPassword"
-          />
-          <wd-input
-            v-model="passwordChangeForm.newPassword"
-            label="新密码"
-            label-width="160rpx"
-            show-password
-            clearable
-            placeholder="请输入新密码"
-            prop="newPassword"
-            :rules="rules.newPassword"
-          />
-          <wd-input
-            v-model="passwordChangeForm.confirmPassword"
-            label="确认密码"
-            label-width="160rpx"
-            show-password
-            clearable
-            placeholder="请确认新密码"
-            prop="confirmPassword"
-            :rules="rules.confirmPassword"
-          />
-        </wd-cell-group>
-        <view class="footer">
-          <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
-        </view>
-      </wd-form>
-      <wd-form
-        v-if="dialog.type === DialogType.MOBILE"
-        ref="mobileBindingFormRef"
-        :model="mobileBindingForm"
-        custom-class="edit-form"
-      >
-        <wd-cell-group border>
-          <wd-input
-            v-model="mobileBindingForm.mobile"
-            label="手机号码"
-            label-width="160rpx"
-            clearable
-            placeholder="请输入手机号码"
-            prop="mobile"
-            :rules="rules.mobile"
-          />
-          <wd-input
-            v-model="mobileBindingForm.code"
-            label="验证码"
-            label-width="160rpx"
-            clearable
-            placeholder="请输入验证码"
-            prop="code"
-            :rules="rules.code"
-          >
-            <template #suffix>
-              <wd-button
-                plain
-                :disabled="mobileCountdown > 0"
-                @click="handleSendVerificationCode('MOBILE')"
-              >
-                {{ mobileCountdown > 0 ? `${mobileCountdown}s后重新发送` : "发送验证码" }}
-              </wd-button>
-            </template>
-          </wd-input>
-        </wd-cell-group>
-        <view class="footer">
-          <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
-        </view>
-      </wd-form>
-      <wd-form
-        v-if="dialog.type === DialogType.EMAIL"
-        ref="emailBindingFormRef"
-        :model="emailBindingForm"
-        custom-class="edit-form"
-      >
-        <wd-cell-group border>
-          <wd-input
-            v-model="emailBindingForm.email"
-            label="邮箱"
-            label-width="160rpx"
-            clearable
-            placeholder="请输入邮箱"
-            prop="email"
-            :rules="rules.email"
-          />
-          <wd-input
-            v-model="emailBindingForm.code"
-            label="验证码"
-            label-width="160rpx"
-            clearable
-            placeholder="请输入验证码"
-            prop="code"
-            :rules="rules.code"
-          >
-            <template #suffix>
-              <wd-button
-                plain
-                :disabled="emailCountdown > 0"
-                @click="handleSendVerificationCode('EMAIL')"
-              >
-                {{ emailCountdown > 0 ? `${emailCountdown}s后重新发送` : "发送验证码" }}
-              </wd-button>
-            </template>
-          </wd-input>
-        </wd-cell-group>
-        <view class="footer">
-          <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
-        </view>
-      </wd-form>
     </wd-popup>
   </view>
 </template>
@@ -222,7 +66,6 @@
 import UserAPI, {
   type UserProfileVO,
   UserProfileForm,
-  PasswordChangeForm,
   MobileBindingForm,
   EmailBindingForm,
 } from "@/api/system/user";
@@ -262,173 +105,41 @@ function handleAvatarConfirm(event) {
   });
 }
 
-const validatorConfirmPassword = (value) => {
-  if (!value) {
-    return Promise.reject("请确认密码");
-  } else {
-    if (value !== passwordChangeForm.newPassword) {
-      return Promise.reject("两次输入的密码不一致");
-    } else {
-      return Promise.resolve();
-    }
-  }
-};
 // 本页面中所有的校验规则
 const rules = reactive({
   nickname: [{ required: true, message: "请填写昵称" }],
   gender: [{ required: true, message: "请选择性别" }],
-  oldPassword: [{ required: true, message: "请填写原密码" }],
-  newPassword: [{ required: true, message: "请填写新密码" }],
-  confirmPassword: [{ required: true, message: "请确认密码", validator: validatorConfirmPassword }],
-  mobile: [{ required: true, pattern: /^1[3-9]\d{9}$/, message: "请填写正确的手机号码" }],
-  code: [{ required: true, message: "请填写验证码" }],
-  email: [
-    {
-      required: true,
-      pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
-      message: "请填写正确的邮箱地址",
-    },
-  ],
 });
 
-enum DialogType {
-  ACCOUNT = "account",
-  PASSWORD = "password",
-  MOBILE = "mobile",
-  EMAIL = "email",
-}
-
 const dialog = reactive({
   visible: false,
-  type: "" as DialogType, // 修改账号资料,修改密码、绑定手机、绑定邮箱
 });
 
 const userProfileForm = reactive<UserProfileForm>({});
-const passwordChangeForm = reactive<PasswordChangeForm>({});
-const mobileBindingForm = reactive<MobileBindingForm>({});
-const emailBindingForm = reactive<EmailBindingForm>({});
 const userProfileFormRef = ref();
-const passwordChangeFormRef = ref();
-const mobileBindingFormRef = ref();
-const emailBindingFormRef = ref();
 
-const mobileCountdown = ref(0);
-const mobileTimer = ref<NodeJS.Timeout | null>(null);
-
-const emailCountdown = ref(0);
-const emailTimer = ref<NodeJS.Timeout | null>(null);
 /**
  * 打开弹窗
  * @param type 弹窗类型 ACCOUNT: 账号资料 PASSWORD: 修改密码 MOBILE: 绑定手机 EMAIL: 绑定邮箱
  */
-const handleOpenDialog = (type: DialogType) => {
-  dialog.type = type;
+const handleOpenDialog = () => {
   dialog.visible = true;
-  switch (type) {
-    case DialogType.ACCOUNT:
-      // 初始化表单数据
-      userProfileForm.nickname = userProfile.value?.nickname;
-      userProfileForm.gender = userProfile.value?.gender;
-      break;
-    case DialogType.PASSWORD:
-      passwordChangeForm.oldPassword = "";
-      passwordChangeForm.newPassword = "";
-      passwordChangeForm.confirmPassword = "";
-      break;
-    case DialogType.MOBILE:
-      mobileBindingForm.mobile = "";
-      mobileBindingForm.code = "";
-      break;
-    case DialogType.EMAIL:
-      emailBindingForm.email = "";
-      emailBindingForm.code = "";
-      break;
-  }
-};
-
-/**
- *  发送验证码
- *
- * @param contactType 联系方式类型 MOBILE: 手机号码  EMAIL: 邮箱
- */
-const handleSendVerificationCode = async (contactType: string) => {
-  if (contactType === "MOBILE") {
-    mobileBindingFormRef.value.validate("mobile").then(({ valid }) => {
-      if (valid) {
-        UserAPI.sendVerificationCode(mobileBindingForm.mobile, "MOBILE").then(() => {
-          uni.showToast({ title: "验证码已发送", icon: "none" });
-          mobileCountdown.value = 60;
-          mobileTimer.value = setInterval(() => {
-            if (mobileCountdown.value > 0) {
-              mobileCountdown.value -= 1;
-            } else {
-              clearInterval(mobileTimer.value!);
-            }
-          }, 1000);
-        });
-      }
-    });
-  } else if (contactType === "EMAIL") {
-    emailBindingFormRef.value.validate("email").then(({ valid }) => {
-      if (valid) {
-        UserAPI.sendVerificationCode(emailBindingForm.email, "EMAIL").then(() => {
-          uni.showToast({ title: "验证码已发送", icon: "none" });
-          emailCountdown.value = 60;
-          emailTimer.value = setInterval(() => {
-            if (emailCountdown.value > 0) {
-              emailCountdown.value -= 1;
-            } else {
-              clearInterval(emailTimer.value!);
-            }
-          }, 1000);
-        });
-      }
-    });
-  }
+  // 初始化表单数据
+  userProfileForm.nickname = userProfile.value?.nickname;
+  userProfileForm.gender = userProfile.value?.gender;
 };
 
 // 提交表单
 function handleSubmit() {
-  if (dialog.type === DialogType.ACCOUNT) {
-    userProfileFormRef.value.validate().then(({ valid }) => {
-      if (valid) {
-        UserAPI.updateProfile(userProfileForm).then(() => {
-          uni.showToast({ title: "账号资料修改成功", icon: "none" });
-          dialog.visible = false;
-          loadUserProfile();
-        });
-      }
-    });
-  } else if (dialog.type === DialogType.PASSWORD) {
-    passwordChangeFormRef.value.validate().then(({ valid }) => {
-      if (valid) {
-        UserAPI.changePassword(passwordChangeForm).then(() => {
-          uni.showToast({ title: "密码修改成功", icon: "none" });
-          dialog.visible = false;
-        });
-      }
-    });
-  } else if (dialog.type === DialogType.MOBILE) {
-    mobileBindingFormRef.value.validate().then(({ valid }) => {
-      if (valid) {
-        UserAPI.bindMobile(mobileBindingForm).then(() => {
-          uni.showToast({ title: "手机号绑定成功", icon: "none" });
-          dialog.visible = false;
-          loadUserProfile();
-        });
-      }
-    });
-  } else if (dialog.type === DialogType.EMAIL) {
-    emailBindingFormRef.value.validate().then(({ valid }) => {
-      if (valid) {
-        UserAPI.bindEmail(emailBindingForm).then(() => {
-          uni.showToast({ title: "邮箱绑定成功", icon: "none" });
-          dialog.visible = false;
-          loadUserProfile();
-        });
-      }
-    });
-  }
+  userProfileFormRef.value.validate().then(({ valid }) => {
+    if (valid) {
+      UserAPI.updateProfile(userProfileForm).then(() => {
+        uni.showToast({ title: "账号资料修改成功", icon: "none" });
+        dialog.visible = false;
+        loadUserProfile();
+      });
+    }
+  });
 }
 
 onMounted(() => {
@@ -485,10 +196,7 @@ function touchmoveListener(event) {
             position: absolute;
             top: 50%;
             left: 50%;
-            font-size: 60px;
             color: #fff;
-            -webkit-transform: translate(-50%, -50%);
-            transform: translate(-50%, -50%);
           }
         }
       }
diff --git a/src/pages/mine/settings/account/index.vue b/src/pages/mine/settings/account/index.vue
new file mode 100644
index 0000000..15923a6
--- /dev/null
+++ b/src/pages/mine/settings/account/index.vue
@@ -0,0 +1,343 @@
+<template>
+  <view class="profile">
+    <view class="profile-card">
+      <wd-cell-group border>
+        <wd-cell
+          title="账户密码"
+          label="定期修改密码有助于保护账户安全"
+          value="修改"
+          is-link
+          @click="handleOpenDialog(DialogType.PASSWORD)"
+        />
+        <wd-cell
+          title="绑定手机"
+          :value="userProfile?.mobile"
+          is-link
+          @click="handleOpenDialog(DialogType.MOBILE)"
+        />
+        <wd-cell
+          title="绑定邮箱"
+          :value="userProfile?.email ? userProfile.email : '未绑定邮箱'"
+          is-link
+          @click="handleOpenDialog(DialogType.EMAIL)"
+        />
+      </wd-cell-group>
+    </view>
+
+    <!--用户信息编辑弹出框-->
+    <wd-popup v-model="dialog.visible" position="bottom">
+      <wd-form
+        v-if="dialog.type === DialogType.PASSWORD"
+        ref="passwordChangeFormRef"
+        :model="passwordChangeForm"
+        custom-class="edit-form"
+      >
+        <wd-cell-group border>
+          <wd-input
+            v-model="passwordChangeForm.oldPassword"
+            label="原密码"
+            label-width="160rpx"
+            show-password
+            clearable
+            placeholder="请输入原密码"
+            prop="oldPassword"
+            :rules="rules.oldPassword"
+          />
+          <wd-input
+            v-model="passwordChangeForm.newPassword"
+            label="新密码"
+            label-width="160rpx"
+            show-password
+            clearable
+            placeholder="请输入新密码"
+            prop="newPassword"
+            :rules="rules.newPassword"
+          />
+          <wd-input
+            v-model="passwordChangeForm.confirmPassword"
+            label="确认密码"
+            label-width="160rpx"
+            show-password
+            clearable
+            placeholder="请确认新密码"
+            prop="confirmPassword"
+            :rules="rules.confirmPassword"
+          />
+        </wd-cell-group>
+        <view class="footer">
+          <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
+        </view>
+      </wd-form>
+      <wd-form
+        v-if="dialog.type === DialogType.MOBILE"
+        ref="mobileBindingFormRef"
+        :model="mobileBindingForm"
+        custom-class="edit-form"
+      >
+        <wd-cell-group border>
+          <wd-input
+            v-model="mobileBindingForm.mobile"
+            label="手机号码"
+            label-width="160rpx"
+            clearable
+            placeholder="请输入手机号码"
+            prop="mobile"
+            :rules="rules.mobile"
+          />
+          <wd-input
+            v-model="mobileBindingForm.code"
+            label="验证码"
+            label-width="160rpx"
+            clearable
+            placeholder="请输入验证码"
+            prop="code"
+            :rules="rules.code"
+          >
+            <template #suffix>
+              <wd-button
+                plain
+                :disabled="mobileCountdown > 0"
+                @click="handleSendVerificationCode('MOBILE')"
+              >
+                {{ mobileCountdown > 0 ? `${mobileCountdown}s后重新发送` : "发送验证码" }}
+              </wd-button>
+            </template>
+          </wd-input>
+        </wd-cell-group>
+        <view class="footer">
+          <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
+        </view>
+      </wd-form>
+      <wd-form
+        v-if="dialog.type === DialogType.EMAIL"
+        ref="emailBindingFormRef"
+        :model="emailBindingForm"
+        custom-class="edit-form"
+      >
+        <wd-cell-group border>
+          <wd-input
+            v-model="emailBindingForm.email"
+            label="邮箱"
+            label-width="160rpx"
+            clearable
+            placeholder="请输入邮箱"
+            prop="email"
+            :rules="rules.email"
+          />
+          <wd-input
+            v-model="emailBindingForm.code"
+            label="验证码"
+            label-width="160rpx"
+            clearable
+            placeholder="请输入验证码"
+            prop="code"
+            :rules="rules.code"
+          >
+            <template #suffix>
+              <wd-button
+                plain
+                :disabled="emailCountdown > 0"
+                @click="handleSendVerificationCode('EMAIL')"
+              >
+                {{ emailCountdown > 0 ? `${emailCountdown}s后重新发送` : "发送验证码" }}
+              </wd-button>
+            </template>
+          </wd-input>
+        </wd-cell-group>
+        <view class="footer">
+          <wd-button type="primary" size="large" block @click="handleSubmit">提交</wd-button>
+        </view>
+      </wd-form>
+    </wd-popup>
+  </view>
+</template>
+<script setup lang="ts">
+import UserAPI, {
+  PasswordChangeForm,
+  MobileBindingForm,
+  EmailBindingForm,
+  UserProfileVO,
+} from "@/api/system/user";
+
+const validatorConfirmPassword = (value: string) => {
+  if (!value) {
+    return Promise.reject("请确认密码");
+  } else {
+    if (value !== passwordChangeForm.newPassword) {
+      return Promise.reject("两次输入的密码不一致");
+    } else {
+      return Promise.resolve();
+    }
+  }
+};
+// 本页面中所有的校验规则
+const rules = reactive({
+  oldPassword: [{ required: true, message: "请填写原密码" }],
+  newPassword: [{ required: true, message: "请填写新密码" }],
+  confirmPassword: [{ required: true, message: "请确认密码", validator: validatorConfirmPassword }],
+  mobile: [{ required: true, pattern: /^1[3-9]\d{9}$/, message: "请填写正确的手机号码" }],
+  code: [{ required: true, message: "请填写验证码" }],
+  email: [
+    {
+      required: true,
+      pattern: /\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}/,
+      message: "请填写正确的邮箱地址",
+    },
+  ],
+});
+
+enum DialogType {
+  PASSWORD = "password",
+  MOBILE = "mobile",
+  EMAIL = "email",
+}
+
+const dialog = reactive({
+  visible: false,
+  type: "" as DialogType, // 修改账号资料,修改密码、绑定手机、绑定邮箱
+});
+
+const userProfile = ref<UserProfileVO>(); //用户信息
+const passwordChangeForm = reactive<PasswordChangeForm>({});
+const mobileBindingForm = reactive<MobileBindingForm>({});
+const emailBindingForm = reactive<EmailBindingForm>({});
+const passwordChangeFormRef = ref();
+const mobileBindingFormRef = ref();
+const emailBindingFormRef = ref();
+
+const mobileCountdown = ref(0);
+const mobileTimer = ref<ReturnType<typeof setInterval> | null>(null);
+
+const emailCountdown = ref(0);
+const emailTimer = ref<ReturnType<typeof setTimeout> | null>(null);
+
+/** 加载用户信息 */
+const loadUserProfile = async () => {
+  userProfile.value = await UserAPI.getProfile();
+};
+
+/**
+ * 打开弹窗
+ * @param type 弹窗类型 ACCOUNT: 账号资料 PASSWORD: 修改密码 MOBILE: 绑定手机 EMAIL: 绑定邮箱
+ */
+const handleOpenDialog = (type: DialogType) => {
+  dialog.type = type;
+  dialog.visible = true;
+  switch (type) {
+    case DialogType.PASSWORD:
+      passwordChangeForm.oldPassword = "";
+      passwordChangeForm.newPassword = "";
+      passwordChangeForm.confirmPassword = "";
+      break;
+    case DialogType.MOBILE:
+      mobileBindingForm.mobile = "";
+      mobileBindingForm.code = "";
+      break;
+    case DialogType.EMAIL:
+      emailBindingForm.email = "";
+      emailBindingForm.code = "";
+      break;
+  }
+};
+
+/**
+ *  发送验证码
+ *
+ * @param contactType 联系方式类型 MOBILE: 手机号码  EMAIL: 邮箱
+ */
+const handleSendVerificationCode = async (contactType: string) => {
+  if (contactType === "MOBILE") {
+    mobileBindingFormRef.value.validate("mobile").then(({ valid }: { valid: boolean }) => {
+      if (valid) {
+        UserAPI.sendVerificationCode(mobileBindingForm.mobile!, "MOBILE").then(() => {
+          uni.showToast({ title: "验证码已发送", icon: "none" });
+          mobileCountdown.value = 60;
+          mobileTimer.value = setInterval(() => {
+            if (mobileCountdown.value > 0) {
+              mobileCountdown.value -= 1;
+            } else {
+              clearInterval(mobileTimer.value!);
+            }
+          }, 1000);
+        });
+      }
+    });
+  } else if (contactType === "EMAIL") {
+    emailBindingFormRef.value.validate("email").then(({ valid }: { valid: boolean }) => {
+      if (valid) {
+        UserAPI.sendVerificationCode(emailBindingForm.email!, "EMAIL").then(() => {
+          uni.showToast({ title: "验证码已发送", icon: "none" });
+          emailCountdown.value = 60;
+          emailTimer.value = setInterval(() => {
+            if (emailCountdown.value > 0) {
+              emailCountdown.value -= 1;
+            } else {
+              clearInterval(emailTimer.value!);
+            }
+          }, 1000);
+        });
+      }
+    });
+  }
+};
+
+// 提交表单
+function handleSubmit() {
+  if (dialog.type === DialogType.PASSWORD) {
+    passwordChangeFormRef.value.validate().then(({ valid }: { valid: boolean }) => {
+      if (valid) {
+        UserAPI.changePassword(passwordChangeForm).then(() => {
+          uni.showToast({ title: "密码修改成功", icon: "none" });
+          dialog.visible = false;
+        });
+      }
+    });
+  } else if (dialog.type === DialogType.MOBILE) {
+    mobileBindingFormRef.value.validate().then(({ valid }: { valid: boolean }) => {
+      if (valid) {
+        UserAPI.bindMobile(mobileBindingForm).then(() => {
+          uni.showToast({ title: "手机号绑定成功", icon: "none" });
+          dialog.visible = false;
+          loadUserProfile();
+        });
+      }
+    });
+  } else if (dialog.type === DialogType.EMAIL) {
+    emailBindingFormRef.value.validate().then(({ valid }: { valid: boolean }) => {
+      if (valid) {
+        UserAPI.bindEmail(emailBindingForm).then(() => {
+          uni.showToast({ title: "邮箱绑定成功", icon: "none" });
+          dialog.visible = false;
+          loadUserProfile();
+        });
+      }
+    });
+  }
+}
+
+onMounted(() => {
+  loadUserProfile();
+});
+</script>
+<style lang="scss" scoped>
+.profile {
+  .profile-card {
+    padding: 10rpx;
+    margin-bottom: 24rpx;
+    line-height: 1.1;
+    background-color: rgb(255, 255, 255);
+    border-radius: 16px;
+    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
+  }
+  .edit-form {
+    padding-top: 40rpx;
+    .ef-radio-group {
+      line-height: 1;
+      text-align: left;
+    }
+    .footer {
+      padding: 24rpx;
+    }
+  }
+}
+</style>
diff --git a/src/pages/mine/user-agreement/index.vue b/src/pages/mine/settings/agreement/index.vue
similarity index 100%
rename from src/pages/mine/user-agreement/index.vue
rename to src/pages/mine/settings/agreement/index.vue
diff --git a/src/pages/mine/settings/index.vue b/src/pages/mine/settings/index.vue
new file mode 100644
index 0000000..198123f
--- /dev/null
+++ b/src/pages/mine/settings/index.vue
@@ -0,0 +1,193 @@
+<template>
+  <view class="settings-container">
+    <wd-cell-group>
+      <wd-cell title="账号和安全" icon="secured" is-link @click="navigateToAccount" />
+      <wd-cell title="用户协议" icon="user" is-link @click="navigateToUserAgreement" />
+      <wd-cell title="隐私政策" icon="folder" is-link @click="navigateToPrivacy" />
+    </wd-cell-group>
+
+    <wd-cell-group custom-style="margin-top:40rpx">
+      <wd-cell title="网络测试" icon="wifi" is-link @click="navigateToNetworkTest" />
+      <wd-cell
+        title="清空缓存"
+        icon="delete1"
+        :value="cacheSize"
+        clickable
+        @click="handleClearCache"
+      />
+    </wd-cell-group>
+
+    <wd-cell-group v-if="isLogin" custom-style="margin-top:40rpx">
+      <wd-cell title="退出" icon="logout" is-link @click="handleLogout" />
+    </wd-cell-group>
+
+    <!-- 全屏 loading -->
+    <view v-if="clearing" class="loading-mask">
+      <view class="loading-content">
+        <view class="loading-icon" />
+        <text class="loading-text">正在清理...</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { useUserStore } from "@/store/modules/user";
+const userStore = useUserStore();
+
+const isLogin = computed(() => !!userStore.userInfo);
+
+// 账号和安全
+const navigateToAccount = () => {
+  uni.navigateTo({ url: "/pages/mine/settings/account/index" });
+};
+
+// 用户协议
+const navigateToUserAgreement = () => {
+  uni.navigateTo({ url: "/pages/mine/settings/agreement/index" });
+};
+// 隐私政策
+const navigateToPrivacy = () => {
+  uni.navigateTo({ url: "/pages/mine/settings/privacy/index" });
+};
+// 网络测试
+const navigateToNetworkTest = () => {
+  uni.navigateTo({ url: "/pages/mine/settings/network/index" });
+};
+
+// 是否正在清理
+const clearing = ref(false);
+// 缓存大小
+const cacheSize = ref<any>("计算中...");
+// 获取缓存大小
+const getCacheSize = async () => {
+  try {
+    // #ifdef MP-WEIXIN
+    const res = await uni.getStorageInfo();
+    cacheSize.value = formatSize(res.currentSize);
+    // #endif
+    // #ifdef H5
+    cacheSize.value = formatSize(
+      Object.keys(localStorage).reduce((size, key) => size + localStorage[key].length, 0)
+    );
+    // #endif
+    if (!cacheSize.value) {
+      cacheSize.value = "0B";
+    }
+  } catch (error) {
+    console.error("获取缓存大小失败:", error);
+    cacheSize.value = "获取失败";
+  }
+};
+
+// 格式化存储大小
+const formatSize = (size: number) => {
+  if (size < 1024) {
+    return size + "B";
+  } else if (size < 1024 * 1024) {
+    return (size / 1024).toFixed(2) + "KB";
+  } else {
+    return (size / 1024 / 1024).toFixed(2) + "MB";
+  }
+};
+
+// 处理清除缓存
+const handleClearCache = async () => {
+  if (cacheSize.value === "获取失败") {
+    uni.showToast({
+      title: "获取缓存信息失败，请稍后重试",
+      icon: "none",
+      duration: 2000,
+    });
+    return;
+  }
+  if (cacheSize.value === "0B") {
+    uni.showToast({
+      title: "暂无缓存需要清理",
+      icon: "none",
+      duration: 2000,
+    });
+    return;
+  }
+  if (clearing.value) {
+    return;
+  }
+
+  try {
+    clearing.value = true;
+    // 模拟清理过程
+    await new Promise((resolve) => setTimeout(resolve, 1500));
+    // 清除缓存
+    await uni.clearStorage();
+    // 更新缓存大小显示
+    await getCacheSize();
+    // 提示清理成功
+    uni.showToast({
+      title: "清理成功",
+      icon: "success",
+    });
+  } catch (error) {
+    uni.showToast({
+      title: "清理失败",
+      icon: "error",
+    });
+  } finally {
+    clearing.value = false;
+  }
+};
+
+// 退出登录
+const handleLogout = () => {
+  userStore.logout().then(() => {
+    uni.showToast({ title: "已退出登录", icon: "success" });
+    // 跳转到登录页
+    uni.reLaunch({ url: "/pages/mine/index" });
+  });
+};
+
+onLoad(() => {
+  getCacheSize();
+});
+</script>
+<style lang="scss" scoped>
+.settings-container {
+  padding: 20px;
+
+  .loading-mask {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 9999;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: rgba(0, 0, 0, 0.4);
+
+    .loading-content {
+      padding: 30rpx 40rpx;
+      text-align: center;
+      background-color: rgba(255, 255, 255, 0.95);
+      border-radius: 12rpx;
+      box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
+
+      .loading-icon {
+        width: 60rpx;
+        height: 60rpx;
+        margin: 0 auto 20rpx;
+        border: 4rpx solid #f3f3f3;
+        border-top: 4rpx solid #409eff;
+        border-radius: 50%;
+        animation: spin 1s linear infinite;
+      }
+
+      .loading-text {
+        font-size: 28rpx;
+        font-weight: 500;
+        color: #333;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/pages/mine/network-test/index.vue b/src/pages/mine/settings/network/index.vue
similarity index 99%
rename from src/pages/mine/network-test/index.vue
rename to src/pages/mine/settings/network/index.vue
index 075ba79..ffae164 100644
--- a/src/pages/mine/network-test/index.vue
+++ b/src/pages/mine/settings/network/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="network-test">
+  <view class="network-container">
     <!-- 网络状态展示 -->
     <view class="status-card">
       <view class="status-header">
@@ -193,7 +193,7 @@ onBeforeUnmount(() => {
 </script>
 
 <style lang="scss" scoped>
-.network-test {
+.network-container {
   min-height: 100vh;
   padding: 20px;
   background-color: #f5f5f5;
diff --git a/src/pages/mine/privacy/index.vue b/src/pages/mine/settings/privacy/index.vue
similarity index 100%
rename from src/pages/mine/privacy/index.vue
rename to src/pages/mine/settings/privacy/index.vue
diff --git a/src/pages/work/index.vue b/src/pages/work/index.vue
index ba8c664..4cd84c2 100644
--- a/src/pages/work/index.vue
+++ b/src/pages/work/index.vue
@@ -39,16 +39,6 @@ const gridList = reactive([
         url: "/pages/work/role/index",
         prem: "sys:role:query",
       },
-      {
-        icon: "/static/icons/dept.png",
-        title: "部门管理",
-        prem: "sys:dept:query",
-      },
-      {
-        icon: "/static/icons/dict.png",
-        title: "字典管理",
-        prem: "sys:dict:query",
-      },
       {
         icon: "/static/icons/config.png",
         title: "系统配置",
@@ -66,13 +56,9 @@ const gridList = reactive([
   {
     title: "系统监控",
     children: [
-      {
-        icon: "/static/icons/monitor.png",
-        title: "实时监控",
-      },
       {
         icon: "/static/icons/log.png",
-        title: "日志管理",
+        title: "系统日志",
         url: "/pages/work/log/index",
         prem: "sys:log:query",
       },
diff --git a/src/pages/work/role/index.vue b/src/pages/work/role/index.vue
index 54bd36d..69dde8c 100644
--- a/src/pages/work/role/index.vue
+++ b/src/pages/work/role/index.vue
@@ -168,19 +168,19 @@ onReachBottom(() => {
 
 // 操作按钮
 const handleAction = (item: RolePageVO) => {
-  const actions = ["删除", "分配权限", "编辑"];
+  const actions = ["编辑", "分配权限", "删除"];
   uni.showActionSheet({
     itemList: actions,
     success: ({ tapIndex }) => {
       switch (actions[tapIndex]) {
-        case "删除":
-          handleDelete(item.id);
+        case "编辑":
+          handleOpenDialog(item.id);
           break;
         case "分配权限":
           handleAssignPerm(item.id);
           break;
-        case "编辑":
-          handleOpenDialog(item.id);
+        case "删除":
+          handleDelete(item.id);
           break;
       }
     },
@@ -288,6 +288,15 @@ onLoad(() => {
 });
 </script>
 
+<script lang="ts">
+// https://wot-design-uni.pages.dev/guide/common-problems#%E5%B0%8F%E7%A8%8B%E5%BA%8F%E6%A0%B7%E5%BC%8F%E9%9A%94%E7%A6%BB
+export default {
+  options: {
+    styleIsolation: "shared",
+  },
+};
+</script>
+
 <style lang="scss" scoped>
 .role {
   :deep(.wd-drop-menu .wd-drop-menu__item) {
@@ -307,6 +316,15 @@ onLoad(() => {
       }
     }
   }
+  :deep(.wd-cell__wrapper) {
+    padding: 4rpx 0;
+  }
+
+  :deep(.wd-cell) {
+    padding-right: 10rpx;
+    background: #f8f8f8;
+  }
+
   :deep(.wd-fab__trigger) {
     width: 80rpx !important;
     height: 80rpx !important;
diff --git a/src/pages/work/user/index.vue b/src/pages/work/user/index.vue
index a5c0544..0c0df5e 100644
--- a/src/pages/work/user/index.vue
+++ b/src/pages/work/user/index.vue
@@ -1,21 +1,26 @@
 <template>
-  <view class="user">
-    <view style="width: 100%; height: var(--status-bar-height)" />
+  <!-- 自定义导航栏的占位 -->
+  <view style="width: 100%; height: var(--status-bar-height)" />
+
+  <view class="user-container">
+    <!-- 自定义导航栏 -->
     <wd-navbar title="用户管理">
       <template #left>
         <wd-icon name="thin-arrow-left" @click="handleNavigateback()" />
       </template>
     </wd-navbar>
+
     <!-- 排序筛选 -->
-    <view class="mb-24rpx">
+    <view class="filter-container">
       <wd-drop-menu>
         <wd-drop-menu-item
           v-model="sortValue"
           :options="sortOptions"
           title="排序"
+          icon="unfold-more"
           @change="handleSortChange"
         />
-        <wd-drop-menu-item ref="filterDropMenu" title="筛选">
+        <wd-drop-menu-item ref="filterDropMenu" title="筛选" icon="filter">
           <view>
             <wd-input
               v-model="queryParams.keywords"
@@ -26,69 +31,84 @@
             <cu-date-query v-model="queryParams.createTime" label="创建时间" />
 
             <view class="flex-between py-2">
-              <wd-button custom-class="w-20per" type="info" @click="handleResetQuery">
-                重置
-              </wd-button>
-              <wd-button custom-class="w-70per" @click="handleQuery">查询</wd-button>
+              <wd-button type="info" @click="handleResetQuery">重置</wd-button>
+              <wd-button @click="handleQuery">查询</wd-button>
             </view>
           </view>
         </wd-drop-menu-item>
       </wd-drop-menu>
     </view>
 
-    <!-- 用户卡片 -->
-    <wd-card v-for="item in pageData" :key="item.id">
-      <template #title>
-        <view class="flex-between">
-          <view class="flex-center">
-            <wd-img :width="50" :height="50" round :src="item.avatar" />
-            <view class="ml-2">
-              <view class="font-bold">
-                {{ item.nickname }}
-                <wd-icon v-if="item.gender == 1" name="gender-male" class="color-#4D80F0" />
-                <wd-icon v-else-if="item.gender == 2" name="gender-female" class="color-#FA4350" />
+    <!-- 数据列表 -->
+    <view class="data-container">
+      <wd-card v-for="item in pageData" :key="item.id">
+        <template #title>
+          <view class="flex-between">
+            <view class="flex-center">
+              <wd-img :width="50" :height="50" round :src="item.avatar" />
+              <view class="ml-2">
+                <view class="font-bold">
+                  {{ item.nickname }}
+                  <wd-icon v-if="item.gender == 1" name="gender-male" class="color-#4D80F0" />
+                  <wd-icon
+                    v-else-if="item.gender == 2"
+                    name="gender-female"
+                    class="color-#FA4350"
+                  />
+                </view>
+                <view class="mt-1"><wd-text :text="item.deptName" size="12px" /></view>
               </view>
-              <view class="mt-1"><wd-text :text="item.deptName" size="12px" /></view>
+            </view>
+            <view>
+              <wd-tag v-if="item.status === 1" type="success" plain>正常</wd-tag>
+              <wd-tag v-else-if="item.status === 0" plain>禁用</wd-tag>
             </view>
           </view>
-          <view>
-            <wd-tag v-if="item.status === 1" type="success" plain>正常</wd-tag>
-            <wd-tag v-else-if="item.status === 0" plain>禁用</wd-tag>
+        </template>
+
+        <wd-cell-group>
+          <wd-cell title="用户名" :value="item.username" icon="user" />
+          <wd-cell title="角色" :value="item.roleNames" icon="usergroup" />
+          <wd-cell title="手机号码" :value="item.mobile" icon="mobile" />
+          <wd-cell title="邮箱" :value="item.email" icon="mail" />
+        </wd-cell-group>
+
+        <template #footer>
+          <view class="flex-between">
+            <view class="text-left">
+              <wd-text text="创建时间：" size="small" class="font-bold" />
+              <wd-text :text="item.createTime" size="small" />
+            </view>
+            <view class="text-right">
+              <wd-button
+                type="primary"
+                size="small"
+                plain
+                :v-has-perm="'sys:user:edit'"
+                @click="handleOpenDialog(item.id)"
+              >
+                编辑
+              </wd-button>
+              &nbsp;
+              <wd-button
+                type="error"
+                size="small"
+                plain
+                :v-has-perm="'sys:user:delete'"
+                @click="handleDelete(item.id)"
+              >
+                删除
+              </wd-button>
+            </view>
           </view>
-        </view>
-      </template>
+        </template>
+      </wd-card>
 
-      <wd-cell-group>
-        <wd-cell title="用户名" :value="item.username" icon="user" />
-        <wd-cell title="角色" :value="item.roleNames" icon="usergroup" />
-        <wd-cell title="手机号码" :value="item.mobile" icon="mobile" />
-        <wd-cell title="邮箱" :value="item.email" icon="mail" />
-      </wd-cell-group>
+      <wd-loadmore v-if="total > 0" :state="loadMoreState" @reload="loadmore" />
+      <wd-status-tip v-else-if="total == 0" image="search" tip="当前搜索无结果" />
+    </view>
 
-      <template #footer>
-        <view class="flex-between">
-          <view class="text-left">
-            <wd-text text="创建时间：" size="small" class="font-bold" />
-            <wd-text :text="item.createTime" size="small" />
-          </view>
-          <view class="text-right">
-            <wd-button type="primary" size="small" plain @click="handleOpenDialog(item.id)">
-              编辑
-            </wd-button>
-            &nbsp;
-            <wd-button type="error" size="small" plain @click="handleDelete(item.id)">
-              删除
-            </wd-button>
-          </view>
-        </view>
-      </template>
-    </wd-card>
-
-    <wd-loadmore v-if="total > 0" :state="loadMoreState" @reload="loadmore" />
-    <wd-status-tip v-else-if="total == 0" image="search" tip="当前搜索无结果" />
-    <wd-message-box />
-
-    <!-- 编辑弹窗 -->
+    <!-- 弹窗表单 -->
     <wd-popup v-model="dialog.visible" position="bottom" @close="hancleCloseDialog">
       <wd-form ref="userFormRef" :model="formData" :rules="rules">
         <wd-cell-group border>
@@ -113,17 +133,21 @@
           </wd-cell>
         </wd-cell-group>
       </wd-form>
-      <view class="footer">
+      <view class="popup-footer">
         <wd-button type="primary" block @click="handleSubmit">提交</wd-button>
       </view>
     </wd-popup>
 
+    <!-- 悬浮操作按钮 -->
     <wd-fab
+      :v-has-perm="'sys:user:add'"
       position="left-bottom"
       :expandable="false"
-      customStyle="width: 1rem; height: 1rem; line-height: 1rem;z-index:9"
+      custom-style="z-index: 9"
       @click="handleOpenDialog"
     />
+
+    <wd-message-box />
   </view>
 </template>
 
@@ -368,24 +392,38 @@ onLoad(() => {
 });
 </script>
 
+<script lang="ts">
+// https://wot-design-uni.pages.dev/guide/common-problems#%E5%B0%8F%E7%A8%8B%E5%BA%8F%E6%A0%B7%E5%BC%8F%E9%9A%94%E7%A6%BB
+export default {
+  options: {
+    styleIsolation: "shared",
+  },
+};
+</script>
+
 <style lang="scss" scoped>
-.user {
+.user-container {
   :deep(.wd-cell__wrapper) {
     padding: 4rpx 0;
   }
+
   :deep(.wd-cell) {
     padding-right: 10rpx;
     background: #f8f8f8;
   }
+
   :deep(.wd-fab__trigger) {
     width: 80rpx !important;
     height: 80rpx !important;
   }
-  :deep(.w-20per) {
-    width: 20%;
+
+  .filter-container {
+    padding: 10rpx;
+    background: #fff;
   }
-  :deep(.w-70per) {
-    width: 70%;
+
+  .data-container {
+    margin-top: 20rpx;
   }
 }
 </style>
diff --git a/src/static/icons/dept.png b/src/static/icons/dept.png
deleted file mode 100644
index 9851fbbe53399a71338814e44ea8c5a7785aeb5b..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 4710
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
bN~M}HyvC)or6Xw<M-cVP+G?dLmcjo6Qz)l<

diff --git a/src/static/icons/menu.png b/src/static/icons/menu.png
deleted file mode 100644
index 24c20eec9797ed6e90bc8ceb8dbba528890331db..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3868
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

diff --git a/src/static/icons/monitor.png b/src/static/icons/monitor.png
deleted file mode 100644
index 61004b2fccc2f9288f9dfe2444578712482201c8..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3876
zcmX|Ec|6qJ_y5e8$r#(jSVMzitRW;z#t^2$7#T+PeH&Rqi5eOavR8!2zVG|K%aTIK
zV<&kmQ6V9Gr|0#1{r<T3p7*);-1ENok8|Jm8D3w98O{p_0Du{%t3{xV@BTK}8CqXr
zTKa}IfP4r#SfF&6Zw&xg=5SgXx9?kiOKZE!*T>Q4bWaDvX^V=AzQ@<DxTfu5_exp_
zi%Sz}dEa@81x(@#fdj7FN$X?v`Vgbg0W|rO?kmK1*7!5fcd<<0^;4S1zBz37Z4Eak
zPo-VinSGjBud?%1WxHx;ZfLWV7{|}mQ}@t*)Lw38tnsr%#1h@1g<Fu1hwH&*xj~!g
zVDR$6)m<NRWRI!a@pk6Ns?+l<qRZrCj|b5jUW*1Ji$%_5!5K-nN&^dPPHu@Q&_Q%+
z;Rq$28x{}ht7?2^>fkLPLhzFQyimr8Ge^eAmwNQ>ajW$j5`j5eB78%pn9EcdL~T#f
zr?)!U_MrUH2$AT$yF6ko(=vU%l?{oA;{NgQwKbzt!+_`S!$-RK5CAL#X-ZQabIRCs
zZ}GW8U7G`4ZTfRkJHh+RKYR|GtOtjHdL&S*31ek(PVJEoi3|7TXVktsJmJE`QjgYI
z5|?qoKdfcczQ?5~(Ruql@H5&7(PrVpqeP(2X1}+b>mPoxO=PFV8<`#CuHB(cXhTzX
z*cAVIz)ye<5HypRfsRm_AxU$hbbGUY(R0_4K*XOO%&-N@DFboAnU=1)Vjhn8!lyX8
zG{enN&RiD->ToxXnq^MmhDSwW&%fScQ3Tt!4*!U<VUi98%Zgh!>)S$LKcl&ixD~I8
z%Lp+0?@tdnLm{5kxbQYcVupgtT?ho%uuvMdmJ8=oEUB#n5t1fCb}}e<D6eLT8K#_U
z;q2e#9u2N}OO*OcHA;Z5!0Wjd)YYj*5gZakWTWk@B3|x=B+)?_L!#xDy$j&(<`{E2
z$XFxch|BLG-kPkr%!cAtQ`L<U(vrX<4>KB>9T*T_1Tv2}dyfpQ#kfdN>aRPCv-OXt
z+G27Xre<6uAjH@wxrL$VSOU*nRY+MlYj$dur4<anoz7DL4*7n=+Ntvk3NG1M%!5j5
zfeXpOIf^knj_*Mo8(8T6#apZye-UssJyoa~j*^Q&mb6O_iGw<NwMK#%mNn5b+_&}>
ze#Rh1Gl!7K3{@?=W8u(Jt#ep3fWhWR$Qcn9@XP%jiHGdu9|gdBd&BThj(h2anZ@=<
z0M&o*A}^b6upO^P`587{3#5c42oP#zOlH1+ICii!@U26krp5O;i7@)=xeKI2$YwO?
zPp;SL{U7J|HuKISgT1^CyzL^@9~}kxZmeDbZeHgH;$`?m@b0eHFb8eozy(=MJ-&DV
zBRIL*_UFRU2!wJ0fQ9PCSf$E8HAr;?v*iG=J|CfmuiIRwgqX*w1@FZIlaf^~0Nr6+
zzNTkF@vLvu8Q?vxJ|5(GeB1PiZ&*oGo;bi}VD-rii%%51ZT0nJt!3URIR=PrRV~e#
z<Ic!`owR`lV}!sL6w$<-elH{lrA9~49~}MgIYxc!kM;;JPM;oFds}x=!|=swSCR1E
zLD{u6jf#^(2#Vk35=X>Lmn6W3Kv)(11JbLOR<4s_q?k78?m)$`aXv{<j4BYXjJz5~
z0;mkS`Nsyge3V-x^AyekwrggO)sFJ^^@3lD>^=(6uOb26?X!oUPwlOV%VO1*6_58C
zg`9Gk!&ca-t$xQ}E1h8&*BQxQ#^02cVX)UOt^w4S)^Fp=xB9W{N<Iu#fNsyZY^<ST
z$ApVZ)1N1iq9UrrX$d!J3=#<zswN#jv5}GWEJv>r+A4J7`8tb>L2nURw;H7aWgCse
zQiYsW__8}%wgoCs75o)SzxIOkYAN+f+Vg3(W^F}Tqk17#q*3V5XZhkP(L0!}pdDw~
zD&d@}_04;;CyVisAHQCQZxhriA>BQKw)d#&kAKsPRyh+RJ-Ab!<R&nDydAR%y!{x#
zHkQaTX+LGmK6z-j6}buE$h)XjZ(sa?I+}G+pj1$xZce&%kR>+JJ7!eFod45aZk%`0
z3x1T9>TzM@IfFdkdgc5<Gu<itq+zj9hotx*95HD+jh!4eSW(V*yT9Uw+%T8vf>(jN
z9cp{=ALjIzn?WP1%w4|74ZZr85j20EX7}f}igz7YD<UZ>5k2`1E=EKOKFerGqmV^g
zm?3C6Yi&=pwX@K;&o50f{A}VT@FOm^_j6p4;)|l`qq`O+(_L4rVqA|X(QZxk=R_<v
zm>&fBQ9SqgLpQ031Nu@!12p#Rd)%0te@%pUrg>-aH42Uf*br2b%?M8H|16MK(6x)j
zzJ57Q46sf~710Vcl^mIyswnxq$FdI!-WXUG#LPW1AhVY81TpmcK6z6z_Qmg!xXnvb
z%xg;vJGq1q841bC0xC%eB<tmoz|!eXRMI6dRB3^2*FTfHR6C13DfoW!VOYtm!P*ia
z%cFL~Wqr%GAaJNRhLI}KV~=DtX-bdp0ogvByfohkLjO^U(i2OS`mMO)?^UXVapyY7
zPcWa;n7%HWZ63Be34TU*;S=#&Vp{cwTHNDUIAwQDE%}qwRT39HjM%Ya=uj!m;Z{V;
zo)XqA{z%#n$3mkLqN*ieM(C1^qo9W3>BB$C+>}JYs_Zp{d`IyASs)?byR;J_96_<t
zNCY#ivsl`^+kl_YrhSnYk@7t9Q6o=|CkH0H$9VXM@>t1s^!S3e4m37f1^%vu&xX^a
z!J~{0HM`!D&ul|9=)6PRIOM-RxZa#5txPXwj7eH~e?A0x!FLxW8xM5<5-dbnQm|LV
zQNF(l-EXncI7PhDSC!$w&C{%GVR1*@*~iAla?j3Ed8slI(wOWRK3u5jr=(BnWt^{$
zChyqo@F+2mZ#Y5(E6zIZEqg<HPR2K$rw48H$?cmZfFUY@v;3XaR5tiOSnOrv0s$Oo
z=^;`~or+sn#79_Xa8dJEuE*m7rt%-os}khD4XP2hqmr=12*)h%5Fr<gk_~Y>O}1}F
zq{cqwVb?9`?j<UTe0TPp13dX2S`%HWnd4^>Px18ot=Qr#ydq|g8Hu__!=1&olcU*4
zM?>8Q8(dc$A3&p-K#R1<X(6SLJ?nu5#oqpJ@5T$m7@W>ICcF3RJ0M+}cs%)H9FGLr
zlt@FU(K@01`Nq;~CsRk6lel<jw_m`-mr_?o{=SjM`dl)hbK+?(j>$|*GVd9A@cH5&
zdr$>))vY)8Z(bbwc>sov@wC?RT{^?9I29|8l0Uk)-K0};{-Z2I*^M8z3{{0k=}L+R
zo~9{=X6uu=@n@*1jcYz5yZ+Nn1#A45yZI|TPT56wcR=Cf77-hF*sS@$Edc~un07q<
zhx8$9G4;N$a^w9Cc0MZo_C_drv-8gmxeVGWU0=p1mx%9rdUH~4`wC&q{nKAR^_V$v
znLeyEE7i+4vfL0htb=yzq?zkAOghlRO!CJ!{w+QJ-Ip-&r#JW7E4|>_tk*HA0Oj+p
z$J5o?l`A6gzyCoxGs31EFJG-FkOI21!!D~k89f>k!G#|i)H3+E2wx$sZW?HYkALN1
zI8D<|$SWHjuQE~3k6atf`B)VAUHpqa>6HTS@Fv@8!#UcM2Gr{9$nsbliHaJQy|fx$
zA2}USjLUtZEitU=0(9r<c$NA?l^%rq3-iJuD2u}9jT6X)uYwjh223M?chCJcrONtq
zP9l(fv&L}pHMsPFt}_m#>l|wMs0b{(DhOoP9C>1$p|&ivs{ikt&Ve?(TR8$iWNmff
z-g11efQnF`0~e@;=!6_hR4jlXnk;4F;U8VE`H!nm_5Pa~BL%OY(;1-eO=WaI0vPVh
zMK%&VvD|C!J}bt4PodZsPq}P#2EzyG%c(>z6#qkqAO$hG@pH7Zhem^!epYh;D3|?9
zW~=!WvcS?IQ*%~B@!$_4`%CxwaAbMVCMTu+ZY81J&+fuL^lVT>#Mx|vJ@))*`Js5F
z0Q^1>3rVg1Ad=MVF#7AbFR0e3#sgq8x(lnxS(~+HoA0~x?F{%!GQrirdA@z~9TIJY
zc=OJGybtnj@<u^Q+!~Wl28IdFM;FW82vY1WY(ES7nL}8wGL@oQ;4^ff(YsSC`*k%F
z{sHn}W6fYR2RdSj<vB_|;3GPO4vq<SfU@jOtxV~aFy8p&g#n@Qh8gHx5D<J56U+-e
z^JJ~H72P_UqEBDV`QP#g@MX-u{>7o~monO4gLSeNw-%WYL-rkNe_<F6jxf<GyC*BU
zych^InLeET@&CBpxn9N24n(W(^)RF<T4qq42y_I%_#p6DaP>(AO~^OX<S9al9(g|t
z!(%B03Q>h@fuN2wX;-9xDgOqMj&A~we|Kd@L<u!C>HPX;#j8e>o#q!FiuMyJ<0E#$
zs2xKHtD(b&$dqCrc{d*l$<nRWk0*BxzSuDaaWaM$J#O!`scnt7=vwRVNGtK*@^HN`
zh2p+mxs%|2&fH>OMnL0h15BXr{RFwv<+uB!hlQJ)4x-WeS_Hl`df(Au`4UNC_pj1-
zcJ&fQap?Y=?Ash9D>092tymuM^lvM9Q9`+m>ac4dyDn|pB0pDuwRw?U_QBPrt}JOT
z?Co=SQm0`P3&BKr?k)5K?Sgx=XIwem61Yvz<JzzPBxBtOTTJf)9XAx`R#VDeF_0S+
z_$CC2VoVxx$>s;h?Ol#_@q^?Ruk;tsn6#@*eW8Lga&g?NyTuga;YB{%5>ASgn3}(O
zVVRM&Ir6YPur^g9VGKrKZpa-2ak4kGP&NW37N9JCER_Wc?`{U}%MRFyx8La9SpO*(
zf_mWOcTsw$puHX)k=01vn2BfxgYosVlnryFbHJOf9P=_k&Q9sc()PVtI2DpreeoTP
zaCt1W=lUJi_5)uyAM2Sh&47k`&d-!V_71g-8Pu(D`N8xRZrUI1Uu9o6VS_x1<SM#L
zEywbd=%!~NwM1f1u^e2TvCPOHm}W$!V9O6CI0C%S8eIBH*Pi=wID?zTYJOXY>YAVo
z#}sOh2EdQ6B{S_;OaF?<{EczbJ2i=x8-H9^!}>VpX0V)7MmnVP&%Oj}|B$q%s1fOe
Yk*10q`K%{LXy0A{cU@nr6l)#wKM2<MhyVZp

diff --git a/src/static/icons/more.png b/src/static/icons/more.png
deleted file mode 100644
index 54a7e903edff84b330367228825adc063bf24df9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 5248
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