canrd-outside / order-erp-front · Commits

Commit 73c8e0c1583afa83353ff36d1d9ec847776d3016

Authored by vben
1 parent 19011296

perf: perf component

Inline Side-by-side
Showing 80 changed files with 528 additions and 630 deletions
CHANGELOG.zh_CN.md
  View file @73c8e0c
1 1 ## Wip
2 2  
  3 +## (破坏性更新) Breaking changes
  4 +
  5 +- ClickOutSide 组件引入方式由 `import ClickOutSide from '/@/components/ClickOutSide/index.vue'`变更为`import { ClickOutSide } from '/@/components/ClickOutSide'`
  6 +- Button 组件引入方式由 `import ClickOutSide from '/@/components/Button/index.vue'`变更为`import { Button } from '/@/components/Button'`
  7 +- StrengthMeter 组件引入方式由 `import StrengthMeter from '/@/components/StrengthMeter'`变更为`import { StrengthMeter } from '/@/components/StrengthMeter'`
  8 +- 除示例外加入全局国际化功能，支持中文与英文
  9 +
3 10 ### ✨ Refactor
4 11  
5 12 - 重构整体 layout。更改代码实现方式。代码更精简
6 13 - 配置项重构
7 14 - 移除 messageSetting 配置
  15 +- BasicTitle 组件 `showSpan`=> `span`
8 16  
9 17 ### ✨ Features
10 18  
11 19 - 缓存可以配置是否加密,默认生产环境开启 Aes 加密
12 20 - 新增标签页拖拽排序
13   -- 除示例外加入全局国际化功能，支持中文与英文
14 21  
15 22 ### 🎫 Chores
16 23  
... ...
README.md
  View file @73c8e0c
... ... @@ -69,7 +69,7 @@
69 69 ### 环境要求
70 70  
71 71 - `Node.js`: - 版本最好大于 `12.0.0`
72   -- `yarn` > `npm` > `cnpm`: - 包管理工具.
  72 +- `yarn` : - 包管理工具.
73 73  
74 74 ### UI 框架
75 75  
... ...
package.json
  View file @73c8e0c
... ... @@ -38,6 +38,7 @@
38 38 "vue": "^3.0.3",
39 39 "vue-i18n": "^9.0.0-beta.8",
40 40 "vue-router": "^4.0.0-rc.5",
  41 + "vue-types": "^3.0.1",
41 42 "vuex": "^4.0.0-rc.2",
42 43 "vuex-module-decorators": "^1.0.1",
43 44 "xlsx": "^0.16.9",
... ...
src/components/Application/index.ts
  View file @73c8e0c
1 1 import AppLocalePicker from './src/AppLocalePicker.vue';
2   -import AppPageFooter from './src/AppPageFooter.vue';
3 2 import AppLogo from './src/AppLogo.vue';
4 3 import { withInstall } from '../util';
5 4  
6   -export { AppLocalePicker, AppPageFooter, AppLogo };
  5 +export { AppLocalePicker, AppLogo };
7 6  
8   -export default withInstall(AppLocalePicker, AppPageFooter, AppLogo);
  7 +export default withInstall(AppLocalePicker, AppLogo);
... ...
src/components/Application/src/AppLocalePicker.vue
  View file @73c8e0c
... ... @@ -23,18 +23,16 @@
23 23  
24 24 import { LocaleType } from '/@/locales/types';
25 25  
  26 + import { propTypes } from '/@/utils/propTypes';
  27 +
26 28 export default defineComponent({
27 29 name: 'AppLocalPicker',
28 30 components: { GlobalOutlined, Dropdown },
29 31 props: {
30   - showText: {
31   - type: Boolean,
32   - default: true,
33   - },
34   - reload: {
35   - type: Boolean,
36   - default: false,
37   - },
  32 + // Whether to display text
  33 + showText: propTypes.bool.def(true),
  34 + // Whether to refresh the interface when changing
  35 + reload: propTypes.bool,
38 36 },
39 37 setup(props) {
40 38 const { localeList } = useLocaleSetting();
... ...
src/components/Application/src/AppLogo.vue
  View file @73c8e0c
... ... @@ -9,7 +9,6 @@
9 9 </div>
10 10 </template>
11 11 <script lang="ts">
12   - import type { PropType } from 'vue';
13 12 import { defineComponent } from 'vue';
14 13  
15 14 import { useGlobSetting } from '/@/hooks/setting';
... ... @@ -18,23 +17,23 @@
18 17  
19 18 import { PageEnum } from '/@/enums/pageEnum';
20 19  
  20 + import { propTypes } from '/@/utils/propTypes';
  21 +
21 22 export default defineComponent({
22 23 name: 'AppLogo',
23 24 props: {
24 25 /**
25 26 * The theme of the current parent component
26 27 */
27   - theme: {
28   - type: String as PropType<string>,
29   - },
30   - showTitle: {
31   - type: Boolean,
32   - default: true,
33   - },
  28 + theme: propTypes.oneOf(['light', 'dark']),
  29 + // Whether to show title
  30 + showTitle: propTypes.bool.def(true),
34 31 },
35 32 setup() {
36 33 const { getCollapsedShowTitle } = useMenuSetting();
  34 +
37 35 const globSetting = useGlobSetting();
  36 +
38 37 const go = useGo();
39 38  
40 39 function handleGoHome(): void {
... ...
src/components/Basic/index.ts
  View file @73c8e0c
1   -export { default as BasicArrow } from './src/BasicArrow.vue';
2   -export { default as BasicHelp } from './src/BasicHelp.vue';
3   -export { default as BasicTitle } from './src/BasicTitle.vue';
  1 +import BasicArrow from './src/BasicArrow.vue';
  2 +import BasicHelp from './src/BasicHelp.vue';
  3 +import BasicTitle from './src/BasicTitle.vue';
  4 +
  5 +import { withInstall } from '../util';
  6 +
  7 +export { BasicArrow, BasicHelp, BasicTitle };
  8 +
  9 +export default withInstall(BasicArrow, BasicHelp, BasicTitle);
... ...
src/components/Basic/src/BasicArrow.vue
  View file @73c8e0c
... ... @@ -8,27 +8,30 @@
8 8 </span>
9 9 </template>
10 10 <script lang="ts">
11   - import type { PropType } from 'vue';
12   -
13 11 import { defineComponent, computed } from 'vue';
14 12 import { RightOutlined } from '@ant-design/icons-vue';
  13 + import { propTypes } from '/@/utils/propTypes';
15 14  
16 15 export default defineComponent({
17 16 name: 'BasicArrow',
18 17 components: { RightOutlined },
19 18 props: {
20 19 // Expand contract, expand by default
21   - expand: {
22   - type: Boolean as PropType<boolean>,
23   - default: true,
24   - },
  20 + expand: propTypes.bool,
  21 + top: propTypes.bool,
  22 + bottom: propTypes.bool,
25 23 },
26 24 setup(props) {
27 25 const getClass = computed(() => {
28   - const preCls = 'base-arrow';
29   - const cls = [preCls];
30   - props.expand && cls.push(`${preCls}__active`);
31   - return cls;
  26 + const { expand, top, bottom } = props;
  27 + return [
  28 + 'base-arrow',
  29 + {
  30 + 'base-arrow__active': expand,
  31 + top,
  32 + bottom,
  33 + },
  34 + ];
32 35 });
33 36  
34 37 return {
... ... @@ -39,26 +42,29 @@
39 42 </script>
40 43 <style lang="less" scoped>
41 44 .base-arrow {
42   - transform: rotate(-90deg);
  45 + display: inline-block;
  46 + transform: rotate(0deg);
43 47 transition: all 0.3s ease 0.1s;
44 48 transform-origin: center center;
45 49  
46   - &.right {
47   - transform: rotate(0deg);
  50 + &__active {
  51 + transform: rotate(90deg);
  52 + }
  53 +
  54 + &.top {
  55 + transform: rotate(-90deg);
  56 + }
48 57  
49   - > span {
50   - transition: all 0.3s ease 0.1s !important;
51   - }
  58 + &.bottom {
  59 + transform: rotate(90deg);
52 60 }
53 61  
54   - &__active {
  62 + &.top.base-arrow__active {
55 63 transform: rotate(90deg);
56 64 }
57 65  
58   - &.right.base-arrow__active {
59   - span {
60   - transform: rotate(90deg);
61   - }
  66 + &.bottom.base-arrow__active {
  67 + transform: rotate(-90deg);
62 68 }
63 69 }
64 70 </style>
... ...
src/components/Basic/src/BasicHelp.vue
  View file @73c8e0c
1 1 <script lang="ts">
2   - import type { PropType } from 'vue';
  2 + import type { CSSProperties, PropType } from 'vue';
3 3 import { defineComponent, computed, unref, h } from 'vue';
4 4  
5 5 import { Tooltip } from 'ant-design-vue';
... ... @@ -8,37 +8,24 @@
8 8 import { getPopupContainer } from '/@/utils';
9 9 import { isString, isArray } from '/@/utils/is';
10 10 import { getSlot } from '/@/utils/helper/tsxHelper';
  11 + import { propTypes } from '/@/utils/propTypes';
11 12 export default defineComponent({
12 13 name: 'BasicHelp',
13 14 components: { Tooltip },
14 15 props: {
15 16 // max-width
16   - maxWidth: {
17   - type: String as PropType<string>,
18   - default: '600px',
19   - },
  17 + maxWidth: propTypes.string.def('600px'),
20 18 // Whether to display the serial number
21   - showIndex: {
22   - type: Boolean as PropType<boolean>,
23   - default: false,
24   - },
  19 + showIndex: propTypes.bool,
  20 + // color
  21 + color: propTypes.string.def('#ffffff'),
  22 + fontSize: propTypes.string.def('14px'),
  23 + placement: propTypes.string.def('right'),
  24 + absolute: propTypes.bool,
25 25 // Text list
26 26 text: {
27 27 type: [Array, String] as PropType<string[] | string>,
28 28 },
29   - // color
30   - color: {
31   - type: String as PropType<string>,
32   - default: '#ffffff',
33   - },
34   - fontSize: {
35   - type: String as PropType<string>,
36   - default: '14px',
37   - },
38   - absolute: {
39   - type: Boolean as PropType<boolean>,
40   - default: false,
41   - },
42 29 // 定位
43 30 position: {
44 31 type: [Object] as PropType<any>,
... ... @@ -48,24 +35,24 @@
48 35 bottom: 0,
49 36 }),
50 37 },
51   - placement: {
52   - type: String as PropType<string>,
53   - defualt: 'right',
54   - },
55 38 },
56 39 setup(props, { slots }) {
57   - const getOverlayStyleRef = computed(() => {
58   - return {
59   - maxWidth: props.maxWidth,
60   - };
61   - });
  40 + const getOverlayStyleRef = computed(
  41 + (): CSSProperties => {
  42 + return {
  43 + maxWidth: props.maxWidth,
  44 + };
  45 + }
  46 + );
62 47  
63   - const getWrapStyleRef = computed(() => {
64   - return {
65   - color: props.color,
66   - fontSize: props.fontSize,
67   - };
68   - });
  48 + const getWrapStyleRef = computed(
  49 + (): CSSProperties => {
  50 + return {
  51 + color: props.color,
  52 + fontSize: props.fontSize,
  53 + };
  54 + }
  55 + );
69 56  
70 57 const getMainStyleRef = computed(() => {
71 58 return props.absolute ? props.position : {};
... ... @@ -73,14 +60,17 @@
73 60  
74 61 const renderTitle = () => {
75 62 const list = props.text;
  63 +
76 64 if (isString(list)) {
77 65 return h('p', list);
78 66 }
  67 +
79 68 if (isArray(list)) {
80 69 return list.map((item, index) => {
81 70 return h('p', { key: item }, [props.showIndex ? `${index + 1}. ` : '', item]);
82 71 });
83 72 }
  73 +
84 74 return null;
85 75 };
86 76  
... ... @@ -95,7 +85,7 @@
95 85 style: unref(getWrapStyleRef),
96 86 },
97 87 [renderTitle()]
98   - ) as any,
  88 + ),
99 89 overlayClassName: 'base-help__wrap',
100 90 autoAdjustOverflow: true,
101 91 overlayStyle: unref(getOverlayStyleRef),
... ...
src/components/Basic/src/BasicTitle.vue
  View file @73c8e0c
1 1 <template>
2   - <span class="base-title" :class="{ 'show-span': showSpan && $slots.default }">
  2 + <span class="base-title" :class="{ 'show-span': span && $slots.default }">
3 3 <slot />
4 4 <BasicHelp class="base-title__help" v-if="helpMessage" :text="helpMessage" />
5 5 </span>
... ... @@ -10,6 +10,7 @@
10 10 import { defineComponent } from 'vue';
11 11  
12 12 import BasicHelp from './BasicHelp.vue';
  13 + import { propTypes } from '/@/utils/propTypes';
13 14  
14 15 export default defineComponent({
15 16 name: 'BasicTitle',
... ... @@ -19,13 +20,7 @@
19 20 type: [String, Array] as PropType<string | string[]>,
20 21 default: '',
21 22 },
22   - showSpan: {
23   - type: Boolean as PropType<boolean>,
24   - default: false,
25   - },
26   - },
27   - setup() {
28   - return {};
  23 + span: propTypes.bool,
29 24 },
30 25 });
31 26 </script>
... ...
src/components/Breadcrumb/index.ts 0 → 100644
  View file @73c8e0c
  1 +import Breadcrumb from './src/Breadcrumb.vue';
  2 +import BreadcrumbItem from './src/BreadcrumbItem.vue';
  3 +import { withInstall } from '../util';
  4 +
  5 +export { Breadcrumb, BreadcrumbItem };
  6 +
  7 +export default withInstall(Breadcrumb, BreadcrumbItem);
... ...
src/components/Breadcrumb/Breadcrumb.vue renamed to src/components/Breadcrumb/src/Breadcrumb.vue
  View file @73c8e0c
... ... @@ -5,20 +5,14 @@
5 5 </template>
6 6  
7 7 <script lang="ts">
8   - import type { PropType } from 'vue';
9 8 import { defineComponent, provide, ref } from 'vue';
  9 + import { propTypes } from '/@/utils/propTypes';
10 10  
11 11 export default defineComponent({
12 12 name: 'Breadcrumb',
13 13 props: {
14   - separator: {
15   - type: String as PropType<string>,
16   - default: '/',
17   - },
18   - separatorClass: {
19   - type: String as PropType<string>,
20   - default: '',
21   - },
  14 + separator: propTypes.string.def('/'),
  15 + separatorClass: propTypes.string,
22 16 },
23 17 setup(props) {
24 18 const breadcrumbRef = ref<Nullable<HTMLElement>>(null);
... ... @@ -32,7 +26,7 @@
32 26 });
33 27 </script>
34 28 <style lang="less">
35   - @import (reference) '../../design/index.less';
  29 + @import (reference) '../../../design/index.less';
36 30  
37 31 .breadcrumb {
38 32 .unselect();
... ...
src/components/Breadcrumb/BreadcrumbItem.vue renamed to src/components/Breadcrumb/src/BreadcrumbItem.vue
  View file @73c8e0c
... ... @@ -13,21 +13,14 @@
13 13 import { useRouter } from 'vue-router';
14 14 import { useEventListener } from '/@/hooks/event/useEventListener';
15 15  
  16 + import { propTypes } from '/@/utils/propTypes';
  17 +
16 18 export default defineComponent({
17 19 name: 'BreadcrumbItem',
18 20 props: {
19   - to: {
20   - type: [String, Object],
21   - default: '',
22   - },
23   - replace: {
24   - type: Boolean,
25   - default: false,
26   - },
27   - isLink: {
28   - type: Boolean,
29   - default: false,
30   - },
  21 + to: propTypes.oneOfType([propTypes.string, propTypes.object]),
  22 + replace: propTypes.bool,
  23 + isLink: propTypes.bool,
31 24 },
32 25 setup(props) {
33 26 const linkRef = ref<Nullable<HTMLElement>>(null);
... ...
src/components/Button/index.ts 0 → 100644
  View file @73c8e0c
  1 +import Button from './src/BasicButton.vue';
  2 +import { withInstall } from '../util';
  3 +
  4 +export { Button };
  5 +
  6 +export default withInstall(Button);
... ...
src/components/Button/index.vue renamed to src/components/Button/src/BasicButton.vue
  View file @73c8e0c
... ... @@ -8,51 +8,33 @@
8 8 </Button>
9 9 </template>
10 10 <script lang="ts">
11   - import { PropType } from 'vue';
12   -
13 11 import { defineComponent, computed } from 'vue';
  12 +
14 13 import { Button } from 'ant-design-vue';
15 14 import Icon from '/@/components/Icon';
  15 + import { propTypes } from '/@/utils/propTypes';
  16 +
16 17 export default defineComponent({
17 18 name: 'AButton',
18 19 inheritAttrs: false,
19 20 components: { Button, Icon },
20 21 props: {
21   - type: {
22   - type: String as PropType<'primary' | 'default' | 'danger' | 'dashed' | 'link'>,
23   - default: 'default',
24   - },
25   - color: {
26   - type: String as PropType<'error' | 'warning' | 'success' | ''>,
27   - },
28   - loading: {
29   - type: Boolean as PropType<boolean>,
30   - default: false,
31   - },
32   - disabled: {
33   - type: Boolean as PropType<boolean>,
34   - default: false,
35   - },
36   - preIcon: {
37   - type: String as PropType<string>,
38   - },
39   - postIcon: {
40   - type: String as PropType<string>,
41   - },
  22 + type: propTypes.oneOf(['primary', 'default', 'danger', 'dashed', 'link']).def('default'),
  23 + color: propTypes.oneOf(['error', 'warning', 'success', '']),
  24 + loading: propTypes.bool,
  25 + disabled: propTypes.bool,
  26 + preIcon: propTypes.string,
  27 + postIcon: propTypes.string,
42 28 },
43 29 setup(props, { attrs }) {
44   - const getIsCircleBtn = computed(() => {
45   - return attrs.shape === 'circle';
46   - });
  30 + const getIsCircleBtn = computed(() => attrs.shape === 'circle');
47 31  
48 32 const getColor = computed(() => {
49 33 const { color, disabled } = props;
50   - return [
51   - {
52   - [`ant-btn-${color}`]: !!color,
53   - [`is-disabled`]: disabled,
54   - },
55   - ];
  34 + return {
  35 + [`ant-btn-${color}`]: !!color,
  36 + [`is-disabled`]: disabled,
  37 + };
56 38 });
57 39  
58 40 const getBindValue = computed((): any => {
... ...
src/components/Button/types.ts deleted 100644 → 0
  View file @1901129
1   -import { VNodeChild } from 'vue';
2   -
3   -export interface BasicButtonProps {
4   - /**
5   - * can be set to primary ghost dashed danger(added in 2.7) or omitted (meaning default)
6   - * @default 'default'
7   - * @type string
8   - */
9   - type?: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default';
10   -
11   - /**
12   - * set the original html type of button
13   - * @default 'button'
14   - * @type string
15   - */
16   - htmlType?: 'button' | 'submit' | 'reset' | 'menu';
17   -
18   - /**
19   - * set the icon of button
20   - * @type string
21   - */
22   - icon?: VNodeChild | JSX.Element;
23   -
24   - /**
25   - * can be set to circle or circle-outline or omitted
26   - * @type string
27   - */
28   - shape?: 'circle' | 'circle-outline';
29   -
30   - /**
31   - * can be set to small large or omitted
32   - * @default 'default'
33   - * @type string
34   - */
35   - size?: 'small' | 'large' | 'default';
36   -
37   - /**
38   - * set the loading status of button
39   - * @default false
40   - * @type boolean | { delay: number }
41   - */
42   - loading?: boolean | { delay: number };
43   -
44   - /**
45   - * disabled state of button
46   - * @default false
47   - * @type boolean
48   - */
49   - disabled?: boolean;
50   -
51   - /**
52   - * make background transparent and invert text and border colors, added in 2.7
53   - * @default false
54   - * @type boolean
55   - */
56   - ghost?: boolean;
57   -
58   - /**
59   - * option to fit button width to its parent width
60   - * @default false
61   - * @type boolean
62   - */
63   - block?: boolean;
64   -
65   - onClick?: (e?: Event) => void;
66   -}
src/components/ClickOutSide/index.ts 0 → 100644
  View file @73c8e0c
  1 +import ClickOutSide from './src/index.vue';
  2 +import { withInstall } from '../util';
  3 +
  4 +export { ClickOutSide };
  5 +
  6 +export default withInstall(ClickOutSide);
... ...
src/components/ClickOutSide/index.vue renamed to src/components/ClickOutSide/src/index.vue
  View file @73c8e0c
... ... @@ -9,9 +9,8 @@
9 9  
10 10 export default defineComponent({
11 11 name: 'ClickOutSide',
12   -
13 12 setup(_, { emit }) {
14   - const wrapRef = ref<Nullable<HTMLDivElement | null>>(null);
  13 + const wrapRef = ref<ElRef>(null);
15 14  
16 15 useClickOutside(wrapRef as Ref<HTMLDivElement>, () => {
17 16 emit('clickOutside');
... ...
src/components/Container/index.ts
  View file @73c8e0c
1   -export { default as ScrollContainer } from './src/ScrollContainer.vue';
2   -export { default as CollapseContainer } from './src/collapse/CollapseContainer.vue';
3   -export { default as LazyContainer } from './src/LazyContainer.vue';
  1 +import ScrollContainer from './src/ScrollContainer.vue';
  2 +import CollapseContainer from './src/collapse/CollapseContainer.vue';
  3 +import LazyContainer from './src/LazyContainer.vue';
  4 +import { withInstall } from '../util';
4 5  
5   -export * from './src/types.d';
  6 +export * from './src/types';
  7 +
  8 +export { ScrollContainer, CollapseContainer, LazyContainer };
  9 +
  10 +export default withInstall(ScrollContainer, CollapseContainer, LazyContainer);
... ...
src/components/Container/src/LazyContainer.vue
  View file @73c8e0c
... ... @@ -24,19 +24,20 @@
24 24 import { Skeleton } from 'ant-design-vue';
25 25 import { useTimeoutFn } from '/@/hooks/core/useTimeout';
26 26 import { useIntersectionObserver } from '/@/hooks/event/useIntersectionObserver';
  27 + import { propTypes } from '/@/utils/propTypes';
  28 +
27 29 interface State {
28 30 isInit: boolean;
29 31 loading: boolean;
30 32 intersectionObserverInstance: IntersectionObserver | null;
31 33 }
  34 +
32 35 export default defineComponent({
33 36 name: 'LazyContainer',
34 37 components: { Skeleton },
35 38 props: {
36 39 // Waiting time, if the time is specified, whether visible or not, it will be automatically loaded after the specified time
37   - timeout: {
38   - type: Number as PropType<number>,
39   - },
  40 + timeout: propTypes.number,
40 41  
41 42 // The viewport where the component is located. If the component is scrolling in the page container, the viewport is the container
42 43 viewport: {
... ... @@ -47,33 +48,18 @@
47 48 },
48 49  
49 50 // Preload threshold, css unit
50   - threshold: {
51   - type: String as PropType<string>,
52   - default: '0px',
53   - },
  51 + threshold: propTypes.string.def('0px'),
54 52  
55 53 // The scroll direction of the viewport, vertical represents the vertical direction, horizontal represents the horizontal direction
56   - direction: {
57   - type: String as PropType<'vertical' | 'horizontal'>,
58   - default: 'vertical',
59   - },
  54 + direction: propTypes.oneOf(['vertical', 'horizontal']).def('vertical'),
60 55  
61 56 // The label name of the outer container that wraps the component
62   - tag: {
63   - type: String as PropType<string>,
64   - default: 'div',
65   - },
  57 + tag: propTypes.string.def('div'),
66 58  
67   - maxWaitingTime: {
68   - type: Number as PropType<number>,
69   - default: 80,
70   - },
  59 + maxWaitingTime: propTypes.number.def(80),
71 60  
72 61 // transition name
73   - transitionName: {
74   - type: String as PropType<string>,
75   - default: 'lazy-container',
76   - },
  62 + transitionName: propTypes.string.def('lazy-container'),
77 63 },
78 64 emits: ['init'],
79 65 setup(props, { emit }) {
... ...
src/components/Container/src/ScrollContainer.vue
  View file @73c8e0c
... ... @@ -10,11 +10,9 @@
10 10 </template>
11 11  
12 12 <script lang="ts">
13   - // component
14 13 import { defineComponent, ref, unref, nextTick } from 'vue';
15 14 import { Scrollbar } from '/@/components/Scrollbar';
16 15  
17   - // hook
18 16 import { useScrollTo } from '/@/hooks/event/useScrollTo';
19 17  
20 18 export default defineComponent({
... ... @@ -26,6 +24,7 @@
26 24 function scrollTo(to: number, duration = 500) {
27 25 const scrollbar = unref(scrollbarRef);
28 26 if (!scrollbar) return;
  27 +
29 28 nextTick(() => {
30 29 const { start } = useScrollTo({
31 30 el: unref(scrollbar.$.wrap),
... ... @@ -45,6 +44,7 @@
45 44 function scrollBottom() {
46 45 const scrollbar = unref(scrollbarRef);
47 46 if (!scrollbar) return;
  47 +
48 48 nextTick(() => {
49 49 const scrollHeight = scrollbar.$.wrap.scrollHeight as number;
50 50 const { start } = useScrollTo({
... ... @@ -54,6 +54,7 @@
54 54 start();
55 55 });
56 56 }
  57 +
57 58 return {
58 59 scrollbarRef,
59 60 scrollTo,
... ...
src/components/Container/src/collapse/CollapseContainer.vue
  View file @73c8e0c
... ... @@ -5,6 +5,7 @@
5 5 <slot name="title" />
6 6 </template>
7 7 </CollapseHeader>
  8 +
8 9 <CollapseTransition :enable="canExpan">
9 10 <Skeleton v-if="loading" />
10 11 <div class="collapse-container__body" v-else v-show="show">
... ... @@ -22,36 +23,31 @@
22 23 <script lang="ts">
23 24 import type { PropType } from 'vue';
24 25  
25   - import { defineComponent, ref, unref } from 'vue';
  26 + import { defineComponent, ref } from 'vue';
  27 +
26 28 // component
  29 + import { Skeleton } from 'ant-design-vue';
27 30 import { CollapseTransition } from '/@/components/Transition/index';
28 31 import CollapseHeader from './CollapseHeader.vue';
29   - import { Skeleton } from 'ant-design-vue';
30   -
31 32 import LazyContainer from '../LazyContainer.vue';
32 33  
33 34 import { triggerWindowResize } from '/@/utils/event/triggerWindowResizeEvent';
34 35 // hook
35 36 import { useTimeoutFn } from '/@/hooks/core/useTimeout';
  37 + import { propTypes } from '/@/utils/propTypes';
36 38  
37 39 export default defineComponent({
  40 + name: 'CollapseContainer',
38 41 components: {
39 42 Skeleton,
40 43 LazyContainer,
41 44 CollapseHeader,
42 45 CollapseTransition,
43 46 },
44   - name: 'CollapseContainer',
45 47 props: {
46   - title: {
47   - type: String as PropType<string>,
48   - default: '',
49   - },
  48 + title: propTypes.string.def(''),
50 49 // Can it be expanded
51   - canExpan: {
52   - type: Boolean as PropType<boolean>,
53   - default: true,
54   - },
  50 + canExpan: propTypes.bool.def(true),
55 51 // Warm reminder on the right side of the title
56 52 helpMessage: {
57 53 type: [Array, String] as PropType<string[] | string>,
... ... @@ -59,41 +55,27 @@
59 55 },
60 56 // Whether to trigger window.resize when expanding and contracting,
61 57 // Can adapt to tables and forms, when the form shrinks, the form triggers resize to adapt to the height
62   - triggerWindowResize: {
63   - type: Boolean as PropType<boolean>,
64   - default: false,
65   - },
66   - loading: {
67   - type: Boolean as PropType<boolean>,
68   - default: false,
69   - },
  58 + triggerWindowResize: propTypes.bool,
  59 + loading: propTypes.bool,
70 60 // Delayed loading
71   - lazy: {
72   - type: Boolean as PropType<boolean>,
73   - default: false,
74   - },
  61 + lazy: propTypes.bool,
75 62 // Delayed loading time
76   - lazyTime: {
77   - type: Number as PropType<number>,
78   - default: 0,
79   - },
  63 + lazyTime: propTypes.number.def(0),
80 64 },
81 65 setup(props) {
82   - const showRef = ref(true);
  66 + const show = ref(true);
83 67 /**
84 68 * @description: Handling development events
85 69 */
86 70 function handleExpand() {
87   - const hasShow = !unref(showRef);
88   - showRef.value = hasShow;
89   -
  71 + show.value = !show.value;
90 72 if (props.triggerWindowResize) {
91 73 // 200 milliseconds here is because the expansion has animation,
92 74 useTimeoutFn(triggerWindowResize, 200);
93 75 }
94 76 }
95 77 return {
96   - show: showRef,
  78 + show,
97 79 handleExpand,
98 80 };
99 81 },
... ...
src/components/Container/src/collapse/CollapseHeader.vue
  View file @73c8e0c
... ... @@ -11,7 +11,7 @@
11 11  
12 12 <div class="collapse-container__action">
13 13 <slot name="action" />
14   - <BasicArrow v-if="$attrs.canExpan" :expand="$attrs.show" @click="$emit('expand')" />
  14 + <BasicArrow v-if="$attrs.canExpan" top :expand="$attrs.show" @click="$emit('expand')" />
15 15 </div>
16 16 </div>
17 17 </template>
... ...
src/components/Container/src/types.d.ts renamed to src/components/Container/src/types.ts
  View file @73c8e0c
src/components/ContextMenu/index.ts
  View file @73c8e0c
1 1 export { createContextMenu, destroyContextMenu } from './src/createContextMenu';
  2 +
2 3 export * from './src/types';
... ...
src/components/ContextMenu/src/props.ts
  View file @73c8e0c
1   -import type { PropType, CSSProperties } from 'vue';
  1 +import type { PropType } from 'vue';
2 2 import type { Axis, ContextMenuItem } from './types';
  3 +import { propTypes } from '/@/utils/propTypes';
3 4 export const props = {
4   - width: {
5   - type: Number as PropType<number>,
6   - default: 156,
7   - },
  5 + width: propTypes.number.def(156),
8 6 customEvent: {
9 7 type: Object as PropType<Event>,
10 8 default: null,
11 9 },
12   - styles: {
13   - type: Object as PropType<CSSProperties>,
14   - default: null,
15   - },
16   - showIcon: {
17   - type: Boolean as PropType<boolean>,
18   - default: true,
19   - },
  10 + styles: propTypes.style,
  11 + showIcon: propTypes.bool.def(true),
20 12 axis: {
21 13 // The position of the right mouse button click
22 14 type: Object as PropType<Axis>,
... ...
src/components/ContextMenu/src/types.ts
  View file @73c8e0c
... ... @@ -29,7 +29,7 @@ export interface ContextMenuProps {
29 29 }
30 30  
31 31 export interface ItemContentProps {
32   - showIcon: boolean;
  32 + showIcon: boolean | undefined;
33 33 item: ContextMenuItem;
34 34 handler: Fn;
35 35 }
... ...
src/components/CountTo/index.ts
  View file @73c8e0c
1 1 // Transform vue-count-to to support vue3 version
2   -export { default as CountTo } from './src/index.vue';
  2 +
  3 +import CountTo from './src/index.vue';
  4 +import { withInstall } from '../util';
  5 +
  6 +export { CountTo };
  7 +
  8 +export default withInstall(CountTo);
... ...
src/components/CountTo/src/props.ts
  View file @73c8e0c
1 1 import { PropType } from 'vue';
  2 +import { propTypes } from '/@/utils/propTypes';
2 3 export const countToProps = {
3   - startVal: {
4   - type: Number as PropType<number>,
5   - required: false,
6   - default: 0,
7   - },
8   - endVal: {
9   - type: Number as PropType<number>,
10   - required: false,
11   - default: 2017,
12   - },
13   - duration: {
14   - type: Number as PropType<number>,
15   - required: false,
16   - default: 3000,
17   - },
18   - autoplay: {
19   - type: Boolean as PropType<boolean>,
20   - required: false,
21   - default: true,
22   - },
  4 + startVal: propTypes.number.def(0),
  5 + endVal: propTypes.number.def(2020),
  6 + duration: propTypes.number.def(1300),
  7 + autoplay: propTypes.bool.def(true),
23 8 decimals: {
24 9 type: Number as PropType<number>,
25 10 required: false,
... ... @@ -28,31 +13,11 @@ export const countToProps = {
28 13 return value >= 0;
29 14 },
30 15 },
31   - decimal: {
32   - type: String as PropType<string>,
33   - required: false,
34   - default: '.',
35   - },
36   - separator: {
37   - type: String as PropType<string>,
38   - required: false,
39   - default: ',',
40   - },
41   - prefix: {
42   - type: String as PropType<string>,
43   - required: false,
44   - default: '',
45   - },
46   - suffix: {
47   - type: String as PropType<string>,
48   - required: false,
49   - default: '',
50   - },
51   - useEasing: {
52   - type: Boolean as PropType<boolean>,
53   - required: false,
54   - default: true,
55   - },
  16 + decimal: propTypes.string.def('.'),
  17 + separator: propTypes.string.def(','),
  18 + prefix: propTypes.string.def(''),
  19 + suffix: propTypes.string.def(''),
  20 + useEasing: propTypes.bool.def(true),
56 21 easingFn: {
57 22 type: Function as PropType<(t: number, b: number, c: number, d: number) => number>,
58 23 default(t: number, b: number, c: number, d: number) {
... ...
src/components/Description/src/index.tsx
  View file @73c8e0c
1   -import { defineComponent, computed, ref, unref } from 'vue';
  1 +import type { DescOptions, DescInstance, DescItem } from './types';
  2 +
  3 +import { defineComponent, computed, ref, unref, CSSProperties } from 'vue';
2 4 import { Descriptions } from 'ant-design-vue';
3 5 import { CollapseContainer, CollapseContainerOptions } from '/@/components/Container/index';
4   -import type { DescOptions, DescInstance, DescItem } from './types';
5 6 import descProps from './props';
6 7  
7 8 import { isFunction } from '/@/utils/is';
... ... @@ -11,6 +12,7 @@ import { deepMerge } from &#39;/@/utils&#39;;
11 12  
12 13 const prefixCls = 'description';
13 14 export default defineComponent({
  15 + name: 'Description',
14 16 props: descProps,
15 17 emits: ['register'],
16 18 setup(props, { attrs, slots, emit }) {
... ... @@ -72,17 +74,13 @@ export default defineComponent({
72 74 if (!labelStyle && !labelMinWidth) {
73 75 return label;
74 76 }
75   - return (
76   - <div
77   - style={{
78   - ...labelStyle,
79 77  
80   - minWidth: `${labelMinWidth}px`,
81   - }}
82   - >
83   - {label}
84   - </div>
85   - );
  78 + const labelStyles: CSSProperties = {
  79 + ...labelStyle,
  80 +
  81 + minWidth: `${labelMinWidth}px `,
  82 + };
  83 + return <div style={labelStyles}>{label}</div>;
86 84 }
87 85  
88 86 function renderItem() {
... ... @@ -90,9 +88,11 @@ export default defineComponent({
90 88 return unref(schema).map((item) => {
91 89 const { render, field, span, show, contentMinWidth } = item;
92 90 const { data } = unref(getProps) as any;
  91 +
93 92 if (show && isFunction(show) && !show(data)) {
94 93 return null;
95 94 }
  95 +
96 96 const getContent = () =>
97 97 isFunction(render)
98 98 ? render(data && data[field], data)
... ... @@ -130,12 +130,9 @@ export default defineComponent({
130 130 const renderContainer = () => {
131 131 const content = props.useCollapse ? renderDesc() : <div>{renderDesc()}</div>;
132 132 // Reduce the dom level
  133 + const { title, canExpand, helpMessage } = unref(getCollapseOptions);
133 134 return props.useCollapse ? (
134   - <CollapseContainer
135   - title={unref(getMergeProps).title}
136   - canExpan={unref(getCollapseOptions).canExpand}
137   - helpMessage={unref(getCollapseOptions).helpMessage}
138   - >
  135 + <CollapseContainer title={title} canExpan={canExpand} helpMessage={helpMessage}>
139 136 {{
140 137 default: () => content,
141 138 action: () => getSlot(slots, 'action'),
... ...
src/components/Description/src/props.ts
  View file @73c8e0c
1 1 import type { PropType } from 'vue';
  2 +import type { CollapseContainerOptions } from '/@/components/Container';
2 3 import type { DescItem } from './types';
3 4  
  5 +import { propTypes } from '/@/utils/propTypes';
4 6 export default {
5   - useCollapse: {
6   - type: Boolean as PropType<boolean>,
7   - default: true,
8   - },
9   - title: {
10   - type: String as PropType<string>,
11   - default: '',
12   - },
13   - size: {
14   - type: String as PropType<'small' | 'default' | 'middle' | undefined>,
15   - default: 'small',
16   - },
17   - bordered: {
18   - type: Boolean as PropType<boolean>,
19   - default: true,
20   - },
  7 + useCollapse: propTypes.bool.def(true),
  8 + title: propTypes.string.def(''),
  9 + size: propTypes.oneOf(['small', 'default', 'middle', undefined]).def('small'),
  10 + bordered: propTypes.bool.def(true),
21 11 column: {
22 12 type: [Number, Object] as PropType<number | any>,
23 13 default: () => {
... ... @@ -25,15 +15,12 @@ export default {
25 15 },
26 16 },
27 17 collapseOptions: {
28   - type: Object as PropType<any>,
  18 + type: Object as PropType<CollapseContainerOptions>,
29 19 default: null,
30 20 },
31 21 schema: {
32 22 type: Array as PropType<Array<DescItem>>,
33 23 default: () => [],
34 24 },
35   - data: {
36   - type: Object as PropType<any>,
37   - default: null,
38   - },
  25 + data: propTypes.object,
39 26 };
... ...
src/components/Description/src/types.ts
  View file @73c8e0c
... ... @@ -88,6 +88,7 @@ export interface DescInstance {
88 88 }
89 89  
90 90 export type Register = (descInstance: DescInstance) => void;
  91 +
91 92 /**
92 93 * @description:
93 94 */
... ...
src/components/Description/src/useDescription.ts
  View file @73c8e0c
... ... @@ -7,13 +7,11 @@ export function useDescription(props?: Partial&lt;DescOptions&gt;): UseDescReturnType
7 7 if (!getCurrentInstance()) {
8 8 throw new Error('Please put useDescription function in the setup function!');
9 9 }
10   - const descRef = ref<DescInstance | null>(null);
  10 + const descRef = ref<Nullable<DescInstance>>(null);
11 11 const loadedRef = ref(false);
12 12  
13 13 function register(instance: DescInstance) {
14   - if (unref(loadedRef) && isProdMode()) {
15   - return;
16   - }
  14 + if (unref(loadedRef) && isProdMode()) return;
17 15 descRef.value = instance;
18 16 props && instance.setDescProps(props);
19 17 loadedRef.value = true;
... ... @@ -24,5 +22,6 @@ export function useDescription(props?: Partial&lt;DescOptions&gt;): UseDescReturnType
24 22 unref(descRef)!.setDescProps(descProps);
25 23 },
26 24 };
  25 +
27 26 return [register, methods];
28 27 }
... ...
src/components/Dropdown/index.ts
  View file @73c8e0c
1   -export { default as Dropdown } from './src/Dropdown';
  1 +import Dropdown from './src/Dropdown';
  2 +import { withInstall } from '../util';
  3 +
2 4 export * from './src/types';
  5 +
  6 +export { Dropdown };
  7 +export default withInstall(Dropdown);
... ...
src/components/Dropdown/src/Dropdown.tsx
  View file @73c8e0c
... ... @@ -2,7 +2,6 @@ import type { Trigger } from &#39;./types&#39;;
2 2  
3 3 import { defineComponent, computed, unref } from 'vue';
4 4 import { Dropdown, Menu } from 'ant-design-vue';
5   -
6 5 import Icon from '/@/components/Icon/index';
7 6  
8 7 import { basicDropdownProps } from './props';
... ...
src/components/Excel/index.ts
  View file @73c8e0c
1   -export { default as ImportExcel } from './src/ImportExcel.vue';
2   -export { default as ExportExcelModel } from './src/ExportExcelModel.vue';
  1 +import ImportExcel from './src/ImportExcel.vue';
  2 +import ExportExcelModel from './src/ExportExcelModel.vue';
3 3  
4   -export { jsonToSheetXlsx, aoaToSheetXlsx } from './src/Export2Excel';
  4 +import { withInstall } from '../util';
5 5  
6 6 export * from './src/types';
  7 +
  8 +export { jsonToSheetXlsx, aoaToSheetXlsx } from './src/Export2Excel';
  9 +
  10 +export { ImportExcel, ExportExcelModel };
  11 +
  12 +export default withInstall(ImportExcel, ExportExcelModel);
... ...
src/components/Excel/src/Export2Excel.ts
  View file @73c8e0c
1 1 import xlsx from 'xlsx';
2 2 import type { WorkBook } from 'xlsx';
3 3 import type { JsonToSheet, AoAToSheet } from './types';
4   -// import { isObject } from '@/src/utils/is';
5 4  
6 5 const { utils, writeFile } = xlsx;
7 6  
  7 +const DEF_FILE_NAME = 'excel-list.xlsx';
8 8 export function jsonToSheetXlsx<T = any>({
9 9 data,
10 10 header,
11   - filename = 'excel-list.xlsx',
  11 + filename = DEF_FILE_NAME,
12 12 json2sheetOpts = {},
13 13 write2excelOpts = { bookType: 'xlsx' },
14 14 }: JsonToSheet<T>) {
... ... @@ -34,7 +34,7 @@ export function jsonToSheetXlsx&lt;T = any&gt;({
34 34 export function aoaToSheetXlsx<T = any>({
35 35 data,
36 36 header,
37   - filename = 'excel-list.xlsx',
  37 + filename = DEF_FILE_NAME,
38 38 write2excelOpts = { bookType: 'xlsx' },
39 39 }: AoAToSheet<T>) {
40 40 const arrData = [...data];
... ...
src/components/Excel/src/ExportExcelModel.vue
  View file @73c8e0c
... ... @@ -72,7 +72,6 @@
72 72 async function handleOk() {
73 73 const res = (await validateFields()) as ExportModalResult;
74 74 const { filename, bookType } = res;
75   -
76 75 emit('success', {
77 76 filename: `${filename.split('.').shift()}.${bookType}`,
78 77 bookType,
... ...
src/components/Form/src/FormAction.tsx
  View file @73c8e0c
... ... @@ -2,7 +2,7 @@ import type { ColEx } from &#39;./types/index&#39;;
2 2  
3 3 import { defineComponent, unref, computed, PropType } from 'vue';
4 4 import { Form, Col } from 'ant-design-vue';
5   -import Button from '/@/components/Button/index.vue';
  5 +import { Button } from '/@/components/Button';
6 6 import { BasicArrow } from '/@/components/Basic/index';
7 7  
8 8 import { getSlot } from '/@/utils/helper/tsxHelper';
... ... @@ -12,7 +12,6 @@ const { t } = useI18n(&#39;component.form&#39;);
12 12  
13 13 export default defineComponent({
14 14 name: 'BasicFormAction',
15   - emits: ['toggle-advanced'],
16 15 props: {
17 16 show: {
18 17 type: Boolean,
... ... @@ -55,6 +54,7 @@ export default defineComponent({
55 54 default: false,
56 55 },
57 56 },
  57 + emits: ['toggle-advanced'],
58 58 setup(props, { slots, emit }) {
59 59 const getResetBtnOptionsRef = computed(() => {
60 60 return {
... ... @@ -112,7 +112,7 @@ export default defineComponent({
112 112 {() => (
113 113 <>
114 114 {isAdvanced ? t('putAway') : t('unfold')}
115   - <BasicArrow expand={!isAdvanced} />
  115 + <BasicArrow expand={!isAdvanced} top />
116 116 </>
117 117 )}
118 118 </Button>
... ...
src/components/Form/src/types/form.ts
  View file @73c8e0c
1 1 import type { NamePath, RuleObject } from 'ant-design-vue/lib/form/interface';
2 2 import type { VNode } from 'vue';
3   -import type { BasicButtonProps } from '/@/components/Button/types';
  3 +import type { ButtonProps as AntdButtonProps } from 'ant-design-vue/es/button/buttonTypes';
  4 +
4 5 import type { FormItem } from './formItem';
5 6 import type { ColEx, ComponentType } from './index';
6   -import { TableActionType } from '../../../Table/src/types/table';
  7 +import type { TableActionType } from '/@/components/Table/src/types/table';
7 8  
8 9 export type FieldMapToTime = [string, [string, string], string?][];
9 10  
... ... @@ -18,7 +19,7 @@ export interface RenderCallbackParams {
18 19 field: string;
19 20 }
20 21  
21   -export interface ButtonProps extends BasicButtonProps {
  22 +export interface ButtonProps extends AntdButtonProps {
22 23 text?: string;
23 24 }
24 25  
... ...
src/components/Icon/index.tsx
  View file @73c8e0c
  1 +import './index.less';
  2 +
1 3 import type { PropType } from 'vue';
2   -import { defineComponent, ref, watch, onMounted, nextTick, unref, computed } from 'vue';
  4 +import {
  5 + defineComponent,
  6 + ref,
  7 + watch,
  8 + onMounted,
  9 + nextTick,
  10 + unref,
  11 + computed,
  12 + CSSProperties,
  13 +} from 'vue';
3 14 import Iconify from '@purge-icons/generated';
4 15 import { isString } from '/@/utils/is';
5   -import './index.less';
  16 +import { propTypes } from '/@/utils/propTypes';
6 17 export default defineComponent({
7 18 name: 'GIcon',
8 19 props: {
9 20 // icon name
10   - icon: {
11   - type: String as PropType<string>,
12   - required: true,
13   - },
  21 + icon: propTypes.string,
14 22 // icon color
15   - color: {
16   - type: String as PropType<string>,
17   - },
  23 + color: propTypes.string,
18 24 // icon size
19 25 size: {
20 26 type: [String, Number] as PropType<string | number>,
21 27 default: 16,
22 28 },
23   - prefix: {
24   - type: String as PropType<string>,
25   - default: '',
26   - },
  29 + prefix: propTypes.string.def(''),
27 30 },
28 31 setup(props, { attrs }) {
29   - const elRef = ref<Nullable<HTMLElement>>(null);
  32 + const elRef = ref<ElRef>(null);
30 33  
31 34 const getIconRef = computed(() => {
32 35 const { icon, prefix } = props;
... ... @@ -54,18 +57,20 @@ export default defineComponent({
54 57 }
55 58 };
56 59  
57   - const wrapStyleRef = computed((): any => {
58   - const { size, color } = props;
59   - let fs = size;
60   - if (isString(size)) {
61   - fs = parseInt(size, 10);
  60 + const wrapStyleRef = computed(
  61 + (): CSSProperties => {
  62 + const { size, color } = props;
  63 + let fs = size;
  64 + if (isString(size)) {
  65 + fs = parseInt(size, 10);
  66 + }
  67 + return {
  68 + fontSize: `${fs}px`,
  69 + color,
  70 + display: 'inline-flex',
  71 + };
62 72 }
63   - return {
64   - fontSize: `${fs}px`,
65   - color,
66   - display: 'inline-flex',
67   - };
68   - });
  73 + );
69 74  
70 75 watch(() => props.icon, update, { flush: 'post' });
71 76  
... ...
src/components/Markdown/index.ts
  View file @73c8e0c
1   -export { default as MarkDown } from './src/index.vue';
  1 +import MarkDown from './src/index.vue';
  2 +
  3 +import { withInstall } from '../util';
2 4  
3 5 export * from './src/types';
  6 +export { MarkDown };
  7 +export default withInstall(MarkDown);
... ...
src/components/Markdown/src/index.vue
  View file @73c8e0c
... ... @@ -2,39 +2,27 @@
2 2 <div class="markdown" ref="wrapRef" />
3 3 </template>
4 4 <script lang="ts">
5   - import {
6   - defineComponent,
7   - ref,
8   - onMounted,
9   - unref,
10   - PropType,
11   - onUnmounted,
12   - nextTick,
13   - watchEffect,
14   - } from 'vue';
  5 + import { defineComponent, ref, onMounted, unref, onUnmounted, nextTick, watchEffect } from 'vue';
15 6 import Vditor from 'vditor';
16 7 import 'vditor/dist/index.css';
  8 +
  9 + import { propTypes } from '/@/utils/propTypes';
  10 +
17 11 export default defineComponent({
18 12 emits: ['update:value'],
19 13 props: {
20   - height: {
21   - type: Number as PropType<number>,
22   - default: 360,
23   - },
24   - value: {
25   - type: String,
26   - default: '',
27   - },
  14 + height: propTypes.number.def(360),
  15 + value: propTypes.string.def(''),
28 16 },
29 17 setup(props, { attrs, emit }) {
30   - const wrapRef = ref<Nullable<HTMLDivElement>>(null);
  18 + const wrapRef = ref<ElRef>(null);
31 19 const vditorRef = ref<Nullable<Vditor>>(null);
32 20 const initedRef = ref(false);
33 21  
34 22 function init() {
35 23 const wrapEl = unref(wrapRef);
36 24 if (!wrapEl) return;
37   - const data = { ...attrs, ...props };
  25 + const bindValue = { ...attrs, ...props };
38 26 vditorRef.value = new Vditor(wrapEl, {
39 27 mode: 'sv',
40 28 preview: {
... ... @@ -43,7 +31,7 @@
43 31 input: (v) => {
44 32 emit('update:value', v);
45 33 },
46   - ...data,
  34 + ...bindValue,
47 35 cache: {
48 36 enable: false,
49 37 },
... ...
src/components/Modal/src/BasicModal.tsx
  View file @73c8e0c
... ... @@ -3,7 +3,7 @@ import type { ModalProps, ModalMethods } from &#39;./types&#39;;
3 3 import { defineComponent, computed, ref, watch, unref, watchEffect } from 'vue';
4 4  
5 5 import Modal from './Modal';
6   -import Button from '/@/components/Button/index.vue';
  6 +import { Button } from '/@/components/Button';
7 7 import ModalWrapper from './ModalWrapper';
8 8 import { BasicTitle } from '/@/components/Basic';
9 9 import { FullscreenExitOutlined, FullscreenOutlined, CloseOutlined } from '@ant-design/icons-vue';
... ...
src/components/Page/index.ts 0 → 100644
  View file @73c8e0c
  1 +import PageFooter from './src/PageFooter.vue';
  2 +import { withInstall } from '../util';
  3 +
  4 +export { PageFooter };
  5 +
  6 +export default withInstall(PageFooter);
... ...
src/components/Application/src/AppPageFooter.vue renamed to src/components/Page/src/PageFooter.vue
  View file @73c8e0c
... ... @@ -14,10 +14,9 @@
14 14 import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
15 15  
16 16 export default defineComponent({
17   - name: 'AppFooterToolbar',
  17 + name: 'PageFooter',
18 18 setup() {
19 19 const { getCalcContentWidth } = useMenuSetting();
20   -
21 20 return { getCalcContentWidth };
22 21 },
23 22 });
... ...
src/components/StrengthMeter/index.tsx
  View file @73c8e0c
1   -import { PropType } from 'vue';
  1 +import StrengthMeter from './src/index';
  2 +import { withInstall } from '../util';
2 3  
3   -import { defineComponent, computed, ref, watch, unref, watchEffect } from 'vue';
  4 +export { StrengthMeter };
4 5  
5   -import { Input } from 'ant-design-vue';
6   -
7   -import zxcvbn from 'zxcvbn';
8   -import { extendSlots } from '/@/utils/helper/tsxHelper';
9   -
10   -import './index.less';
11   -const prefixCls = 'strength-meter';
12   -export default defineComponent({
13   - name: 'StrengthMeter',
14   - emits: ['score-change', 'change'],
15   - props: {
16   - value: {
17   - type: String as PropType<string>,
18   - default: undefined,
19   - },
20   -
21   - userInputs: {
22   - type: Array as PropType<string[]>,
23   - default: () => [],
24   - },
25   -
26   - showInput: {
27   - type: Boolean as PropType<boolean>,
28   - default: true,
29   - },
30   - disabled: {
31   - type: Boolean as PropType<boolean>,
32   - default: false,
33   - },
34   - },
35   - setup(props, { emit, attrs, slots }) {
36   - const innerValueRef = ref('');
37   - const getPasswordStrength = computed(() => {
38   - const { userInputs, disabled } = props;
39   - if (disabled) return null;
40   - const innerValue = unref(innerValueRef);
41   - const score = innerValue
42   - ? zxcvbn(unref(innerValueRef), (userInputs as string[]) || null).score
43   - : null;
44   - emit('score-change', score);
45   - return score;
46   - });
47   -
48   - function handleChange(e: ChangeEvent) {
49   - innerValueRef.value = e.target.value;
50   - }
51   -
52   - watchEffect(() => {
53   - innerValueRef.value = props.value || '';
54   - });
55   - watch(
56   - () => unref(innerValueRef),
57   - (val) => {
58   - emit('change', val);
59   - }
60   - );
61   -
62   - return () => {
63   - const { showInput, disabled } = props;
64   - return (
65   - <div class={prefixCls}>
66   - {showInput && (
67   - <Input.Password
68   - {...attrs}
69   - allowClear={true}
70   - value={unref(innerValueRef)}
71   - onChange={handleChange}
72   - disabled={disabled}
73   - >
74   - {extendSlots(slots)}
75   - </Input.Password>
76   - )}
77   - <div class={`${prefixCls}-bar`}>
78   - <div class={`${prefixCls}-bar__fill`} data-score={unref(getPasswordStrength)}></div>
79   - </div>
80   - </div>
81   - );
82   - };
83   - },
84   -});
  6 +export default withInstall(StrengthMeter);
... ...
src/components/StrengthMeter/index.less renamed to src/components/StrengthMeter/src/index.less
  View file @73c8e0c
1   -@import (reference) '../../design/index.less';
  1 +@import (reference) '../../../design/index.less';
2 2  
3 3 .strength-meter {
4 4 position: relative;
... ...
src/components/StrengthMeter/src/index.tsx 0 → 100644
  View file @73c8e0c
  1 +import './index.less';
  2 +
  3 +import { PropType } from 'vue';
  4 +
  5 +import { defineComponent, computed, ref, watch, unref, watchEffect } from 'vue';
  6 +
  7 +import { Input } from 'ant-design-vue';
  8 +
  9 +import zxcvbn from 'zxcvbn';
  10 +import { extendSlots } from '/@/utils/helper/tsxHelper';
  11 +import { propTypes } from '/@/utils/propTypes';
  12 +
  13 +const prefixCls = 'strength-meter';
  14 +export default defineComponent({
  15 + name: 'StrengthMeter',
  16 + props: {
  17 + value: propTypes.string,
  18 +
  19 + userInputs: {
  20 + type: Array as PropType<string[]>,
  21 + default: () => [],
  22 + },
  23 +
  24 + showInput: propTypes.bool.def(true),
  25 + disabled: propTypes.bool,
  26 + },
  27 + emits: ['score-change', 'change'],
  28 + setup(props, { emit, attrs, slots }) {
  29 + const innerValueRef = ref('');
  30 + const getPasswordStrength = computed(() => {
  31 + const { userInputs, disabled } = props;
  32 + if (disabled) return null;
  33 + const innerValue = unref(innerValueRef);
  34 + const score = innerValue
  35 + ? zxcvbn(unref(innerValueRef), (userInputs as string[]) || null).score
  36 + : null;
  37 + emit('score-change', score);
  38 + return score;
  39 + });
  40 +
  41 + function handleChange(e: ChangeEvent) {
  42 + innerValueRef.value = e.target.value;
  43 + }
  44 +
  45 + watchEffect(() => {
  46 + innerValueRef.value = props.value || '';
  47 + });
  48 + watch(
  49 + () => unref(innerValueRef),
  50 + (val) => {
  51 + emit('change', val);
  52 + }
  53 + );
  54 +
  55 + return () => {
  56 + const { showInput, disabled } = props;
  57 + return (
  58 + <div class={prefixCls}>
  59 + {showInput && (
  60 + <Input.Password
  61 + {...attrs}
  62 + allowClear={true}
  63 + value={unref(innerValueRef)}
  64 + onChange={handleChange}
  65 + disabled={disabled}
  66 + >
  67 + {extendSlots(slots)}
  68 + </Input.Password>
  69 + )}
  70 + <div class={`${prefixCls}-bar`}>
  71 + <div class={`${prefixCls}-bar__fill`} data-score={unref(getPasswordStrength)}></div>
  72 + </div>
  73 + </div>
  74 + );
  75 + };
  76 + },
  77 +});
... ...
src/components/Table/src/components/TableAction.tsx
  View file @73c8e0c
... ... @@ -3,7 +3,7 @@ import { Dropdown, Menu, Popconfirm } from &#39;ant-design-vue&#39;;
3 3 import Icon from '/@/components/Icon/index';
4 4 import { DownOutlined } from '@ant-design/icons-vue';
5 5 import { ActionItem } from '/@/components/Table';
6   -import Button from '/@/components/Button/index.vue';
  6 +import { Button } from '/@/components/Button';
7 7 const prefixCls = 'basic-table-action';
8 8 export default defineComponent({
9 9 name: 'TableAction',
... ...
src/components/Table/src/components/renderEditable.tsx
  View file @73c8e0c
  1 +import '../style/editable-cell.less';
  2 +
1 3 import { defineComponent, PropType, ref, unref, nextTick, watchEffect } from 'vue';
2   -import ClickOutSide from '/@/components/ClickOutSide/index.vue';
  4 +import { ClickOutSide } from '/@/components/ClickOutSide';
3 5  
4 6 import { RenderEditableCellParams } from '../types/table';
5 7 import { ComponentType } from '../types/componentType';
... ... @@ -8,8 +10,6 @@ import { componentMap } from &#39;../componentMap&#39;;
8 10 import { isString, isBoolean } from '/@/utils/is';
9 11 import { FormOutlined, CloseOutlined, CheckOutlined } from '@ant-design/icons-vue';
10 12  
11   -import '../style/editable-cell.less';
12   -
13 13 const prefixCls = 'editable-cell';
14 14 const EditableCell = defineComponent({
15 15 name: 'EditableCell',
... ...
src/components/Table/src/components/renderExpandIcon.tsx
  View file @73c8e0c
... ... @@ -8,7 +8,6 @@ export default () =&gt; {
8 8 props.onExpand(props.record, e);
9 9 }}
10 10 expand={props.expanded}
11   - class="right"
12 11 />
13 12 );
14 13 };
... ...
src/components/Tinymce/index.ts
  View file @73c8e0c
1   -export { default as Tinymce } from './src/Editor.vue';
  1 +import Tinymce from './src/Editor.vue';
  2 +import { withInstall } from '../util';
  3 +
  4 +export { Tinymce };
  5 +export default withInstall(Tinymce);
... ...
src/components/Tinymce/src/Editor.vue
  View file @73c8e0c
... ... @@ -8,7 +8,6 @@
8 8 import {
9 9 defineComponent,
10 10 computed,
11   - onMounted,
12 11 nextTick,
13 12 ref,
14 13 unref,
... ... @@ -24,6 +23,7 @@
24 23 import { snowUuid } from '/@/utils/uuid';
25 24 import { bindHandlers } from './helper';
26 25 import lineHeight from './lineHeight';
  26 + import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
27 27  
28 28 const CDN_URL = 'https://cdn.bootcdn.net/ajax/libs/tinymce/5.5.1';
29 29  
... ... @@ -91,8 +91,7 @@
91 91 editor.setMode(attrs.disabled ? 'readonly' : 'design');
92 92 }
93 93 );
94   -
95   - onMounted(() => {
  94 + onMountedOrActivated(() => {
96 95 nextTick(() => {
97 96 init();
98 97 });
... ...
src/components/Transition/src/CreateTransition.tsx
  View file @73c8e0c
... ... @@ -13,14 +13,6 @@ export function createSimpleTransition(name: string, origin = &#39;top center 0&#39;, mo
13 13 type: Boolean as PropType<boolean>,
14 14 default: false,
15 15 },
16   - // hideOnLeave: {
17   - // type: Boolean as PropType<boolean>,
18   - // default: false,
19   - // },
20   - // leaveAbsolute: {
21   - // type: Boolean as PropType<boolean>,
22   - // default: false,
23   - // },
24 16 mode: {
25 17 type: String as PropType<Mode>,
26 18 default: mode,
... ...
src/components/Verify/index.ts
  View file @73c8e0c
1   -export { default as BasicDragVerify } from './src/DragVerify';
2   -export { default as RotateDragVerify } from './src/ImgRotate';
  1 +import BasicDragVerify from './src/DragVerify';
  2 +import RotateDragVerify from './src/ImgRotate';
  3 +import { withInstall } from '../util';
3 4  
4 5 export * from './src/types';
  6 +
  7 +export { RotateDragVerify, BasicDragVerify };
  8 +
  9 +export default withInstall(RotateDragVerify, BasicDragVerify);
... ...
src/components/VirtualScroll/index.ts
  View file @73c8e0c
1   -export { default as VirtualScroll } from './src/index';
  1 +import VirtualScroll from './src/index';
  2 +import { withInstall } from '../util';
  3 +
  4 +export { VirtualScroll };
  5 +
  6 +export default withInstall(VirtualScroll);
... ...
src/components/VirtualScroll/src/index.tsx
  View file @73c8e0c
1   -import { defineComponent, computed, ref, unref, reactive, onMounted, watch, nextTick } from 'vue';
  1 +import {
  2 + defineComponent,
  3 + computed,
  4 + ref,
  5 + unref,
  6 + reactive,
  7 + onMounted,
  8 + watch,
  9 + nextTick,
  10 + CSSProperties,
  11 +} from 'vue';
2 12 import { useEventListener } from '/@/hooks/event/useEventListener';
3 13  
4 14 import { convertToUnit } from '/@/components/util';
... ... @@ -34,29 +44,33 @@ export default defineComponent({
34 44 return Math.min((props.items || []).length, state.last + unref(getBenchRef));
35 45 });
36 46  
37   - const getContainerStyleRef = computed(() => {
38   - return {
39   - height: convertToUnit((props.items || []).length * unref(getItemHeightRef)),
40   - };
41   - });
  47 + const getContainerStyleRef = computed(
  48 + (): CSSProperties => {
  49 + return {
  50 + height: convertToUnit((props.items || []).length * unref(getItemHeightRef)),
  51 + };
  52 + }
  53 + );
42 54  
43   - const getWrapStyleRef = computed((): object => {
44   - const styles: Record<string, string> = {};
45   - const height = convertToUnit(props.height);
46   - const minHeight = convertToUnit(props.minHeight);
47   - const minWidth = convertToUnit(props.minWidth);
48   - const maxHeight = convertToUnit(props.maxHeight);
49   - const maxWidth = convertToUnit(props.maxWidth);
50   - const width = convertToUnit(props.width);
51   -
52   - if (height) styles.height = height;
53   - if (minHeight) styles.minHeight = minHeight;
54   - if (minWidth) styles.minWidth = minWidth;
55   - if (maxHeight) styles.maxHeight = maxHeight;
56   - if (maxWidth) styles.maxWidth = maxWidth;
57   - if (width) styles.width = width;
58   - return styles;
59   - });
  55 + const getWrapStyleRef = computed(
  56 + (): CSSProperties => {
  57 + const styles: Record<string, string> = {};
  58 + const height = convertToUnit(props.height);
  59 + const minHeight = convertToUnit(props.minHeight);
  60 + const minWidth = convertToUnit(props.minWidth);
  61 + const maxHeight = convertToUnit(props.maxHeight);
  62 + const maxWidth = convertToUnit(props.maxWidth);
  63 + const width = convertToUnit(props.width);
  64 +
  65 + if (height) styles.height = height;
  66 + if (minHeight) styles.minHeight = minHeight;
  67 + if (minWidth) styles.minWidth = minWidth;
  68 + if (maxHeight) styles.maxHeight = maxHeight;
  69 + if (maxWidth) styles.maxWidth = maxWidth;
  70 + if (width) styles.width = width;
  71 + return styles;
  72 + }
  73 + );
60 74  
61 75 watch([() => props.itemHeight, () => props.height], () => {
62 76 onScroll();
... ...
src/components/registerGlobComp.ts
  View file @73c8e0c
1 1 import Icon from './Icon/index';
2   -import Button from './Button/index.vue';
  2 +import { Button } from './Button';
3 3 import {
4 4 // Need
5 5 Button as AntButton,
... ...
src/components/util.ts
  View file @73c8e0c
... ... @@ -6,6 +6,7 @@ export function withInstall(...components: Component[]) {
6 6 components.forEach((comp) => {
7 7 comp.name && app.component(comp.name, comp);
8 8 });
  9 + return app;
9 10 };
10 11 }
11 12  
... ...
src/layouts/default/LayoutTrigger.tsx
  View file @73c8e0c
1   -import type { PropType, FunctionalComponent } from 'vue';
  1 +import type { FunctionalComponent } from 'vue';
2 2  
3 3 import { defineComponent, unref } from 'vue';
  4 +
4 5 import {
5 6 DoubleRightOutlined,
6 7 DoubleLeftOutlined,
... ... @@ -9,6 +10,7 @@ import {
9 10 } from '@ant-design/icons-vue';
10 11  
11 12 import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
  13 +import { propTypes } from '/@/utils/propTypes';
12 14  
13 15 const SiderTrigger: FunctionalComponent = () => {
14 16 const { getCollapsed } = useMenuSetting();
... ... @@ -29,13 +31,8 @@ const HeaderTrigger: FunctionalComponent&lt;{
29 31 export default defineComponent({
30 32 name: 'LayoutTrigger',
31 33 props: {
32   - sider: {
33   - type: Boolean as PropType<boolean>,
34   - default: true,
35   - },
36   - theme: {
37   - type: String as PropType<string>,
38   - },
  34 + sider: propTypes.bool.def(true),
  35 + theme: propTypes.oneOf(['light', 'dark']),
39 36 },
40 37 setup(props) {
41 38 return () => {
... ...
src/layouts/default/header/LayoutBreadcrumb.tsx
  View file @73c8e0c
... ... @@ -3,9 +3,9 @@ import type { RouteLocationMatched } from &#39;vue-router&#39;;
3 3 import type { PropType } from 'vue';
4 4  
5 5 import { defineComponent, TransitionGroup, unref, watch, ref } from 'vue';
6   -import Breadcrumb from '/@/components/Breadcrumb/Breadcrumb.vue';
7 6 import Icon from '/@/components/Icon';
8   -import BreadcrumbItem from '/@/components/Breadcrumb/BreadcrumbItem.vue';
  7 +
  8 +import { Breadcrumb, BreadcrumbItem } from '/@/components/Breadcrumb';
9 9  
10 10 import { useRouter } from 'vue-router';
11 11  
... ...
src/layouts/default/header/LayoutHeader.tsx
  View file @73c8e0c
... ... @@ -38,6 +38,7 @@ import { PageEnum } from &#39;/@/enums/pageEnum&#39;;
38 38 import { MenuModeEnum, MenuSplitTyeEnum } from '/@/enums/menuEnum';
39 39 import { AppLocalePicker } from '/@/components/Application';
40 40 import { useI18n } from '/@/hooks/web/useI18n';
  41 +import { propTypes } from '/@/utils/propTypes';
41 42  
42 43 interface TooltipItemProps {
43 44 title: string;
... ... @@ -57,10 +58,7 @@ const TooltipItem: FunctionalComponent&lt;TooltipItemProps&gt; = (props, { slots }) =&gt;
57 58 export default defineComponent({
58 59 name: 'LayoutHeader',
59 60 props: {
60   - fixed: {
61   - type: Boolean,
62   - default: false,
63   - },
  61 + fixed: propTypes.bool,
64 62 },
65 63 setup(props) {
66 64 let logoEl: Element | null | undefined;
... ...
src/layouts/default/header/notice/NoticeList.vue
  View file @73c8e0c
... ... @@ -37,7 +37,7 @@
37 37 export default defineComponent({
38 38 props: {
39 39 list: {
40   - type: Array as PropType<Array<ListItem>>,
  40 + type: Array as PropType<ListItem[]>,
41 41 default: () => [],
42 42 },
43 43 },
... ...
src/layouts/default/lock/LockAction.tsx
  View file @73c8e0c
... ... @@ -2,7 +2,7 @@ import &#39;./LockAction.less&#39;;
2 2  
3 3 import { defineComponent } from 'vue';
4 4 import { BasicModal, useModalInner } from '/@/components/Modal/index';
5   -import Button from '/@/components/Button/index.vue';
  5 +import { Button } from '/@/components/Button';
6 6 import { BasicForm, useForm } from '/@/components/Form/index';
7 7  
8 8 import headerImg from '/@/assets/images/header.jpg';
... ...
src/layouts/default/menu/index.tsx
  View file @73c8e0c
... ... @@ -15,32 +15,25 @@ import { useRootSetting } from &#39;/@/hooks/setting/useRootSetting&#39;;
15 15 import { useGo } from '/@/hooks/web/usePage';
16 16 import { useSplitMenu } from './useLayoutMenu';
17 17 import { openWindow } from '/@/utils';
  18 +import { propTypes } from '/@/utils/propTypes';
18 19  
19 20 export default defineComponent({
20 21 name: 'LayoutMenu',
21 22 props: {
22   - theme: {
23   - type: String as PropType<string>,
24   - default: '',
25   - },
  23 + theme: propTypes.oneOf(['light', 'dark']),
  24 +
26 25 splitType: {
27 26 type: Number as PropType<MenuSplitTyeEnum>,
28 27 default: MenuSplitTyeEnum.NONE,
29 28 },
30   - parentMenuPath: {
31   - type: String as PropType<string>,
32   - default: '',
33   - },
34   - showSearch: {
35   - type: Boolean as PropType<boolean>,
36   - default: true,
37   - },
38   - isHorizontal: {
39   - type: Boolean as PropType<boolean>,
40   - default: false,
41   - },
  29 +
  30 + // Whether to show search box
  31 + showSearch: propTypes.bool.def(true),
  32 +
  33 + isHorizontal: propTypes.bool,
  34 + // menu Mode
42 35 menuMode: {
43   - type: [String] as PropType<MenuModeEnum | null>,
  36 + type: [String] as PropType<Nullable<MenuModeEnum>>,
44 37 default: '',
45 38 },
46 39 },
... ...
src/layouts/default/setting/SettingDrawer.tsx
  View file @73c8e0c
... ... @@ -5,7 +5,7 @@ import defaultSetting from &#39;/@/settings/projectSetting&#39;;
5 5 import { defineComponent, computed, unref, FunctionalComponent } from 'vue';
6 6 import { BasicDrawer } from '/@/components/Drawer/index';
7 7 import { Divider, Switch, Tooltip, InputNumber, Select } from 'ant-design-vue';
8   -import Button from '/@/components/Button/index.vue';
  8 +import { Button } from '/@/components/Button';
9 9 import { CopyOutlined, RedoOutlined, CheckOutlined } from '@ant-design/icons-vue';
10 10  
11 11 import { MenuTypeEnum } from '/@/enums/menuEnum';
... ...
src/locales/index.ts
  View file @73c8e0c
... ... @@ -13,5 +13,4 @@ export const localeList: DropMenu[] = [
13 13 event: 'en',
14 14 },
15 15 ];
16   -
17 16 export default messages;
... ...
src/main.ts
  View file @73c8e0c
1 1 import { createApp } from 'vue';
  2 +import App from './App.vue';
2 3  
3 4 import router, { setupRouter } from '/@/router';
4 5 import { setupStore } from '/@/store';
... ... @@ -6,12 +7,9 @@ import { setupAntd } from &#39;/@/setup/ant-design-vue&#39;;
6 7 import { setupErrorHandle } from '/@/setup/error-handle';
7 8 import { setupGlobDirectives } from '/@/setup/directives';
8 9 import { setupI18n } from '/@/setup/i18n';
9   -
10 10 import { setupProdMockServer } from '../mock/_createProductionServer';
11 11 import { setApp } from '/@/setup/App';
12 12  
13   -import App from './App.vue';
14   -
15 13 import { isDevMode, isProdMode, isUseMock } from '/@/utils/env';
16 14  
17 15 import '/@/design/index.less';
... ...
src/router/routes/modules/demo/form.ts
  View file @73c8e0c
... ... @@ -10,7 +10,7 @@ const form: AppRouteModule = {
10 10 redirect: '/form/basic',
11 11 meta: {
12 12 icon: 'ant-design:table-outlined',
13   - title: 'rroutes.demo.form.form',
  13 + title: 'routes.demo.form.form',
14 14 },
15 15 },
16 16  
... ... @@ -20,7 +20,7 @@ const form: AppRouteModule = {
20 20 name: 'FormBasicDemo',
21 21 component: () => import('/@/views/demo/form/index.vue'),
22 22 meta: {
23   - title: 'rroutes.demo.form.basic',
  23 + title: 'routes.demo.form.basic',
24 24 },
25 25 },
26 26 {
... ... @@ -28,7 +28,7 @@ const form: AppRouteModule = {
28 28 name: 'UseFormDemo',
29 29 component: () => import('/@/views/demo/form/UseForm.vue'),
30 30 meta: {
31   - title: 'rroutes.demo.form.useForm',
  31 + title: 'routes.demo.form.useForm',
32 32 },
33 33 },
34 34 {
... ... @@ -36,7 +36,7 @@ const form: AppRouteModule = {
36 36 name: 'RefFormDemo',
37 37 component: () => import('/@/views/demo/form/RefForm.vue'),
38 38 meta: {
39   - title: 'rroutes.demo.form.refForm',
  39 + title: 'routes.demo.form.refForm',
40 40 },
41 41 },
42 42 {
... ... @@ -44,7 +44,7 @@ const form: AppRouteModule = {
44 44 name: 'AdvancedFormDemo',
45 45 component: () => import('/@/views/demo/form/AdvancedForm.vue'),
46 46 meta: {
47   - title: 'rroutes.demo.form.advancedForm',
  47 + title: 'routes.demo.form.advancedForm',
48 48 },
49 49 },
50 50 {
... ... @@ -52,7 +52,7 @@ const form: AppRouteModule = {
52 52 name: 'RuleFormDemo',
53 53 component: () => import('/@/views/demo/form/RuleForm.vue'),
54 54 meta: {
55   - title: 'rroutes.demo.form.ruleForm',
  55 + title: 'routes.demo.form.ruleForm',
56 56 },
57 57 },
58 58 {
... ... @@ -60,7 +60,7 @@ const form: AppRouteModule = {
60 60 name: 'DynamicFormDemo',
61 61 component: () => import('/@/views/demo/form/DynamicForm.vue'),
62 62 meta: {
63   - title: 'rroutes.demo.form.dynamicForm',
  63 + title: 'routes.demo.form.dynamicForm',
64 64 },
65 65 },
66 66 {
... ... @@ -68,7 +68,7 @@ const form: AppRouteModule = {
68 68 name: 'CustomerFormDemo',
69 69 component: () => import('/@/views/demo/form/CustomerForm.vue'),
70 70 meta: {
71   - title: 'rroutes.demo.form.customerForm',
  71 + title: 'routes.demo.form.customerForm',
72 72 },
73 73 },
74 74 ],
... ...
src/store/modules/user.ts
  View file @73c8e0c
... ... @@ -30,8 +30,6 @@ hotModuleUnregisterModule(NAME);
30 30  
31 31 const { permissionCacheType } = useProjectSetting();
32 32  
33   -const { t } = useI18n('sys.app');
34   -
35 33 function getCache<T>(key: string) {
36 34 const fn = permissionCacheType === CacheTypeEnum.LOCAL ? getLocal : getSession;
37 35 return fn(key) as T;
... ... @@ -145,6 +143,7 @@ class User extends VuexModule {
145 143 @Action
146 144 async confirmLoginOut() {
147 145 const { createConfirm } = useMessage();
  146 + const { t } = useI18n('sys.app');
148 147 createConfirm({
149 148 iconType: 'warning',
150 149 title: t('loginOutTip'),
... ...
src/utils/http/axios/checkStatus.ts
  View file @73c8e0c
... ... @@ -3,10 +3,9 @@ import { userStore } from &#39;/@/store/modules/user&#39;;
3 3 import { useI18n } from '/@/hooks/web/useI18n';
4 4 const { createMessage } = useMessage();
5 5  
6   -const { t } = useI18n('sys.api');
7   -
8 6 const error = createMessage.error!;
9 7 export function checkStatus(status: number, msg: string): void {
  8 + const { t } = useI18n('sys.api');
10 9 switch (status) {
11 10 case 400:
12 11 error(`${msg}`);
... ...
src/utils/http/axios/index.ts
  View file @73c8e0c
... ... @@ -22,7 +22,6 @@ import { errorStore } from &#39;/@/store/modules/error&#39;;
22 22 import { errorResult } from './const';
23 23 import { useI18n } from '/@/hooks/web/useI18n';
24 24  
25   -const { t } = useI18n('sys.api');
26 25 const globSetting = useGlobSetting();
27 26 const prefix = globSetting.urlPrefix;
28 27 const { createMessage, createErrorModal } = useMessage();
... ... @@ -35,6 +34,7 @@ const transform: AxiosTransform = {
35 34 * @description: 处理请求数据
36 35 */
37 36 transformRequestData: (res: AxiosResponse<Result>, options: RequestOptions) => {
  37 + const { t } = useI18n('sys.api');
38 38 const { isTransformRequestResult } = options;
39 39 // 不进行任何处理，直接返回
40 40 // 用于页面代码可能需要直接获取code，data，message这些信息时开启
... ... @@ -154,6 +154,7 @@ const transform: AxiosTransform = {
154 154 * @description: 响应错误处理
155 155 */
156 156 responseInterceptorsCatch: (error: any) => {
  157 + const { t } = useI18n('sys.api');
157 158 errorStore.setupErrorHandle(error);
158 159 const { response, code, message } = error || {};
159 160 const msg: string =
... ...
src/utils/propTypes.ts 0 → 100644
  View file @73c8e0c
  1 +import { CSSProperties, VNodeChild } from 'vue';
  2 +import { createTypes, VueTypeValidableDef, VueTypesInterface } from 'vue-types';
  3 +
  4 +type VueNode = VNodeChild | JSX.Element;
  5 +
  6 +type PropTypes = VueTypesInterface & {
  7 + readonly style: VueTypeValidableDef<CSSProperties>;
  8 + readonly VNodeChild: VueTypeValidableDef<VueNode>;
  9 + // readonly trueBool: VueTypeValidableDef<boolean>;
  10 +};
  11 +
  12 +const propTypes = createTypes({
  13 + func: undefined,
  14 + bool: undefined,
  15 + string: undefined,
  16 + number: undefined,
  17 + object: undefined,
  18 + integer: undefined,
  19 +}) as PropTypes;
  20 +
  21 +propTypes.extend([
  22 + {
  23 + name: 'style',
  24 + getter: true,
  25 + type: [String, Object],
  26 + default: undefined,
  27 + },
  28 + {
  29 + name: 'VNodeChild',
  30 + getter: true,
  31 + type: undefined,
  32 + },
  33 + // {
  34 + // name: 'trueBool',
  35 + // getter: true,
  36 + // type: Boolean,
  37 + // default: true,
  38 + // },
  39 +]);
  40 +export { propTypes };
... ...
src/views/demo/comp/strength-meter/index.vue
  View file @73c8e0c
... ... @@ -11,7 +11,7 @@
11 11  
12 12 <script lang="ts">
13 13 import { defineComponent } from 'vue';
14   - import StrengthMeter from '/@/components/StrengthMeter/index';
  14 + import { StrengthMeter } from '/@/components/StrengthMeter';
15 15 export default defineComponent({
16 16 components: {
17 17 StrengthMeter,
... ...
src/views/demo/feat/click-out-side/index.vue
  View file @73c8e0c
... ... @@ -11,7 +11,7 @@
11 11 <script lang="ts">
12 12 import { defineComponent, ref } from 'vue';
13 13 import { Alert } from 'ant-design-vue';
14   - import ClickOutSide from '/@/components/ClickOutSide/index.vue';
  14 + import { ClickOutSide } from '/@/components/ClickOutSide';
15 15 export default defineComponent({
16 16 components: { ClickOutSide, Alert },
17 17 setup() {
... ...
src/views/demo/page/desc/basic/data.tsx
  View file @73c8e0c
1 1 import { DescItem } from '/@/components/Description/index';
2 2 import { BasicColumn } from '/@/components/Table/src/types/table';
3   -import Button from '/@/components/Button/index.vue';
  3 +import { Button } from '/@/components/Button';
4 4  
5 5 import { Badge } from 'ant-design-vue';
6 6  
... ...
src/views/demo/page/form/high/index.vue
  View file @73c8e0c
... ... @@ -16,23 +16,23 @@
16 16 </a-card>
17 17 </div>
18 18  
19   - <AppPageFooter>
  19 + <PageFooter>
20 20 <template #right>
21 21 <a-button type="primary" @click="submitAll">提交</a-button>
22 22 </template>
23   - </AppPageFooter>
  23 + </PageFooter>
24 24 </div>
25 25 </template>
26 26 <script lang="ts">
27 27 import { BasicForm, useForm } from '/@/components/Form';
28 28 import { defineComponent, ref } from 'vue';
29 29 import PersonTable from './PersonTable.vue';
30   - import { AppPageFooter } from '/@/components/Application';
  30 + import { PageFooter } from '/@/components/Page';
31 31  
32 32 import { schemas, taskSchemas } from './data';
33 33  
34 34 export default defineComponent({
35   - components: { BasicForm, PersonTable, AppPageFooter },
  35 + components: { BasicForm, PersonTable, PageFooter },
36 36 setup() {
37 37 const tableRef = ref<{ getDataSource: () => any } | null>(null);
38 38  
... ...
src/views/sys/login/Login.vue
  View file @73c8e0c
... ... @@ -63,7 +63,7 @@
63 63 import { defineComponent, reactive, ref, unref, toRaw } from 'vue';
64 64 import { Checkbox } from 'ant-design-vue';
65 65  
66   - import Button from '/@/components/Button/index.vue';
  66 + import { Button } from '/@/components/Button';
67 67 import { AppLocalePicker } from '/@/components/Application';
68 68 // import { BasicDragVerify, DragVerifyActionType } from '/@/components/Verify/index';
69 69  
... ...
yarn.lock
  View file @73c8e0c
... ... @@ -8318,7 +8318,7 @@ vue-router@^4.0.0-rc.5:
8318 8318 resolved "https://registry.npmjs.org/vue-router/-/vue-router-4.0.0-rc.5.tgz#191d32e3d5276641ff21e881d34e33a71dc6e8f0"
8319 8319 integrity sha512-Q8Tt6VGwGMN5qASeIdjSydU3uRADK9AUkqnbnzmTz+zZKS0W6GZOAuP235lf3y5/MqEFSKRJGaTWPEY0t+Rjmg==
8320 8320  
8321   -vue-types@^3.0.0:
  8321 +vue-types@^3.0.0, vue-types@^3.0.1:
8322 8322 version "3.0.1"
8323 8323 resolved "https://registry.npmjs.org/vue-types/-/vue-types-3.0.1.tgz#20e9baae8673de8093d0a989234695d08d544be0"
8324 8324 integrity sha512-UbvbzPu8DNzZRfMB1RDTFKBB6seMm80scMFdP+GkKaw00EugC3cjq9AtlS4y258vDkpAe9HfqbRO4cp63qVHXQ==
... ...