修改:文章管理界面

This commit is contained in:
jmal 2020-11-15 21:28:23 +08:00
parent 44614a803f
commit 217db0b7a6
7 changed files with 153 additions and 64 deletions

View File

@ -10,14 +10,6 @@ export default {
params
})
},
// 添加文档 /markdown/add
addMarkdown: function(data) {
return request({
url: '/markdown/add',
method: 'post',
data
})
},
// 编辑文档 /markdown/edit
editMarkdown: function(data) {
return request({

View File

@ -96,7 +96,7 @@ export function initialization(data) {
export function getSetting(params) {
return request({
url: 'user/setting',
url: '/public/website/setting',
method: 'get',
params
})
@ -104,7 +104,7 @@ export function getSetting(params) {
export function updateSetting(data) {
return request({
url: 'user/setting/update',
url: '/setting/update',
method: 'put',
data
})

View File

@ -2300,7 +2300,7 @@ export default {
break
case 'edit':
// 编辑
this.$router.push(`/setting/website/manager-articles?operation=editor&id=${this.rowContextData.id}`)
window.open(`/setting/website/manager-articles?operation=editor&id=${this.rowContextData.id}`, '_blank')
break
case 'open':
// 打开

View File

@ -1,4 +1,16 @@
a {
color: #1890ff;
text-decoration: none;
background-color: transparent;
outline: none;
cursor: pointer;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
a:hover {
color: #40a9ff;
}
.container {
padding: 20px;
}
@ -98,3 +110,9 @@
color: #1890ff;
}
}
.table-top {
.table-top-right {
float: right;
margin-top: -28px;
}
}

View File

@ -25,8 +25,7 @@
<div class="editor-right">
<div class="operation">
<el-button class="release-button" type="warning" size="small" @click="add" :loading="updating">保存草稿</el-button>
<el-button v-if="!editStatus" class="release-button" type="primary" size="small" @click="add" :loading="updating">发布文章</el-button>
<el-button v-if="editStatus" class="release-button" type="primary" size="small" @click="update" :loading="updating">更新文章</el-button>
<el-button class="release-button" type="primary" size="small" @click="update" :loading="updating">{{ editStatus?'发布文章':'更新文章' }}</el-button>
</div>
<div class="more-setting">
<p class="mark-setting-label">文章封面:</p>
@ -237,6 +236,9 @@
after: () => {
this.contentEditor.setValue(content)
},
input: (val) => {
this.valueHasChanged()
}
})
},
$imgAdd(pos, $file) {
@ -307,33 +309,6 @@
}
return true
},
// add
add(){
this.update()
// if(!this.checkParam()){
// return
// }
// this.updating = true
// const filename = this.filename + ".md"
// markdownApi.addMarkdown({
// userId: this.$store.state.user.userId,
// username: this.$store.state.user.name,
// filename: filename,
// cover: this.file.cover,
// categoryIds: this.getCategoryList(),
// currentDirectory: this.storageLocation,
// contentText: this.contentEditor.getValue()
// }).then(() => {
// this.updating = false
// this.$message({
// message: "发布成功",
// type: 'success',
// duration : 1000
// });
// }).catch(()=> {
// this.updating = false
// })
},
getCategoryList(){
let categoryIdList = []
this.categoryIds.forEach(categoryIds => {

View File

@ -12,20 +12,103 @@
<markdown-editor ref="editor" :has-change.sync="hasChange" @onTitle="onTitle"></markdown-editor>
</el-dialog>
<el-card class="box-card">
<div class="box-card-header">
<div class="clearfix card-header-back">
<span>文章管理</span>
<el-button class="card-button" size="mini" type="primary" @click="newArticle">新建文章</el-button>
<div slot="header">
<div class="box-card-header">
<div class="clearfix card-header-back">
<span>文章管理</span>
<el-button class="card-button" size="mini" type="primary" @click="newArticle">新建文章</el-button>
</div>
</div>
</div>
<div>
<div class="table-top">
<div class="table-top-left">
<el-radio-group v-model="query.radioStatus" size="mini">
<el-radio-button label="release">可用</el-radio-button>
<el-radio-button label="draft">草稿</el-radio-button>
</el-radio-group>
<span class="table-top-author">作者:</span>
<el-radio-group v-model="query.radioUser" size="mini">
<el-radio-button label="">所有</el-radio-button>
<el-radio-button :label="$store.state.username">我的</el-radio-button>
</el-radio-group>
</div>
<div class="table-top-right">
<el-input v-model="query.keyword" size="mini" placeholder="请输入关键字"></el-input>
<el-cascader
v-model="query.parentCategoryId"
placeholder="不选择"
:options="categories"
:show-all-levels="false"
size="mini"
:props="{ checkStrictly: true }"
clearable></el-cascader>
<el-button type="primary" size="mini">筛选</el-button>
</div>
</div>
<el-table
:data="articleList"
stripe
>
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column
prop="name"
label="标题">
<template slot-scope="scope">
<router-link :title="'编辑 '+scope.row.name" :to="'/setting/website/manager-articles?operation=editor&id='+scope.row.id" target="_blank">{{scope.row.name}}</router-link>
</template>
</el-table-column>
<el-table-column
label="状态">
<template slot-scope="scope">
<el-tag size="medium" type="success">{{ scope.row.release?'已发布':'未发布' }}</el-tag>
</template>
</el-table-column>
<el-table-column
prop="username"
label="作者">
</el-table-column>
<el-table-column
prop="categories"
label="分类">
<template slot-scope="scope">
<span v-for="(category,i) in scope.row.categories">
<router-link to="#">{{category.name}}</router-link>
{{i===0?' ,':''}}
</span>
</template>
</el-table-column>
<el-table-column
prop="updateDate"
label="日期">
<template slot-scope="scope">
<span>{{scope.row.updateDate.substring(0, 16)}}</span>
</template>
</el-table-column>
</el-table>
</div>
<el-pagination
style="text-align: center"
:hide-on-single-page="true"
:current-page.sync="pagination.pageIndex"
:page-sizes="pagination.pageSizes"
:page-size="pagination.pageSize"
:total="pagination.total"
@current-change="currentChange"
layout="prev, pager, next">
</el-pagination>
</el-card>
</div>
</template>
<script>
import MarkdownEditor from '@/views/markdown/index'
import markdownApi from "@/api/markdown-api";
import categoryApi from "@/api/category";
export default {
name: 'articleManager',
components: {
@ -35,16 +118,30 @@ export default {
return {
newArticleDialogVisible: false,
pageTitle: '文章管理',
hasChange: false
hasChange: false,
articleList: [],
pagination: {
pageIndex: 1,
pageSize: 15,
total: 0,
},
categories: [],
query: {
radioStatus: 'release',
radioUser: this.$store.state.username,
keyword: '',
},
}
},
computed: {},
mounted() {
this.newArticleDialogVisible = !!this.$route.query.operation;
this.getArticleList()
this.categoryTree()
this.newArticleDialogVisible = !!this.$route.query.operation
// 监听返回
if (window.history && window.history.pushState) {
history.pushState(null, null, document.URL);
window.addEventListener('popstate', this.goBack, false);
history.pushState(null, null, document.URL)
window.addEventListener('popstate', this.goBack, false)
}
window.addEventListener('beforeunload', e => this.beforeunloadFn(e))
},
@ -52,7 +149,7 @@ export default {
hasChange(val){
if(val){
window.onbeforeunload = function() {
return "还有文件正在上传, 确定退出吗?";
return "还有文件正在上传, 确定退出吗?"
}
}
}
@ -77,10 +174,28 @@ export default {
this.newArticleDialogVisible = false
}
},
getArticleList() {
markdownApi.getMarkdown({pageIndex: this.pagination.pageIndex, pageSize: this.pagination.pageSize}).then((res) => {
this.articleList = res.data
this.pagination.total = res.count
this.$nextTick(() => {
this.isLoading = false
this.pagination.pageIndex = parseInt(decodeURI(this.$route.query.page))
})
})
},
currentChange() {
this.getMarkDown()
},
newArticle() {
this.newArticleDialogVisible = true
this.$router.push({path: this.$route.path, query: {operation: 'new'}})
},
categoryTree() {
categoryApi.categoryTree({userId: this.$store.state.user.userId}).then(res => {
this.categories = res.data
})
},
handleClose(done) {
console.log(this.hasChange)
if(this.hasChange){
@ -120,4 +235,7 @@ export default {
</script>
<style lang="scss" scoped>
@import "src/styles/setting";
.table-top-author {
margin-left: 15px;
}
</style>

View File

@ -322,18 +322,4 @@ export default {
line-height: 32px;
}
a {
color: #1890ff;
text-decoration: none;
background-color: transparent;
outline: none;
cursor: pointer;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
a:hover {
color: #40a9ff;
}
</style>