From 0e513d7a9590d8231d71503d2f6fc789b7f87543 Mon Sep 17 00:00:00 2001
From: Mateus Machado Luna <mateus.m.luna@gmail.com>
Date: Thu, 12 Apr 2018 10:42:12 -0300
Subject: [PATCH] Adds 'Creation' field to Items List. This field is the
 default on sorting, has the value of wordpress 'post_date'. Alings vertically
 items o table.

---
 .../components/lists/collections-list.vue     |  2 +-
 src/admin/components/lists/items-list.vue     | 50 +++++++++++++++----
 .../components/search/search-control.vue      |  3 +-
 src/admin/pages/lists/collections-page.vue    |  4 +-
 src/admin/pages/lists/items-page.vue          |  5 +-
 src/js/store/modules/search/actions.js        |  4 +-
 6 files changed, 51 insertions(+), 17 deletions(-)

diff --git a/src/admin/components/lists/collections-list.vue b/src/admin/components/lists/collections-list.vue
index f10a11325..cb8c3b600 100644
--- a/src/admin/components/lists/collections-list.vue
+++ b/src/admin/components/lists/collections-list.vue
@@ -221,7 +221,7 @@ export default {
     @import "../../scss/_variables.scss";
 
     .table-thumb {
-        max-height: 38px !important;
+        max-height: 55px !important;
         vertical-align: middle !important;
     }
 
diff --git a/src/admin/components/lists/items-list.vue b/src/admin/components/lists/items-list.vue
index 252172874..5db321e5f 100644
--- a/src/admin/components/lists/items-list.vue
+++ b/src/admin/components/lists/items-list.vue
@@ -28,38 +28,51 @@
                         :custom-key="column.slug"
                         :label="column.name"
                         :visible="column.visible"
-                        :width="column.field == 'row_actions' ? 78 : column.field == 'featured_image' ? 55 : undefined ">
+                        :class="column.field == 'row_creation' ? 'row-creation' : ''"
+                        :width="column.field == 'row_actions' ? 78 : column.field == 'row_thumbnail' ? 55 : undefined ">
                         
                     <template>
-                        <span 
+                        <span
                                 class="clickable-row" 
                                 @click.prevent="goToItemPage(props.row.id)"
-                                v-if="column.field != 'featured_image' && column.field != 'row_actions'"
+                                v-if="column.field != 'row_thumbnail' && column.field != 'row_actions' && column.field != 'row_creation'"
                                 v-html="renderMetadata( props.row.metadata[column.slug] )" />   
                     </template>
                     
-                    <template v-if="column.field == 'featured_image'">
+                    <template v-if="column.field == 'row_thumbnail'">
                         <router-link 
                                 tag="img" 
                                 class="table-thumb clickable-row" 
                                 :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}" 
                                 :src="props.row[column.slug]"/>
                     </template>
+
+                    <template 
+                            class="row-creation" 
+                            v-if="column.field == 'row_creation'">
+                        <router-link 
+                                class="clickable-row" 
+                                v-html="getCreationHtml(props.row)"
+                                tag="span" 
+                                :to="{path: $routerHelper.getItemPath(collectionId, props.row.id)}"/>
+                    </template>
                          
                     <template v-if="column.field == 'row_actions'">
                         <!-- <a id="button-view" @click.prevent.stop="goToItemPage(props.row.id)"><b-icon icon="eye"></a> -->
                         <a 
                                 id="button-edit" 
                                 :aria-label="$i18n.getFrom('items','edit_item')" 
-                                @click="goToItemEditPage(props.row.id)"><b-icon 
-                                type="is-gray" 
-                                icon="pencil"/></a>
+                                @click="goToItemEditPage(props.row.id)">
+                            <b-icon 
+                                    type="is-gray" 
+                                    icon="pencil"/></a>
                         <a 
                                 id="button-delete" 
                                 :aria-label="$i18n.get('label_button_delete')" 
-                                @click="deleteOneItem(props.row.id)"><b-icon 
-                                type="is-gray" 
-                                icon="delete"/></a>
+                                @click="deleteOneItem(props.row.id)">
+                            <b-icon 
+                                    type="is-gray" 
+                                    icon="delete"/></a>
                     </template>
                 </b-table-column>
             </template>
@@ -69,6 +82,7 @@
 
 <script>
 import { mapActions } from 'vuex';
+import moment from 'moment';
 
 export default {
     name: 'ItemsList',
@@ -163,17 +177,31 @@ export default {
                 return '';
             else
                 return metadata.value_as_html;
+        },
+        getCreationHtml(item) {
+            return this.$i18n.get('info_created_by') + item['author_name'] + '<br>' + this.$i18n.get('info_date') + moment( item['creation_date'], 'YYYY-MM-DD').format('DD/MM/YYYY');
         }
     }
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
+
+    @import "../../scss/_variables.scss";
 
     .table-thumb {
         max-height: 55px !important;
+    }
+    td {
         vertical-align: middle !important;
     }
+
+    .row-creation span {
+        color: $gray-light;
+        font-size: 0.75em;
+        line-height: 1.5
+    }
+
     .clickable-row{ cursor: pointer !important }
 
 </style>
diff --git a/src/admin/components/search/search-control.vue b/src/admin/components/search/search-control.vue
index 8ea99af90..add66d269 100644
--- a/src/admin/components/search/search-control.vue
+++ b/src/admin/components/search/search-control.vue
@@ -29,11 +29,12 @@
                     <option
                         v-for="field in tableFields"
                         v-if="
+                            field.id == 'date' || (
                             field.id != undefined && 
                             field.field_type_object.related_mapped_prop != 'description' &&
                             field.field_type_object.primitive_type != 'term' &&
                             field.field_type_object.primitive_type != 'item' &&
-                            field.field_type_object.primitive_type != 'compound'"
+                            field.field_type_object.primitive_type != 'compound')"
                         :value="field"
                         :key="field.id">
                         {{ field.name }}
diff --git a/src/admin/pages/lists/collections-page.vue b/src/admin/pages/lists/collections-page.vue
index 35ebc764e..fa33573a7 100644
--- a/src/admin/pages/lists/collections-page.vue
+++ b/src/admin/pages/lists/collections-page.vue
@@ -150,8 +150,8 @@ export default {
     @import '../../scss/_variables.scss';
 
     .sub-header {
-        max-height: $header-height;
-        height: $header-height;
+        min-height: $subheader-height;
+        height: $subheader-height;
         margin-left: -$page-small-side-padding;
         margin-right: -$page-small-side-padding;
         margin-top: -$page-small-top-padding;
diff --git a/src/admin/pages/lists/items-page.vue b/src/admin/pages/lists/items-page.vue
index ea681f18e..13a484dbf 100644
--- a/src/admin/pages/lists/items-page.vue
+++ b/src/admin/pages/lists/items-page.vue
@@ -165,13 +165,16 @@ export default {
         this.isLoadingFields = true;
         this.fetchFields({ collectionId: this.collectionId, isRepositoryLevel: this.isRepositoryLevel, isContextEdit: false }).then(() => {
 
-            this.tableFields.push({ name: this.$i18n.get('label_thumbnail'), field: 'featured_image', field_type: undefined, slug: 'featured_image', id: undefined, visible: true });
+            this.tableFields.push({ name: this.$i18n.get('label_thumbnail'), field: 'row_thumbnail', field_type: undefined, slug: 'featured_image', id: undefined, visible: true });
             for (let field of this.fields) {
                 this.tableFields.push(
                     {name: field.name, field: field.description, slug: field.slug, field_type: field.field_type, field_type_object: field.field_type_object, id: field.id, visible: true }
                 );
             }
+            
+            this.tableFields.push({ name: this.$i18n.get('label_creation'), field: 'row_creation', field_type: undefined, slug: 'creation', id: 'date', visible: true});
             this.tableFields.push({ name: this.$i18n.get('label_actions'), field: 'row_actions', field_type: undefined, slug: 'actions', id: undefined, visible: true });
+            
             //this.prefTableFields = this.tableFields;
             // this.$userPrefs.get('table_columns_' + this.collectionId)
             //     .then((value) => {
diff --git a/src/js/store/modules/search/actions.js b/src/js/store/modules/search/actions.js
index 9220ab8e0..6fd0ac474 100644
--- a/src/js/store/modules/search/actions.js
+++ b/src/js/store/modules/search/actions.js
@@ -37,7 +37,9 @@ export const setItemsPerPage = ({ commit }, page ) => {
 export const setOrderBy = ({ commit }, orderBy ) => {
 
     // Primitive Types: string, date, item, term, compound, float
-    if (orderBy.field_type_object.primitive_type == 'float' || orderBy.field_type_object.primitive_type == 'int') {
+    if (orderBy.id == 'date') {
+        commit('setPostQueryAttribute', {  attr: 'orderby', value: 'date' } );
+    } else if (orderBy.field_type_object.primitive_type == 'float' || orderBy.field_type_object.primitive_type == 'int') {
         commit('setPostQueryAttribute', {  attr: 'meta_key', value: orderBy.id } );
         commit('setPostQueryAttribute', {  attr: 'orderby', value: 'meta_value_num' } );
     } else if (orderBy.field_type_object.primitive_type == 'date') {