From dc868ab33c03788d3f22c23699ffc92df89d5f7d Mon Sep 17 00:00:00 2001 From: ruibaby Date: Sun, 14 Apr 2019 22:02:52 +0800 Subject: [PATCH] Attachment library. --- src/components/Tools/SideProfile.vue | 2 +- src/views/attachment/AttachmentList.vue | 8 +- src/views/dashboard/Dashboard.vue | 19 ++- src/views/post/PostEdit.vue | 189 ++++++++++++++++++++++-- 4 files changed, 198 insertions(+), 20 deletions(-) diff --git a/src/components/Tools/SideProfile.vue b/src/components/Tools/SideProfile.vue index c9d3efc8..f64c0c3a 100644 --- a/src/components/Tools/SideProfile.vue +++ b/src/components/Tools/SideProfile.vue @@ -1,7 +1,7 @@ diff --git a/src/views/attachment/AttachmentList.vue b/src/views/attachment/AttachmentList.vue index 49b393e8..a97eb09d 100644 --- a/src/views/attachment/AttachmentList.vue +++ b/src/views/attachment/AttachmentList.vue @@ -192,9 +192,7 @@ export default { }) }, doCopyNormalLink() { - const text = ` - ${this.selectAttachment.path} - ` + const text = `${this.selectAttachment.path}` this.$copyText(text) .then(message => { console.log('copy', message) @@ -206,9 +204,7 @@ export default { }) }, doCopyMarkdownLink() { - const text = ` - ![${this.selectAttachment.name}](${this.selectAttachment.path}) - ` + const text = `![${this.selectAttachment.name}](${this.selectAttachment.path})` this.$copyText(text) .then(message => { console.log('copy', message) diff --git a/src/views/dashboard/Dashboard.vue b/src/views/dashboard/Dashboard.vue index cea0e10e..249e5a90 100644 --- a/src/views/dashboard/Dashboard.vue +++ b/src/views/dashboard/Dashboard.vue @@ -1,7 +1,7 @@ diff --git a/src/views/post/PostEdit.vue b/src/views/post/PostEdit.vue index e93452a6..374e24f7 100644 --- a/src/views/post/PostEdit.vue +++ b/src/views/post/PostEdit.vue @@ -12,6 +12,7 @@ /> 发布 + 附件库 @@ -27,13 +28,7 @@ - +

基本设置

@@ -94,7 +89,11 @@

缩略图

- +
@@ -106,8 +105,7 @@ closable :visible="childDrawerVisible" @close="onChildClose" - > - + >
保存草稿 {{ publishText }} @@ -115,6 +113,89 @@ + + + + +
+ +
+ + + + + + + +
+ +
+ + + + + + + + + 附件名： + + + + + 附件类型： + + + + + 附件大小： + + + + + 图片尺寸： + + + + + + 普通链接： + + + + + + + + Markdown 格式： + + + + + + + + + +
@@ -126,6 +207,7 @@ import 'mavon-editor/dist/css/index.css' import tagApi from '@/api/tag' import categoryApi from '@/api/category' import postApi from '@/api/post' +import attachmentApi from '@/api/attachment' const toolbars = { bold: true, // 粗体 @@ -161,6 +243,10 @@ export default { sm: { span: 24 }, xs: { span: 24 } }, + attachmentDrawerWidth: '580', + selectAttachmentDrawerWidth: '460', + attachmentDrawerVisible: false, + selectAttachmentDrawerVisible: false, visible: false, childDrawerVisible: false, drawerWidth: '460', @@ -169,7 +255,15 @@ export default { selectedCategoryIds: [], selectedTagIds: [], markdownOption: toolbars, - postToStage: {} + postToStage: {}, + attachments: [], + selectAttachment: {}, + detailLoading: false, + pagination: { + page: 1, + size: 10, + sort: '' + } } }, computed: { @@ -183,8 +277,10 @@ export default { mounted() { if (this.isMobile()) { this.drawerWidth = '100%' + this.attachmentDrawerWidth = '100%' } else { this.drawerWidth = '460' + this.attachmentDrawerWidth = '580' } }, created() { @@ -217,6 +313,14 @@ export default { this.categories = response.data.data }) }, + loadAttachments() { + const pagination = Object.assign({}, this.pagination) + pagination.page-- + attachmentApi.list(pagination).then(response => { + this.attachments = response.data.data.content + this.pagination.total = response.data.data.total + }) + }, createOrUpdatePost() { // Set category ids this.postToStage.categoryIds = this.selectedCategoryIds @@ -242,6 +346,18 @@ export default { this.visible = true }, showAttachDrawer() { + this.attachmentDrawerVisible = true + this.loadAttachments() + }, + showDetailDrawer(attachment) { + this.selectAttachmentDrawerVisible = true + this.detailLoading = true + this.selectAttachment = attachment + setTimeout(() => { + this.detailLoading = false + }, 500) + }, + showThumbDrawer() { this.childDrawerVisible = true }, handlePublishClick() { @@ -257,6 +373,36 @@ export default { }, onChildClose() { this.childDrawerVisible = false + }, + onAttachmentClose() { + this.attachmentDrawerVisible = false + }, + onSelectAttachmentClose() { + this.selectAttachmentDrawerVisible = false + }, + doCopyNormalLink() { + const text = `${this.selectAttachment.path}` + this.$copyText(text) + .then(message => { + console.log('copy', message) + this.$message.success('复制成功') + }) + .catch(err => { + console.log('copy.err', err) + this.$message.error('复制失败') + }) + }, + doCopyMarkdownLink() { + const text = `![${this.selectAttachment.name}](${this.selectAttachment.path})` + this.$copyText(text) + .then(message => { + console.log('copy', message) + this.$message.success('复制成功') + }) + .catch(err => { + console.log('copy.err', err) + this.$message.error('复制失败') + }) } } } @@ -304,4 +450,25 @@ export default { width: 100%; height: 560px; } + +.attach-item { + width: 50%; + margin: 0 auto; + position: relative; + padding-bottom: 28%; + overflow: hidden; + float: left; +} + +.attach-item > img { + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; +} + +.attach-detail-img img { + width: 100%; +}