Closes #135.

src/admin/components/other/collections-modal.vue

@@ -0,0 +1,93 @@
+<template>
+    <form action="">
+        <div 
+                class="tainacan-modal-content" 
+                style="width: auto">
+            <header class="tainacan-modal-title">
+                <h2>{{ this.$i18n.get('collections') }}</h2>
+                <hr>
+            </header>
+            <section class="tainacan-form">
+                 <p>{{ $i18n.get('instruction_select_a_target_collection') }}</p>
+                <div 
+                        v-if="!isLoading"
+                        class="collection-types-container">
+                    <div
+                            class="collection-type"
+                            v-for="(collection, index) in collections"
+                            :key="index"
+                            @click="onSelectCollection(collection)">
+                        <h4>{{ collection.name }}</h4>
+                        <p>{{ collection.length > 200 ? (collection.description.substring(0,197) + '...') : collection.description }}</p>            
+                    </div>
+                </div>
+                
+                <b-loading 
+                        :active.sync="isLoading" 
+                        :can-cancel="false"/>
+            </section>
+        </div>
+    </form>     
+</template>
+
+<script>
+import { mapActions } from 'vuex';
+
+export default {
+    name: 'CollectionsModal',
+    data(){
+        return {
+            collections: [],
+            isLoading: false
+        }
+    },
+    methods: {
+        ...mapActions('collection', [
+            'fetchCollections'
+        ]),
+        onSelectCollection(collection) {
+            this.$router.push(this.$routerHelper.getNewItemPath(collection.id));
+            this.$parent.close();
+        }
+    },
+    mounted() {
+        this.isLoading = true;
+        this.fetchCollections({ page: 1, collectionsPerPage: 96 })
+            .then((res) => {
+                this.collections = res.collections;
+                this.isLoading = false;
+            }).catch((error) => {
+                this.$console.log(error);
+                this.isLoading = false;
+            });
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+
+    @import "../../scss/_variables.scss";
+
+    .collection-types-container {
+
+        .collection-type {
+            border-bottom: 1px solid $gray2;
+            padding: 15px 8.3333333%;
+            cursor: pointer;
+        
+            &:first-child {
+                margin-top: 15px;
+            }
+            &:last-child {
+                border-bottom: none;
+            }
+            &:hover {
+                background-color: $gray2;
+            }
+        }
+    }
+
+</style>
+
+
+ 

src/admin/pages/lists/items-page.vue

@@ -141,7 +141,7 @@
                             <b-icon icon="menu-down"/>
                         </button>
 
-                        <b-dropdown-item>
+                        <b-dropdown-item v-if="!isRepositoryLevel">
                             <router-link
                                     id="a-create-item"
                                     tag="div"
@@ -149,6 +149,14 @@
                                 {{ $i18n.get('add_one_item') }}
                             </router-link>
                         </b-dropdown-item>
+                        <b-dropdown-item v-if="isRepositoryLevel">
+                            <div
+                                    id="a-create-item"
+                                    tag="div"
+                                    @click="onOpenCollectionsModal">
+                                {{ $i18n.get('add_one_item') }}
+                            </div>
+                        </b-dropdown-item>
                         <b-dropdown-item disabled>
                             {{ $i18n.get('add_items_bulk') + ' (Not ready)' }}
                         </b-dropdown-item>
@@ -661,6 +669,7 @@
     import Pagination from '../../components/search/pagination.vue'
     import AdvancedSearch from '../../components/advanced-search/advanced-search.vue';
     import AvailableImportersModal from '../../components/other/available-importers-modal.vue';
+    import CollectionsModal from '../../components/other/collections-modal.vue';
     import { mapActions, mapGetters } from 'vuex';
 
     export default {
@@ -795,6 +804,13 @@
                     }
                 });
             },
+            onOpenCollectionsModal() {
+                this.$modal.open({
+                    parent: this,
+                    component: CollectionsModal,
+                    hasModalCard: true
+                });
+            },
             updateSearch() {
                 this.$eventBusSearch.setSearchQuery(this.futureSearchQuery);
             },