章节树

src/components/Adult/inputModules/Catelog.vue

@@ -148,6 +148,7 @@ export default {
     "bookLevel",
     "bookNodeIndex",
     "changeTreeData",
+    "currentTreeID",
   ],
   data() {
     return {
@@ -178,6 +179,7 @@ export default {
       dialogTitle: "添加节点",
       dialogDisabled: false, // 是否禁用单选按钮
       loading: false, // 加载中
+      pidList: [],
     };
   },
   mounted() {
@@ -196,7 +198,42 @@ export default {
     // 销毁enter事件
     this.enterKeyupDestroyed();
   },
+  watch: {
+    // 监听预览页面翻页的变化 树组件做出相同的操作
+    async currentTreeID(newval, oldval) {
+      if (newval) {
+        this.activeIndex = newval;
+        await this.unfoldData(this.activeIndex, this.treeData);
+        await this.unfoldFather(this.treeData);
+      }
+    },
+  },
   methods: {
+    // 递归找到当前节点的所有父节点
+    unfoldData(activeIndex, data, index, child) {
+      data.forEach((item, i) => {
+        if (item.id == activeIndex) {
+          this.pidList.push(item.pid);
+          if (Object.prototype.toString.call(index).indexOf("Number") != -1) {
+            this.pidList.push(child.pid);
+          }
+        } else if (item.children) {
+          this.unfoldData(activeIndex, item.children, i, item);
+        }
+      });
+    },
+    // 展示父节点
+    unfoldFather(data) {
+      data.forEach((item, i) => {
+        this.pidList.forEach((p) => {
+          if (item.id == p) {
+            item.$folded = false;
+          } else if (item.children) {
+            this.unfoldFather(item.children);
+          }
+        });
+      });
+    },
     foldAll() {
       if (this.$refs.tree !== undefined) {
         this.$refs.tree.foldAll();
@@ -664,18 +701,18 @@ export default {
       color: #ff9900;
     }
   }
-  .tree_box_item_active,
-  .tree_box_leaf:hover {
-    color: #fff;
-    background: #ff9900;
+  .tree_box_item_light,
+  .tree_box_leaf:hover  {
+    color: #ff9900;
     > i {
-      color: #fff;
+      color: #ff9900;
     }
   }
-  .tree_box_item_light {
-    color: #ff9900;
+  .tree_box_item_active{
+    color: #fff !important;
+    background: #ff9900 !important;
     > i {
-      color: #ff9900;
+      color: #fff !important;
     }
   }
   .el-icon_box {

src/components/Adult/preview/WordPhrase.vue

@@ -285,7 +285,7 @@ export default {
             resIndex++;
             sItem.def_str =
               sItem.definition_list.length > 0
-                ? sItem.definition_list.join("  ")
+                ? sItem.definition_list.join("    ")
                 : "";
             if (sItem.mp3_list[0]) {
               mp3List.push(sItem);

src/components/TreeView.vue

@@ -233,18 +233,18 @@ export default {
       color: #ff9900;
     }
   }
-  .tree_box_item_active,
-  .tree_box_leaf:hover {
-    color: #fff;
-    background: #ff9900;
+  .tree_box_item_light,
+  .tree_box_leaf:hover  {
+    color: #ff9900;
     > i {
-      color: #fff;
+      color: #ff9900;
     }
   }
-  .tree_box_item_light {
-    color: #ff9900;
+  .tree_box_item_active{
+    color: #fff !important;
+    background: #ff9900 !important;
     > i {
-      color: #ff9900;
+      color: #fff !important;
     }
   }
 }

src/views/adultInput.vue

@@ -10,6 +10,7 @@
           :book-node-index="bookIndex"
           :change-id="changeId"
           :changeTreeData="changeTreeData"
+          :currentTreeID="currentTreeID"
         />
       </div>
       <div v-if="currentTreeID" class="Book-content">

src/views/courseView.vue

@@ -108,6 +108,7 @@ export default {
     // 获取预览数据
     onGetData() {
       const _this = this;
+      _this.context = null;
       const MethodName = "book-courseware_manager-GetCoursewareContent_View";
       const data = {
         id: _this.chapterId,
@@ -130,7 +131,6 @@ export default {
             _this.context = JSON.parse(res.content);
           }
         } else {
-          const _this = this;
           _this.context = null;
         }
       });