修改：文章管理界面

src/api/markdown-api.js

@@ -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({

src/api/user.js

@@ -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
   })

src/components/ShowFile/ShowFile.vue

@@ -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':
           // 打开

src/styles/setting.scss

@@ -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;
+  }
+}

src/views/markdown/index.vue

@@ -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 class="release-button" type="primary" size="small" @click="update" :loading="updating">{{ editStatus?'发布文章':'更新文章' }}</el-button>
-          <el-button v-if="editStatus" class="release-button" type="primary" size="small" @click="update" :loading="updating">更新文章</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 => {

src/views/setting/articles/articleManager.vue

@@ -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 slot="header">
-        <div class="clearfix card-header-back">
+        <div class="box-card-header">
-          <span>文章管理</span>
+          <div class="clearfix card-header-back">
-          <el-button class="card-button" size="mini" type="primary" @click="newArticle">新建文章</el-button>
+            <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);
+      history.pushState(null, null, document.URL)
-      window.addEventListener('popstate', this.goBack, false);
+      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>

src/views/setting/articles/categoryManager.vue

@@ -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>