diff --git a/src/views/account/settings.vue b/src/views/account/settings.vue
index 6acec7e0..5f51d448 100644
--- a/src/views/account/settings.vue
+++ b/src/views/account/settings.vue
@@ -5,6 +5,7 @@ import BaseInfo from './components/base-info.vue';
 import ResetPasswd from './components/reset-passwd.vue';
 import StyleLayout from './components/style-layout.vue';
 import { useRoute } from 'vue-router';
+import { hasRoles } from '@/plugins/auth-user';
 import useAppStore from '@/store/modules/app';
 import useI18n from '@/hooks/useI18n';
 const appStore = useAppStore();
@@ -45,14 +46,14 @@ onActivated(() => {
         >
           <ResetPasswd></ResetPasswd>
         </a-tab-pane>
-        <div v-roles:has="['admin']">
-          <a-tab-pane
-            key="style-layout"
-            :tab="t('views.account.settings.styleLayout')"
-          >
-            <StyleLayout></StyleLayout>
-          </a-tab-pane>
-        </div>
+
+        <a-tab-pane
+          key="style-layout"
+          :tab="t('views.account.settings.styleLayout')"
+          v-if="hasRoles(['admin'])"
+        >
+          <StyleLayout></StyleLayout>
+        </a-tab-pane>
       </a-tabs>
     </a-card>
   </PageContainer>