120 lines
3.0 KiB
Vue
120 lines
3.0 KiB
Vue
<script setup>
|
|
import { RouterView } from 'vue-router'
|
|
import { ref, onMounted } from 'vue'
|
|
import { theme } from 'ant-design-vue'
|
|
import SvgSprite from '@/components/icons/SvgSprite.vue'
|
|
import { useUserStore } from '@/stores/user'
|
|
import tokenManager from '@gold/utils/token-manager'
|
|
import zhCN from 'ant-design-vue/es/locale/zh_CN';
|
|
const themeToken = ref({
|
|
token: {
|
|
colorPrimary: '#3B82F6',
|
|
colorInfo: '#2563EB',
|
|
colorSuccess: '#10B981',
|
|
colorWarning: '#F59E0B',
|
|
colorError: '#EF4444',
|
|
colorBgBase: '#F8FAFC',
|
|
colorBgContainer: '#FFFFFF',
|
|
colorBgElevated: '#FFFFFF',
|
|
colorTextBase: '#334155',
|
|
colorTextSecondary: '#64748B',
|
|
colorTextTertiary: '#94A3B8',
|
|
colorBorder: '#E2E8F0',
|
|
colorBorderSecondary: '#F1F5F9',
|
|
borderRadius: 8,
|
|
borderRadiusSM: 4,
|
|
borderRadiusLG: 12,
|
|
wireframe: false,
|
|
fontSize: 14,
|
|
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
|
|
fontSizeHeading1: 32,
|
|
fontSizeHeading2: 24,
|
|
fontSizeHeading3: 20,
|
|
fontSizeHeading4: 16,
|
|
fontSizeHeading5: 14,
|
|
motionDurationMid: '0.15s',
|
|
motionEaseInOut: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
boxShadow: '0 1px 2px 0 rgb(0 0 0 / 0.05)',
|
|
boxShadowSecondary: '0 4px 6px -1px rgb(0 0 0 / 0.1)',
|
|
boxShadowTertiary: '0 10px 15px -3px rgb(0 0 0 / 0.1)',
|
|
},
|
|
algorithm: undefined, // 可以设置为 theme.darkAlgorithm 用于暗色主题
|
|
components: {
|
|
Button: {
|
|
controlHeight: 32,
|
|
controlHeightSM: 24,
|
|
controlHeightLG: 40,
|
|
borderRadius: 8,
|
|
},
|
|
Card: {
|
|
borderRadius: 12,
|
|
boxShadow: '0 1px 2px 0 rgb(0 0 0 / 0.05)',
|
|
},
|
|
Input: {
|
|
borderRadius: 8,
|
|
controlHeight: 32,
|
|
},
|
|
Table: {
|
|
borderRadius: 8,
|
|
headerBg: '#F8FAFC',
|
|
},
|
|
Menu: {
|
|
itemHeight: 40,
|
|
itemMarginInline: 4,
|
|
itemMarginBlock: 2,
|
|
},
|
|
}
|
|
})
|
|
|
|
onMounted(async () => {})
|
|
</script>
|
|
|
|
<template>
|
|
<a-config-provider :theme="themeToken" :locale="zhCN">
|
|
<SvgSprite />
|
|
<keep-alive>
|
|
<RouterView />
|
|
</keep-alive>
|
|
</a-config-provider>
|
|
</template>
|
|
|
|
<style>
|
|
/* 全局样式保持不变 */
|
|
.ant-btn{
|
|
align-items: center;
|
|
text-align: center;
|
|
display: flex;
|
|
}
|
|
|
|
.ant-select-selector {
|
|
background: var(--color-bg) !important;
|
|
border: 1px solid var(--color-border) !important;
|
|
border-radius: 4px !important;
|
|
transition: all 0.2s !important;
|
|
min-height: 32px !important;
|
|
}
|
|
|
|
.ant-select-selection-item,
|
|
.ant-select-selection-placeholder {
|
|
line-height: 30px !important;
|
|
color: var(--color-text) !important;
|
|
}
|
|
|
|
.ant-select-focused .ant-select-selector {
|
|
border-color: var(--color-primary) !important;
|
|
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1) !important;
|
|
}
|
|
|
|
.ant-select:hover .ant-select-selector {
|
|
border-color: var(--color-primary) !important;
|
|
}
|
|
|
|
.ant-select-arrow {
|
|
color: var(--color-text-secondary) !important;
|
|
}
|
|
.ant-modal .ant-modal-footer {
|
|
display: flex;
|
|
justify-content: end;
|
|
}
|
|
</style>
|