chore: 更新依赖

package.json

@@ -26,21 +26,21 @@
     "p": "plop"
   },
   "dependencies": {
-    "@iconify/iconify": "^3.1.0",
+    "@iconify/iconify": "^3.1.1",
     "@iconify/vue": "^4.1.1",
-    "@vueuse/core": "^10.2.0",
+    "@vueuse/core": "^10.2.1",
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "^5.1.10",
     "@zxcvbn-ts/core": "^3.0.2",
     "animate.css": "^4.1.1",
     "axios": "^1.4.0",
-    "dayjs": "^1.11.8",
+    "dayjs": "^1.11.9",
     "echarts": "^5.4.2",
     "echarts-wordcloud": "^2.1.0",
-    "element-plus": "^2.3.6",
+    "element-plus": "^2.3.7",
     "intro.js": "^7.0.1",
     "lodash-es": "^4.17.21",
-    "mitt": "^3.0.0",
+    "mitt": "^3.0.1",
     "mockjs": "^1.1.0",
     "nprogress": "^0.2.0",
     "pinia": "^2.1.4",
@@ -50,57 +50,57 @@
     "url": "^0.11.1",
     "vue": "3.3.4",
     "vue-i18n": "9.2.2",
-    "vue-router": "^4.2.2",
-    "vue-types": "^5.0.4",
+    "vue-router": "^4.2.4",
+    "vue-types": "^5.1.0",
     "web-storage-cache": "^1.1.1"
   },
   "devDependencies": {
-    "@commitlint/cli": "^17.6.5",
-    "@commitlint/config-conventional": "^17.6.5",
-    "@iconify/json": "^2.2.80",
-    "@intlify/unplugin-vue-i18n": "^0.11.0",
+    "@commitlint/cli": "^17.6.6",
+    "@commitlint/config-conventional": "^17.6.6",
+    "@iconify/json": "^2.2.89",
+    "@intlify/unplugin-vue-i18n": "^0.12.2",
     "@purge-icons/generated": "^0.9.0",
     "@types/intro.js": "^5.1.1",
     "@types/lodash-es": "^4.17.7",
-    "@types/node": "^20.3.1",
+    "@types/node": "^20.4.1",
     "@types/nprogress": "^0.2.0",
-    "@types/qrcode": "^1.5.0",
+    "@types/qrcode": "^1.5.1",
     "@types/qs": "^6.9.7",
-    "@typescript-eslint/eslint-plugin": "^5.59.11",
-    "@typescript-eslint/parser": "^5.59.11",
-    "@unocss/transformer-variant-group": "^0.53.1",
-    "@vitejs/plugin-legacy": "^4.0.4",
+    "@typescript-eslint/eslint-plugin": "^6.0.0",
+    "@typescript-eslint/parser": "^6.0.0",
+    "@unocss/transformer-variant-group": "^0.53.5",
+    "@vitejs/plugin-legacy": "^4.1.0",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vitejs/plugin-vue-jsx": "^3.0.1",
-    "@vue-macros/volar": "^0.11.0",
+    "@vue-macros/volar": "^0.12.1",
     "autoprefixer": "^10.4.14",
-    "consola": "^3.1.0",
-    "eslint": "^8.43.0",
+    "consola": "^3.2.3",
+    "eslint": "^8.44.0",
     "eslint-config-prettier": "^8.8.0",
-    "eslint-define-config": "^1.20.0",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-vue": "^9.15.0",
+    "eslint-define-config": "^1.21.0",
+    "eslint-plugin-prettier": "^5.0.0",
+    "eslint-plugin-vue": "^9.15.1",
     "husky": "^8.0.3",
     "less": "^4.1.3",
-    "lint-staged": "^13.2.2",
+    "lint-staged": "^13.2.3",
     "plop": "^3.1.2",
-    "postcss": "^8.4.24",
+    "postcss": "^8.4.25",
     "postcss-html": "^1.5.0",
     "postcss-less": "^6.0.0",
-    "prettier": "^2.8.8",
+    "prettier": "^3.0.0",
     "rimraf": "^5.0.1",
-    "rollup": "^3.25.1",
-    "stylelint": "^15.8.0",
+    "rollup": "^3.26.2",
+    "stylelint": "^15.10.1",
     "stylelint-config-html": "^1.1.0",
     "stylelint-config-prettier": "^9.0.5",
-    "stylelint-config-recommended": "^12.0.0",
-    "stylelint-config-standard": "^33.0.0",
+    "stylelint-config-recommended": "^13.0.0",
+    "stylelint-config-standard": "^34.0.0",
     "stylelint-order": "^6.0.3",
-    "terser": "^5.18.0",
-    "typescript": "5.1.3",
-    "unocss": "^0.53.1",
-    "unplugin-vue-define-options": "^1.3.8",
-    "vite": "4.3.9",
+    "terser": "^5.19.0",
+    "typescript": "5.1.6",
+    "unocss": "^0.53.5",
+    "unplugin-vue-define-options": "^1.3.11",
+    "vite": "4.4.2",
     "vite-plugin-ejs": "^1.6.4",
     "vite-plugin-eslint": "^1.8.1",
     "vite-plugin-mock": "2.9.6",
@@ -108,7 +108,7 @@
     "vite-plugin-purge-icons": "^0.9.2",
     "vite-plugin-style-import": "2.0.0",
     "vite-plugin-svg-icons": "^2.0.1",
-    "vue-tsc": "^1.8.0"
+    "vue-tsc": "^1.8.4"
   },
   "engines": {
     "node": ">= 14.18.0"

src/components/Table/src/components/TableActions.vue

@@ -1,13 +1,12 @@
 <script lang="tsx">
-import { defineComponent, unref, computed, ref } from 'vue'
+import { defineComponent, unref, computed } from 'vue'
 import {
   ElTooltip,
   ElDropdown,
   ElDropdownMenu,
   ElDropdownItem,
   ComponentSize,
-  ElPopover,
-  ClickOutside as vClickOutside
+  ElPopover
 } from 'element-plus'
 import { Icon } from '@/components/Icon'
 import { useI18n } from '@/hooks/web/useI18n'
@@ -20,9 +19,6 @@ const { t } = useI18n()
 
 export default defineComponent({
   name: 'TableActions',
-  directives: {
-    ClickOutside: vClickOutside
-  },
   emits: ['refresh', 'changSize'],
   setup(_, { emit }) {
     const refresh = () => {
@@ -33,23 +29,8 @@ export default defineComponent({
       emit('changSize', size)
     }
 
-    const popoverRef = ref()
-    const iconRef = ref()
-
-    const onClickOutside = () => {
-      unref(popoverRef)?.popperRef?.delayHide?.()
-    }
-
     return () => (
       <>
-        <ElPopover
-          ref={popoverRef.value}
-          virtualRef={iconRef.value}
-          trigger="click"
-          virtualTriggering
-        >
-          <span> Some content </span>
-        </ElPopover>
         <div class="text-right h-28px flex items-center justify-end">
           <ElTooltip content={t('common.refresh')} placement="top">
             <Icon
@@ -93,15 +74,24 @@ export default defineComponent({
             </ElDropdown>
           </ElTooltip>
 
-          <ElTooltip content={t('common.columnSetting')} placement="top">
-            <Icon
-              ref={iconRef.value}
-              icon="ant-design:setting-outlined"
-              class="cursor-pointer"
-              hoverColor="var(--el-color-primary)"
-              vClickOutside={onClickOutside}
-            />
-          </ElTooltip>
+          {/* <ElTooltip content={t('common.columnSetting')} placement="top"> */}
+          <ElPopover trigger="click" placement="bottom-end">
+            {{
+              default: () => {
+                return <div>假假按揭</div>
+              },
+              reference: () => {
+                return (
+                  <Icon
+                    icon="ant-design:setting-outlined"
+                    class="cursor-pointer"
+                    hoverColor="var(--el-color-primary)"
+                  />
+                )
+              }
+            }}
+          </ElPopover>
+          {/* </ElTooltip> */}
         </div>
       </>
     )

src/views/Components/Form/DefaultForm.vue

@@ -2,7 +2,6 @@
 import { Form } from '@/components/Form'
 import { reactive, ref, onMounted, computed } from 'vue'
 import { useI18n } from '@/hooks/web/useI18n'
-import { useIcon } from '@/hooks/web/useIcon'
 import { ContentWrap } from '@/components/ContentWrap'
 import { useAppStore } from '@/store/modules/app'
 import { SelectOption, RadioOption, CheckboxOption, FormSchema } from '@/components/Form'
@@ -17,6 +16,7 @@ import {
   ElInput
 } from 'element-plus'
 import { getDictOneApi } from '@/api/common'
+import { Icon } from '@/components/Icon'
 
 const appStore = useAppStore()
 
@@ -461,8 +461,8 @@ const schema = reactive<FormSchema[]>([
     label: `${t('formDemo.icon')}1`,
     component: 'Input',
     componentProps: {
-      suffixIcon: useIcon({ icon: 'ep:calendar' }),
-      prefixIcon: useIcon({ icon: 'ep:share' })
+      suffixIcon: <Icon icon="ep:calendar" />,
+      prefixIcon: <Icon icon="ep:share" />
     }
   },
   {
@@ -472,9 +472,9 @@ const schema = reactive<FormSchema[]>([
     componentProps: {
       slots: {
         suffix: () => {
-          return useIcon({ icon: 'ep:share' })
+          return <Icon icon="ep:share" />
         },
-        prefix: () => useIcon({ icon: 'ep:calendar' })
+        prefix: () => <Icon icon="ep:calendar" />
       }
     }
   },
@@ -484,8 +484,8 @@ const schema = reactive<FormSchema[]>([
     component: 'Input',
     componentProps: {
       slots: {
-        prepend: () => useIcon({ icon: 'ep:calendar' }),
-        append: () => useIcon({ icon: 'ep:share' })
+        prepend: () => <Icon icon="ep:calendar" />,
+        append: () => <Icon icon="ep:share" />
       }
     }
   },
@@ -622,10 +622,7 @@ const schema = reactive<FormSchema[]>([
             return null
           }
         },
-        prefix: () => useIcon({ icon: 'ep:calendar' }),
-        empty: () => {
-          return useIcon({ icon: 'ep:share' })
-        }
+        prefix: () => <Icon icon="ep:calendar" />
       }
     }
   },
@@ -869,8 +866,8 @@ const schema = reactive<FormSchema[]>([
     component: 'Switch',
     value: false,
     componentProps: {
-      activeIcon: useIcon({ icon: 'ep:check' }),
-      inactiveIcon: useIcon({ icon: 'ep:close' })
+      activeIcon: <Icon icon="ep:check" />,
+      inactiveIcon: <Icon icon="ep:close" />
     }
   },
   {
@@ -890,11 +887,11 @@ const schema = reactive<FormSchema[]>([
     component: 'Rate',
     value: null,
     componentProps: {
-      voidIcon: useIcon({ icon: 'ep:chat-round' }),
+      voidIcon: <Icon icon="ep:chat-round" />,
       icons: [
-        useIcon({ icon: 'ep:chat-round' }),
-        useIcon({ icon: 'ep:chat-line-round' }),
-        useIcon({ icon: 'ep:chat-dot-round' })
+        <Icon icon="ep:chat-round" />,
+        <Icon icon="ep:chat-line-round" />,
+        <Icon icon="ep:chat-dot-round" />
       ]
     }
   },
@@ -1683,15 +1680,15 @@ const schema = reactive<FormSchema[]>([
   box-sizing: border-box;
 
   .text {
+    position: absolute;
+    left: 50%;
+    display: block;
     width: 24px;
     height: 24px;
-    display: block;
     margin: 0 auto;
     line-height: 24px;
-    position: absolute;
-    left: 50%;
-    transform: translateX(-50%);
     border-radius: 50%;
+    transform: translateX(-50%);
   }
 
   &.current {
@@ -1703,18 +1700,18 @@ const schema = reactive<FormSchema[]>([
 
   .holiday {
     position: absolute;
+    bottom: 0;
+    left: 50%;
     width: 6px;
     height: 6px;
     background: var(--el-color-danger);
     border-radius: 50%;
-    bottom: 0px;
-    left: 50%;
     transform: translateX(-50%);
   }
 }
 
 .transfer-footer {
-  margin-left: 15px;
   padding: 6px 5px;
+  margin-left: 15px;
 }
 </style>

src/views/Login/Login.vue

@@ -34,7 +34,7 @@ const toLogin = () => {
     class="h-[100%] relative lt-xl:bg-[var(--login-bg-color)] lt-sm:px-10px lt-xl:px-10px lt-md:px-10px"
   >
     <ElScrollbar class="h-full">
-      <div class="relative flex mx-auto">
+      <div class="relative flex mx-auto h-100vh">
         <div
           :class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px lt-xl:hidden`"
         >
@@ -97,6 +97,7 @@ const toLogin = () => {
 
 .@{prefix-cls} {
   overflow: auto;
+
   &__left {
     &::before {
       position: absolute;