修改:文章管理界面
This commit is contained in:
parent
44614a803f
commit
217db0b7a6
@ -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({
|
||||
|
||||
@ -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
|
||||
})
|
||||
|
||||
@ -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':
|
||||
// 打开
|
||||
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
@ -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 => {
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user