diff --git a/src/main.ts b/src/main.ts index f68d2fca..c5ce4466 100644 --- a/src/main.ts +++ b/src/main.ts @@ -11,74 +11,13 @@ import '@/assets/styles/font.scss' import 'animate.css' // 自定义插件 -import Contextmenu from './plugins/contextmenu' -import ClickOutside from './plugins/clickOutside' -import IconPark from './plugins/iconPark' - -// 自定义组件 -import FileInput from '@/components/FileInput.vue' -import SvgWrapper from '@/components/SvgWrapper.vue' -import CheckboxButton from '@/components/CheckboxButton.vue' -import CheckboxButtonGroup from '@/components/CheckboxButtonGroup.vue' -import ColorPicker from '@/components/ColorPicker/index.vue' -import FullscreenSpin from '@/components/FullscreenSpin.vue' - -// antd 组件 -import { - InputNumber, - Divider, - Button, - Tooltip, - Popover, - Slider, - Select, - Switch, - Radio, - Input, - Modal, - Dropdown, - Menu, - Checkbox, - Drawer, - Spin, -} from 'ant-design-vue' +import IconPark from '@/plugins/iconPark' +import Antd from '@/plugins/antd' +import PptCustomComponent from '@/plugins/PptCustomComponent' const app = createApp(App) - -app.directive('contextmenu', Contextmenu) -app.directive('click-outside', ClickOutside) app.use(IconPark) - -app.component('FileInput', FileInput) -app.component('SvgWrapper', SvgWrapper) -app.component('CheckboxButton', CheckboxButton) -app.component('CheckboxButtonGroup', CheckboxButtonGroup) -app.component('ColorPicker', ColorPicker) -app.component('FullscreenSpin', FullscreenSpin) - -app.component('InputNumber', InputNumber) -app.component('Divider', Divider) -app.component('Button', Button) -app.component('ButtonGroup', Button.Group) -app.component('Tooltip', Tooltip) -app.component('Popover', Popover) -app.component('Slider', Slider) -app.component('Select', Select) -app.component('SelectOption', Select.Option) -app.component('SelectOptGroup', Select.OptGroup) -app.component('Switch', Switch) -app.component('Radio', Radio) -app.component('RadioGroup', Radio.Group) -app.component('RadioButton', Radio.Button) -app.component('Input', Input) -app.component('InputGroup', Input.Group) -app.component('Modal', Modal) -app.component('Dropdown', Dropdown) -app.component('Menu', Menu) -app.component('MenuItem', Menu.Item) -app.component('Checkbox', Checkbox) -app.component('Drawer', Drawer) -app.component('Spin', Spin) - +app.use(Antd) +app.use(PptCustomComponent) app.use(store, key) app.mount('#app') diff --git a/src/plugins/PptCustomComponent.ts b/src/plugins/PptCustomComponent.ts new file mode 100644 index 00000000..0451dabf --- /dev/null +++ b/src/plugins/PptCustomComponent.ts @@ -0,0 +1,24 @@ +import { App } from 'vue' +// 自定义插件 +import Contextmenu from './contextmenu' +import ClickOutside from './clickOutside' +import FileInput from '@/components/FileInput.vue' +import SvgWrapper from '@/components/SvgWrapper.vue' +import CheckboxButton from '@/components/CheckboxButton.vue' +import CheckboxButtonGroup from '@/components/CheckboxButtonGroup.vue' +import ColorPicker from '@/components/ColorPicker/index.vue' +import FullscreenSpin from '@/components/FullscreenSpin.vue' + +export default { + install(app: App) { + // 插入元素 + app.directive('contextmenu', Contextmenu) + app.directive('click-outside', ClickOutside) + app.component('FileInput', FileInput) + app.component('SvgWrapper', SvgWrapper) + app.component('CheckboxButton', CheckboxButton) + app.component('CheckboxButtonGroup', CheckboxButtonGroup) + app.component('ColorPicker', ColorPicker) + app.component('FullscreenSpin', FullscreenSpin) + } +} diff --git a/src/plugins/antd.ts b/src/plugins/antd.ts new file mode 100644 index 00000000..0ed4da1d --- /dev/null +++ b/src/plugins/antd.ts @@ -0,0 +1,49 @@ +import { App } from 'vue' +// antd 组件 +import { + InputNumber, + Divider, + Button, + Tooltip, + Popover, + Slider, + Select, + Switch, + Radio, + Input, + Modal, + Dropdown, + Menu, + Checkbox, + Drawer, + Spin, +} from 'ant-design-vue' + +export default { + install(app: App) { + // 插入元素 + app.component('InputNumber', InputNumber) + app.component('Divider', Divider) + app.component('Button', Button) + app.component('ButtonGroup', Button.Group) + app.component('Tooltip', Tooltip) + app.component('Popover', Popover) + app.component('Slider', Slider) + app.component('Select', Select) + app.component('SelectOption', Select.Option) + app.component('SelectOptGroup', Select.OptGroup) + app.component('Switch', Switch) + app.component('Radio', Radio) + app.component('RadioGroup', Radio.Group) + app.component('RadioButton', Radio.Button) + app.component('Input', Input) + app.component('InputGroup', Input.Group) + app.component('Modal', Modal) + app.component('Dropdown', Dropdown) + app.component('Menu', Menu) + app.component('MenuItem', Menu.Item) + app.component('Checkbox', Checkbox) + app.component('Drawer', Drawer) + app.component('Spin', Spin) + } +}