Files
tms-erp-web/src/main.js
赵忠林 8a262d9d41 style(ui): 统一弹窗分组白卡样式并改造相关弹窗布局
- 新增全局弹窗灰底背景色,提升视觉一致性
- 新增通用分组白卡组件 section-card,标题融入卡头,支持额外插槽
- 统一 Avue 弹窗表单及分组为白卡样式
- 调整 common-route.vue 弹窗,使用 section-card 分组包裹查询条件与常用地址
- 改造 loading-manage.vue 弹窗所有分区,采用 section-card 统一风格
- 全局样式调整弹窗内容区表单项间距及两列表单布局工具类
- 在 main.js 全局注册 section-card 组件,便于项目统一复用
2026-08-06 09:27:49 +08:00

111 lines
3.9 KiB
JavaScript

import { createApp } from 'vue';
import website from './config/website';
import axios from './axios';
import router from './router/';
import store from './store';
import i18n from './lang/';
import { language, messages } from './lang/';
import * as ElementPlusIconsVue from '@element-plus/icons-vue';
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css';
import Avue from '@smallwei/avue';
import '@smallwei/avue/lib/index.css';
import avueUeditor from 'avue-plugin-ueditor';
import crudCommon from '@/mixins/crud.js';
import { getScreen, findColumn } from './utils/util';
import { setupPaginationEnhancer } from './utils/pagination';
import { setupDialogFormLabelAlign } from './utils/dialog-form-label';
import './permission';
import error from './error';
import App from './App.vue';
import 'animate.css';
import dayjs from 'dayjs';
import 'styles/common.scss';
// 系统组件
import debug from './debug';
import VueClipboard from 'vue3-clipboard';
import highlight from './components/highlight/main.vue';
import codeEditor from './components/code-editor/main.vue';
import cronEditor from './components/cron-editor/main.vue';
import basicBlock from './components/basic-block/main.vue';
import basicContainer from './components/basic-container/main.vue';
import emptyPagination from './components/empty-pagination/main.vue';
import vehicleAttachmentUpload from './components/vehicle-attachment-upload/main.vue';
import thirdRegister from './components/third-register/main.vue';
import flowDesign from './components/flow-design/main.vue';
import flowDesignStep from './components/flow-design-step/main.vue';
// 业务组件
import codeSetting from './views/tool/codesetting.vue';
import formSetting from './views/tool/formsetting.vue';
import tenantPackage from './views/system/tenantpackage.vue';
import tenantDatasource from './views/system/tenantdatasource.vue';
// 通用弹窗分组白卡(灰底弹窗内使用,标题在卡内)
import sectionCard from './components/section-card/main.vue';
window.$crudCommon = crudCommon;
debug();
window.axios = axios;
const app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component);
}
app.component('basicContainer', basicContainer);
app.component('basicBlock', basicBlock);
app.component('emptyPagination', emptyPagination);
app.component('vehicleAttachmentUpload', vehicleAttachmentUpload);
app.component('highlight', highlight);
app.component('codeEditor', codeEditor);
app.component('cronEditor', cronEditor);
app.component('thirdRegister', thirdRegister);
app.component('flowDesign', flowDesign);
app.component('flowDesignStep', flowDesignStep);
app.component('codeSetting', codeSetting);
app.component('formSetting', formSetting);
app.component('tenantPackage', tenantPackage);
app.component('tenantDatasource', tenantDatasource);
app.component('sectionCard', sectionCard);
app.config.globalProperties.$app = app;
app.config.globalProperties.$dayjs = dayjs;
app.config.globalProperties.website = website;
app.config.globalProperties.getScreen = getScreen;
app.config.globalProperties.findColumn = findColumn;
app.use(error);
app.use(i18n);
app.use(store);
app.use(router);
app.use(ElementPlus, {
locale: messages[language],
});
app.use(Avue, {
axios,
calcHeight: 10,
crudOption: {
searchIcon: true,
searchIndex: 4,
searchLabelWidth: 160,
searchMenuSpan: 24,
searchMenuPosition: 'right',
menuWidth: 160,
viewBtnIcon: ' ',
editBtnIcon: ' ',
copyBtnIcon: ' ',
delBtnIcon: ' ',
saveBtnIcon: ' ',
updateBtnIcon: ' ',
cancelBtnIcon: ' ',
mockBtnIcon: ' ',
},
labelPosition: 'right',
labelWidth: 'auto',
locale: language,
i18n: (key, options) => i18n.global.t(key, options),
});
app.use(avueUeditor, { axios });
app.use(VueClipboard, {
autoSetContainer: true,
appendToBody: true, // 这可以帮助解决一些更复杂的使用场景下的问题
});
app.mount('#app');
setupPaginationEnhancer();
setupDialogFormLabelAlign();