Resolve "Studiengruppen erweitern" - Hauptbronch

Closes #3616

Merge request studip/studip!2509

4 files changed, 98 insertions, 5 deletions

diff --git a/resources/vue/base-components.js b/resources/vue/base-components.js
index d9bb1b7..2524642 100644
--- a/resources/vue/base-components.js
+++ b/resources/vue/base-components.js
@@ -10,6 +10,7 @@ const BaseComponents = {
     EditableList: defineAsyncComponent(() => import('./components/EditableList.vue')),
     FileUpload: defineAsyncComponent(() => import('./components/form_inputs/FileUpload.vue')),
     I18nTextarea: defineAsyncComponent(() => import("./components/I18nTextarea.vue")),
+    Multiquicksearch: defineAsyncComponent(() => import('./components/Multiquicksearch.vue')),
     Multiselect: defineAsyncComponent(() => import('./components/Multiselect.vue')),
     MyCoursesColouredTable: defineAsyncComponent(() => import('./components/form_inputs/MyCoursesColouredTable.vue')),
     Quicksearch: defineAsyncComponent(() => import('./components/Quicksearch.vue')),
diff --git a/resources/vue/components/Multiquicksearch.vue b/resources/vue/components/Multiquicksearch.vue
new file mode 100644
index 0000000..19d8068
--- /dev/null
+++ b/resources/vue/components/Multiquicksearch.vue
@@ -0,0 +1,96 @@
+<template>
+    <div>
+        <ul class="clean multiquicksearch">
+            <li v-for="(item, index) in items" :key="index">
+                <quicksearch :name="name"
+                             :searchtype="searchtype"
+                             :autocomplete="autocomplete"
+                             :modelValue="autocomplete ? item.item_name : item.item_id"
+                             :needle="item.item_name"
+                             :ref="'qs_' + index"
+                             @update:modelValue="(new_id, new_item_name) => editItem(new_id, new_item_name, index)"></quicksearch>
+                <a href="" class="delete_item" @click.prevent="deleteItem(index)">
+                    <studip-icon shape="trash" class="text-bottom"></studip-icon>
+                </a>
+            </li>
+        </ul>
+        <a href="#" @click.prevent="addItem">
+            <studip-icon shape="add" class="text-bottom"></studip-icon>
+            {{ addlabel }}
+        </a>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'multiquicksearch',
+    inheritAttrs: false,
+    props: {
+        name: {
+            type: String,
+            required: false
+        },
+        value: {
+            type: Object,
+            required: false,
+            default: []
+        },
+        searchtype: {
+            type: String,
+            required: true
+        },
+        autocomplete: {
+            type: Boolean,
+            required: false,
+            default: false
+        },
+        addlabel: {
+            type: String,
+            required: false,
+            default: ""
+        }
+    },
+    data () {
+        return {
+            items: []
+        };
+    },
+    mounted () {
+        for (let i in this.value) {
+            this.items.push({
+                item_id: this.autocomplete ? this.value[i] : i,
+                item_name: this.value[i]
+            });
+        }
+    },
+    watch: {
+        items: {
+            handler(newValue, oldValue) {
+                let new_val = {};
+                for (let i in newValue) {
+                    new_val[newValue[i].item_id] = newValue[i].item_name;
+                }
+                this.$emit('update:modelValue', new_val);
+            },
+            deep: true
+        }
+    },
+    methods: {
+        addItem: function () {
+            this.items.push({
+                item_id: '',
+                item_name: ''
+            });
+        },
+        editItem: function (item_id, item_name, index) {
+            this.items[index].item_id = item_id;
+            this.items[index].item_name = item_name;
+        },
+        deleteItem: function (index) {
+            if (this.items.length > 0) {
+                this.items.splice(index, 1);
+            }
+        }
+    }
+}
+</script>
diff --git a/resources/vue/components/MyCoursesTables.vue b/resources/vue/components/MyCoursesTables.vue
index e3b70ea..3041735 100644
--- a/resources/vue/components/MyCoursesTables.vue
+++ b/resources/vue/components/MyCoursesTables.vue
@@ -141,11 +141,6 @@ export default {
                 if (!this.isChild(course)) {
                     courses.push(course);
                 }
-                if (this.isParent(course)) {
-                    this.getCourses(course.children).forEach(c => {
-                        courses.push(c);
-                    });
-                }
             });
 
             return courses;
diff --git a/resources/vue/components/Quicksearch.vue b/resources/vue/components/Quicksearch.vue
index dcdd31d..1a61513 100644
--- a/resources/vue/components/Quicksearch.vue
+++ b/resources/vue/components/Quicksearch.vue
@@ -8,6 +8,7 @@
                :name="autocomplete ? name : null"
                v-model="inputValue"
                autocomplete="off"
+               ref="text_input"
                @blur="reset()"
                @keydown.up="selectUp"
                @keydown.down="selectDown"