fix: some warning

.github/workflows/sync-to-gitee.yml

@@ -21,7 +21,7 @@ jobs:
       - name: Setup node
         uses: actions/setup-node@v3
         with:
-          node-version: '16'
+          node-version: '18'
           registry-url: https://registry.npmjs.com/
 
       - name: Setup pnpm

src/components/basic/button/button.vue

@@ -1,15 +1,15 @@
 <template>
-  <ConfigProvider :theme="btnTheme">
+  <ProConfigProvider :theme="btnTheme">
     <Button v-bind="{ ...$attrs, ...props }" :type="buttonType">
       <template v-for="(_, key) in $slots" #[key]>
         <slot :name="key"></slot>
       </template>
     </Button>
-  </ConfigProvider>
+  </ProConfigProvider>
 </template>
 <script lang="ts" setup>
   import { computed } from 'vue';
-  import { Button, ConfigProvider } from 'ant-design-vue';
+  import { Button } from 'ant-design-vue';
   import { buttonProps, buttonColorPrimary, aButtonTypes } from './button';
   import type { ButtonType, AButtonType } from './button';
 

src/components/basic/lockscreen/huawei-charge.vue

@@ -74,18 +74,18 @@
       }
     }
 
-    @keyframes moveToTop {
+    @keyframes move-to-top {
       90% {
         opacity: 1;
       }
 
       100% {
-        opacity: 0.1;
         transform: translate(-50%, -180px);
+        opacity: 0.1;
       }
     }
 
-    @keyframes hueRotate {
+    @keyframes hue-rotate {
       100% {
         filter: contrast(15) hue-rotate(360deg);
       }
@@ -110,60 +110,60 @@
         width: @width;
         height: @width;
         transform: translate(-50%, -50%);
-        animation: moveToTop unit(~`(Math.round(Math.random() * 6) + 3) `, s) ease-in-out
+        animation: move-to-top unit(~`(Math.round(Math.random() * 6) + 3) `, s) ease-in-out
           unit(~`-(Math.random() * 5000 / 1000) `, s) infinite;
       }
     }
 
     .number {
       position: absolute;
-      top: 27%;
       z-index: 10;
+      top: 27%;
       width: 300px;
-      font-size: 32px;
       color: #fff;
+      font-size: 32px;
       text-align: center;
     }
 
     .contrast {
       width: 300px;
       height: 400px;
       overflow: hidden;
+      animation: hue-rotate 10s infinite linear;
       background-color: #000;
       filter: contrast(15) hue-rotate(0);
-      animation: hueRotate 10s infinite linear;
 
       .circle {
         position: relative;
+        box-sizing: border-box;
         width: 300px;
         height: 300px;
         filter: blur(8px);
-        box-sizing: border-box;
 
         &::after {
+          content: '';
           position: absolute;
           top: 40%;
           left: 50%;
           width: 200px;
           height: 200px;
-          background-color: #00ff6f;
-          border-radius: 42% 38% 62% 49% / 45%;
-          content: '';
           transform: translate(-50%, -50%) rotate(0);
           animation: trotate 10s infinite linear;
+          border-radius: 42% 38% 62% 49% / 45%;
+          background-color: #00ff6f;
         }
 
         &::before {
+          content: '';
           position: absolute;
+          z-index: 10;
           top: 40%;
           left: 50%;
-          z-index: 10;
           width: 176px;
           height: 176px;
-          background-color: #000;
-          border-radius: 50%;
-          content: '';
           transform: translate(-50%, -50%);
+          border-radius: 50%;
+          background-color: #000;
         }
       }
 
@@ -173,15 +173,15 @@
         left: 50%;
         width: 100px;
         height: 40px;
-        background-color: #00ff6f;
+        transform: translate(-50%, 0);
         border-radius: 100px 100px 0 0;
+        background-color: #00ff6f;
         filter: blur(5px);
-        transform: translate(-50%, 0);
 
         li {
           position: absolute;
-          background: #00ff6f;
           border-radius: 50%;
+          background: #00ff6f;
         }
       }
     }

src/components/basic/lockscreen/index.vue

@@ -1,13 +1,13 @@
 <template>
   <transition name="slide-up">
-    <LockScreen v-if="isLock && isMouted && $route.name != LOGIN_NAME" />
+    <LockScreenPage v-if="isLock && isMouted && $route.name != LOGIN_NAME" />
   </transition>
 </template>
 
 <script setup lang="ts">
   import { computed, ref, onMounted, onUnmounted } from 'vue';
   import { useRoute } from 'vue-router';
-  import LockScreen from './lockscreen.vue';
+  import LockScreenPage from './lockscreen-page.vue';
   import { useLockscreenStore } from '@/store/modules/lockscreen';
   import { LOGIN_NAME } from '@/router/constant';
 

src/components/basic/pro-config-provider/index.vue

@@ -1,4 +1,7 @@
 <script setup lang="ts">
+  import { computed } from 'vue';
+  import { configProviderProps } from 'ant-design-vue/es/config-provider/context';
+  import { merge } from 'lodash-es';
   import { ConfigProvider } from 'ant-design-vue';
   import { useLocale } from '@/locales/useLocale';
   import { useLayoutSettingStore } from '@/store/modules/layoutSetting';
@@ -7,14 +10,18 @@
     name: 'ProConfigProvider',
   });
 
+  const props = defineProps(configProviderProps());
+
   const layoutSetting = useLayoutSettingStore();
   const { getAntdLocale } = useLocale();
+
+  const theme = computed(() => {
+    return merge({}, layoutSetting.themeConfig, props.theme);
+  });
 </script>
 
 <template>
-  <ConfigProvider :locale="getAntdLocale" :theme="layoutSetting.themeConfig">
+  <ConfigProvider v-bind="$props" :locale="getAntdLocale" :theme="theme">
     <slot></slot>
   </ConfigProvider>
 </template>
-
-<style lang="less" scoped></style>

src/components/core/dynamic-table/index.ts

@@ -1,6 +1,6 @@
 import DynamicTable from './src/dynamic-table.vue';
-import type { DefineComponent, Ref } from 'vue';
-import type { DynamicTableInstance, DynamicTableProps } from './src/dynamic-table';
+import type { Ref } from 'vue';
+import type { DynamicTableInstance } from './src/dynamic-table';
 export { DynamicTable };
 
 export * from './src/types/';
@@ -9,5 +9,4 @@ export * from './src/dynamic-table';
 
 export type DynamicTableRef = Ref<DynamicTableInstance>;
 
-// TODO 暂时是为了解决ts error(如果你有解决方法 请务必联系我~): JSX element type 'DynamicTable' does not have any construct or call signatures.
-export default DynamicTable as unknown as DefineComponent<Partial<DynamicTableProps>>;
+export default DynamicTable;

src/components/core/dynamic-table/src/hooks/useColumns.tsx

@@ -54,6 +54,7 @@ export const useColumns = ({ state, methods, props, tableAction }: UseTableColum
       } as TableColumn);
     }
 
+    // @ts-ignore
     innerColumns.value = columns.map((item) => {
       const customRender = item.customRender;
 

src/components/core/schema-form/index.ts

@@ -1,7 +1,5 @@
 import SchemaForm from './src/schema-form.vue';
 import SchemaFormItem from './src/schema-form-item.vue';
-import type { DefineComponent } from 'vue';
-import type { SchemaFormProps } from './src/schema-form';
 
 export * from './src/types/';
 export * from './src/schema-form';
@@ -11,5 +9,4 @@ export * from './src/components/';
 
 export { SchemaForm, SchemaFormItem };
 
-// TODO 暂时是为了解决ts error(如果你有解决方法 请务必联系我~): JSX element type 'SchemaForm' does not have any construct or call signatures.
-export default SchemaForm as unknown as DefineComponent<Partial<SchemaFormProps>>;
+export default SchemaForm;

src/components/core/schema-form/src/hooks/useFormEvents.ts

@@ -129,6 +129,7 @@ export function useFormEvents(formActionContext: UseFormActionContext) {
    * @description: 根据 field 删除 Schema
    */
   async function removeSchemaByField(fields: string | string[]): Promise<void> {
+    // @ts-ignore
     const schemaList = cloneDeep<FormSchema[]>(unref(formSchemasRef));
 
     if (!fields) {

src/hooks/useModal/modal.tsx

@@ -1,26 +1,21 @@
 import { defineComponent, watch, ref, computed, unref } from 'vue';
 import { omit } from 'lodash-es';
-import { ConfigProvider } from 'ant-design-vue';
 import type { HookModalProps } from './types';
 import { isFunction } from '@/utils/is';
 import { DraggableModal } from '@/components/core/draggable-modal';
-import { useLocale } from '@/locales/useLocale';
 
 export type MyModalInstance = InstanceType<typeof MyModal>;
 
 export const MyModal = defineComponent({
-  components: { customModal: DraggableModal },
   props: {
     content: {
       type: [String, Function] as PropType<string | JSX.Element | (() => JSX.Element)>,
     },
     closeModal: Function,
     open: Boolean,
-    isAppChild: Boolean,
   },
   setup(props, { attrs, expose }) {
     const confirmLoading = ref<boolean>(false);
-    const { getAntdLocale } = useLocale();
 
     const propsRef = ref({ ...attrs, ...props });
 
@@ -32,7 +27,7 @@ export const MyModal = defineComponent({
       const _props = unref(getProps);
 
       return {
-        ...omit(_props, ['onCancel', 'onOk', 'closeModal', 'isAppChild', 'content']),
+        ...omit(_props, ['onCancel', 'onOk', 'closeModal', 'content']),
         open: _props.open,
         confirmLoading: confirmLoading.value,
         onCancel: handleCancel,
@@ -82,17 +77,11 @@ export const MyModal = defineComponent({
 
     return () => {
       const _props = unref(getProps);
-      const { content, isAppChild } = _props;
+      const { content } = _props;
 
       const Content = isFunction(content) ? content() : content;
 
-      return isAppChild ? (
-        <customModal {...unref(bindValues)}>{Content}</customModal>
-      ) : (
-        <ConfigProvider locale={getAntdLocale.value}>
-          <customModal {...unref(bindValues)}>{Content}</customModal>
-        </ConfigProvider>
-      );
+      return <DraggableModal {...unref(bindValues)}>{Content}</DraggableModal>;
     };
   },
 });

src/views/account/about.vue

@@ -3,8 +3,8 @@
     <Card>
       <Card.Meta title="关于">
         <template #description>
-          <BlankLink :url="pkg.author.url" :text="pkg.name" />的前端项目是基于Vue3.x、Vue-CLI5.x、
-          Ant-Design-Vue3.x 、TypeScript4.x开发，
+          <BlankLink :url="pkg.author.url" :text="pkg.name" />的前端项目是基于Vue3.x、Vite4.x、
+          Ant-Design-Vue4.x 、TypeScript5.x开发，
           内置了动态路由、权限验证、并提供了常用的功能组件，帮助你快速搭建企业级中后台产品原型。
           原则上不会限制任何代码用于商用。
         </template>

vite.config.ts

@@ -39,10 +39,6 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
     },
     resolve: {
       alias: [
-        {
-          find: 'vue-i18n',
-          replacement: 'vue-i18n/dist/vue-i18n.cjs.js',
-        },
         {
           find: '@',
           replacement: resolve(__dirname, './src'),