feat: support set thumbnail to category and tag.

pull/3445/head
ruibaby 2020-02-15 20:35:37 +08:00
parent 069e47e8ac
commit ad10279584
3 changed files with 68 additions and 5 deletions

View File

@ -911,4 +911,8 @@ body {
img {
width: 100%;
}
}
.ant-input-group-addon {
line-height: initial !important;
}

View File

@ -32,6 +32,20 @@
v-model="categoryToCreate.parentId"
/>
</a-form-item>
<a-form-item
label="封面图"
help="* 在分类页面可展示,需要主题支持"
>
<a-input v-model="categoryToCreate.thumbnail">
<a
href="javascript:void(0);"
slot="addonAfter"
@click="()=>this.thumbnailDrawerVisible = true"
>
<a-icon type="picture" />
</a>
</a-input>
</a-form-item>
<a-form-item
label="描述:"
help="* 分类描述,部分主题可显示"
@ -206,12 +220,19 @@
</a-card>
</a-col>
</a-row>
<AttachmentSelectDrawer
v-model="thumbnailDrawerVisible"
@listenToSelect="handleSelectThumbnail"
title="选择封面图"
/>
</div>
</template>
<script>
import { mixin, mixinDevice } from '@/utils/mixin.js'
import CategorySelectTree from './components/CategorySelectTree'
import AttachmentSelectDrawer from '../attachment/components/AttachmentSelectDrawer'
import categoryApi from '@/api/category'
import menuApi from '@/api/menu'
@ -239,13 +260,14 @@ const columns = [
}
]
export default {
components: { CategorySelectTree },
components: { CategorySelectTree, AttachmentSelectDrawer },
mixins: [mixin, mixinDevice],
data() {
return {
formType: 'create',
categories: [],
categoryToCreate: {},
thumbnailDrawerVisible: false,
menu: {},
loading: false,
columns
@ -316,6 +338,10 @@ export default {
this.$message.success('添加到菜单成功!')
this.menu = {}
})
},
handleSelectThumbnail(data) {
this.$set(this.categoryToCreate, 'thumbnail', encodeURI(data.path))
this.thumbnailDrawerVisible = false
}
}
}

View File

@ -9,7 +9,10 @@
:xs="24"
:style="{ 'padding-bottom': '12px' }"
>
<a-card :title="title" :bodyStyle="{ padding: '16px' }">
<a-card
:title="title"
:bodyStyle="{ padding: '16px' }"
>
<a-form layout="horizontal">
<a-form-item
label="名称:"
@ -23,6 +26,20 @@
>
<a-input v-model="tagToCreate.slugName" />
</a-form-item>
<a-form-item
label="封面图"
help="* 在标签页面可展示,需要主题支持"
>
<a-input v-model="tagToCreate.thumbnail">
<a
href="javascript:void(0);"
slot="addonAfter"
@click="()=>this.thumbnailDrawerVisible = true"
>
<a-icon type="picture" />
</a>
</a-input>
</a-form-item>
<a-form-item>
<a-button
type="primary"
@ -64,8 +81,11 @@
:xs="24"
:style="{ 'padding-bottom': '12px' }"
>
<a-card title="所有标签" :bodyStyle="{ padding: '16px' }">
<a-empty v-if="tags.length==0"/>
<a-card
title="所有标签"
:bodyStyle="{ padding: '16px' }"
>
<a-empty v-if="tags.length==0" />
<a-tooltip
placement="topLeft"
v-for="tag in tags"
@ -84,18 +104,27 @@
</a-card>
</a-col>
</a-row>
<AttachmentSelectDrawer
v-model="thumbnailDrawerVisible"
@listenToSelect="handleSelectThumbnail"
title="选择封面图"
/>
</div>
</template>
<script>
import tagApi from '@/api/tag'
import AttachmentSelectDrawer from '../attachment/components/AttachmentSelectDrawer'
export default {
components: { AttachmentSelectDrawer },
data() {
return {
formType: 'create',
tags: [],
tagToCreate: {}
tagToCreate: {},
thumbnailDrawerVisible: false
}
},
computed: {
@ -155,6 +184,10 @@ export default {
})
}
this.handleAddTag()
},
handleSelectThumbnail(data) {
this.$set(this.tagToCreate, 'thumbnail', encodeURI(data.path))
this.thumbnailDrawerVisible = false
}
}
}