文章预览

src/views/content_manage/newspaper_manage/CreateArticle.vue

@@ -101,7 +101,7 @@
             <el-button type="primary" size="small" @click="handleSaveArticle('articleForm')" :loading="loading">下一步</el-button>
             <el-button size="small" @click="onCancel('articleForm')">取消</el-button>
         </div>
-        <el-button type="primary" size="small" class="preview-btn">预览</el-button>
+        <el-button type="primary" size="small" class="preview-btn" @click="handlePreviewArt">预览</el-button>
     </div>
     <el-dialog
         :visible.sync="resourceFlag"
@@ -147,6 +147,17 @@
         v-if="pharseFlag">
         <phrase @closeDialog="closeDialog" :itemData="pharseObj" :articleId="id||articleId" :sentenceList="sentenceList"></phrase>
     </el-dialog>
+    <el-dialog
+        :visible.sync="previewArticle"
+        :show-close="false"
+        :close-on-click-modal="false"
+        :append-to-body="true"
+        width="100%"
+        top="0"
+        class="login-dialog"
+        v-if="previewArticle">
+        <article-detail :id="id?id:articleId" :iss_id="$route.query.issueId" @closePreviewArticle="closePreviewArticle"></article-detail>
+    </el-dialog>
   </div>
 </template>
 
@@ -189,10 +200,11 @@ import Explain from "./Explain.vue"
 import AnnotationList from './components/AnnotationList.vue'
 import PhraseList from './components/PhraseList.vue';
 import Phrase from './Phrase.vue'
+import ArticleDetail from "./ArticleDetail.vue"
 
 export default {
   //import引入的组件需要注入到对象中才能使用
-  components: { Header, Breadcrumb, Editor, Upload, NewWords, NewWordList, Explain, AnnotationList, PhraseList, Phrase },
+  components: { Header, Breadcrumb, Editor, Upload, NewWords, NewWordList, Explain, AnnotationList, PhraseList, Phrase, ArticleDetail },
   props: {},
   data() {
     //这里存放数据
@@ -338,7 +350,8 @@ export default {
         },
         wordLit:[],
         annotationList: [],
-        phraseList: []
+        phraseList: [],
+        previewArticle: false
     }
   },
   //计算属性 类似于data概念
@@ -419,6 +432,8 @@ export default {
                             }else if(flag === 'explain'){
                                 this.explainObj = null
                                 this.explainFlag = true
+                            }else if(flag === 'preview'){
+                                this.previewArticle = true
                             }
                         }else{
                             this.$message.success('文章保存成功')
@@ -667,6 +682,17 @@ export default {
         this[flag] = false
         this.getArticleInfo()
     },
+    closePreviewArticle(){
+        this.previewArticle = false
+    },
+    // 预览文章
+    handlePreviewArt(){
+        if(!this.id&&!this.issueId){
+            this.handleSaveArticle('articleForm','preview')
+        }else{
+            this.previewArticle = true
+        }
+    }
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {

src/views/content_manage/newspaper_manage/components/TreeList.vue

@@ -25,7 +25,6 @@
 <script>
 //这里可以导入其它文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
 //例如：import 《组件名称》from ‘《组件路径》';
-import { getLogin } from "@/api/ajax";
 import ArticleDetail from "../ArticleDetail.vue"
 export default {
   //import引入的组件需要注入到对象中才能使用