1 files changed, 35 insertions, 2 deletions
diff --git a/resources/vue/components/tree/StudipTree.vue b/resources/vue/components/tree/StudipTree.vue
index 136fc95..fc6dc41 100644
--- a/resources/vue/components/tree/StudipTree.vue
+++ b/resources/vue/components/tree/StudipTree.vue
@@ -33,14 +33,21 @@
         <MountingPortal v-if="withSearch" mountTo="#search-widget" name="sidebar-search">
             <search-widget v-if="currentNode" :min-length="3" ref="searchWidget"></search-widget>
         </MountingPortal>
+        <MountingPortal v-if="!editable && !isSearching && !isLoading && currentNode"
+                        mountTo="#views-widget"
+                        name="sidebar-views">
+            <studip-tree-view-widget :config="viewConfig" />
+        </MountingPortal>
     </div>
 </template>
 
 <script>
 import axios from 'axios';
 import { TreeMixin } from '../../mixins/TreeMixin';
+import PageLayout from '../../../assets/javascripts/lib/page_layout';
 import StudipProgressIndicator from '../StudipProgressIndicator.vue';
 import SearchWidget from '../SearchWidget.vue';
+import StudipTreeViewWidget from './StudipTreeViewWidget.vue';
 import StudipTreeList from './StudipTreeList.vue';
 import StudipTreeTable from './StudipTreeTable.vue';
 import StudipTreeNode from './StudipTreeNode.vue';
@@ -49,7 +56,13 @@ import TreeSearchResult from './TreeSearchResult.vue';
 export default {
     name: 'StudipTree',
     components: {
-        TreeSearchResult, SearchWidget, StudipProgressIndicator, StudipTreeList, StudipTreeTable, StudipTreeNode
+        TreeSearchResult,
+        SearchWidget,
+        StudipTreeViewWidget,
+        StudipProgressIndicator,
+        StudipTreeList,
+        StudipTreeTable,
+        StudipTreeNode
     },
     mixins: [ TreeMixin ],
     props: {
@@ -163,12 +176,21 @@ export default {
             isLoading: false,
             showStructuralNavigation: false,
             searchConfig: {},
-            isSearching: false
+            isSearching: false,
+            viewConfig: null,
+            pageTitle: document.title
         }
     },
     methods: {
         changeCurrentNode(node) {
             this.currentNode = node;
+            this.viewConfig = {
+                view: this.viewType,
+                node: this.currentNode,
+                semester: this.semester,
+                semClass: this.semClass
+            };
+            this.setPageTitle(this.currentNode.attributes.name);
             this.$nextTick(() => {
                 document.getElementById('tree-breadcrumb-' + node.attributes.id)?.focus();
             });
@@ -187,6 +209,10 @@ export default {
                 form.appendChild(input);
             }
             input.setAttribute('value', searchterm);
+        },
+        setPageTitle(nodeTitle) {
+            const title = this.pageTitle.split('-');
+            PageLayout.title = title.slice(0, -1).join('-') + '/ ' + nodeTitle + ' -' + title[title.length - 1];
         }
     },
     mounted() {
@@ -206,6 +232,13 @@ export default {
             this.currentNode = this.startNode;
             this.loaded = true;
             this.isLoading = false;
+            this.viewConfig = {
+                view: this.viewType,
+                node: this.currentNode,
+                semester: this.semester,
+                semClass: this.semClass
+            };
+            this.setPageTitle(this.currentNode.attributes.name);
         });
 
         axios.interceptors.request.eject(loadingIndicator);