Skip to content

Commit ad575cc

Browse files
sendyasendya
committed
update defaultConfig
1 parent cd20a57 commit ad575cc

File tree

4 files changed

+63
-43
lines changed

4 files changed

+63
-43
lines changed

‎src/components/tools/SettingDrawer.vue

Lines changed: 47 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -14,36 +14,56 @@
1414
<h3 class="setting-drawer-index-title">整体风格设置</h3>
1515

1616
<div class="setting-drawer-index-blockChecbox">
17-
<div class="setting-drawer-index-item" @click="changeMenuTheme('dark')">
18-
<img src="https://gw.alipayobjects.com/zos/rmsportal/LCkqqYNmvBEbokSDscrm.svg" alt="dark">
19-
<div class="setting-drawer-index-selectIcon" v-if="theme === 'dark'">
20-
<a-icon type="check"/>
17+
<a-tooltip>
18+
<template slot="title">
19+
暗色菜单风格
20+
</template>
21+
<div class="setting-drawer-index-item" @click="changeMenuTheme('dark')">
22+
<img src="https://gw.alipayobjects.com/zos/rmsportal/LCkqqYNmvBEbokSDscrm.svg" alt="dark">
23+
<div class="setting-drawer-index-selectIcon" v-if="navTheme === 'dark'">
24+
<a-icon type="check"/>
25+
</div>
2126
</div>
22-
</div>
23-
<div class="setting-drawer-index-item" @click="changeMenuTheme('light')">
24-
<img src="https://gw.alipayobjects.com/zos/rmsportal/jpRkZQMyYRryryPNtyIC.svg" alt="light">
25-
<div class="setting-drawer-index-selectIcon" v-if="theme !== 'dark'">
26-
<a-icon type="check"/>
27+
</a-tooltip>
28+
29+
<a-tooltip>
30+
<template slot="title">
31+
亮色菜单风格
32+
</template>
33+
<div class="setting-drawer-index-item" @click="changeMenuTheme('light')">
34+
<img src="https://gw.alipayobjects.com/zos/rmsportal/jpRkZQMyYRryryPNtyIC.svg" alt="light">
35+
<div class="setting-drawer-index-selectIcon" v-if="navTheme !== 'dark'">
36+
<a-icon type="check"/>
37+
</div>
2738
</div>
28-
</div>
39+
</a-tooltip>
2940
</div>
3041
</div>
3142

3243
<div :style="{ marginBottom: '24px' }">
3344
<h3 class="setting-drawer-index-title">主题色</h3>
3445

35-
<div>
46+
<div style="height: 20px">
3647
<a-tooltip class="setting-drawer-theme-color-colorBlock" v-for="(item, index) in colorList" :key="index">
3748
<template slot='title'>
3849
{{ item.key }}
3950
</template>
40-
<a-tag :color="item.color" @click="changeColor(item)">
41-
<a-icon type="check" v-if="item.color === colorObj.color"></a-icon>
51+
<a-tag :color="item.color" @click="changeColor(item.color)">
52+
<a-icon type="check" v-if="item.color === primaryColor"></a-icon>
4253
</a-tag>
4354
</a-tooltip>
4455

4556
</div>
4657
</div>
58+
<a-divider />
59+
<div :style="{ marginBottom: '24px' }">
60+
<a-alert type="warning">
61+
<span slot="message">
62+
配置栏只在开发环境用于预览，生产环境不会展现，请手动修改配置文件
63+
<a href="https://github.com/sendya/ant-design-pro-vue/blob/master/src/defaultConfig.js" target="_blank">src/defaultConfig.js</a>
64+
</span>
65+
</a-alert>
66+
</div>
4767
</div>
4868
<div class="setting-drawer-index-handle" @click="toggle">
4969
<a-icon type="setting" v-if="!visible"/>
@@ -62,35 +82,35 @@
6282
6383
const colorList = [
6484
{
65-
key: 'dust',
85+
key: '薄暮',
6686
color: '#F5222D',
6787
},
6888
{
69-
key: 'volcano',
89+
key: '火山',
7090
color: '#FA541C',
7191
},
7292
{
73-
key: 'sunset',
93+
key: '日暮',
7494
color: '#FAAD14',
7595
},
7696
{
77-
key: 'cyan',
97+
key: '明青',
7898
color: '#13C2C2',
7999
},
80100
{
81-
key: 'green',
101+
key: '极光绿',
82102
color: '#52C41A',
83103
},
84104
{
85-
key: 'daybreak',
105+
key: '拂晓蓝（默认）',
86106
color: '#1890FF',
87107
},
88108
{
89-
key: 'geekblue',
109+
key: '极客蓝',
90110
color: '#2F54EB',
91111
},
92112
{
93-
key: 'purple',
113+
key: '酱紫',
94114
color: '#722ED1',
95115
},
96116
];
@@ -107,8 +127,8 @@
107127
},
108128
computed: {
109129
...mapState({
110-
theme: state => state.app.theme,
111-
colorObj: state => state.app.color,
130+
navTheme: state => state.app.theme,
131+
primaryColor: state => state.app.color,
112132
})
113133
},
114134
mounted () {
@@ -117,8 +137,8 @@
117137
vm.visible = false
118138
}, 1)
119139
// 当主题色不是默认色时，才进行主题编译
120-
if (this.colorObj.color !== config.color.color) {
121-
updateTheme(this.colorObj.color)
140+
if (this.primaryColor !== config.primaryColor) {
141+
updateTheme(this.primaryColor)
122142
}
123143
},
124144
methods: {
@@ -135,9 +155,9 @@
135155
this.$store.dispatch('ToggleTheme', theme)
136156
},
137157
changeColor(color) {
138-
if (this.colorObj.color !== color.color) {
158+
if (this.primaryColor !== color) {
139159
this.$store.dispatch('ToggleColor', color)
140-
updateTheme(color.color)
160+
updateTheme(color)
141161
}
142162
}
143163
},

‎src/defaultConfig.js

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
export default {
2-
color: {
3-
key: 'daybreak',
4-
color: '#1890FF'
5-
},
6-
theme: 'dark',
7-
colorWeak: false
2+
primaryColor: '#1890FF', // primary color of ant design
3+
navTheme: 'dark', // theme for nav menu
4+
colorWeak: false,
5+
// vue-ls options
6+
storageOptions: {
7+
namespace: 'pro__', // key prefix
8+
name: 'ls', // name variable Vue.[ls] or this.[$ls],
9+
storage: 'local', // storage name session, local, memory
10+
}
811
}

‎src/main.js

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,13 @@ Vue.filter('dayjs', function(dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
2121
return dayjs(dataStr).format(pattern)
2222
})
2323

24-
const options = {
25-
namespace: 'ant__', // key prefix
26-
name: 'ls', // name variable Vue.[ls] or this.[$ls],
27-
storage: 'local', // storage name session, local, memory
28-
}
24+
Vue.filter('moment', function(dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
25+
return dayjs(dataStr).format(pattern)
26+
})
2927

3028
Vue.config.productionTip = false
3129

32-
Vue.use(Storage, options)
30+
Vue.use(Storage, config.storageOptions)
3331
Vue.use(Antd)
3432
Vue.use(VueAxios, router)
3533
Vue.use(Viser)
@@ -39,10 +37,9 @@ new Vue({
3937
store,
4038
mounted () {
4139
store.commit('SET_SIDEBAR_TYPE', Vue.ls.get(SIDEBAR_TYPE, false))
42-
store.commit('TOGGLE_THEME', Vue.ls.get(DEFAULT_THEME, config.theme))
43-
store.commit('TOGGLE_COLOR', Vue.ls.get(DEFAULT_COLOR, config.color))
40+
store.commit('TOGGLE_THEME', Vue.ls.get(DEFAULT_THEME, config.navTheme))
41+
store.commit('TOGGLE_COLOR', Vue.ls.get(DEFAULT_COLOR, config.primaryColor))
4442
store.commit('SET_TOKEN', Vue.ls.get(ACCESS_TOKEN))
45-
4643
},
4744
render: h => h(App)
4845
}).$mount('#app')

‎src/router/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export const constantRouterMap = [
3434
path: '/',
3535
component: Layout,
3636
redirect: '/login',
37-
name: '首页',
37+
name: 'home',
3838
hidden: true
3939
}
4040
]

0 commit comments

Comments
 (0)