sheng/mes-ui-d2
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

no message

Browse Source 
Former-commit-id: b5a2e324ecbb5b07f0d9271fad79ffc349d7f802
Former-commit-id: 0bf7da6578411c0a3503cba0d08e349d675bca18
Former-commit-id: f7401e8a82bba4d3f3b678c46c18320bfa7ac427
This commit is contained in:
liyang
2018-06-11 13:47:48 +08:00
parent 4ad0fa7eb3
commit 1d67560596
4 changed files with 72 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/components/core/d2-layout-main/components/-header-right/components/-theme.vue
View File

@@ -5,67 +5,18 @@
<d2-icon name="diamond"/>
</el-button>
</el-tooltip>
<el-dialog title="主题" width="500px" :visible.sync="dialogVisible">
<el-table v-bind="table">
<el-table-column prop="name" align="center" width="100"/>
<el-table-column label="预览" width="220">
<div slot-scope="scope" class="theme-preview" :style="{'backgroundImage': `url(${ scope.row.preview })`}"></div>
</el-table-column>
<el-table-column prop="address" align="center">
<template slot-scope="scope">
<el-button type="primary">使用</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog title="主题" width="600px" :visible.sync="dialogVisible">
<d2-theme-list/>
</el-dialog>
</div>
</template>
<script>
import { mapState, mapMutations } from 'vuex'
export default {
data () {
return {
dialogVisible: false,
table: {
data: [
{
name: 'd2admin',
preview: '/static/image/theme-preview/d2admin@2x.png'
},
{
name: 'star',
preview: '/static/image/theme-preview/star@2x.png'
}
],
showHeader: false,
border: true
}
dialogVisible: false
}
},
computed: {
...mapState({
themeName: state => state.theme.themeName
})
},
methods: {
...mapMutations([
'setTheme'
])
},
mounted () {
this.setTheme('d2')
}
}
</script>
<style lang="scss" scoped>
@import '~@/assets/style/public.scss';
.theme-preview {
height: 100px;
width: 200px;
border-radius: 4px;
background-size: cover;
border: 1px solid $color-border-1;
}
</style>

67
src/components/core/d2-theme-list/index.vue Normal file
View File

@@ -0,0 +1,67 @@
<template>
<el-table v-bind="table">
<el-table-column prop="name" align="center" width="160"/>
<el-table-column label="预览" width="220">
<div slot-scope="scope" class="theme-preview" :style="{'backgroundImage': `url(${ scope.row.preview })`}"></div>
</el-table-column>
<el-table-column prop="address" align="center">
<template slot-scope="scope">
<el-button type="primary" @click="handleSelectTheme(scope.row.value)">使用</el-button>
</template>
</el-table-column>
</el-table>
</template>
<script>
import { mapState, mapMutations } from 'vuex'
export default {
name: 'd2-theme-list',
data () {
return {
table: {
data: [
{
name: 'd2admin 经典',
value: 'd2',
preview: '/static/image/theme-preview/d2@2x.png'
},
{
name: '流星',
value: 'star',
preview: '/static/image/theme-preview/star@2x.png'
}
],
showHeader: false,
border: true
}
}
},
mounted () {
this.setTheme('d2')
},
computed: {
...mapState({
themeName: state => state.theme.themeName
})
},
methods: {
...mapMutations([
'setTheme'
]),
handleSelectTheme (themeName) {
this.setTheme(themeName)
}
}
}
</script>
<style lang="scss" scoped>
@import '~@/assets/style/public.scss';
.theme-preview {
height: 100px;
width: 200px;
border-radius: 4px;
background-size: cover;
border: 1px solid $color-border-1;
}
</style>

3
src/components/core/register.js
View File

@@ -14,5 +14,6 @@ Vue.component('d2-icon', () => import('@/components/core/d2-icon'))
Vue.component('d2-icon-select', () => import('@/components/core/d2-icon-select/index.vue'))
Vue.component('d2-icon-svg', () => import('@/components/core/d2-icon-svg/index.vue'))
Vue.component('d2-markdown', () => import('@/components/core/d2-markdown'))
Vue.component('d2-quill', () => import('@/components/core/d2-quill'))
Vue.component('d2-mde', () => import('@/components/core/d2-mde'))
Vue.component('d2-quill', () => import('@/components/core/d2-quill'))
Vue.component('d2-theme-list', () => import('@/components/core/d2-theme-list'))

0
static/image/theme-preview/d2admin@2x.png.REMOVED.git-id → static/image/theme-preview/d2@2x.png.REMOVED.git-id
View File