Skip to content

B
basic-vue-admin
提交 6392b7f0 作者: vben
操作

refactor: remove global import

上级 c2f6542b
正在显示 包含 256 行增加 和 162 行删除
CHANGELOG.zh_CN.md
......@@ -3,6 +3,7 @@
### ✨ Refactor
- 新增 `SimpleMenu`组件替代左侧菜单组件(顶部菜单没有替换,功能尽量做到简单不卡)。解决菜单卡顿问题。
- `ant-design-vue`组件不再全局注册。以便于更好配合 css 按需引入。如果需要全局注册,需要自己加
### ✨ Features
......@@ -13,6 +14,7 @@
- 修复 `TableAction`图标问题
- 修复菜单折叠按钮丢失问题
- 修复菜单相关问题
- 修复 moment 多语言问题
## 2.0.0-rc.16 (2020-01-12)
......
build/vite/plugin/style-import.ts
......@@ -5,20 +5,9 @@ export function configStyleImportConfig() {
libs: [
{
libraryName: 'ant-design-vue',
esModule: true,
resolveStyle: (name) => {
// ! col row popconfirm These three components have no corresponding css files after packaging. Need special treatment
if (['col', 'row'].includes(name)) {
return 'ant-design-vue/lib/grid/style/index.css';
}
if (['popconfirm'].includes(name)) {
return [
'ant-design-vue/lib/popover/style/index.css',
'ant-design-vue/lib/button/style/index.css',
];
}
return `ant-design-vue/lib/${name}/style/index.css`;
return `ant-design-vue/es/${name}/style/css`;
},
},
],
......
package.json
......@@ -29,7 +29,6 @@
"echarts": "^4.9.0",
"lodash-es": "^4.17.20",
"mockjs": "^1.1.0",
"moment": "^2.29.1",
"nprogress": "^0.2.0",
"path-to-regexp": "^6.2.0",
"qrcode": "^1.4.4",
......@@ -98,12 +97,12 @@
"stylelint-order": "^4.1.0",
"ts-node": "^9.1.0",
"typescript": "^4.1.3",
"vite": "^2.0.0-beta.30",
"vite": "^2.0.0-beta.31",
"vite-plugin-html": "^2.0.0-beta.5",
"vite-plugin-mock": "^2.0.0-beta.3",
"vite-plugin-purge-icons": "^0.5.1",
"vite-plugin-pwa": "^0.3.8",
"vite-plugin-style-import": "^0.2.1",
"vite-plugin-style-import": "^0.4.0",
"vue-eslint-parser": "^7.3.0",
"yargs": "^16.2.0"
},
......
src/components/Application/src/search/AppSearchModal.vue
......@@ -63,10 +63,11 @@
import { useI18n } from '/@/hooks/web/useI18n';
import { useAppInject } from '/@/hooks/web/useAppInject';
import clickOutside from '/@/directives/clickOutside';
import { Input } from 'ant-design-vue';
export default defineComponent({
name: 'AppSearchModal',
components: { SearchOutlined, AppSearchFooter },
components: { SearchOutlined, AppSearchFooter, [Input.name]: Input },
emits: ['close'],
props: {
......
src/components/Form/src/components/FormAction.vue
......@@ -42,7 +42,7 @@
import type { ButtonProps } from 'ant-design-vue/es/button/buttonTypes';
import { defineComponent, computed, PropType } from 'vue';
import { Form } from 'ant-design-vue';
import { Form, Col } from 'ant-design-vue';
import { Button } from '/@/components/Button';
import { BasicArrow } from '/@/components/Basic/index';
import { useFormContext } from '../hooks/useFormContext';
......@@ -58,6 +58,7 @@
FormItem: Form.Item,
Button,
BasicArrow,
[Col.name]: Col,
},
props: {
showActionButtonGroup: propTypes.bool.def(true),
......
src/components/Page/src/PageWrapper.vue
......@@ -51,6 +51,7 @@
setup(props, { slots }) {
const headerRef = ref<ComponentRef>(null);
const footerRef = ref<ComponentRef>(null);
const footerHeight = ref(0);
const { prefixCls } = useDesign('page-wrapper');
const { contentHeight, setPageHeight, pageHeight } = usePageContext();
......@@ -80,30 +81,33 @@
...bg,
...contentStyle,
minHeight: `${unref(pageHeight)}px`,
paddingBottom: `${unref(footerHeight)}px`,
};
}
);
watch(
() => contentHeight?.value,
(height) => {
() => [contentHeight?.value, getShowFooter.value],
() => {
if (!props.contentFullHeight) {
return;
}
nextTick(() => {
const footer = unref(footerRef);
const header = unref(headerRef);
let footetHeight = 0;
footerHeight.value = 0;
const footerEl = footer?.$el;
if (footerEl) {
footetHeight += footerEl?.offsetHeight ?? 0;
footerHeight.value += footerEl?.offsetHeight ?? 0;
}
let headerHeight = 0;
const headerEl = header?.$el;
if (headerEl) {
headerHeight += headerEl?.offsetHeight ?? 0;
}
setPageHeight?.(height - footetHeight - headerHeight);
setPageHeight?.(unref(contentHeight) - unref(footerHeight) - headerHeight);
});
},
{
......
src/components/registerGlobComp.ts
......@@ -5,48 +5,46 @@ import {
Button as AntButton,
// Optional
Select,
Alert,
Checkbox,
DatePicker,
Radio,
Switch,
Card,
List,
Tabs,
Descriptions,
Tree,
Table,
Divider,
Modal,
Drawer,
Dropdown,
Tag,
Tooltip,
Badge,
Popover,
Upload,
Transfer,
Steps,
PageHeader,
Result,
Empty,
Avatar,
Menu,
Breadcrumb,
Form,
Input,
Row,
Col,
Spin,
// Select,
// Alert,
// Checkbox,
// DatePicker,
// Radio,
// Switch,
// Card,
// List,
// Tabs,
// Descriptions,
// Tree,
// Table,
// Divider,
// Modal,
// Drawer,
// Dropdown,
// Tag,
// Tooltip,
// Badge,
// Popover,
// Upload,
// Transfer,
// Steps,
// PageHeader,
// Result,
// Empty,
// Avatar,
// Menu,
// Breadcrumb,
// Form,
// Input,
// Row,
// Col,
// Spin,
} from 'ant-design-vue';
// import 'ant-design-vue/dist/antd.css';
import { App } from 'vue';
const compList = [Icon, Button, AntButton.Group];
// Fix hmr multiple registered components
export function registerGlobComp(app: App) {
compList.forEach((comp: any) => {
app.component(comp.name, comp);
......@@ -55,39 +53,39 @@ export function registerGlobComp(app: App) {
// Optional
// If you need to customize global components, you can write here
// If you don’t need it, you can delete it
app
.use(Select)
.use(Alert)
.use(Breadcrumb)
.use(Checkbox)
.use(DatePicker)
.use(Radio)
.use(Switch)
.use(Card)
.use(List)
.use(Descriptions)
.use(Tree)
.use(Table)
.use(Divider)
.use(Modal)
.use(Drawer)
.use(Dropdown)
.use(Tag)
.use(Tooltip)
.use(Badge)
.use(Popover)
.use(Upload)
.use(Transfer)
.use(Steps)
.use(PageHeader)
.use(Result)
.use(Empty)
.use(Avatar)
.use(Menu)
.use(Tabs)
.use(Form)
.use(Input)
.use(Row)
.use(Col)
.use(Spin);
// app
// .use(Select)
// .use(Alert)
// .use(Breadcrumb)
// .use(Checkbox)
// .use(DatePicker)
// .use(Radio)
// .use(Switch)
// .use(Card)
// .use(List)
// .use(Descriptions)
// .use(Tree)
// .use(Table)
// .use(Divider)
// .use(Modal)
// .use(Drawer)
// .use(Dropdown)
// .use(Tag)
// .use(Tooltip)
// .use(Badge)
// .use(Popover)
// .use(Upload)
// .use(Transfer)
// .use(Steps)
// .use(PageHeader)
// .use(Result)
// .use(Empty)
// .use(Avatar)
// .use(Menu)
// .use(Tabs)
// .use(Form)
// .use(Input)
// .use(Row)
// .use(Col)
// .use(Spin);
}
src/design/ant/pagination.less
......@@ -19,7 +19,7 @@
.ant-pagination-prev,
.ant-pagination-next,
.ant-pagination-item {
margin: 0 4px;
margin: 0 4px !important;
background: #f4f4f5 !important;
border: none;
border-radius: none !important;
......@@ -61,6 +61,6 @@
}
&-disabled {
display: none;
display: none !important;
}
}
src/layouts/default/header/components/Breadcrumb.vue
......@@ -14,10 +14,12 @@
</div>
</template>
<script lang="ts">
import type { RouteLocationMatched } from 'vue-router';
import { defineComponent, ref, toRaw, watchEffect } from 'vue';
import { Breadcrumb } from 'ant-design-vue';
import { useI18n } from 'vue-i18n';
import type { RouteLocationMatched } from 'vue-router';
import { useRouter } from 'vue-router';
import { filter } from '/@/utils/helper/treeHelper';
import { REDIRECT_NAME } from '/@/router/constant';
......@@ -35,7 +37,7 @@
export default defineComponent({
name: 'LayoutBreadcrumb',
components: { HomeOutlined, Icon },
components: { HomeOutlined, Icon, [Breadcrumb.name]: Breadcrumb },
props: {
theme: propTypes.oneOf(['dark', 'light']),
},
......
src/layouts/default/header/components/notify/NoticeList.vue
......@@ -34,8 +34,15 @@
import { defineComponent, PropType } from 'vue';
import { ListItem } from './data';
import { useDesign } from '/@/hooks/web/useDesign';
import { List, Avatar, Tag } from 'ant-design-vue';
export default defineComponent({
components: {
[Avatar.name]: Avatar,
[List.name]: List,
[List.Item.name]: List.Item,
AListItemMeta: List.Item.Meta,
[Tag.name]: Tag,
},
props: {
list: {
type: Array as PropType<ListItem[]>,
......
src/locales/useLocale.ts
......@@ -7,10 +7,10 @@ import type { Ref } from 'vue';
import { unref, ref } from 'vue';
import { useLocaleSetting } from '/@/hooks/setting/useLocaleSetting';
import { dateUtil } from '/@/utils/dateUtil';
import { i18n } from './setupI18n';
import 'moment/locale/zh-cn';
const antConfigLocaleRef = ref<any>(null);
export function useLocale() {
......@@ -34,14 +34,12 @@ export function useLocale() {
antConfigLocaleRef.value = locale.default;
});
dateUtil.locale('cn');
break;
// English
case 'en':
import('ant-design-vue/es/locale/en_US').then((locale) => {
antConfigLocaleRef.value = locale.default;
});
dateUtil.locale('en-us');
break;
// other
......
src/views/dashboard/analysis/index.vue
......@@ -49,7 +49,7 @@
import TaskCard from './components/TaskCard.vue';
import FlowAnalysis from './components/FlowAnalysis';
import { CollapseContainer } from '/@/components/Container/index';
import { Row, Col } from 'ant-design-vue';
import { growCardList, taskList } from './data';
export default defineComponent({
components: {
......@@ -61,6 +61,8 @@
AnalysisBar,
TaskCard,
FlowAnalysis,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return { growCardList, taskList };
......
src/views/dashboard/workbench/index.vue
......@@ -19,9 +19,18 @@
import Week from './components/Week.vue';
import NewsList from './components/NewsList.vue';
import ShortCuts from './components/ShortCuts.vue';
import { Row, Col } from 'ant-design-vue';
export default defineComponent({
components: { ProdTotal, TodoList, Week, ShortCuts, NewsList },
components: {
ProdTotal,
TodoList,
Week,
ShortCuts,
NewsList,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return {};
},
......
src/views/demo/comp/button/index.vue
<template>
<PageWrapper
contentFullHeight
title="基础组件"
content=" 基础组件依赖于ant-design-vue,组件库已有的基础组件,项目中不会再次进行demo展示（二次封装组件除外）"
>
......
src/views/demo/comp/loading/index.vue
......@@ -20,9 +20,10 @@
import { defineComponent, reactive, toRefs, ref } from 'vue';
import { Loading, useLoading } from '/@/components/Loading';
import { PageWrapper } from '/@/components/Page';
import { Alert } from 'ant-design-vue';
export default defineComponent({
components: { Loading, PageWrapper },
components: { Loading, PageWrapper, [Alert.name]: Alert },
setup() {
const wrapEl = ref<ElRef>(null);
......
src/views/demo/comp/upload/index.vue
......@@ -14,6 +14,7 @@
import { useMessage } from '/@/hooks/web/useMessage';
import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
import { PageWrapper } from '/@/components/Page';
import { Alert } from 'ant-design-vue';
import { uploadApi } from '/@/api/sys/upload';
......@@ -32,7 +33,7 @@
},
];
export default defineComponent({
components: { BasicUpload, BasicForm, PageWrapper },
components: { BasicUpload, BasicForm, PageWrapper, [Alert.name]: Alert },
setup() {
const { createMessage } = useMessage();
const [register] = useForm({
......
src/views/demo/feat/copy/index.vue
......@@ -14,10 +14,11 @@
import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
import { useMessage } from '/@/hooks/web/useMessage';
import { PageWrapper } from '/@/components/Page';
import { Input } from 'ant-design-vue';
export default defineComponent({
name: 'Copy',
components: { CollapseContainer, PageWrapper },
components: { CollapseContainer, PageWrapper, [Input.name]: Input },
setup() {
const valueRef = ref('');
const { createMessage } = useMessage();
......
src/views/demo/feat/download/index.vue
......@@ -25,9 +25,10 @@
} from '/@/utils/file/download';
import imgBase64 from './imgBase64';
import { PageWrapper } from '/@/components/Page';
import { Alert } from 'ant-design-vue';
export default defineComponent({
components: { PageWrapper },
components: { PageWrapper, [Alert.name]: Alert },
setup() {
function handleDownByData() {
downloadByData('text content', 'testName.txt');
......
src/views/demo/feat/tabs/index.vue
......@@ -19,9 +19,11 @@
import { CollapseContainer } from '/@/components/Container/index';
import { useTabs } from '/@/hooks/web/useTabs';
import { PageWrapper } from '/@/components/Page';
import { Input } from 'ant-design-vue';
export default defineComponent({
name: 'TabsDemo',
components: { CollapseContainer, PageWrapper },
components: { CollapseContainer, PageWrapper, [Input.name]: Input },
setup() {
const { closeAll, closeLeft, closeRight, closeOther, closeCurrent, refreshPage } = useTabs();
......
src/views/demo/form/CustomerForm.vue
......@@ -62,7 +62,7 @@
},
];
export default defineComponent({
components: { BasicForm, CollapseContainer, PageWrapper },
components: { BasicForm, CollapseContainer, PageWrapper, [Input.name]: Input },
setup() {
const { createMessage } = useMessage();
const [register, { setProps }] = useForm({
......
src/views/demo/page/account/center/Application.vue
......@@ -29,7 +29,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { List, Card } from 'ant-design-vue';
import { List, Card, Row, Col } from 'ant-design-vue';
import Icon from '/@/components/Icon/index';
import { applicationList } from './data';
......@@ -39,6 +39,8 @@
ListItem: List.Item,
Card,
Icon,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return {
......
src/views/demo/page/account/center/Project.vue
......@@ -19,7 +19,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { List, Card } from 'ant-design-vue';
import { List, Card, Row, Col } from 'ant-design-vue';
import demoImg from '/@/assets/images/demo.png';
import { projectList } from './data';
......@@ -28,6 +28,8 @@
List,
ListItem: List.Item,
Card,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return {
......
src/views/demo/page/account/center/index.vue
......@@ -51,7 +51,7 @@
</template>
<script lang="ts">
import { Tag, Tabs } from 'ant-design-vue';
import { Tag, Tabs, Row, Col } from 'ant-design-vue';
import { defineComponent } from 'vue';
import { CollapseContainer } from '/@/components/Container/index';
import Icon from '/@/components/Icon/index';
......@@ -72,6 +72,8 @@
Article,
Application,
Project,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return {
......
src/views/demo/page/account/setting/BaseSetting.vue
......@@ -18,7 +18,7 @@
</CollapseContainer>
</template>
<script lang="ts">
import { Button, Upload } from 'ant-design-vue';
import { Button, Upload, Row, Col } from 'ant-design-vue';
import { defineComponent, onMounted } from 'vue';
import { BasicForm, useForm } from '/@/components/Form/index';
import { CollapseContainer } from '/@/components/Container/index';
......@@ -31,7 +31,15 @@
import { baseSetschemas } from './data';
export default defineComponent({
components: { BasicForm, CollapseContainer, Button, Upload, Icon },
components: {
BasicForm,
CollapseContainer,
Button,
Upload,
Icon,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
const { createMessage } = useMessage();
......
src/views/demo/page/desc/basic/index.vue
......@@ -29,6 +29,7 @@
import { Description } from '/@/components/Description/index';
import { BasicTable, useTable } from '/@/components/Table';
import { PageWrapper } from '/@/components/Page';
import { Divider } from 'ant-design-vue';
import {
refundSchema,
......@@ -41,7 +42,7 @@
refundTimeTableData,
} from './data';
export default defineComponent({
components: { Description, BasicTable, PageWrapper },
components: { Description, BasicTable, PageWrapper, [Divider.name]: Divider },
setup() {
const [registerRefundTable] = useTable({
title: '退货商品',
......
src/views/demo/page/desc/high/index.vue
......@@ -90,10 +90,24 @@
import { Description } from '/@/components/Description/index';
import { BasicTable, useTable } from '/@/components/Table';
import { PageWrapper } from '/@/components/Page';
import { Divider, Card, Empty, Descriptions, Steps, Tabs } from 'ant-design-vue';
import { refundTimeTableSchema, refundTimeTableData } from './data';
export default defineComponent({
components: { Description, BasicTable, PageWrapper },
components: {
Description,
BasicTable,
PageWrapper,
[Divider.name]: Divider,
[Card.name]: Card,
AEmpty: Empty,
[Descriptions.name]: Descriptions,
[Descriptions.Item.name]: Descriptions.Item,
[Steps.name]: Steps,
[Steps.Step.name]: Steps.Step,
[Tabs.name]: Tabs,
[Tabs.TabPane.name]: Tabs.TabPane,
},
setup() {
const [registerTimeTable] = useTable({
title: '退货进度',
......
src/views/demo/page/form/high/index.vue
......@@ -27,9 +27,10 @@
import PersonTable from './PersonTable.vue';
import { PageWrapper } from '/@/components/Page';
import { schemas, taskSchemas } from './data';
import { Card } from 'ant-design-vue';
export default defineComponent({
components: { BasicForm, PersonTable, PageWrapper },
components: { BasicForm, PersonTable, PageWrapper, [Card.name]: Card },
setup() {
const tableRef = ref<{ getDataSource: () => any } | null>(null);
......
src/views/demo/page/form/step/Step1.vue
......@@ -31,8 +31,16 @@
import { BasicForm, useForm } from '/@/components/Form';
import { step1Schemas } from './data';
import { Select, Input, Divider } from 'ant-design-vue';
export default defineComponent({
components: { BasicForm },
components: {
BasicForm,
[Select.name]: Select,
ASelectOption: Select.Option,
[Input.name]: Input,
[Input.Group.name]: Input.Group,
[Divider.name]: Divider,
},
emits: ['next'],
setup(_, { emit }) {
const [register, { validate }] = useForm({
......
src/views/demo/page/form/step/Step2.vue
......@@ -15,9 +15,16 @@
import { defineComponent } from 'vue';
import { BasicForm, useForm } from '/@/components/Form';
import { step2Schemas } from './data';
import { Alert, Divider, Descriptions } from 'ant-design-vue';
export default defineComponent({
components: { BasicForm },
components: {
BasicForm,
[Alert.name]: Alert,
[Divider.name]: Divider,
[Descriptions.name]: Descriptions,
[Descriptions.Item.name]: Descriptions.Item,
},
emits: ['next', 'prev'],
setup(_, { emit }) {
const [register, { validate, setProps }] = useForm({
......
src/views/demo/page/form/step/Step3.vue
......@@ -18,9 +18,13 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Result, Descriptions } from 'ant-design-vue';
export default defineComponent({
components: {},
components: {
[Result.name]: Result,
[Descriptions.name]: Descriptions,
[Descriptions.Item.name]: Descriptions.Item,
},
emits: ['redo'],
setup(_, { emit }) {
return {
......
src/views/demo/page/form/step/index.vue
......@@ -30,9 +30,17 @@
import Step2 from './Step2.vue';
import Step3 from './Step3.vue';
import { PageWrapper } from '/@/components/Page';
import { Steps } from 'ant-design-vue';
export default defineComponent({
components: { Step1, Step2, Step3, PageWrapper },
components: {
Step1,
Step2,
Step3,
PageWrapper,
[Steps.name]: Steps,
[Steps.Step.name]: Steps.Step,
},
setup() {
const current = ref(0);
......
src/views/demo/page/list/basic/index.vue
......@@ -49,14 +49,24 @@
</PageWrapper>
</template>
<script lang="ts">
import { Progress } from 'ant-design-vue';
import { Progress, Row, Col } from 'ant-design-vue';
import { defineComponent } from 'vue';
import Icon from '/@/components/Icon/index';
import { cardList } from './data';
import { PageWrapper } from '/@/components/Page';
import { List } from 'ant-design-vue';
export default defineComponent({
components: { Icon, Progress, PageWrapper },
components: {
Icon,
Progress,
PageWrapper,
[List.name]: List,
[List.Item.name]: List.Item,
AListItemMeta: List.Item.Meta,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return {
prefixCls: 'list-basic',
......
src/views/demo/page/list/card/index.vue
......@@ -37,9 +37,18 @@
import Icon from '/@/components/Icon/index';
import { cardList } from './data';
import { PageWrapper } from '/@/components/Page';
import { Card, Row, Col, List } from 'ant-design-vue';
export default defineComponent({
components: { Icon, PageWrapper },
components: {
Icon,
PageWrapper,
[Card.name]: Card,
[List.name]: List,
[List.Item.name]: List.Item,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
return {
prefixCls: 'list-card',
......
src/views/demo/page/list/search/index.vue
......@@ -53,9 +53,18 @@
import { BasicForm } from '/@/components/Form/index';
import { actions, searchList, schemas } from './data';
import { PageWrapper } from '/@/components/Page';
import { List } from 'ant-design-vue';
export default defineComponent({
components: { Icon, Tag, BasicForm, PageWrapper },
components: {
Icon,
Tag,
BasicForm,
PageWrapper,
[List.name]: List,
[List.Item.name]: List.Item,
AListItemMeta: List.Item.Meta,
},
setup() {
return {
prefixCls: 'list-search',
......
src/views/sys/login/Login.vue
......@@ -10,7 +10,7 @@
<h1>{{ title }}</h1>
</header>
<a-form class="mx-auto mt-10" :model="formData" :rules="formRules" ref="formRef">
<a-form class="login-form__main" :model="formData" :rules="formRules" ref="formRef">
<a-form-item name="account">
<a-input size="large" v-model:value="formData.account" placeholder="username: vben" />
</a-form-item>
......@@ -23,9 +23,6 @@
/>
</a-form-item>
<!-- <a-form-item name="verify" v-if="openLoginVerify">
<BasicDragVerify v-model:value="formData.verify" ref="verifyRef" />
</a-form-item> -->
<a-row>
<a-col :span="12">
<a-form-item>
......@@ -61,15 +58,13 @@
</template>
<script lang="ts">
import { defineComponent, reactive, ref, unref, toRaw } from 'vue';
import { Checkbox } from 'ant-design-vue';
import { Checkbox, Form, Input, Row, Col } from 'ant-design-vue';
import { Button } from '/@/components/Button';
import { AppLocalePicker } from '/@/components/Application';
// import { BasicDragVerify, DragVerifyActionType } from '/@/components/Verify/index';
import { userStore } from '/@/store/modules/user';
// import { appStore } from '/@/store/modules/app';
import { useMessage } from '/@/hooks/web/useMessage';
import { useGlobSetting, useProjectSetting } from '/@/hooks/setting';
import logo from '/@/assets/images/logo.png';
......@@ -77,27 +72,28 @@
export default defineComponent({
components: {
// BasicDragVerify,
[Checkbox.name]: Checkbox,
[Form.name]: Form,
[Form.Item.name]: Form.Item,
[Input.name]: Input,
[Input.Password.name]: Input.Password,
AButton: Button,
ACheckbox: Checkbox,
AppLocalePicker,
[Row.name]: Row,
[Col.name]: Col,
},
setup() {
const formRef = ref<any>(null);
const autoLoginRef = ref(false);
// const verifyRef = ref<RefInstanceType<DragVerifyActionType>>(null);
const globSetting = useGlobSetting();
const { locale } = useProjectSetting();
const { notification } = useMessage();
const { t } = useI18n();
// const openLoginVerifyRef = computed(() => appStore.getProjectConfig.openLoginVerify);
const formData = reactive({
account: 'vben',
password: '123456',
// verify: undefined,
});
const formState = reactive({
......@@ -109,16 +105,8 @@
password: [
{ required: true, message: t('sys.login.passwordPlaceholder'), trigger: 'blur' },
],
// verify: unref(openLoginVerifyRef) ? [{ required: true, message: '请通过验证码校验' }] : [],
});
// function resetVerify() {
// const verify = unref(verifyRef);
// if (!verify) return;
// formData.verify && verify.$.resume();
// formData.verify = undefined;
// }
async function handleLogin() {
const form = unref(formRef);
if (!form) return;
......@@ -140,19 +128,16 @@
}
} catch (error) {
} finally {
// resetVerify();
formState.loading = false;
}
}
return {
formRef,
// verifyRef,
formData,
formState,
formRules,
login: handleLogin,
autoLogin: autoLoginRef,
// openLoginVerify: openLoginVerifyRef,
title: globSetting && globSetting.title,
logo,
t,
......@@ -196,6 +181,10 @@
background-clip: padding-box;
.respond-to(xlarge, { margin: 0 120px 0 50px});
&__main {
margin: 30px auto 0 auto !important;
}
&-wrap {
position: absolute;
top: 0;
......
vite.config.ts
......@@ -88,10 +88,11 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
optimizeDeps: {
include: [
'moment',
'@ant-design/icons-vue',
'echarts/map/js/china',
'ant-design-vue/es/locale/zh_CN',
'moment/dist/locale/zh-cn',
'moment/locale/zh-cn',
'ant-design-vue/es/locale/en_US',
],
},
......
yarn.lock
......@@ -5691,7 +5691,7 @@ modify-values@^1.0.0:
resolved "https://registry.npmjs.org/modify-values/-/modify-values-1.0.1.tgz#b3939fa605546474e3e3e3c63d64bd43b4ee6022"
integrity sha512-xV2bxeN6F7oYjZWTe/YPAy6MN2M+sL4u/Rlm2AHCIVGfo2p1yGmBHQ6vHehl4bRTZBdHu3TSkWdYgkwpYzAGSw==
moment@^2.27.0, moment@^2.29.1:
moment@^2.27.0:
version "2.29.1"
resolved "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz#b2be769fa31940be9eeea6469c075e35006fa3d3"
integrity sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ==
......@@ -8086,10 +8086,10 @@ vite-plugin-pwa@^0.3.8:
pretty-bytes "^5.5.0"
workbox-build "^6.0.2"
vite-plugin-style-import@^0.2.1:
version "0.2.1"
resolved "https://registry.npmjs.org/vite-plugin-style-import/-/vite-plugin-style-import-0.2.1.tgz#9ad5890697efe360853e6f2e0d7dc2c92227d2d6"
integrity sha512-mbRBOz4FMZseLQ5N+QUpFoG6tkIfdRfjIRykgfYn3s4SQCivdvkDWeqPsEQY8K8Q5valwCpqP9UAnNxc0dJbQQ==
vite-plugin-style-import@^0.4.0:
version "0.4.0"
resolved "https://registry.npmjs.org/vite-plugin-style-import/-/vite-plugin-style-import-0.4.0.tgz#050664a6d3ce78bb1a32f7ac8e971ee49ab889f4"
integrity sha512-OXQ0J9Mtndag0dmSKGKpu3T2NbVvKm6vbIa1M6RprVVThRAwBgX+LSwhK7GRQiSDGH5aI6yZuVQRloVFx+pK+Q==
dependencies:
"@babel/core" "^7.12.10"
"@babel/helper-module-imports" "^7.12.5"
......@@ -8097,10 +8097,10 @@ vite-plugin-style-import@^0.2.1:
"@rollup/pluginutils" "^4.1.0"
change-case "^4.1.2"
vite@^2.0.0-beta.30:
version "2.0.0-beta.30"
resolved "https://registry.npmjs.org/vite/-/vite-2.0.0-beta.30.tgz#d0c1056d1fb05c489614360f92363eebec41a6b4"
integrity sha512-wOeO64J3k4jGjCOkH/6RUcIyT/HOTaDZSiXE75aWYqV9hI7Q6uEeSXbAFtb9bG82RGLEWdsqtCvx5t7gaeqtsw==
vite@^2.0.0-beta.31:
version "2.0.0-beta.31"
resolved "https://registry.npmjs.org/vite/-/vite-2.0.0-beta.31.tgz#0ce5f6c496c29f72062f9f0ae70dd6dfb18b0916"
integrity sha512-tHBgSsSp0+dbz8tas6zOj2KbJSKOme62jXN13rk8BZdJEum5FDnwon9+7oas4db3NnVBLnciWa1r8QUNoOZjrA==
dependencies:
esbuild "^0.8.26"
postcss "^8.2.1"
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论