Merge branch 'feature/global_size' into develop
Former-commit-id: 1be752dd21525cd5ac45317912a1201c0e8b0d5b [formerly 1be752dd21525cd5ac45317912a1201c0e8b0d5b [formerly 1be752dd21525cd5ac45317912a1201c0e8b0d5b [formerly 1be752dd21525cd5ac45317912a1201c0e8b0d5b [formerly e07a8bc0abfc66c1b1358a05c7c742dc05b6cef9 [formerly 9716d1badc412438a2bb0bf9dd1cc6e1c7826ce0]]]]] Former-commit-id: 21608061b0d72bde60d7df1371147aca4413f3c5 Former-commit-id: 5e6b5c4fbbe2a88958e464ef3887424cd870ce2b Former-commit-id: cf02dcbb8e6775489348a0cf7b507606377d5d29 [formerly 2b4529f2b8baa487f345c02235b52d69dd146e80] Former-commit-id: e6b4e435cffa6a72af57cfd718f7524d2e48884a Former-commit-id: c2b1764a6d88bc69d7da32fc947acab15779c482 Former-commit-id: 94976dfcd9dfd4a28ca041b30cd349160401fa47 Former-commit-id: d3f861801fb3f8196e6aa9ee708e659ec17721e6 Former-commit-id: 137e9ae5069ad4c7683dff708427ac7c7040c26a
This commit is contained in:
1
package-lock.json.REMOVED.git-id
Normal file
1
package-lock.json.REMOVED.git-id
Normal file
@@ -0,0 +1 @@
|
||||
0db501622270146313d905a0a5f39854fb2494ac
|
||||
@@ -1 +1 @@
|
||||
76c08deda5f3f6bd81e91aeb695cae984eab131e
|
||||
875522462ce00aa53ebb933ad8a70561bf30dfc5
|
||||
58
src/layout/header-aside/components/header-size/index.vue
Normal file
58
src/layout/header-aside/components/header-size/index.vue
Normal file
@@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<el-dropdown placement="bottom" size="small" @command="handleChange">
|
||||
<el-button class="d2-mr btn-text can-hover" type="text">
|
||||
<d2-icon name="font" style="font-size: 16px;"/>
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item command="">
|
||||
<d2-icon :name="iconName('default')" class="d2-mr-5"/>默认
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="medium">
|
||||
<d2-icon :name="iconName('medium')" class="d2-mr-5"/>中
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="small">
|
||||
<d2-icon :name="iconName('small')" class="d2-mr-5"/>小
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="mini">
|
||||
<d2-icon :name="iconName('mini')" class="d2-mr-5"/>最小
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapMutations } from 'vuex'
|
||||
export default {
|
||||
name: 'd2-header-size',
|
||||
computed: {
|
||||
...mapState('d2admin/size', [
|
||||
'value'
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
// 注意 这里是关键
|
||||
// 因为需要访问 this.$ELEMENT 所以只能在这里使用这种方式
|
||||
value: {
|
||||
handler (val) {
|
||||
this.$ELEMENT.size = val
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapMutations('d2admin/size', [
|
||||
'set'
|
||||
]),
|
||||
handleChange (value) {
|
||||
this.set(value)
|
||||
this.$message({
|
||||
message: `设置尺寸成功 ${value}`,
|
||||
type: 'success'
|
||||
})
|
||||
},
|
||||
iconName (name) {
|
||||
return name === this.value ? 'dot-circle-o' : 'circle-o'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-dropdown class="d2-mr">
|
||||
<el-dropdown size="small" class="d2-mr">
|
||||
<span class="btn-text">你好 {{info.name}}</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="logOff">
|
||||
|
||||
@@ -30,6 +30,7 @@
|
||||
class="d2-multiple-page-control-btn"
|
||||
flex-box="0">
|
||||
<el-dropdown
|
||||
size="default"
|
||||
split-button
|
||||
@click="handleControlBtnClick"
|
||||
@command="command => handleControlItemClick(command)">
|
||||
|
||||
@@ -29,6 +29,7 @@
|
||||
<d2-header-error-log/>
|
||||
<d2-header-fullscreen/>
|
||||
<d2-header-theme/>
|
||||
<d2-header-size/>
|
||||
<d2-header-user/>
|
||||
</div>
|
||||
</div>
|
||||
@@ -92,6 +93,7 @@ export default {
|
||||
'd2-tabs': () => import('./components/tabs'),
|
||||
'd2-header-fullscreen': () => import('./components/header-fullscreen'),
|
||||
'd2-header-search': () => import('./components/header-search'),
|
||||
'd2-header-size': () => import('./components/header-size'),
|
||||
'd2-header-theme': () => import('./components/header-theme'),
|
||||
'd2-header-user': () => import('./components/header-user'),
|
||||
'd2-header-error-log': () => import('./components/header-error-log')
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<!-- 表单部分 -->
|
||||
<div class="form-group">
|
||||
<el-card>
|
||||
<el-form ref="loginForm" label-position="top" :rules="rules" :model="formLogin">
|
||||
<el-form ref="loginForm" label-position="top" :rules="rules" :model="formLogin" size="default">
|
||||
<el-form-item prop="username">
|
||||
<el-input type="text" v-model="formLogin.username" placeholder="用户名">
|
||||
<i slot="prepend" class="fa fa-user-circle-o"></i>
|
||||
|
||||
@@ -3,6 +3,8 @@ import ElementUI from 'element-ui'
|
||||
import 'element-ui/lib/theme-chalk/index.css'
|
||||
// flex 布局库
|
||||
import 'flex.css'
|
||||
// store
|
||||
import store from '@/store/index'
|
||||
// 组件
|
||||
import '@/components'
|
||||
// svg 图标
|
||||
@@ -15,9 +17,19 @@ import pluginLog from '@/plugin/log'
|
||||
import pluginOpen from '@/plugin/open'
|
||||
|
||||
export default {
|
||||
install (Vue, options) {
|
||||
async install (Vue, options) {
|
||||
// 获得用户设置的全局尺寸
|
||||
const size = await store.dispatch('d2admin/db/get', {
|
||||
dbName: 'sys',
|
||||
path: 'size.value',
|
||||
defaultValue: '',
|
||||
user: true
|
||||
})
|
||||
console.log('size: ', size)
|
||||
// Element
|
||||
Vue.use(ElementUI)
|
||||
Vue.use(ElementUI, {
|
||||
size
|
||||
})
|
||||
// 插件
|
||||
Vue.use(pluginError)
|
||||
Vue.use(pluginExport)
|
||||
|
||||
@@ -11,6 +11,7 @@ import gray from './modules/gray'
|
||||
import page from './modules/page'
|
||||
import transition from './modules/transition'
|
||||
import search from './modules/search'
|
||||
import size from './modules/size'
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
@@ -27,6 +28,7 @@ export default {
|
||||
gray,
|
||||
page,
|
||||
transition,
|
||||
search
|
||||
search,
|
||||
size
|
||||
}
|
||||
}
|
||||
|
||||
@@ -108,8 +108,10 @@ export default {
|
||||
this.commit('d2admin/transition/load')
|
||||
// DB -> store 持久化数据加载上次退出时的多页列表
|
||||
this.commit('d2admin/page/openedLoad')
|
||||
// DB -> store 持久化数据加载这个用户之前设置的侧边栏折叠状态
|
||||
// DB -> store 持久化数据加载侧边栏折叠状态
|
||||
this.commit('d2admin/menu/asideCollapseLoad')
|
||||
// DB -> store 持久化数据加载全局尺寸
|
||||
this.commit('d2admin/size/load')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
38
src/store/modules/d2admin/modules/size.js
Normal file
38
src/store/modules/d2admin/modules/size.js
Normal file
@@ -0,0 +1,38 @@
|
||||
export default {
|
||||
namespaced: true,
|
||||
state: {
|
||||
// 尺寸
|
||||
value: '' // medium small mini
|
||||
},
|
||||
mutations: {
|
||||
/**
|
||||
* @description 设置尺寸
|
||||
* @param {Object} state vuex state
|
||||
* @param {String} size 尺寸
|
||||
*/
|
||||
set (state, size) {
|
||||
// store 赋值
|
||||
state.value = size
|
||||
// 持久化
|
||||
this.dispatch('d2admin/db/set', {
|
||||
dbName: 'sys',
|
||||
path: 'size.value',
|
||||
value: state.value,
|
||||
user: true
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @description 从持久化数据读取尺寸设置
|
||||
* @param {Object} state vuex state
|
||||
*/
|
||||
async load (state) {
|
||||
// store 赋值
|
||||
state.value = await this.dispatch('d2admin/db/get', {
|
||||
dbName: 'sys',
|
||||
path: 'size.value',
|
||||
defaultValue: 'default',
|
||||
user: true
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user