mirror of https://github.com/halo-dev/halo-admin
Change gallery to photo.
ruibaby
parent
4e9b403bb0
commit
4bf752b23d
|
|
@ -1,23 +0,0 @@
|
|||
import service from '@/utils/service'
|
||||
|
||||
const baseUrl = '/api/admin/galleries'
|
||||
|
||||
const galleryApi = {}
|
||||
|
||||
galleryApi.query = params => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
params: params,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
galleryApi.create = (gallery) => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
data: gallery,
|
||||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
||||
export default galleryApi
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
import service from '@/utils/service'
|
||||
|
||||
const baseUrl = '/api/admin/photos'
|
||||
|
||||
const photoApi = {}
|
||||
|
||||
photoApi.query = params => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
params: params,
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
|
||||
photoApi.create = (photo) => {
|
||||
return service({
|
||||
url: baseUrl,
|
||||
data: photo,
|
||||
method: 'post'
|
||||
})
|
||||
}
|
||||
|
||||
photoApi.delete = photoId => {
|
||||
return service({
|
||||
url: `${baseUrl}/${photoId}`,
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
export default photoApi
|
||||
|
|
@ -80,10 +80,10 @@ export const asyncRouterMap = [
|
|||
meta: { title: '友情链接', hiddenHeaderContent: false }
|
||||
},
|
||||
{
|
||||
path: '/sheets/galleries',
|
||||
name: 'GalleryList',
|
||||
path: '/sheets/photos',
|
||||
name: 'PhotoList',
|
||||
hidden: true,
|
||||
component: () => import('@/views/sheet/internal/GalleryList'),
|
||||
component: () => import('@/views/sheet/internal/PhotoList'),
|
||||
meta: { title: '图库', hiddenHeaderContent: false }
|
||||
},
|
||||
{
|
||||
|
|
|
|||
|
|
@ -142,7 +142,7 @@
|
|||
v-model="drawerVisiable"
|
||||
v-if="selectAttachment"
|
||||
:attachment="selectAttachment"
|
||||
:addToGallery="true"
|
||||
:addToPhoto="true"
|
||||
@delete="handleDelete"
|
||||
/>
|
||||
</page-view>
|
||||
|
|
|
|||
|
|
@ -122,10 +122,10 @@
|
|||
<div class="bottom-control">
|
||||
<a-popconfirm
|
||||
title="你确定要添加到图库？"
|
||||
@confirm="handleAddToGallery"
|
||||
@confirm="handleAddToPhoto"
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
v-if="addToGallery"
|
||||
v-if="addToPhoto"
|
||||
>
|
||||
<a-button
|
||||
type="dashed"
|
||||
|
|
@ -147,7 +147,7 @@
|
|||
<script>
|
||||
import { mixin, mixinDevice } from '@/utils/mixin.js'
|
||||
import attachmentApi from '@/api/attachment'
|
||||
import galleryApi from '@/api/gallery'
|
||||
import photoApi from '@/api/photo'
|
||||
|
||||
export default {
|
||||
name: 'AttachmentDetailDrawer',
|
||||
|
|
@ -156,7 +156,7 @@ export default {
|
|||
return {
|
||||
detailLoading: true,
|
||||
editable: false,
|
||||
gallery: {}
|
||||
photo: {}
|
||||
}
|
||||
},
|
||||
model: {
|
||||
|
|
@ -168,7 +168,7 @@ export default {
|
|||
type: Object,
|
||||
required: true
|
||||
},
|
||||
addToGallery: {
|
||||
addToPhoto: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false
|
||||
|
|
@ -239,15 +239,12 @@ export default {
|
|||
this.$message.error('复制失败')
|
||||
})
|
||||
},
|
||||
handleAddToGallery() {
|
||||
this.gallery['name'] = this.attachment.name
|
||||
this.gallery['thumbnail'] = this.attachment.thumbPath
|
||||
this.gallery['url'] = this.attachment.path
|
||||
this.gallery['description'] = ''
|
||||
this.gallery['takeTime'] = new Date().getTime()
|
||||
this.gallery['location'] = ''
|
||||
this.gallery['team'] = ''
|
||||
galleryApi.create(this.gallery).then(response => {
|
||||
handleAddToPhoto() {
|
||||
this.photo['name'] = this.attachment.name
|
||||
this.photo['thumbnail'] = this.attachment.thumbPath
|
||||
this.photo['url'] = this.attachment.path
|
||||
this.photo['takeTime'] = new Date().getTime()
|
||||
photoApi.create(this.photo).then(response => {
|
||||
this.$message.success('添加成功！')
|
||||
})
|
||||
},
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@
|
|||
<a href="javascript:void(0);">编辑</a>
|
||||
</router-link>
|
||||
<router-link
|
||||
:to="{name:'GalleryList'}"
|
||||
:to="{name:'PhotoList'}"
|
||||
v-if="record.id==2"
|
||||
>
|
||||
<a href="javascript:void(0);">编辑</a>
|
||||
|
|
@ -211,7 +211,7 @@ const internalPages = [
|
|||
{
|
||||
id: '2',
|
||||
name: '图库页面',
|
||||
url: '/galleries'
|
||||
url: '/photos'
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
|
|
|
|||
|
|
@ -1,262 +0,0 @@
|
|||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-row
|
||||
:gutter="12"
|
||||
type="flex"
|
||||
align="middle"
|
||||
>
|
||||
<a-col
|
||||
:span="24"
|
||||
class="search-box"
|
||||
>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col
|
||||
:md="6"
|
||||
:sm="24"
|
||||
>
|
||||
<a-form-item label="关键词">
|
||||
<a-input v-model="queryParam.keyword" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
:md="6"
|
||||
:sm="24"
|
||||
>
|
||||
<a-form-item label="分组">
|
||||
<a-select v-model="queryParam.attachmentType">
|
||||
<a-select-option
|
||||
v-for="item in Object.keys(attachmentType)"
|
||||
:key="item"
|
||||
:value="item"
|
||||
>{{ attachmentType[item].text }}</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
:md="6"
|
||||
:sm="24"
|
||||
>
|
||||
<span class="table-page-search-submitButtons">
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="loadAttachments(true)"
|
||||
>查询</a-button>
|
||||
<a-button
|
||||
style="margin-left: 8px;"
|
||||
@click="resetParam"
|
||||
>重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<div class="table-operator">
|
||||
<a-button
|
||||
type="primary"
|
||||
icon="plus"
|
||||
@click="showUploadModal"
|
||||
>添加</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-list
|
||||
:grid="{ gutter: 12, xs: 1, sm: 2, md: 4, lg: 6, xl: 6, xxl: 6 }"
|
||||
:dataSource="galleries"
|
||||
:loading="listLoading"
|
||||
>
|
||||
<a-list-item
|
||||
slot="renderItem"
|
||||
slot-scope="item, index"
|
||||
:key="index"
|
||||
>
|
||||
<a-card
|
||||
:bodyStyle="{ padding: 0 }"
|
||||
hoverable
|
||||
@click="showDetailDrawer(item)"
|
||||
>
|
||||
<div class="attach-thumb">
|
||||
<img :src="item.thumbnail">
|
||||
</div>
|
||||
<a-card-meta>
|
||||
<ellipsis
|
||||
:length="isMobile()?36:18"
|
||||
tooltip
|
||||
slot="description"
|
||||
>{{ item.name }}</ellipsis>
|
||||
</a-card-meta>
|
||||
</a-card>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row
|
||||
type="flex"
|
||||
justify="end"
|
||||
>
|
||||
<a-pagination
|
||||
:total="pagination.total"
|
||||
:defaultPageSize="pagination.size"
|
||||
:pageSizeOptions="['18', '36', '54','72','90','108']"
|
||||
showSizeChanger
|
||||
@change="handlePaginationChange"
|
||||
@showSizeChange="handlePaginationChange"
|
||||
/>
|
||||
</a-row>
|
||||
<AttachmentDetailDrawer
|
||||
v-model="drawerVisiable"
|
||||
v-if="selectAttachment"
|
||||
:attachment="selectAttachment"
|
||||
@delete="handleDelete"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mixin, mixinDevice } from '@/utils/mixin.js'
|
||||
import AttachmentDetailDrawer from '../../attachment/components/AttachmentDetailDrawer'
|
||||
import attachmentApi from '@/api/attachment'
|
||||
import galleryApi from '@/api/gallery'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AttachmentDetailDrawer
|
||||
},
|
||||
mixins: [mixin, mixinDevice],
|
||||
data() {
|
||||
return {
|
||||
attachmentType: attachmentApi.type,
|
||||
listLoading: true,
|
||||
selectAttachment: {},
|
||||
attachments: [],
|
||||
galleries: [],
|
||||
mediaTypes: [],
|
||||
editable: false,
|
||||
pagination: {
|
||||
page: 1,
|
||||
size: 18,
|
||||
sort: null
|
||||
},
|
||||
queryParam: {
|
||||
page: 0,
|
||||
size: 18,
|
||||
sort: null,
|
||||
keyword: null,
|
||||
mediaType: null,
|
||||
attachmentType: null
|
||||
},
|
||||
drawerVisiable: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
formattedDatas() {
|
||||
return this.attachments.map(attachment => {
|
||||
attachment.typeProperty = this.attachmentType[attachment.type]
|
||||
return attachment
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadAttachments()
|
||||
this.loadGalleries()
|
||||
this.loadMediaTypes()
|
||||
},
|
||||
methods: {
|
||||
loadAttachments(isSearch) {
|
||||
this.queryParam.page = this.pagination.page - 1
|
||||
this.queryParam.size = this.pagination.size
|
||||
this.queryParam.sort = this.pagination.sort
|
||||
if (isSearch) {
|
||||
this.queryParam.page = 0
|
||||
}
|
||||
this.listLoading = true
|
||||
attachmentApi.query(this.queryParam).then(response => {
|
||||
this.attachments = response.data.data.content
|
||||
this.pagination.total = response.data.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
loadGalleries(isSearch) {
|
||||
this.queryParam.page = this.pagination.page - 1
|
||||
this.queryParam.size = this.pagination.size
|
||||
this.queryParam.sort = this.pagination.sort
|
||||
if (isSearch) {
|
||||
this.queryParam.page = 0
|
||||
}
|
||||
this.listLoading = true
|
||||
galleryApi.query(this.queryParam).then(response => {
|
||||
this.galleries = response.data.data.content
|
||||
this.pagination.total = response.data.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
loadMediaTypes() {
|
||||
attachmentApi.getMediaTypes().then(response => {
|
||||
this.mediaTypes = response.data.data
|
||||
})
|
||||
},
|
||||
showDetailDrawer(attachment) {
|
||||
this.selectAttachment = attachment
|
||||
this.drawerVisiable = true
|
||||
},
|
||||
showUploadModal() {
|
||||
this.uploadVisible = true
|
||||
},
|
||||
handlePaginationChange(page, size) {
|
||||
this.$log.debug(`Current: ${page}, PageSize: ${size}`)
|
||||
this.pagination.page = page
|
||||
this.pagination.size = size
|
||||
this.loadAttachments()
|
||||
},
|
||||
resetParam() {
|
||||
this.queryParam.keyword = null
|
||||
this.queryParam.mediaType = null
|
||||
this.queryParam.attachmentType = null
|
||||
this.loadAttachments()
|
||||
},
|
||||
handleDelete(attachment) {
|
||||
this.loadAttachments()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ant-divider-horizontal {
|
||||
margin: 24px 0 12px 0;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.attach-thumb {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
padding-bottom: 56%;
|
||||
overflow: hidden;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-card-meta {
|
||||
padding: 0.8rem;
|
||||
}
|
||||
|
||||
.attach-detail-img img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table-operator {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,365 @@
|
|||
<template>
|
||||
<div class="page-header-index-wide">
|
||||
<a-row
|
||||
:gutter="12"
|
||||
type="flex"
|
||||
align="middle"
|
||||
>
|
||||
<a-col
|
||||
:span="24"
|
||||
class="search-box"
|
||||
>
|
||||
<a-card :bordered="false">
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline">
|
||||
<a-row :gutter="48">
|
||||
<a-col
|
||||
:md="6"
|
||||
:sm="24"
|
||||
>
|
||||
<a-form-item label="关键词">
|
||||
<a-input v-model="queryParam.keyword" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
:md="6"
|
||||
:sm="24"
|
||||
>
|
||||
<a-form-item label="分组">
|
||||
<a-select>
|
||||
<a-select-option value="11">11</a-select-option>
|
||||
<a-select-option value="22">22</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col
|
||||
:md="6"
|
||||
:sm="24"
|
||||
>
|
||||
<span class="table-page-search-submitButtons">
|
||||
<a-button
|
||||
type="primary"
|
||||
@click="loadPhotos(true)"
|
||||
>查询</a-button>
|
||||
<a-button
|
||||
style="margin-left: 8px;"
|
||||
@click="resetParam"
|
||||
>重置</a-button>
|
||||
</span>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<div class="table-operator">
|
||||
<a-button
|
||||
type="primary"
|
||||
icon="plus"
|
||||
>添加</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-list
|
||||
:grid="{ gutter: 12, xs: 1, sm: 2, md: 4, lg: 6, xl: 6, xxl: 6 }"
|
||||
:dataSource="photos"
|
||||
:loading="listLoading"
|
||||
>
|
||||
<a-list-item
|
||||
slot="renderItem"
|
||||
slot-scope="item, index"
|
||||
:key="index"
|
||||
>
|
||||
<a-card
|
||||
:bodyStyle="{ padding: 0 }"
|
||||
hoverable
|
||||
@click="showDrawer(item)"
|
||||
>
|
||||
<div class="attach-thumb">
|
||||
<img :src="item.thumbnail">
|
||||
</div>
|
||||
<a-card-meta>
|
||||
<ellipsis
|
||||
:length="isMobile()?36:18"
|
||||
tooltip
|
||||
slot="description"
|
||||
>{{ item.name }}</ellipsis>
|
||||
</a-card-meta>
|
||||
</a-card>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row
|
||||
type="flex"
|
||||
justify="end"
|
||||
>
|
||||
<a-pagination
|
||||
:total="pagination.total"
|
||||
:defaultPageSize="pagination.size"
|
||||
:pageSizeOptions="['18', '36', '54','72','90','108']"
|
||||
showSizeChanger
|
||||
@change="handlePaginationChange"
|
||||
@showSizeChange="handlePaginationChange"
|
||||
/>
|
||||
</a-row>
|
||||
<a-drawer
|
||||
title="图片详情"
|
||||
:width="isMobile()?'100%':'460'"
|
||||
closable
|
||||
:visible="drawerVisiable"
|
||||
destroyOnClose
|
||||
@close="onDrawerClose"
|
||||
>
|
||||
<a-row
|
||||
type="flex"
|
||||
align="middle"
|
||||
>
|
||||
<a-col :span="24">
|
||||
<a-skeleton
|
||||
active
|
||||
:loading="drawerLoading"
|
||||
:paragraph="{rows: 8}"
|
||||
>
|
||||
<div class="attach-detail-img">
|
||||
<img :src="photo.url">
|
||||
</div>
|
||||
</a-skeleton>
|
||||
</a-col>
|
||||
<a-divider />
|
||||
<a-col :span="24">
|
||||
<a-skeleton
|
||||
active
|
||||
:loading="drawerLoading"
|
||||
:paragraph="{rows: 8}"
|
||||
>
|
||||
<a-list itemLayout="horizontal">
|
||||
<a-list-item>
|
||||
<a-list-item-meta>
|
||||
<template
|
||||
slot="description"
|
||||
v-if="editable"
|
||||
>
|
||||
<a-input v-model="photo.name" />
|
||||
</template>
|
||||
<template
|
||||
slot="description"
|
||||
v-else
|
||||
>{{ photo.name }}</template>
|
||||
<span slot="title">
|
||||
图片名称：
|
||||
</span>
|
||||
</a-list-item-meta>
|
||||
</a-list-item>
|
||||
<a-list-item>
|
||||
<a-list-item-meta>
|
||||
<template
|
||||
slot="description"
|
||||
v-if="editable"
|
||||
>
|
||||
<a-input v-model="photo.takeTime" />
|
||||
</template>
|
||||
<span
|
||||
slot="description"
|
||||
v-else
|
||||
>{{ photo.takeTime | moment }}</span>
|
||||
<span slot="title">拍摄日期：</span>
|
||||
</a-list-item-meta>
|
||||
</a-list-item>
|
||||
<a-list-item>
|
||||
<a-list-item-meta>
|
||||
<template
|
||||
slot="description"
|
||||
v-if="editable"
|
||||
>
|
||||
<a-input v-model="photo.location" />
|
||||
</template>
|
||||
<span
|
||||
slot="description"
|
||||
v-else
|
||||
>{{ photo.location || '无' }}</span>
|
||||
<span slot="title">拍摄地点：</span>
|
||||
</a-list-item-meta>
|
||||
</a-list-item>
|
||||
<a-list-item>
|
||||
<a-list-item-meta>
|
||||
<template
|
||||
slot="description"
|
||||
v-if="editable"
|
||||
>
|
||||
<a-input v-model="photo.team" />
|
||||
</template>
|
||||
<span
|
||||
slot="description"
|
||||
v-else
|
||||
>{{ photo.team || '无' }}</span>
|
||||
<span slot="title">分组：</span>
|
||||
</a-list-item-meta>
|
||||
</a-list-item>
|
||||
<a-list-item>
|
||||
<a-list-item-meta>
|
||||
<template
|
||||
slot="description"
|
||||
v-if="editable"
|
||||
>
|
||||
<a-input
|
||||
v-model="photo.description"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 5 }"
|
||||
/>
|
||||
</template>
|
||||
<span
|
||||
slot="description"
|
||||
v-else
|
||||
>{{ photo.description || '无' }}</span>
|
||||
<span slot="title">描述：</span>
|
||||
</a-list-item-meta>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</a-skeleton>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-divider />
|
||||
<div class="bottom-control">
|
||||
<a-button
|
||||
type="dashed"
|
||||
style="marginRight: 8px"
|
||||
@click="handleEditClick"
|
||||
v-if="!editable"
|
||||
>编辑</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
style="marginRight: 8px"
|
||||
@click="handleEditClick"
|
||||
v-else
|
||||
>保存</a-button>
|
||||
<a-popconfirm
|
||||
title="你确定要删除该图片？"
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
@confirm="handleDeletePhoto"
|
||||
>
|
||||
<a-button type="danger">删除</a-button>
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mixin, mixinDevice } from '@/utils/mixin.js'
|
||||
import photoApi from '@/api/photo'
|
||||
|
||||
export default {
|
||||
mixins: [mixin, mixinDevice],
|
||||
data() {
|
||||
return {
|
||||
drawerVisiable: false,
|
||||
drawerLoading: false,
|
||||
listLoading: true,
|
||||
photo: {},
|
||||
photos: [],
|
||||
editable: false,
|
||||
pagination: {
|
||||
page: 1,
|
||||
size: 18,
|
||||
sort: null
|
||||
},
|
||||
queryParam: {
|
||||
page: 0,
|
||||
size: 18,
|
||||
sort: null,
|
||||
keyword: null,
|
||||
mediaType: null,
|
||||
attachmentType: null
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadPhotos()
|
||||
},
|
||||
methods: {
|
||||
loadPhotos(isSearch) {
|
||||
this.queryParam.page = this.pagination.page - 1
|
||||
this.queryParam.size = this.pagination.size
|
||||
this.queryParam.sort = this.pagination.sort
|
||||
if (isSearch) {
|
||||
this.queryParam.page = 0
|
||||
}
|
||||
this.listLoading = true
|
||||
photoApi.query(this.queryParam).then(response => {
|
||||
this.photos = response.data.data.content
|
||||
this.pagination.total = response.data.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
showDrawer(photo) {
|
||||
this.photo = photo
|
||||
this.drawerVisiable = true
|
||||
},
|
||||
handlePaginationChange(page, size) {
|
||||
this.$log.debug(`Current: ${page}, PageSize: ${size}`)
|
||||
this.pagination.page = page
|
||||
this.pagination.size = size
|
||||
this.loadPhotos()
|
||||
},
|
||||
handleEditClick() {
|
||||
this.editable = true
|
||||
},
|
||||
handleDeletePhoto() {
|
||||
photoApi.delete(this.photo.id).then(response => {
|
||||
this.$message.success('删除成功！')
|
||||
this.onClose()
|
||||
})
|
||||
},
|
||||
resetParam() {
|
||||
this.queryParam.keyword = null
|
||||
this.queryParam.mediaType = null
|
||||
this.queryParam.attachmentType = null
|
||||
this.loadPhotos()
|
||||
},
|
||||
handleDelete(attachment) {
|
||||
this.loadPhotos()
|
||||
},
|
||||
onDrawerClose() {
|
||||
this.drawerVisiable = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.ant-divider-horizontal {
|
||||
margin: 24px 0 12px 0;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.attach-thumb {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
padding-bottom: 56%;
|
||||
overflow: hidden;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-card-meta {
|
||||
padding: 0.8rem;
|
||||
}
|
||||
|
||||
.attach-detail-img img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table-operator {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue