Removes click-on-row functinality from tables. Adds See Item icon. Adds initial secondary sidebar for collection page.

src/admin/admin.vue

@@ -51,5 +51,16 @@
         }
     }
 
+    #secondary-menu {
+        background-color: $secondary;
+
+        li{
+            a {color: white !important;}
+            a:hover {color: $secondary !important;}
+        }
+    }
+
+    
+
 </style>
 

src/admin/components/collections-list.vue

@@ -24,7 +24,6 @@
                     hoverable
                     striped
                     selectable
-                    @select="(collection) => $router.push(`/collections/${collection.id}`)"
                     paginated
                     backend-pagination
                     :total="totalCollections"
@@ -46,7 +45,8 @@
                         {{ props.row.description }}
                     </b-table-column>
 
-                    <b-table-column label="Ações" width="80">
+                    <b-table-column label="Ações" width="110">
+                        <a @click.prevent.stop="goToCollectionPage(props.row.id)"><b-icon icon="eye"></a>
                         <a @click.prevent.stop="goToCollectionEditPage(props.row.id)"><b-icon icon="pencil"></a>
                         <a @click.prevent.stop="deleteOneCollection(props.row.id)"><b-icon icon="delete"></a>
                     </b-table-column>
@@ -160,6 +160,9 @@ export default {
         },
         handleSelectionChange(value) {
         },
+        goToCollectionPage(collectionId) {
+            this.$router.push(`/collections/${collectionId}`);
+        },
         goToCollectionEditPage(collectionId) {
             this.$router.push(`/collections/${collectionId}/edit`);
         },

src/admin/components/items-list.vue

@@ -39,7 +39,6 @@
                     hoverable
                     striped
                     selectable
-                    @select="(item) => $router.push(`/collections/${collectionId}/items/${item.id}`)"
                     paginated
                     backend-pagination
                     :total="totalItems"
@@ -52,14 +51,15 @@
                         :key="index"
                         :label="column.label"
                         :visible="column.visible"
-                        :width="column.field == 'row_actions' ? 80 : column.field == 'featured_image' ? 55 : undefined ">
+                        :width="column.field == 'row_actions' ? 110 : column.field == 'featured_image' ? 55 : undefined ">
                         <template v-if="column.field != 'featured_image' && column.field != 'row_actions'">{{ 
                             props.row.metadata[column.slug].multiple == 'yes' ? props.row.metadata[column.slug].value.join(', ') : props.row.metadata[column.slug].value 
                         }}</template>
                         <template v-if="column.field == 'featured_image'">
                             <img class="table-thumb" :src="`${ props.row[column.slug] }`"/>
                         </template>
-                        <template v-if="column.field == 'row_actions'" width="80">
+                        <template v-if="column.field == 'row_actions'">
+                            <a @click.prevent.stop="goToItemPage(props.row.id)"><b-icon icon="eye"></a>
                             <a @click.prevent.stop="goToItemEditPage(props.row.id)"><b-icon icon="pencil"></a>
                             <a @click.prevent.stop="deleteOneItem(props.row.id)"><b-icon icon="delete"></a>
                         </template>
@@ -185,6 +185,9 @@ export default {
             this.itemsPerPage = value;
             this.loadItems();
         },
+        goToItemPage(itemId) {
+            this.$router.push(`/collections/${this.collectionId}/items/${itemId}`);
+        },
         goToItemEditPage(itemId) {
             this.$router.push(`/collections/${this.collectionId}/items/${itemId}/edit`);
         },

src/admin/pages/collection-page.vue

@@ -1,6 +1,17 @@
 <template>
-    <div>
-        <section class="section" v-if="collection != null">
+    <div class="columns is-fullheight">
+        <nav id="secondary-menu" role="navigation" aria-label="secondary navigation" class="column is-2 is-sidebar-menu">
+            <aside class="menu">
+                <ul class="menu-list">
+                    <li><router-link tag="a" to="">Itens</router-link></li>
+                    <li><router-link tag="a" to="">Editar</router-link></li>
+                    <li><router-link tag="a" to="">Campos</router-link></li>
+                    <li><router-link tag="a" to="">Filtros</router-link></li>
+                    <li><router-link tag="a" to="">Atividades</router-link></li>
+                </ul>
+            </aside>
+        </nav>
+        <section class="container column is-main-content" v-if="collection != null">
             <div class="card">
                 <div class="card-image" v-if="collection.featured_image">
                     <figure class="image is-4by3">

src/admin/pages/collections-page.vue

@@ -5,7 +5,7 @@
                     :to="{ path: `/collections/new` }">
             Criar Coleção
         </router-link>
-        <collections-list></collections-list>
+        <collections-list></collections-list>          
     </div>
 </template>