适配 element plus 最新版本

src/layout/components/Navbar.vue

@@ -23,7 +23,7 @@
         </el-tooltip>
       </template>
       <div class="avatar-container">
-        <el-dropdown class="right-menu-item hover-effect" trigger="click">
+        <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
           <div class="avatar-wrapper">
             <img :src="getters.avatar" class="user-avatar" />
             <el-icon><caret-bottom /></el-icon>
@@ -33,10 +33,10 @@
               <router-link to="/user/profile">
                 <el-dropdown-item>个人中心</el-dropdown-item>
               </router-link>
-              <el-dropdown-item @click="setLayout">
+              <el-dropdown-item command="setLayout">
                 <span>布局设置</span>
               </el-dropdown-item>
-              <el-dropdown-item divided @click="logout">
+              <el-dropdown-item divided command="logout">
                 <span>退出登录</span>
               </el-dropdown-item>
             </el-dropdown-menu>
@@ -59,12 +59,26 @@ import RuoYiGit from '@/components/RuoYi/Git'
 import RuoYiDoc from '@/components/RuoYi/Doc'
 
 const store = useStore();
+const router = useRouter();
 const getters = computed(() => store.getters);
 
 function toggleSideBar() {
   store.dispatch('app/toggleSideBar')
 }
 
+function handleCommand(command) {
+  switch (command) {
+    case "setLayout":
+      setLayout();
+      break;
+    case "logout":
+      logout();
+      break;
+    default:
+      break;
+  }
+}
+
 function logout() {
   ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
     confirmButtonText: '确定',

src/layout/components/Settings/index.vue

@@ -28,7 +28,7 @@
     <div class="drawer-item">
       <span>主题颜色</span>
       <span class="comp-style">
-        <el-color-picker size="small" v-model="theme" :predefine="predefineColors" @change="themeChange"/>
+        <el-color-picker v-model="theme" :predefine="predefineColors" @change="themeChange"/>
       </span>
     </div>
     <el-divider />
@@ -72,8 +72,8 @@
 
     <el-divider />
 
-    <el-button size="small" type="primary" plain icon="DocumentAdd" @click="saveSetting">保存配置</el-button>
-    <el-button size="small" plain icon="Refresh" @click="resetSetting">重置配置</el-button>
+    <el-button type="primary" plain icon="DocumentAdd" @click="saveSetting">保存配置</el-button>
+    <el-button plain icon="Refresh" @click="resetSetting">重置配置</el-button>
   </el-drawer>
 
 </template>