From c382d632661d9a9571f5c3675970b41ce5e4fd00 Mon Sep 17 00:00:00 2001
From: xingyu <xingyu4j@vip.qq.com>
Date: Wed, 6 Sep 2023 16:59:22 +0800
Subject: [PATCH] fix: unocss eslint

---
 .../Application/src/AppLocalePicker.vue       |  2 +-
 .../Application/src/AppSizePicker.vue         |  2 +-
 src/components/CardList/src/CardList.vue      |  2 +-
 .../CodeEditor/src/codemirror/CodeMirror.vue  |  2 +-
 .../VFormDesign/components/LayoutItem.vue     |  2 +-
 .../modules/FormComponentPanel.vue            |  2 +-
 src/components/Icon/src/Icon.vue              |  2 +-
 src/components/Icon/src/IconPicker.vue        |  8 +++----
 .../SimpleMenu/src/SimpleSubMenu.vue          |  4 ++--
 .../Table/src/components/TableImg.vue         |  2 +-
 .../Tree/src/components/TreeHeader.vue        |  4 ++--
 src/components/Upload/src/data.tsx            |  2 +-
 src/components/Verifition/src/Verify.vue      |  6 +++--
 .../Verifition/src/Verify/VerifySlide.vue     |  2 +-
 src/views/base/about/index.vue                |  4 ++--
 src/views/base/lock/LockPage.vue              | 18 +++++++-------
 src/views/base/login/ForgetPasswordForm.vue   |  2 +-
 src/views/base/login/Login.vue                | 22 ++++++++---------
 src/views/base/login/LoginForm.vue            |  6 ++---
 src/views/base/login/LoginFormTitle.vue       |  2 +-
 src/views/base/login/MobileForm.vue           |  2 +-
 src/views/base/login/QrCodeForm.vue           |  4 ++--
 src/views/base/login/RegisterForm.vue         |  4 ++--
 src/views/base/login/SSOForm.vue              |  6 ++---
 src/views/base/login/sso.vue                  | 24 +++++++++----------
 src/views/bpm/oa/leave/create.vue             |  2 +-
 .../analysis/components/GrowCard.vue          |  6 ++---
 src/views/dashboard/analysis/index.vue        | 10 ++++----
 .../workbench/components/ProjectCard.vue      |  8 +++----
 .../workbench/components/WorkbenchHeader.vue  | 10 ++++----
 src/views/dashboard/workbench/index.vue       | 10 ++++----
 src/views/infra/build/index.vue               |  2 +-
 .../infra/codegen/components/FinishForm.vue   |  2 +-
 .../infra/codegen/components/PreviewModal.vue |  2 +-
 src/views/infra/redis/index.vue               |  6 ++---
 src/views/infra/webSocket/index.vue           | 10 ++++----
 src/views/mp/components/WxNews/index.vue      |  2 +-
 src/views/mp/components/WxVideoPlay/index.vue |  6 +++--
 src/views/pay/submit/index.vue                | 12 +++++-----
 src/views/system/role/RoleMenuModal.vue       |  5 ++--
 40 files changed, 116 insertions(+), 113 deletions(-)

diff --git a/src/components/Application/src/AppLocalePicker.vue b/src/components/Application/src/AppLocalePicker.vue
index 63dd8fbb9..d9ae5e6ca 100644
--- a/src/components/Application/src/AppLocalePicker.vue
+++ b/src/components/Application/src/AppLocalePicker.vue
@@ -57,7 +57,7 @@ function handleMenuEvent(menu: DropMenu) {
     overlay-class-name="app-locale-picker-overlay"
     @menu-event="handleMenuEvent"
   >
-    <span class="cursor-pointer flex items-center">
+    <span class="flex cursor-pointer items-center">
       <Icon icon="ion:language" />
       <span v-if="showText" class="ml-1">{{ getLocaleText }}</span>
     </span>
diff --git a/src/components/Application/src/AppSizePicker.vue b/src/components/Application/src/AppSizePicker.vue
index ce9b3d9f7..fc9103f05 100644
--- a/src/components/Application/src/AppSizePicker.vue
+++ b/src/components/Application/src/AppSizePicker.vue
@@ -53,7 +53,7 @@ function handleMenuEvent(menu: DropMenu) {
     overlay-class-name="app-locale-picker-overlay"
     @menu-event="handleMenuEvent"
   >
-    <span class="cursor-pointer flex items-center">
+    <span class="flex cursor-pointer items-center">
       <Icon icon="mdi:format-size" />
       <span v-if="showText" class="ml-1">{{ getSizeText }}</span>
     </span>
diff --git a/src/components/CardList/src/CardList.vue b/src/components/CardList/src/CardList.vue
index cff782651..3d26a4186 100644
--- a/src/components/CardList/src/CardList.vue
+++ b/src/components/CardList/src/CardList.vue
@@ -100,7 +100,7 @@ async function handleDelete(id) {
 
 <template>
   <div class="p-2">
-    <div class="p-4 mb-2">
+    <div class="mb-2 p-4">
       <BasicForm @register="registerForm" />
     </div>
     <div class="p-2">
diff --git a/src/components/CodeEditor/src/codemirror/CodeMirror.vue b/src/components/CodeEditor/src/codemirror/CodeMirror.vue
index 814cbb445..e568b0d7e 100644
--- a/src/components/CodeEditor/src/codemirror/CodeMirror.vue
+++ b/src/components/CodeEditor/src/codemirror/CodeMirror.vue
@@ -107,5 +107,5 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div ref="el" class="relative !h-full w-full overflow-hidden" />
+  <div ref="el" class="relative w-full overflow-hidden !h-full" />
 </template>
diff --git a/src/components/FormDesign/src/components/VFormDesign/components/LayoutItem.vue b/src/components/FormDesign/src/components/VFormDesign/components/LayoutItem.vue
index 345709c0b..76dcaad88 100644
--- a/src/components/FormDesign/src/components/VFormDesign/components/LayoutItem.vue
+++ b/src/components/FormDesign/src/components/VFormDesign/components/LayoutItem.vue
@@ -76,7 +76,7 @@ export default defineComponent({
                 handle: '.drag-move',
               }"
               v-model="colItem.children"
-              class="list-main draggable-box"
+              class="draggable-box list-main"
               :component-data="{ name: 'list', tag: 'div', type: 'transition-group' }"
               item-key="key"
               @start="$emit('dragStart', $event, colItem.children)"
diff --git a/src/components/FormDesign/src/components/VFormDesign/modules/FormComponentPanel.vue b/src/components/FormDesign/src/components/VFormDesign/modules/FormComponentPanel.vue
index f9a593c81..ef3f2d479 100644
--- a/src/components/FormDesign/src/components/VFormDesign/modules/FormComponentPanel.vue
+++ b/src/components/FormDesign/src/components/VFormDesign/modules/FormComponentPanel.vue
@@ -60,7 +60,7 @@ export default defineComponent({
 </script>
 
 <template>
-  <div class="form-panel v-form-container">
+  <div class="v-form-container form-panel">
     <Empty
       v-show="formConfig.schemas.length === 0"
       class="empty-text"
diff --git a/src/components/Icon/src/Icon.vue b/src/components/Icon/src/Icon.vue
index abbbc1aee..528667a04 100644
--- a/src/components/Icon/src/Icon.vue
+++ b/src/components/Icon/src/Icon.vue
@@ -77,7 +77,7 @@ onMounted(update)
 
 <template>
   <SvgIcon v-if="isSvgIcon" :size="size" :name="getSvgIcon" class="anticon" :class="[$attrs.class]" :spin="spin" />
-  <span v-else ref="elRef" class="app-iconify anticon" :class="[$attrs.class, spin && 'app-iconify-spin']" :style="getWrapStyle" />
+  <span v-else ref="elRef" class="anticon app-iconify" :class="[$attrs.class, spin && 'app-iconify-spin']" :style="getWrapStyle" />
 </template>
 
 <style lang="less">
diff --git a/src/components/Icon/src/IconPicker.vue b/src/components/Icon/src/IconPicker.vue
index e45d967d1..0d97d8ef5 100644
--- a/src/components/Icon/src/IconPicker.vue
+++ b/src/components/Icon/src/IconPicker.vue
@@ -113,13 +113,13 @@ function handleSearchChange(e: ChangeEvent) {
 
         <template #content>
           <div v-if="getPaginationList.length">
-            <ScrollContainer class="border border-solid border-t-0">
+            <ScrollContainer class="border border-t-0 border-solid">
               <ul class="flex flex-wrap px-2">
                 <li
                   v-for="icon in getPaginationList"
                   :key="icon"
                   :class="currentSelect === icon ? 'border border-primary' : ''"
-                  class="p-2 w-1/8 cursor-pointer mr-1 mt-1 flex justify-center items-center border border-solid hover:border-primary"
+                  class="mr-1 mt-1 w-1/8 flex cursor-pointer items-center justify-center border border-solid p-2 hover:border-primary"
                   :title="icon"
                   @click="handleClick(icon)"
                 >
@@ -129,7 +129,7 @@ function handleSearchChange(e: ChangeEvent) {
                 </li>
               </ul>
             </ScrollContainer>
-            <div v-if="getTotal >= pageSize" class="flex py-2 items-center justify-center">
+            <div v-if="getTotal >= pageSize" class="flex items-center justify-center py-2">
               <Pagination show-less-items size="small" :page-size="pageSize" :total="getTotal" @change="handlePageChange" />
             </div>
           </div>
@@ -140,7 +140,7 @@ function handleSearchChange(e: ChangeEvent) {
           </template>
         </template>
 
-        <span v-if="isSvgMode && currentSelect" class="cursor-pointer px-2 py-1 flex items-center">
+        <span v-if="isSvgMode && currentSelect" class="flex cursor-pointer items-center px-2 py-1">
           <SvgIcon :name="currentSelect" />
         </span>
         <Icon v-else :icon="currentSelect || 'ion:apps-outline'" class="cursor-pointer px-2 py-1" />
diff --git a/src/components/SimpleMenu/src/SimpleSubMenu.vue b/src/components/SimpleMenu/src/SimpleSubMenu.vue
index 34e50bbe6..570937c2e 100644
--- a/src/components/SimpleMenu/src/SimpleSubMenu.vue
+++ b/src/components/SimpleMenu/src/SimpleSubMenu.vue
@@ -55,7 +55,7 @@ function menuHasChildren(menuTreeItem: Menu): boolean {
 <template>
   <MenuItem v-if="!menuHasChildren(item) && getShowMenu" :name="item.path" v-bind="$props" :class="getLevelClass">
     <Icon v-if="getIcon" :icon="getIcon" :size="16" />
-    <div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-1 collapse-title">
+    <div v-if="collapsedShowTitle && getIsCollapseParent" class="collapse-title mt-1">
       {{ getI18nName }}
     </div>
     <template #title>
@@ -74,7 +74,7 @@ function menuHasChildren(menuTreeItem: Menu): boolean {
     <template #title>
       <Icon v-if="getIcon" :icon="getIcon" :size="16" />
 
-      <div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-2 collapse-title">
+      <div v-if="collapsedShowTitle && getIsCollapseParent" class="collapse-title mt-2">
         {{ getI18nName }}
       </div>
 
diff --git a/src/components/Table/src/components/TableImg.vue b/src/components/Table/src/components/TableImg.vue
index e06bad7e8..1a83bb140 100644
--- a/src/components/Table/src/components/TableImg.vue
+++ b/src/components/Table/src/components/TableImg.vue
@@ -35,7 +35,7 @@ const { prefixCls } = useDesign('basic-table-img')
 </script>
 
 <template>
-  <div v-if="imgList && imgList.length" :class="prefixCls" class="flex items-center mx-auto" :style="getWrapStyle">
+  <div v-if="imgList && imgList.length" :class="prefixCls" class="mx-auto flex items-center" :style="getWrapStyle">
     <Badge v-if="simpleShow" :count="!showBadge || imgList.length === 1 ? 0 : imgList.length">
       <div class="img-div">
         <ImagePreviewGroup>
diff --git a/src/components/Tree/src/components/TreeHeader.vue b/src/components/Tree/src/components/TreeHeader.vue
index 4e8c77969..aa472f176 100644
--- a/src/components/Tree/src/components/TreeHeader.vue
+++ b/src/components/Tree/src/components/TreeHeader.vue
@@ -155,12 +155,12 @@ watch(
 </script>
 
 <template>
-  <div :class="bem()" class="flex px-2 py-1.5 items-center">
+  <div :class="bem()" class="flex items-center px-2 py-1.5">
     <slot v-if="slots.headerTitle" name="headerTitle" />
     <BasicTitle v-if="!slots.headerTitle && title" :help-message="helpMessage">
       {{ title }}
     </BasicTitle>
-    <div v-if="search || toolbar" class="flex items-center flex-1 cursor-pointer justify-self-stretch">
+    <div v-if="search || toolbar" class="flex flex-1 cursor-pointer items-center justify-self-stretch">
       <div v-if="search" :class="getInputSearchCls">
         <InputSearch v-model:value="searchValue" :placeholder="t('common.searchText')" allow-clear />
       </div>
diff --git a/src/components/Upload/src/data.tsx b/src/components/Upload/src/data.tsx
index 63f8a7e34..bc2bdc1cf 100644
--- a/src/components/Upload/src/data.tsx
+++ b/src/components/Upload/src/data.tsx
@@ -40,7 +40,7 @@ export function createTableColumns(): BasicColumn[] {
 
         return (
           <span>
-            <p class="truncate mb-1" title={text}>
+            <p class="mb-1 truncate" title={text}>
               {text}
             </p>
             <Progress percent={percent} size="small" status={status} />
diff --git a/src/components/Verifition/src/Verify.vue b/src/components/Verifition/src/Verify.vue
index b0c7b12cc..954089a09 100644
--- a/src/components/Verifition/src/Verify.vue
+++ b/src/components/Verifition/src/Verify.vue
@@ -121,9 +121,11 @@ export default {
       </div>
       <div class="verifybox-bottom" :style="{ padding: mode === 'pop' ? '10px' : '0' }">
         <!-- 验证码容器 -->
-        <component :is="componentType" v-if="componentType" ref="instance" :captcha-type="captchaType" :type="verifyType"
+        <component
+          :is="componentType" v-if="componentType" ref="instance" :captcha-type="captchaType" :type="verifyType"
           :figure="figure" :arith="arith" :mode="mode" :v-space="vSpace" :explain="explain" :img-size="imgSize"
-          :block-size="blockSize" :bar-size="barSize" />
+          :block-size="blockSize" :bar-size="barSize"
+        />
       </div>
     </div>
   </div>
diff --git a/src/components/Verifition/src/Verify/VerifySlide.vue b/src/components/Verifition/src/Verify/VerifySlide.vue
index b8fdf9a97..74301842e 100644
--- a/src/components/Verifition/src/Verify/VerifySlide.vue
+++ b/src/components/Verifition/src/Verify/VerifySlide.vue
@@ -344,7 +344,7 @@ async function getPictrue() {
           @touchstart="start"
           @mousedown="start"
         >
-          <i class="verify-icon iconfont" :class="[iconClass]" :style="{ color: iconColor }" />
+          <i class="iconfont verify-icon" :class="[iconClass]" :style="{ color: iconColor }" />
           <div
             v-if="type === '2'"
             class="verify-sub-block"
diff --git a/src/views/base/about/index.vue b/src/views/base/about/index.vue
index 3e0e6fae3..8f35013c6 100644
--- a/src/views/base/about/index.vue
+++ b/src/views/base/about/index.vue
@@ -91,7 +91,7 @@ const [infoRegister] = useDescription({
 <template>
   <PageWrapper title="关于">
     <template #headerContent>
-      <div class="flex justify-between items-center">
+      <div class="flex items-center justify-between">
         <span class="flex-1">
           <a :href="GITHUB_URL" target="_blank">{{ name }}</a>
           基于Vue3.0、Vite、 Ant-Design-Vue 、TypeScript
@@ -101,7 +101,7 @@ const [infoRegister] = useDescription({
       </div>
     </template>
     <Description class="enter-y" @register="infoRegister" />
-    <Description class="my-4 enter-y" @register="register" />
+    <Description class="enter-y my-4" @register="register" />
     <Description class="enter-y" @register="registerDev" />
   </PageWrapper>
 </template>
diff --git a/src/views/base/lock/LockPage.vue b/src/views/base/lock/LockPage.vue
index b337f51a3..74e8b5069 100644
--- a/src/views/base/lock/LockPage.vue
+++ b/src/views/base/lock/LockPage.vue
@@ -57,21 +57,21 @@ function handleShowForm(show = false) {
 </script>
 
 <template>
-  <div :class="prefixCls" class="fixed inset-0 flex h-screen w-screen bg-black items-center justify-center" @click="handleShowForm(false)">
+  <div :class="prefixCls" class="fixed inset-0 h-screen w-screen flex items-center justify-center bg-black" @click="handleShowForm(false)">
     <!-- eslint-disable max-len -->
     <div
       v-show="showDate"
       :class="`${prefixCls}__unlock`"
-      class="absolute top-0 left-1/2 flex pt-5 h-16 items-center justify-center sm:text-md xl:text-xl flex-col cursor-pointer transform translate-x-1/2"
+      class="sm:text-md absolute left-1/2 top-0 h-16 flex flex-col translate-x-1/2 transform cursor-pointer items-center justify-center pt-5 xl:text-xl"
     >
       <LockOutlined />
       <span>{{ t('sys.lock.unlock') }}</span>
     </div>
 
-    <div class="flex w-screen h-screen justify-center items-center">
-      <div :class="`${prefixCls}__hour`" class="relative mr-5 md:mr-20 w-2/5 h-2/5 md:h-4/5">
+    <div class="h-screen w-screen flex items-center justify-center">
+      <div :class="`${prefixCls}__hour`" class="relative mr-5 h-2/5 w-2/5 md:mr-20 md:h-4/5">
         <span>{{ hour }}</span>
-        <span v-show="showDate" class="meridiem absolute left-5 top-5 text-md xl:text-xl">
+        <span v-show="showDate" class="meridiem text-md absolute left-5 top-5 xl:text-xl">
           {{ meridiem }}
         </span>
       </div>
@@ -93,10 +93,10 @@ function handleShowForm(show = false) {
             {{ t('sys.lock.alert') }}
           </span>
           <div :class="`${prefixCls}-entry__footer enter-x`">
-            <a-button type="link" size="small" class="mt-2 mr-2 enter-x" :disabled="loading" @click="handleShowForm(true)">
+            <a-button type="link" size="small" class="enter-x mr-2 mt-2" :disabled="loading" @click="handleShowForm(true)">
               {{ t('common.back') }}
             </a-button>
-            <a-button type="link" size="small" class="mt-2 mr-2 enter-x" :disabled="loading" @click="goLogin">
+            <a-button type="link" size="small" class="enter-x mr-2 mt-2" :disabled="loading" @click="goLogin">
               {{ t('sys.lock.backToLogin') }}
             </a-button>
             <a-button class="mt-2" type="link" size="small" :loading="loading" @click="unLock()">
@@ -107,8 +107,8 @@ function handleShowForm(show = false) {
       </div>
     </transition>
 
-    <div class="absolute bottom-5 w-full text-gray-300 xl:text-xl 2xl:text-3xl text-center enter-y">
-      <div v-show="!showDate" class="text-5xl mb-4 enter-x">
+    <div class="enter-y absolute bottom-5 w-full text-center text-gray-300 2xl:text-3xl xl:text-xl">
+      <div v-show="!showDate" class="enter-x mb-4 text-5xl">
         {{ hour }}:{{ minute }} <span class="text-3xl">{{ meridiem }}</span>
       </div>
       <div class="text-2xl">
diff --git a/src/views/base/login/ForgetPasswordForm.vue b/src/views/base/login/ForgetPasswordForm.vue
index 520ad51c1..0f11384f1 100644
--- a/src/views/base/login/ForgetPasswordForm.vue
+++ b/src/views/base/login/ForgetPasswordForm.vue
@@ -33,7 +33,7 @@ async function handleReset() {
 <template>
   <template v-if="getShow">
     <LoginFormTitle class="enter-x" />
-    <Form ref="formRef" class="p-4 enter-x" :model="formData" :rules="getFormRules">
+    <Form ref="formRef" class="enter-x p-4" :model="formData" :rules="getFormRules">
       <FormItem name="account" class="enter-x">
         <Input v-model:value="formData.account" size="large" :placeholder="t('sys.login.userName')" />
       </FormItem>
diff --git a/src/views/base/login/Login.vue b/src/views/base/login/Login.vue
index c2e31ff03..fc24925aa 100644
--- a/src/views/base/login/Login.vue
+++ b/src/views/base/login/Login.vue
@@ -26,8 +26,8 @@ const title = computed(() => globSetting?.title ?? '')
 </script>
 
 <template>
-  <div :class="prefixCls" class="relative w-full h-full px-4">
-    <div class="flex items-center absolute right-4 top-4">
+  <div :class="prefixCls" class="relative h-full w-full px-4">
+    <div class="absolute right-4 top-4 flex items-center">
       <AppDarkModeToggle v-if="!sessionTimeout" class="enter-x mr-2" />
       <AppLocalePicker v-if="!sessionTimeout && showLocale" class="enter-x xl:text-gray-600" :show-text="false" />
     </div>
@@ -36,25 +36,25 @@ const title = computed(() => globSetting?.title ?? '')
       <AppLogo :always-show-title="true" />
     </span>
 
-    <div class="container relative h-full py-2 mx-auto sm:px-10">
-      <div class="flex h-full">
-        <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
+    <div class="relative mx-auto h-full py-2 container sm:px-10">
+      <div class="h-full flex">
+        <div class="mr-4 hidden min-h-full pl-4 xl:w-6/12 xl:flex xl:flex-col">
           <AppLogo class="-enter-x" />
           <div class="my-auto">
-            <img :alt="title" src="@/assets/svg/login-box-bg.svg" class="w-1/2 -mt-16 -enter-x">
-            <div class="mt-10 font-medium text-white -enter-x">
-              <span class="inline-block mt-4 text-3xl"> {{ t('sys.login.signInTitle') }}</span>
+            <img :alt="title" src="@/assets/svg/login-box-bg.svg" class="-enter-x w-1/2 -mt-16">
+            <div class="-enter-x mt-10 font-medium text-white">
+              <span class="mt-4 inline-block text-3xl"> {{ t('sys.login.signInTitle') }}</span>
             </div>
-            <div class="mt-5 font-normal text-white dark:text-gray-500 -enter-x">
+            <div class="-enter-x mt-5 font-normal text-white dark:text-gray-500">
               {{ t('sys.login.signInDesc') }}
             </div>
           </div>
         </div>
-        <div class="flex w-full h-full py-5 xl:h-auto xl:py-0 xl:my-0 xl:w-6/12">
+        <div class="h-full w-full flex py-5 xl:my-0 xl:h-auto xl:w-6/12 xl:py-0">
           <!-- eslint-disable max-len -->
           <div
             :class="`${prefixCls}-form`"
-            class="relative w-full px-5 py-8 mx-auto my-auto rounded-md shadow-md xl:ml-16 xl:bg-transparent sm:px-8 xl:p-4 xl:shadow-none sm:w-3/4 lg:w-2/4 xl:w-auto enter-x"
+            class="enter-x relative mx-auto my-auto w-full rounded-md px-5 py-8 shadow-md xl:ml-16 lg:w-2/4 sm:w-3/4 xl:w-auto xl:bg-transparent xl:p-4 sm:px-8 xl:shadow-none"
           >
             <LoginForm />
             <ForgetPasswordForm />
diff --git a/src/views/base/login/LoginForm.vue b/src/views/base/login/LoginForm.vue
index 518c19352..e6cb94337 100644
--- a/src/views/base/login/LoginForm.vue
+++ b/src/views/base/login/LoginForm.vue
@@ -112,7 +112,7 @@ async function handleLogin(params) {
 
 <template>
   <LoginFormTitle v-show="getShow" class="enter-x" />
-  <Form v-show="getShow" ref="formRef" class="p-4 enter-x" :model="formData" :rules="getFormRules" @keypress.enter="handleLogin">
+  <Form v-show="getShow" ref="formRef" class="enter-x p-4" :model="formData" :rules="getFormRules" @keypress.enter="handleLogin">
     <FormItem name="tenantName" class="enter-x">
       <Input
         v-if="tenantEnable === 'true'"
@@ -184,7 +184,7 @@ async function handleLogin(params) {
       {{ t('sys.login.otherSignIn') }}
     </Divider>
 
-    <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">
+    <div class="enter-x flex justify-evenly" :class="`${prefixCls}-sign-in-way`">
       <GithubFilled />
       <WechatFilled />
       <AlipayCircleFilled />
@@ -196,7 +196,7 @@ async function handleLogin(params) {
     <Divider class="enter-x">
       萌新必读
     </Divider>
-    <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">
+    <div class="enter-x flex justify-evenly" :class="`${prefixCls}-sign-in-way`">
       <Button href="https://doc.iocoder.cn/" target="_blank">
         📚开发指南
       </Button>
diff --git a/src/views/base/login/LoginFormTitle.vue b/src/views/base/login/LoginFormTitle.vue
index 23d1b3098..384a9e76f 100644
--- a/src/views/base/login/LoginFormTitle.vue
+++ b/src/views/base/login/LoginFormTitle.vue
@@ -20,7 +20,7 @@ const getFormTitle = computed(() => {
 </script>
 
 <template>
-  <h2 class="mb-3 text-2xl font-bold text-center xl:text-3xl enter-x xl:text-left">
+  <h2 class="enter-x mb-3 text-center text-2xl font-bold xl:text-left xl:text-3xl">
     {{ getFormTitle }}
   </h2>
 </template>
diff --git a/src/views/base/login/MobileForm.vue b/src/views/base/login/MobileForm.vue
index fa8efe608..da563a4a9 100644
--- a/src/views/base/login/MobileForm.vue
+++ b/src/views/base/login/MobileForm.vue
@@ -117,7 +117,7 @@ async function getSmsCode() {
 <template>
   <div v-if="getShow">
     <LoginFormTitle class="enter-x" />
-    <Form ref="formRef" class="p-4 enter-x" :model="formData" :rules="getFormRules">
+    <Form ref="formRef" class="enter-x p-4" :model="formData" :rules="getFormRules">
       <FormItem name="tenantName" class="enter-x">
         <Input
           v-if="tenantEnable === 'true'"
diff --git a/src/views/base/login/QrCodeForm.vue b/src/views/base/login/QrCodeForm.vue
index 8561f7efa..898890706 100644
--- a/src/views/base/login/QrCodeForm.vue
+++ b/src/views/base/login/QrCodeForm.vue
@@ -18,7 +18,7 @@ const getShow = computed(() => unref(getLoginState) === LoginStateEnum.QR_CODE)
 <template>
   <div v-if="getShow">
     <LoginFormTitle class="enter-x" />
-    <div class="enter-x min-w-64 min-h-64">
+    <div class="enter-x min-h-64 min-w-64">
       <Popover :overlay-inner-style="{ padding: 0 }">
         <template #content>
           <QRCode :value="qrCodeUrl" class="enter-x flex justify-center xl:justify-start" :width="280" :bordered="false" />
@@ -28,7 +28,7 @@ const getShow = computed(() => unref(getLoginState) === LoginStateEnum.QR_CODE)
       <Divider class="enter-x">
         {{ t('sys.login.scanSign') }}
       </Divider>
-      <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">
+      <Button size="large" block class="enter-x mt-4" @click="handleBackLogin">
         {{ t('sys.login.backSignIn') }}
       </Button>
     </div>
diff --git a/src/views/base/login/RegisterForm.vue b/src/views/base/login/RegisterForm.vue
index f2b175f6c..b94a1dcce 100644
--- a/src/views/base/login/RegisterForm.vue
+++ b/src/views/base/login/RegisterForm.vue
@@ -40,7 +40,7 @@ async function handleRegister() {
 <template>
   <div v-if="getShow">
     <LoginFormTitle class="enter-x" />
-    <Form ref="formRef" class="p-4 enter-x" :model="formData" :rules="getFormRules">
+    <Form ref="formRef" class="enter-x p-4" :model="formData" :rules="getFormRules">
       <FormItem name="account" class="enter-x">
         <Input v-model:value="formData.account" class="fix-auto-fill" size="large" :placeholder="t('sys.login.userName')" />
       </FormItem>
@@ -72,7 +72,7 @@ async function handleRegister() {
       <Button type="primary" class="enter-x" size="large" block :loading="loading" @click="handleRegister">
         {{ t('sys.login.registerButton') }}
       </Button>
-      <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">
+      <Button size="large" block class="enter-x mt-4" @click="handleBackLogin">
         {{ t('sys.login.backSignIn') }}
       </Button>
     </Form>
diff --git a/src/views/base/login/SSOForm.vue b/src/views/base/login/SSOForm.vue
index 6057a0371..5ee10de2a 100644
--- a/src/views/base/login/SSOForm.vue
+++ b/src/views/base/login/SSOForm.vue
@@ -167,10 +167,10 @@ onMounted(() => {
 </script>
 
 <template>
-  <h2 class="mb-3 text-2xl font-bold text-center xl:text-3xl enter-x xl:text-left">
+  <h2 class="enter-x mb-3 text-center text-2xl font-bold xl:text-left xl:text-3xl">
     {{ client.name + t('sys.login.ssoSignInFormTitle') }}
   </h2>
-  <Form ref="formRef" class="p-4 enter-x" :model="loginForm" @keypress.enter="handleAuthorize(true)">
+  <Form ref="formRef" class="enter-x p-4" :model="loginForm" @keypress.enter="handleAuthorize(true)">
     此第三方应用请求获取以下权限：
     <Row class="enter-x">
       <Col :span="12">
@@ -191,7 +191,7 @@ onMounted(() => {
       <Button type="primary" size="large" block :loading="loading" @click="handleAuthorize(true)">
         {{ t('sys.login.loginButton') }}
       </Button>
-      <Button size="large" class="mt-4 enter-x" block @click="handleBackLogin">
+      <Button size="large" class="enter-x mt-4" block @click="handleBackLogin">
         {{ t('common.cancelText') }}
       </Button>
     </FormItem>
diff --git a/src/views/base/login/sso.vue b/src/views/base/login/sso.vue
index 77b29ce86..eb589d21b 100644
--- a/src/views/base/login/sso.vue
+++ b/src/views/base/login/sso.vue
@@ -22,35 +22,35 @@ const title = computed(() => globSetting?.title ?? '')
 </script>
 
 <template>
-  <div :class="prefixCls" class="relative w-full h-full px-4">
-    <div class="flex items-center absolute right-4 top-4">
+  <div :class="prefixCls" class="relative h-full w-full px-4">
+    <div class="absolute right-4 top-4 flex items-center">
       <AppDarkModeToggle v-if="!sessionTimeout" class="enter-x mr-2" />
-      <AppLocalePicker v-if="!sessionTimeout && showLocale" class="text-white enter-x xl:text-gray-600" :show-text="false" />
+      <AppLocalePicker v-if="!sessionTimeout && showLocale" class="enter-x text-white xl:text-gray-600" :show-text="false" />
     </div>
 
     <span class="-enter-x xl:hidden">
       <AppLogo :always-show-title="true" />
     </span>
 
-    <div class="container relative h-full py-2 mx-auto sm:px-10">
-      <div class="flex h-full">
-        <div class="hidden min-h-full pl-4 mr-4 xl:flex xl:flex-col xl:w-6/12">
+    <div class="relative mx-auto h-full py-2 container sm:px-10">
+      <div class="h-full flex">
+        <div class="mr-4 hidden min-h-full pl-4 xl:w-6/12 xl:flex xl:flex-col">
           <AppLogo class="-enter-x" />
           <div class="my-auto">
-            <img :alt="title" src="@/assets/svg/login-box-bg.svg" class="w-1/2 -mt-16 -enter-x">
-            <div class="mt-10 font-medium text-white -enter-x">
-              <span class="inline-block mt-4 text-3xl"> {{ t('sys.login.signInTitle') }}</span>
+            <img :alt="title" src="@/assets/svg/login-box-bg.svg" class="-enter-x w-1/2 -mt-16">
+            <div class="-enter-x mt-10 font-medium text-white">
+              <span class="mt-4 inline-block text-3xl"> {{ t('sys.login.signInTitle') }}</span>
             </div>
-            <div class="mt-5 font-normal text-white dark:text-gray-500 -enter-x">
+            <div class="-enter-x mt-5 font-normal text-white dark:text-gray-500">
               {{ t('sys.login.signInDesc') }}
             </div>
           </div>
         </div>
-        <div class="flex w-full h-full py-5 xl:h-auto xl:py-0 xl:my-0 xl:w-6/12">
+        <div class="h-full w-full flex py-5 xl:my-0 xl:h-auto xl:w-6/12 xl:py-0">
           <!-- eslint-disable max-len -->
           <div
             :class="`${prefixCls}-form`"
-            class="relative w-full px-5 py-8 mx-auto my-auto rounded-md shadow-md xl:ml-16 xl:bg-transparent sm:px-8 xl:p-4 xl:shadow-none sm:w-3/4 lg:w-2/4 xl:w-auto enter-x"
+            class="enter-x relative mx-auto my-auto w-full rounded-md px-5 py-8 shadow-md xl:ml-16 lg:w-2/4 sm:w-3/4 xl:w-auto xl:bg-transparent xl:p-4 sm:px-8 xl:shadow-none"
           >
             <SSOForm />
           </div>
diff --git a/src/views/bpm/oa/leave/create.vue b/src/views/bpm/oa/leave/create.vue
index 6005a85f8..e7ada3c1f 100644
--- a/src/views/bpm/oa/leave/create.vue
+++ b/src/views/bpm/oa/leave/create.vue
@@ -37,6 +37,6 @@ onMounted(() => {
 
 <template>
   <PageWrapper>
-    <BasicForm class="mt-10 w-200 h-120" @register="registerForm" @submit="handleSubmit" />
+    <BasicForm class="mt-10 h-120 w-200" @register="registerForm" @submit="handleSubmit" />
   </PageWrapper>
 </template>
diff --git a/src/views/dashboard/analysis/components/GrowCard.vue b/src/views/dashboard/analysis/components/GrowCard.vue
index c73a4f6f7..fe1acebad 100644
--- a/src/views/dashboard/analysis/components/GrowCard.vue
+++ b/src/views/dashboard/analysis/components/GrowCard.vue
@@ -17,7 +17,7 @@ defineProps({
       <Card
         :loading="loading"
         :title="item.title"
-        class="md:w-1/4 w-full !md:mt-0"
+        class="w-full md:w-1/4 !md:mt-0"
         :class="{ '!md:mr-4': index + 1 < 4, '!mt-4': index > 0 }"
       >
         <template #extra>
@@ -26,12 +26,12 @@ defineProps({
           </Tag>
         </template>
 
-        <div class="py-4 px-4 flex justify-between items-center">
+        <div class="flex items-center justify-between px-4 py-4">
           <CountTo prefix="$" :start-val="1" :end-val="item.value" class="text-2xl" />
           <Icon :icon="item.icon" :size="40" />
         </div>
 
-        <div class="p-2 px-4 flex justify-between">
+        <div class="flex justify-between p-2 px-4">
           <span>总{{ item.title }}</span>
           <CountTo prefix="$" :start-val="1" :end-val="item.total" />
         </div>
diff --git a/src/views/dashboard/analysis/index.vue b/src/views/dashboard/analysis/index.vue
index 2b21e2d55..3aa1b5da3 100644
--- a/src/views/dashboard/analysis/index.vue
+++ b/src/views/dashboard/analysis/index.vue
@@ -16,11 +16,11 @@ setTimeout(() => {
 <template>
   <div class="p-4">
     <GrowCard :loading="loading" class="enter-y" />
-    <SiteAnalysis class="!my-4 enter-y" :loading="loading" />
-    <div class="md:flex enter-y">
-      <VisitRadar class="md:w-1/3 w-full" :loading="loading" />
-      <VisitSource class="md:w-1/3 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading" />
-      <SalesProductPie class="md:w-1/3 w-full" :loading="loading" />
+    <SiteAnalysis class="enter-y !my-4" :loading="loading" />
+    <div class="enter-y md:flex">
+      <VisitRadar class="w-full md:w-1/3" :loading="loading" />
+      <VisitSource class="w-full !my-4 md:w-1/3 !md:mx-4 !md:my-0" :loading="loading" />
+      <SalesProductPie class="w-full md:w-1/3" :loading="loading" />
     </div>
   </div>
 </template>
diff --git a/src/views/dashboard/workbench/components/ProjectCard.vue b/src/views/dashboard/workbench/components/ProjectCard.vue
index e1c7f025d..0649d3d39 100644
--- a/src/views/dashboard/workbench/components/ProjectCard.vue
+++ b/src/views/dashboard/workbench/components/ProjectCard.vue
@@ -12,15 +12,15 @@ import { Icon } from '@/components/Icon'
       </a-button>
     </template>
 
-    <CardGrid v-for="item in groupItems" :key="item.title" class="!md:w-1/3 !w-full">
+    <CardGrid v-for="item in groupItems" :key="item.title" class="!w-full !md:w-1/3">
       <span class="flex">
         <Icon :icon="item.icon" :color="item.color" size="30" />
-        <span class="text-lg ml-4">{{ item.title }}</span>
+        <span class="ml-4 text-lg">{{ item.title }}</span>
       </span>
-      <div class="flex mt-2 h-10 text-secondary">
+      <div class="text-secondary mt-2 h-10 flex">
         {{ item.desc }}
       </div>
-      <div class="flex justify-between text-secondary">
+      <div class="text-secondary flex justify-between">
         <span>{{ item.group }}</span>
         <span>{{ item.date }}</span>
       </div>
diff --git a/src/views/dashboard/workbench/components/WorkbenchHeader.vue b/src/views/dashboard/workbench/components/WorkbenchHeader.vue
index ab408be16..982a2d2e8 100644
--- a/src/views/dashboard/workbench/components/WorkbenchHeader.vue
+++ b/src/views/dashboard/workbench/components/WorkbenchHeader.vue
@@ -11,23 +11,23 @@ const userinfo = computed(() => userStore.getUserInfo)
 <template>
   <div class="lg:flex">
     <Avatar :src="userinfo.user.avatar || headerImg" :size="72" class="!mx-auto !block" />
-    <div class="md:ml-6 flex flex-col justify-center md:mt-0 mt-2">
-      <h1 class="md:text-lg text-md">
+    <div class="mt-2 flex flex-col justify-center md:ml-6 md:mt-0">
+      <h1 class="text-md md:text-lg">
         早安, {{ userinfo.user.nickname }}, 开始您一天的工作吧！
       </h1>
       <span class="text-secondary"> 今日晴，20℃ - 32℃！ </span>
     </div>
-    <div class="flex flex-1 justify-end md:mt-0 mt-4">
+    <div class="mt-4 flex flex-1 justify-end md:mt-0">
       <div class="flex flex-col justify-center text-right">
         <span class="text-secondary"> 待办 </span>
         <span class="text-2xl">2/10</span>
       </div>
 
-      <div class="flex flex-col justify-center text-right md:mx-16 mx-12">
+      <div class="mx-12 flex flex-col justify-center text-right md:mx-16">
         <span class="text-secondary"> 项目 </span>
         <span class="text-2xl">8</span>
       </div>
-      <div class="flex flex-col justify-center text-right md:mr-10 mr-4">
+      <div class="mr-4 flex flex-col justify-center text-right md:mr-10">
         <span class="text-secondary"> 团队 </span>
         <span class="text-2xl">300</span>
       </div>
diff --git a/src/views/dashboard/workbench/index.vue b/src/views/dashboard/workbench/index.vue
index d755fc463..becba7e73 100644
--- a/src/views/dashboard/workbench/index.vue
+++ b/src/views/dashboard/workbench/index.vue
@@ -21,15 +21,15 @@ setTimeout(() => {
       <WorkbenchHeader />
     </template>
     <div class="lg:flex">
-      <div class="lg:w-7/10 w-full !mr-4 enter-y">
+      <div class="enter-y w-full !mr-4 lg:w-7/10">
         <ProjectCard :loading="loading" class="enter-y" />
-        <DynamicInfo :loading="loading" class="!my-4 enter-y" />
+        <DynamicInfo :loading="loading" class="enter-y !my-4" />
       </div>
-      <div class="lg:w-3/10 w-full enter-y">
+      <div class="enter-y w-full lg:w-3/10">
         <QuickNav :loading="loading" class="enter-y" />
 
-        <Card class="!my-4 enter-y" :loading="loading">
-          <img class="xl:h-50 h-30 mx-auto" src="@/assets/svg/illustration.svg">
+        <Card class="enter-y !my-4" :loading="loading">
+          <img class="mx-auto h-30 xl:h-50" src="@/assets/svg/illustration.svg">
         </Card>
 
         <SaleRadar :loading="loading" class="enter-y" />
diff --git a/src/views/infra/build/index.vue b/src/views/infra/build/index.vue
index 3864ecc4e..d58bdea28 100644
--- a/src/views/infra/build/index.vue
+++ b/src/views/infra/build/index.vue
@@ -4,7 +4,7 @@ import { VFormDesign } from '@/components/FormDesign'
 </script>
 
 <template>
-  <PageWrapper dense content-full-height fixed-height>
+  <PageWrapper dense fixed-height content-full-height>
     <VFormDesign />
   </PageWrapper>
 </template>
diff --git a/src/views/infra/codegen/components/FinishForm.vue b/src/views/infra/codegen/components/FinishForm.vue
index 86b7d079e..39cad7f06 100644
--- a/src/views/infra/codegen/components/FinishForm.vue
+++ b/src/views/infra/codegen/components/FinishForm.vue
@@ -36,7 +36,7 @@ function handleGoList() {
 </script>
 
 <template>
-  <div class="m-5 result-success">
+  <div class="result-success m-5">
     <Result status="success" title="代码生成成功" sub-title="可点击下方按钮预览、下载，或返回列表页。">
       <template #extra>
         <a-button key="console" type="primary" @click="handleGoList">
diff --git a/src/views/infra/codegen/components/PreviewModal.vue b/src/views/infra/codegen/components/PreviewModal.vue
index 887c59ae5..f23798f8d 100644
--- a/src/views/infra/codegen/components/PreviewModal.vue
+++ b/src/views/infra/codegen/components/PreviewModal.vue
@@ -119,7 +119,7 @@ async function copy(text: string) {
 <template>
   <BasicModal v-bind="$attrs" :default-fullscreen="true" title="预览代码" @register="registerModal">
     <div class="flex">
-      <Card class="w-1/4 min-w-130">
+      <Card class="min-w-130 w-1/4">
         <BasicTree
           title="文件夹列表" toolbar :default-expand-all="true" tree-wrapper-class-name="h-[800px] overflow-auto"
           :click-row-to-expand="false" :tree-data="fileTree" :field-names="{ key: 'id', title: 'label' }"
diff --git a/src/views/infra/redis/index.vue b/src/views/infra/redis/index.vue
index 47171e383..a5a51d974 100644
--- a/src/views/infra/redis/index.vue
+++ b/src/views/infra/redis/index.vue
@@ -38,9 +38,9 @@ onMounted(async () => {
       :data="cacheInfo"
       :schema="baseInfoSchema"
     />
-    <div class="md:flex enter-y mt-4">
-      <CommandStats class="md:w-1/2 w-full" :loading="loading" :command-stats="commandStats" />
-      <Memory class="md:w-1/2 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading" :memory-human="memoryHuman" />
+    <div class="enter-y mt-4 md:flex">
+      <CommandStats class="w-full md:w-1/2" :loading="loading" :command-stats="commandStats" />
+      <Memory class="w-full !my-4 md:w-1/2 !md:mx-4 !md:my-0" :loading="loading" :memory-human="memoryHuman" />
     </div>
   </div>
 </template>
diff --git a/src/views/infra/webSocket/index.vue b/src/views/infra/webSocket/index.vue
index 5cb636b0c..37a18bab5 100644
--- a/src/views/infra/webSocket/index.vue
+++ b/src/views/infra/webSocket/index.vue
@@ -60,7 +60,7 @@ function toggle() {
     <div class="flex">
       <div class="w-1/3 p-4">
         <div class="flex items-center">
-          <span class="text-lg font-medium mr-4"> 连接状态: </span>
+          <span class="mr-4 text-lg font-medium"> 连接状态: </span>
           <Tag :color="getTagColor">
             {{ status }}
           </Tag>
@@ -77,7 +77,7 @@ function toggle() {
             {{ getIsOpen ? '关闭连接' : '开启连接' }}
           </a-button>
         </div>
-        <p class="text-lg font-medium mt-4">
+        <p class="mt-4 text-lg font-medium">
           设置
         </p>
         <hr class="my-4">
@@ -89,15 +89,15 @@ function toggle() {
         </a-button>
       </div>
 
-      <div class="w-2/3 ml-4 p-4">
-        <span class="text-lg font-medium mr-4"> 消息记录: </span>
+      <div class="ml-4 w-2/3 p-4">
+        <span class="mr-4 text-lg font-medium"> 消息记录: </span>
         <hr class="my-4">
 
         <div class="max-h-80 overflow-auto">
           <ul>
             <li v-for="item in getList" :key="item.time" class="mt-2">
               <div class="flex items-center">
-                <span class="mr-2 text-primary font-medium">收到消息:</span>
+                <span class="mr-2 font-medium text-primary">收到消息:</span>
                 <span>{{ formatToDateTime(item.time) }}</span>
               </div>
               <div>
diff --git a/src/views/mp/components/WxNews/index.vue b/src/views/mp/components/WxNews/index.vue
index a8e2395d2..acbfbcabf 100644
--- a/src/views/mp/components/WxNews/index.vue
+++ b/src/views/mp/components/WxNews/index.vue
@@ -130,7 +130,7 @@ async function handleDelete(id) {
 
 <template>
   <div class="p-2">
-    <div class="p-4 mb-2">
+    <div class="mb-2 p-4">
       <BasicForm @register="registerForm" />
     </div>
     <div class="p-2">
diff --git a/src/views/mp/components/WxVideoPlay/index.vue b/src/views/mp/components/WxVideoPlay/index.vue
index 26c1bd948..b126c1ae2 100644
--- a/src/views/mp/components/WxVideoPlay/index.vue
+++ b/src/views/mp/components/WxVideoPlay/index.vue
@@ -36,8 +36,10 @@ function playVideo() {
 
     <!-- 弹窗播放 -->
     <Modal v-model:open="openVideo" title="视频播放" append-to-body>
-      <VideoPlayer v-if="openVideo" class="video-player vjs-big-play-centered" :src="props.url" poster=""
-        crossorigin="anonymous" playsinline controls :volume="0.6" :width="800" :playback-rates="[0.7, 1.0, 1.5, 2.0]" />
+      <VideoPlayer
+        v-if="openVideo" class="video-player vjs-big-play-centered" :src="props.url" poster=""
+        crossorigin="anonymous" controls playsinline :volume="0.6" :width="800" :playback-rates="[0.7, 1.0, 1.5, 2.0]"
+      />
       <!--     事件，暫時沒用
       @mounted="handleMounted" -->
       <!--        @ready="handleEvent($event)" -->
diff --git a/src/views/pay/submit/index.vue b/src/views/pay/submit/index.vue
index e72d2deae..2413fcc3f 100644
--- a/src/views/pay/submit/index.vue
+++ b/src/views/pay/submit/index.vue
@@ -81,9 +81,9 @@ onMounted(async () => {
       <List :grid="{ column: 8 }" header="选择支付宝支付" :data-source="aliPayChannels">
         <template #renderItem="{ item }">
           <ListItem>
-            <Card hoverable class="w-30 h-28 mt-3 pb-3" @click="submit(item.code)">
+            <Card hoverable class="mt-3 h-28 w-30 pb-3" @click="submit(item.code)">
               <template #cover>
-                <img class="w-40px h-40px mt-2" :src="icons[item.code]">
+                <img class="mt-2 h-40px w-40px" :src="icons[item.code]">
                 <p class="mt-3 text-center">
                   {{ item.name }}
                 </p>
@@ -95,9 +95,9 @@ onMounted(async () => {
       <List :grid="{ column: 8 }" class="mt-4" header="选择微信支付" :data-source="wxPayChannels">
         <template #renderItem="{ item }">
           <ListItem>
-            <Card hoverable class="w-30 h-28 pt-3 pb-3">
+            <Card hoverable class="h-28 w-30 pb-3 pt-3">
               <template #cover>
-                <img class="w-40px h-40px mt-2" :src="icons[item.code]">
+                <img class="mt-2 h-40px w-40px" :src="icons[item.code]">
                 <p class="mt-3 text-center">
                   {{ item.name }}
                 </p>
@@ -109,9 +109,9 @@ onMounted(async () => {
       <List :grid="{ column: 8 }" class="mt-4" header="选择其它支付" :data-source="otherPayChannels">
         <template #renderItem="{ item }">
           <ListItem>
-            <Card hoverable class="w-30 h-28 pt-3 pb-3">
+            <Card hoverable class="h-28 w-30 pb-3 pt-3">
               <template #cover>
-                <img class="w-40px h-40px mt-2" :src="icons[item.code]">
+                <img class="mt-2 h-40px w-40px" :src="icons[item.code]">
                 <p class="mt-3 text-center">
                   {{ item.name }}
                 </p>
diff --git a/src/views/system/role/RoleMenuModal.vue b/src/views/system/role/RoleMenuModal.vue
index 8495849cf..69c871470 100644
--- a/src/views/system/role/RoleMenuModal.vue
+++ b/src/views/system/role/RoleMenuModal.vue
@@ -108,9 +108,8 @@ function menuCheck(checkedKeys: CheckKeys, event: CheckedEvent) {
           v-model:checkedKeys="model[field]"
           :tree-data="treeData"
           :field-names="{ title: 'name', key: 'id' }"
-          checkable
-          toolbar
-          search
+
+          toolbar checkable search
           :show-strictly-button="false"
           :selectable="false"
           title="菜单分配"