基本设置
@@ -94,7 +89,11 @@
缩略图
-
+
@@ -106,8 +105,7 @@
closable
:visible="childDrawerVisible"
@close="onChildClose"
- >
-
+ >
保存草稿
{{ publishText }}
@@ -115,6 +113,89 @@
+
+
+
+
+
+
![]()
+
+
![]()
+
@@ -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.$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%;
+}