mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-19 09:14:27 +08:00
add desktop frontend framework
This commit is contained in:
MaysWind
+311
-1
@@ -1,6 +1,316 @@
|
||||
import { createApp } from 'vue'
|
||||
import { createApp } from 'vue';
|
||||
import { createPinia } from 'pinia';
|
||||
import { createI18n } from 'vue-i18n';
|
||||
|
||||
import { createVuetify } from 'vuetify';
|
||||
import { VApp } from 'vuetify/components/VApp';
|
||||
import { VAvatar } from 'vuetify/components/VAvatar';
|
||||
import { VBtn } from 'vuetify/components/VBtn';
|
||||
import { VCard, VCardActions, VCardItem, VCardSubtitle, VCardText, VCardTitle } from 'vuetify/components/VCard';
|
||||
import { VChip } from 'vuetify/components/VChip';
|
||||
import { VDialog } from 'vuetify/components/VDialog';
|
||||
import { VDivider } from 'vuetify/components/VDivider';
|
||||
import { VForm } from 'vuetify/components/VForm';
|
||||
import { VContainer, VCol, VRow, VSpacer } from 'vuetify/components/VGrid';
|
||||
import { VIcon } from 'vuetify/components/VIcon';
|
||||
import { VImg } from 'vuetify/components/VImg';
|
||||
import { VInput } from 'vuetify/components/VInput';
|
||||
import { VList, VListGroup, VListImg, VListItem, VListItemAction, VListItemMedia, VListItemSubtitle, VListItemTitle, VListSubheader } from 'vuetify/components/VList';
|
||||
import { VMenu } from 'vuetify/components/VMenu';
|
||||
import { VOverlay } from 'vuetify/components/VOverlay';
|
||||
import { VPagination } from 'vuetify/components/VPagination';
|
||||
import { VProgressCircular } from 'vuetify/components/VProgressCircular';
|
||||
import { VProgressLinear } from 'vuetify/components/VProgressLinear';
|
||||
import { VSelect } from 'vuetify/components/VSelect';
|
||||
import { VSheet } from 'vuetify/components/VSheet';
|
||||
import { VSnackbar } from 'vuetify/components/VSnackbar';
|
||||
import { VTabs } from 'vuetify/components/VTabs';
|
||||
import { VTable } from 'vuetify/components/VTable';
|
||||
import { VTextField } from 'vuetify/components/VTextField';
|
||||
import { aliases, mdi } from 'vuetify/iconsets/mdi-svg';
|
||||
import 'vuetify/styles';
|
||||
|
||||
import 'line-awesome/dist/line-awesome/css/line-awesome.css';
|
||||
|
||||
import { PerfectScrollbar } from 'vue3-perfect-scrollbar';
|
||||
import 'vue3-perfect-scrollbar/dist/vue3-perfect-scrollbar.min.css';
|
||||
|
||||
import VueDatePicker from '@vuepic/vue-datepicker';
|
||||
import '@vuepic/vue-datepicker/dist/main.css';
|
||||
|
||||
import router from '@/router/desktop.js';
|
||||
|
||||
import version from '@/lib/version.js';
|
||||
import settings from '@/lib/settings.js';
|
||||
import userstate from '@/lib/userstate.js';
|
||||
import {
|
||||
getI18nOptions,
|
||||
translateIf,
|
||||
translateError,
|
||||
i18nFunctions
|
||||
} from '@/lib/i18n.js';
|
||||
|
||||
import '@/styles/desktop/base.css';
|
||||
import '@/styles/desktop/layout.css';
|
||||
import '@/styles/desktop/font-size.css';
|
||||
import '@/styles/desktop/gap-size.css';
|
||||
import '@/styles/desktop/vuetify.css';
|
||||
import '@/styles/desktop/classess.css';
|
||||
|
||||
import App from './DesktopApp.vue';
|
||||
|
||||
const app = createApp(App);
|
||||
const pinia = createPinia();
|
||||
const i18n = createI18n(getI18nOptions());
|
||||
const vuetify = createVuetify({
|
||||
components: {
|
||||
VApp,
|
||||
VAvatar,
|
||||
VBtn,
|
||||
VCard,
|
||||
VCardActions,
|
||||
VCardItem,
|
||||
VCardSubtitle,
|
||||
VCardText,
|
||||
VCardTitle,
|
||||
VChip,
|
||||
VDialog,
|
||||
VDivider,
|
||||
VForm,
|
||||
VContainer,
|
||||
VCol,
|
||||
VRow,
|
||||
VSpacer,
|
||||
VIcon,
|
||||
VImg,
|
||||
VInput,
|
||||
VList,
|
||||
VListGroup,
|
||||
VListImg,
|
||||
VListItem,
|
||||
VListItemAction,
|
||||
VListItemMedia,
|
||||
VListItemSubtitle,
|
||||
VListItemTitle,
|
||||
VListSubheader,
|
||||
VMenu,
|
||||
VOverlay,
|
||||
VPagination,
|
||||
VProgressCircular,
|
||||
VProgressLinear,
|
||||
VSelect,
|
||||
VSheet,
|
||||
VSnackbar,
|
||||
VTabs,
|
||||
VTable,
|
||||
VTextField
|
||||
},
|
||||
icons: {
|
||||
defaultSet: 'mdi',
|
||||
aliases,
|
||||
sets: {
|
||||
mdi
|
||||
}
|
||||
},
|
||||
|
||||
defaults: {
|
||||
VAlert: {
|
||||
VBtn: {
|
||||
color: undefined
|
||||
}
|
||||
},
|
||||
VAutocomplete: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VAvatar: {
|
||||
variant: 'flat',
|
||||
VIcon: {
|
||||
size: 24,
|
||||
},
|
||||
},
|
||||
VBadge: {
|
||||
color: 'primary'
|
||||
},
|
||||
VBtn: {
|
||||
color: 'primary'
|
||||
},
|
||||
VCheckbox: {
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VChip: {
|
||||
elevation: 0
|
||||
},
|
||||
VList: {
|
||||
color: 'primary'
|
||||
},
|
||||
VPagination: {
|
||||
activeColor: 'primary'
|
||||
},
|
||||
VRadio: {
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VSelect: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VSlider: {
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VSwitch: {
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VProgressCircular: {
|
||||
size: 40
|
||||
},
|
||||
VTabs: {
|
||||
color: 'primary',
|
||||
VSlideGroup: {
|
||||
showArrows: true
|
||||
}
|
||||
},
|
||||
VTextarea: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VTextField: {
|
||||
variant: 'outlined',
|
||||
color: 'primary',
|
||||
hideDetails: 'auto'
|
||||
},
|
||||
VTooltip: {
|
||||
location: 'top'
|
||||
}
|
||||
},
|
||||
theme: {
|
||||
defaultTheme: 'light',
|
||||
themes: {
|
||||
light: {
|
||||
dark: false,
|
||||
colors: {
|
||||
'primary': '#c67e48',
|
||||
'secondary': '#8a8d93',
|
||||
'on-secondary': '#fff',
|
||||
'success': '#4cd964',
|
||||
'info': '#2196f3',
|
||||
'warning': '#ff9500',
|
||||
'error': '#ff3b30',
|
||||
'on-primary': '#ffffff',
|
||||
'on-success': '#ffffff',
|
||||
'on-warning': '#ffffff',
|
||||
'background': '#faf8f4',
|
||||
'on-background': '#413935',
|
||||
'on-surface': '#413935',
|
||||
'grey-50': '#fafafa',
|
||||
'grey-100': '#f0f2f8',
|
||||
'grey-200': '#eeeeee',
|
||||
'grey-300': '#e0e0e0',
|
||||
'grey-400': '#bdbdbd',
|
||||
'grey-500': '#9e9e9e',
|
||||
'grey-600': '#757575',
|
||||
'grey-700': '#616161',
|
||||
'grey-800': '#424242',
|
||||
'grey-900': '#212121',
|
||||
'perfect-scrollbar-thumb': '#dbdade',
|
||||
'skin-bordered-background': '#fff',
|
||||
'skin-bordered-surface': '#fff'
|
||||
},
|
||||
variables: {
|
||||
'btn-height': '38px',
|
||||
'code-color': '#ff8000',
|
||||
'overlay-scrim-background': '#3a3541',
|
||||
'overlay-scrim-opacity': 0.5,
|
||||
'hover-opacity': 0.04,
|
||||
'focus-opacity': 0.1,
|
||||
'selected-opacity': 0.12,
|
||||
'activated-opacity': 0.1,
|
||||
'pressed-opacity': 0.14,
|
||||
'dragged-opacity': 0.1,
|
||||
'border-color': '#3a3541',
|
||||
'table-header-background': '#f9fafc',
|
||||
'custom-background': '#f9f8f9',
|
||||
'shadow-key-umbra-opacity': 'rgba(var(--v-theme-on-surface), 0.08)',
|
||||
'shadow-key-penumbra-opacity': 'rgba(var(--v-theme-on-surface), 0.12)',
|
||||
'shadow-key-ambient-opacity': 'rgba(var(--v-theme-on-surface), 0.04)'
|
||||
}
|
||||
},
|
||||
dark: {
|
||||
dark: true,
|
||||
colors: {
|
||||
'primary': '#c67e48',
|
||||
'secondary': '#8a8d93',
|
||||
'on-secondary': '#fff',
|
||||
'success': '#4cd964',
|
||||
'info': '#2196f3',
|
||||
'warning': '#ff9500',
|
||||
'error': '#ff3b30',
|
||||
'on-primary': '#ffffff',
|
||||
'on-success': '#ffffff',
|
||||
'on-warning': '#ffffff',
|
||||
'background': '#28243d',
|
||||
'on-background': '#fcf0e3',
|
||||
'surface': '#312d4b',
|
||||
'on-surface': '#fcf0e3',
|
||||
'grey-50': '#2a2e42',
|
||||
'grey-100': '#474360',
|
||||
'grey-200': '#4a5072',
|
||||
'grey-300': '#5e6692',
|
||||
'grey-400': '#7983bb',
|
||||
'grey-500': '#8692d0',
|
||||
'grey-600': '#aab3de',
|
||||
'grey-700': '#b6bee3',
|
||||
'grey-800': '#cfd3ec',
|
||||
'grey-900': '#e7e9f6',
|
||||
'perfect-scrollbar-thumb': '#4a5072',
|
||||
'skin-bordered-background': '#312d4b',
|
||||
'skin-bordered-surface': '#312d4b'
|
||||
},
|
||||
variables: {
|
||||
'btn-height': '38px',
|
||||
'code-color': '#ff8000',
|
||||
'overlay-scrim-background': '#2C2942',
|
||||
'overlay-scrim-opacity': 0.6,
|
||||
'hover-opacity': 0.04,
|
||||
'focus-opacity': 0.1,
|
||||
'selected-opacity': 0.12,
|
||||
'activated-opacity': 0.1,
|
||||
'pressed-opacity': 0.14,
|
||||
'dragged-opacity': 0.1,
|
||||
'border-color': '#E7E3FC',
|
||||
'table-header-background': '#3D3759',
|
||||
'custom-background': '#373452',
|
||||
'shadow-key-umbra-opacity': 'rgba(20, 18, 33, 0.08)',
|
||||
'shadow-key-penumbra-opacity': 'rgba(20, 18, 33, 0.12)',
|
||||
'shadow-key-ambient-opacity': 'rgba(20, 18, 33, 0.04)'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
app.use(pinia);
|
||||
app.use(i18n);
|
||||
app.use(vuetify);
|
||||
app.use(router);
|
||||
|
||||
app.component('PerfectScrollbar', PerfectScrollbar);
|
||||
app.component('VueDatePicker', VueDatePicker);
|
||||
|
||||
app.config.globalProperties.$version = version.getVersion();
|
||||
app.config.globalProperties.$buildTime = version.getBuildTime();
|
||||
|
||||
app.config.globalProperties.$settings = settings;
|
||||
app.config.globalProperties.$locale = i18nFunctions(i18n.global);
|
||||
app.config.globalProperties.$tIf = (text, isTranslate) => translateIf(text, isTranslate, i18n.global.t);
|
||||
app.config.globalProperties.$tError = (message) => translateError(message, i18n.global.t);
|
||||
|
||||
app.config.globalProperties.$user = userstate;
|
||||
|
||||
app.mount('#app');
|
||||
|
||||
Reference in New Issue
Block a user