列表页

src/components/Detail/addOrEdit.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="container">
         <div class="title">{{ showAdd ? '添加' : '修改' }}详情</div>
-        <el-form :model="formLabelAlign" :rules="rules" ref="ruleForm" label-width="80px" class="demo-ruleForm">
+        <el-form :model="formLabelAlign" :rules="rules" ref="ruleForm" label-width="120px" class="demo-ruleForm">
             <el-form-item label="页面显示位置：" prop="showPage">
                 <el-cascader
                     v-model="formLabelAlign.showPage"
@@ -11,7 +11,7 @@
                 </el-cascader>
             </el-form-item>
             <el-form-item label="正文：" prop="content">
-                <editor ref="editor" />
+                <editor ref="editor" :content="content" />
                 <!-- <el-input
                     type="textarea"
                     :rows="2"
@@ -48,9 +48,9 @@
             return {
                 labelPosition: 'right',
                 formLabelAlign: {
-                    showPage: ['00', '0000'],
+                    showPage: ['00', '0000']
-                    content: ''
                 },
+                content: '',
                 BASE_API,
                 tabList,
                 props: {
@@ -91,7 +91,7 @@
                 this.$refs.ruleForm.validate((valid) => {
                     if (valid) {
                         const child = this.$refs['editor']
-                        formName.content = child.getValue();
+                        this.content = child.getValue();
                         if(this.showAdd){
                             this.addCarousel(formName)
 
@@ -109,7 +109,8 @@
              * 添加详情
              */
             async addCarousel(formName){
-                const { showPage, content } = formName;
+                const { showPage } = formName;
+                const { content } = this;
                 const params = {
                     showPage: showPage[1],
                     content
@@ -128,7 +129,8 @@
              * 修改详情
              */
             async updateCarousel(formName){
-                const { detailId, showPage, content } = formName;
+                const { detailId, showPage } = formName;
+                const { content } = this;
                 const params = {
                     detailId,
                     showPage: showPage[1],
@@ -158,7 +160,7 @@
                     };
                     await QUERY_DETAIL(params).then(res => {
                         if(res.code === 200){
-                            this.formLabelAlign.content = res.data.content
+                            this.content = res.data.content
                         }else{
                             Alert.fail(res.msg || '详情获取失败');
                         }

src/components/Detail/editor.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="editorSection" @change="handleChange"></div>
+  <div id="editorSection"></div>
 </template>
 
 <script>
@@ -12,8 +12,24 @@ import { init } from "echarts/lib/echarts";
 
 export default {
   name: "mytuieditor",
+  props:{
+    content:{
+      type: String,
+      default: ''
+    }
+  },
+  watch: {
+    content(val){
+      if(val){
+        this.setValue(val)
+      }
+    }
+  },
   mounted() {
     this.initialize();
+    this.$nextTick(() => {
+      this.setValue(this.content)
+    })
   },
   beforeDestroy() {
     this.tuieditor = null;
@@ -32,11 +48,11 @@ export default {
       }
     },
 
-    handleChange(value){
-      console.log('value: ', value);
-    },
     getValue() {
       return this.tuieditor.getHtml()
+    },
+    setValue(val) {
+      this.tuieditor.setHtml(val);
     }
   }
 };

src/components/Detail/index.vue

@@ -206,7 +206,12 @@
                         if(res.code === 200){
                             this.content = res.data.content
                             if(this.keys.length){
-                                this.keys.splice(0, 1, row.detailId)
+                                const index = this.keys.findIndex(key => key === row.detailId)
+                                if(index !== -1){
+                                    this.keys = []
+                                }else{
+                                    this.keys.splice(0, 1, row.detailId)
+                                }
                             }else{
                                 this.keys.push(row.detailId)
                             }

src/components/News/index.vue

@@ -208,7 +208,12 @@
                         if(res.code === 200){
                             this.detailContent = res.data
                             if(this.keys.length){
-                                this.keys.splice(0, 1, row.introId)
+                                const index = this.keys.findIndex(key => key === row.introId)
+                                if(index !== -1){
+                                    this.keys = []
+                                }else{
+                                    this.keys.splice(0, 1, row.introId)
+                                }
                             }else{
                                 this.keys.push(row.introId)
                             }

src/views/lists/index.vue

@@ -37,7 +37,6 @@
         },
         methods: {
             handleClick(value) {
-                console.log('value: ', value);
                 this.activeName  =value
                 if(value === 'IMAGE'){
                     this.$refs.banner.getList()