Fix theme setting saving bug

pull/9/head
johnniang 2019-04-21 00:53:25 +08:00
parent 0d3bebcf5a
commit ad7705cf4c
2 changed files with 124 additions and 41 deletions

View File

@ -53,16 +53,16 @@ themeApi.fetchConfiguration = themeId => {
})
}
themeApi.fetchSettings = () => {
themeApi.fetchSettings = themeId => {
return service({
url: `${baseUrl}/activation/settings`,
url: `${baseUrl}/${themeId}/settings`,
method: 'get'
})
}
themeApi.saveSettings = settings => {
themeApi.saveSettings = (themeId, settings) => {
return service({
url: `${baseUrl}/activation/settings`,
url: `${baseUrl}/${themeId}/settings`,
data: settings,
method: 'post'
})

View File

@ -1,30 +1,60 @@
<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 :span="24">
<a-list
:grid="{ gutter: 12, xs: 1, sm: 1, md: 2, lg: 4, xl: 4, xxl: 4 }"
:dataSource="themes"
>
<a-list-item slot="renderItem" slot-scope="item, index" :key="index">
<a-card hoverable :title="item.name">
<img :alt="item.name" :src="item.screenshots" slot="cover">
<template class="ant-card-actions" slot="actions">
<a-list-item
slot="renderItem"
slot-scope="item, index"
:key="index"
>
<a-card
hoverable
:title="item.name"
>
<img
:alt="item.name"
:src="item.screenshots"
slot="cover"
>
<template
class="ant-card-actions"
slot="actions"
>
<div v-if="item.activated">
<a-icon type="unlock" theme="twoTone"/>已启用
<a-icon
type="unlock"
theme="twoTone"
/>
</div>
<div v-else @click="handleActivateClick(item)">
<div
v-else
@click="handleActivateClick(item)"
>
<a-icon type="lock" />启用
</div>
<div @click="handleEditClick(item)">
<a-icon type="setting" />设置
</div>
<a-dropdown placement="topCenter">
<a class="ant-dropdown-link" href="#">
<a
class="ant-dropdown-link"
href="#"
>
<a-icon type="ellipsis" />更多
</a>
<a-menu slot="overlay">
<a-menu-item :key="1" :disabled="item.activated">
<a-menu-item
:key="1"
:disabled="item.activated"
>
<a-popconfirm
v-if="!item.activated"
:title="'确定删除【' + item.name + '】主题?'"
@ -55,11 +85,28 @@
:visible="visible"
destroyOnClose
>
<a-row :gutter="12" type="flex">
<a-col :xl="12" :lg="12" :md="12" :sm="24" :xs="24">
<a-skeleton active :loading="optionLoading" :paragraph="{rows: 10}">
<a-row
:gutter="12"
type="flex"
>
<a-col
:xl="12"
:lg="12"
:md="12"
:sm="24"
:xs="24"
>
<a-skeleton
active
:loading="optionLoading"
:paragraph="{rows: 10}"
>
<a-card :bordered="false">
<img :alt="themeProperty.name" :src="themeProperty.screenshots" slot="cover">
<img
:alt="themeProperty.name"
:src="themeProperty.screenshots"
slot="cover"
>
<a-card-meta
:title="themeProperty.author.name"
:description="themeProperty.description"
@ -70,15 +117,32 @@
size="large"
slot="avatar"
/>
<a-avatar v-else size="large" slot="avatar">{{ themeProperty.author.name }}</a-avatar>
<a-avatar
v-else
size="large"
slot="avatar"
>{{ themeProperty.author.name }}</a-avatar>
</a-card-meta>
</a-card>
</a-skeleton>
</a-col>
<a-col :xl="12" :lg="12" :md="12" :sm="24" :xs="24">
<a-skeleton active :loading="optionLoading" :paragraph="{rows: 20}">
<a-col
:xl="12"
:lg="12"
:md="12"
:sm="24"
:xs="24"
>
<a-skeleton
active
:loading="optionLoading"
:paragraph="{rows: 20}"
>
<div class="card-container">
<a-tabs type="card" defaultActiveKey="0">
<a-tabs
type="card"
defaultActiveKey="0"
>
<a-tab-pane
v-for="(group, index) in themeConfiguration"
:key="index.toString()"
@ -127,7 +191,10 @@
</a-select>
</a-form-item>
<a-form-item>
<a-button type="primary" @click="saveSettings"></a-button>
<a-button
type="primary"
@click="saveSettings"
>保存</a-button>
</a-form-item>
</a-form>
</a-tab-pane>
@ -138,7 +205,13 @@
</a-row>
</a-drawer>
<div class="upload-button">
<a-button type="primary" shape="circle" icon="plus" size="large" @click="showUploadModal"></a-button>
<a-button
type="primary"
shape="circle"
icon="plus"
size="large"
@click="showUploadModal"
></a-button>
</div>
<a-modal
title="安装主题"
@ -147,7 +220,10 @@
:bodyStyle="{ padding: '0 24px 24px' }"
>
<a-tabs defaultActiveKey="1">
<a-tab-pane tab="本地上传" key="1">
<a-tab-pane
tab="本地上传"
key="1"
>
<upload
name="file"
multiple
@ -163,13 +239,19 @@
<p class="ant-upload-hint">支持单个或批量上传仅支持 ZIP 格式的文件</p>
</upload>
</a-tab-pane>
<a-tab-pane tab="远程拉取" key="2">
<a-tab-pane
tab="远程拉取"
key="2"
>
<a-form layout="vertical">
<a-form-item label="远程地址:">
<a-input v-model="fetchingUrl" />
</a-form-item>
<a-form-item>
<a-button type="primary" @click="handleFetching"></a-button>
<a-button
type="primary"
@click="handleFetching"
>确定</a-button>
</a-form-item>
</a-form>
</a-tab-pane>
@ -220,16 +302,17 @@ export default {
this.optionLoading = true
this.themeProperty = theme
setTimeout(() => {
themeApi.fetchConfiguration(theme.id).then(response => {
this.themeConfiguration = response.data.data
themeApi.fetchSettings().then(response => {
themeApi.fetchSettings(theme.id).then(response => {
this.themeSettings = response.data.data
setTimeout(() => {
this.visible = true
this.optionLoading = false
})
})
}, 300)
})
})
},
activeTheme(themeId) {
themeApi.active(themeId).then(response => {
@ -244,7 +327,7 @@ export default {
})
},
saveSettings() {
themeApi.saveSettings(this.themeSettings).then(response => {
themeApi.saveSettings(this.themeProperty.id, this.themeSettings).then(response => {
this.$message.success('保存成功!')
})
},