mirror of https://github.com/halo-dev/halo-admin
Update ThemeList.vue
johnniang
parent
e4cf6f1ae2
commit
d5422d7f84
|
|
@ -2393,6 +2393,11 @@
|
|||
"resolved": "http://registry.npm.taobao.org/amdefine/download/amdefine-1.0.1.tgz",
|
||||
"integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
|
||||
},
|
||||
"animate.css": {
|
||||
"version": "3.7.0",
|
||||
"resolved": "https://registry.npmjs.org/animate.css/-/animate.css-3.7.0.tgz",
|
||||
"integrity": "sha512-u3iMXDJr0cxMdQocIciDiou9Au4L5f9uT+/jCtprw3s1j3HcfCuI+khF+90Ps2KdsEhM2soF7SXB4WUvI3HlXg=="
|
||||
},
|
||||
"ansi-colors": {
|
||||
"version": "3.2.4",
|
||||
"resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
|
||||
|
|
@ -15470,6 +15475,11 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"vue-fragment": {
|
||||
"version": "1.5.0",
|
||||
"resolved": "https://registry.npmjs.org/vue-fragment/-/vue-fragment-1.5.0.tgz",
|
||||
"integrity": "sha512-nobmbbOSOx59fm7U00BDz14Yvqitwx7NPQGYDTKg3+dNDGTDCRNy/q2kfr5hV4S0l4fQG0kvC+rbCmENLmHUSA=="
|
||||
},
|
||||
"vue-hot-reload-api": {
|
||||
"version": "2.3.3",
|
||||
"resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.3.tgz",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-row :gutter="12" type="flex" align="middle">
|
||||
<a-row
|
||||
:gutter="12"
|
||||
type="flex"
|
||||
align="middle"
|
||||
>
|
||||
<a-col
|
||||
class="theme-item"
|
||||
:xl="6"
|
||||
|
|
@ -21,9 +25,20 @@
|
|||
<div class="theme-control">
|
||||
<span class="theme-title">{{ theme.properties.name }}</span>
|
||||
<a-button-group class="theme-button">
|
||||
<a-button type="primary" v-if="activatedTheme == theme.key" disabled>已启用</a-button>
|
||||
<a-button type="primary" @click="activeTheme(theme.key)" v-else>启用</a-button>
|
||||
<a-button @click="optionModal(theme.key)" v-if="activatedTheme == theme.key">设置</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
v-if="activatedTheme == theme.key"
|
||||
disabled
|
||||
>已启用</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="activeTheme(theme.key)"
|
||||
v-else
|
||||
>启用</a-button>
|
||||
<a-button
|
||||
@click="optionModal(theme.key)"
|
||||
v-if="activatedTheme == theme.key"
|
||||
>设置</a-button>
|
||||
<a-popconfirm
|
||||
:title="'确定删除【' + theme.properties.name + '】主题？'"
|
||||
@confirm="deleteTheme(theme.key)"
|
||||
|
|
@ -38,34 +53,52 @@
|
|||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-modal :title="optionTheme + ' 主题设置'" width="90%" v-model="visible">
|
||||
<a-modal
|
||||
:title="optionTheme + ' 主题设置'"
|
||||
width="90%"
|
||||
v-model="visible"
|
||||
>
|
||||
<a-row>
|
||||
<a-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
|
||||
<a-col
|
||||
:xl="24"
|
||||
:lg="24"
|
||||
:md="24"
|
||||
:sm="24"
|
||||
:xs="24"
|
||||
>
|
||||
<div class="card-container">
|
||||
<a-tabs type="card">
|
||||
<a-tab-pane
|
||||
v-for="(group,index) in themeOptions"
|
||||
v-for="(group,index) in themeConfiguration"
|
||||
:key="index"
|
||||
:tab="group.description"
|
||||
:tab="group.label"
|
||||
>
|
||||
<a-form layout="vertical">
|
||||
<a-form-item
|
||||
v-for="(item,index1) in group.items"
|
||||
:label="item.description+'：'"
|
||||
:label="item.label + '：'"
|
||||
:key="index1"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<a-input :v-model="'options.'+item.description" v-if="item.type=='text'"/>
|
||||
<a-input
|
||||
v-model="themeOptions[item.name]"
|
||||
v-if="item.type=='text'"
|
||||
/>
|
||||
<a-input
|
||||
v-model="themeOptions[item.name]"
|
||||
v-if="item.type='email'"
|
||||
type="email"
|
||||
/>
|
||||
<a-input
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 5 }"
|
||||
:v-model="'options.'+item.description"
|
||||
v-model="themeOptions[item.name]"
|
||||
v-else-if="item.type=='textarea'"
|
||||
/>
|
||||
<a-radio-group
|
||||
v-decorator="['radio-group']"
|
||||
defaultValue="false"
|
||||
:v-model="'options.'+item.description"
|
||||
v-model="themeOptions[item.name]"
|
||||
v-else-if="item.type=='radio'"
|
||||
>
|
||||
<a-radio
|
||||
|
|
@ -75,7 +108,7 @@
|
|||
>{{ option.label }}</a-radio>
|
||||
</a-radio-group>
|
||||
<a-select
|
||||
:v-model="'options.'+item.description"
|
||||
v-model="themeOptions[item.name]"
|
||||
v-else-if="item.type=='select'"
|
||||
>
|
||||
<a-select-option
|
||||
|
|
@ -86,7 +119,10 @@
|
|||
</a-select>
|
||||
</a-form-item>
|
||||
<a-form-item>
|
||||
<a-button type="primary" @click="saveOptions">保存</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="saveOptions"
|
||||
>保存</a-button>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-tab-pane>
|
||||
|
|
@ -115,8 +151,9 @@ export default {
|
|||
optionUrl: 'https://ryanc.cc',
|
||||
// TODO 从api获取当前使用的主题
|
||||
activatedTheme: 'anatole',
|
||||
themeOptions: [],
|
||||
options: []
|
||||
themeConfiguration: [],
|
||||
options: {},
|
||||
themeOptions: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
|
@ -130,7 +167,7 @@ export default {
|
|||
},
|
||||
optionModal(theme) {
|
||||
themeApi.listOptions('anatole').then(response => {
|
||||
this.themeOptions = response.data.data
|
||||
this.themeConfiguration = response.data.data
|
||||
this.optionTheme = theme
|
||||
this.visible = true
|
||||
this.loadOptions()
|
||||
|
|
|
|||
Loading…
Reference in New Issue