From 7122530b100c31af420507c1df66618a8e5aceda Mon Sep 17 00:00:00 2001
From: mateuswetah <mateus.m.luna@gmail.com>
Date: Mon, 9 Apr 2018 19:57:43 -0300
Subject: [PATCH] Initiates layout split on ItemEditionPage

---
 .../components/edition/item-edition-form.vue  | 241 ++++++++++--------
 src/admin/components/lists/filters-list.vue   |   3 +-
 src/classes/field-types/date/Date.vue         |   1 +
 src/js/event-bus-web-components.js            |   2 +-
 src/js/store/modules/filter/actions.js        |   2 +-
 5 files changed, 133 insertions(+), 116 deletions(-)

diff --git a/src/admin/components/edition/item-edition-form.vue b/src/admin/components/edition/item-edition-form.vue
index 75fd1c02b..b91fa7106 100644
--- a/src/admin/components/edition/item-edition-form.vue
+++ b/src/admin/components/edition/item-edition-form.vue
@@ -8,118 +8,127 @@
                 v-if="!isLoading" 
                 class="tainacan-form" 
                 label-width="120px">
-            <b-field 
-                    :addons="false"
-                    :label="$i18n.get('label_status')">
-                <help-button 
-                        :title="$i18n.getHelperTitle('items', 'status')" 
-                        :message="$i18n.getHelperMessage('items', 'status')"/>
-                <b-select 
-                        id="status-select"
-                        v-model="form.status"
-                        :placeholder="$i18n.get('instruction_select_a_status')">
-                    <option
-                            :id="`status-option-${statusOption.value}`"
-                            v-for="statusOption in statusOptions"
-                            :key="statusOption.value"
-                            :value="statusOption.value"
-                            :disabled="statusOption.disabled">{{ statusOption.label }}
-                    </option>
-                </b-select>
-            </b-field>
 
-            <!-- Thumbnail -------------------------------- --> 
-            <b-field :label="$i18n.get('label_image')">
-                <div class="thumbnail-field">
-                    <b-upload 
-                            v-if="item.featured_image == undefined || item.featured_image == false"
-                            v-model="thumbnail"
-                            drag-drop
-                            @input="uploadThumbnail($event)">
-                        <div class="content has-text-centered">
-                            <p>
-                            <b-icon
-                                icon="upload"/>
-                            </p>
-                            <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
-                        </div>
-                    </b-upload>
-                    <div v-else> 
-                        <figure class="image is-128x128">
-                            <img 
-                                    :alt="$i18n.get('label_thumbnail')" 
-                                    :src="item.featured_image">
-                        </figure>
-                        <div class="thumbnail-buttons-row">
-                            <b-upload 
-                                    model="thumbnail"
-                                    @input="uploadThumbnail($event)">
-                                <a 
-                                        id="button-edit" 
-                                        :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"/></a>
-                            </b-upload>
-                            <a 
-                                    id="button-delete" 
-                                    :aria-label="$i18n.get('label_button_delete_thumb')" 
-                                    @click="deleteThumbnail()"><b-icon icon="delete"/></a>
-                        </div>
-                    </div> 
-                </div>
-            </b-field> 
-                  
-            <!-- Fields from Collection-------------------------------- -->   
-            <tainacan-form-item                 
-                v-for="(field, index) in fieldList"
-                :key="index"
-                :field="field"/>  
-
-            <!-- Attachments ------------------------------------------ -->
-            <div class="columns is-multiline">
-                <div class="column is-4">
+            <div class="columns">
+                <div class="column is-narrow">
+                    <!-- Thumbnail -------------------------------- --> 
                     <b-field :label="$i18n.get('label_image')">
-                        <b-upload 
-                                v-model="form.files"
-                                multiple
-                                drag-drop
-                                @input="uploadAttachment($event)">
-                            <section class="section">
+                        <div class="thumbnail-field">
+                            <b-upload 
+                                    v-if="item.featured_image == undefined || item.featured_image == false"
+                                    v-model="thumbnail"
+                                    drag-drop
+                                    @input="uploadThumbnail($event)">
                                 <div class="content has-text-centered">
                                     <p>
-                                        <b-icon
-                                                icon="upload"
-                                                size="is-large"/>
+                                    <b-icon
+                                        icon="upload"/>
                                     </p>
                                     <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
                                 </div>
-                            </section>
-                        </b-upload>
-                    </b-field>
-                    <div class="uploaded-files">
-                        <div 
-                                v-for="(file, index) in form.files"
-                                :key="index">
-                            <span class="tag is-primary">
-                                {{ file.name }}
-                                <button 
-                                    class="delete is-small"
-                                    type="button"
-                                    @click="deleteFile(index)"/>
-                            </span>
-                            <!-- <progress class="progress is-secondary" value="15" max="100">30%</progress> -->
+                            </b-upload>
+                            <div v-else> 
+                                <figure class="image is-128x128">
+                                    <img 
+                                            :alt="$i18n.get('label_thumbnail')" 
+                                            :src="item.featured_image">
+                                </figure>
+                                <div class="thumbnail-buttons-row">
+                                    <b-upload 
+                                            model="thumbnail"
+                                            @input="uploadThumbnail($event)">
+                                        <a 
+                                                id="button-edit" 
+                                                :aria-label="$i18n.get('label_button_edit_thumb')"><b-icon icon="pencil"/></a>
+                                    </b-upload>
+                                    <a 
+                                            id="button-delete" 
+                                            :aria-label="$i18n.get('label_button_delete_thumb')" 
+                                            @click="deleteThumbnail()"><b-icon icon="delete"/></a>
+                                </div>
+                            </div> 
                         </div>
-                    </div>     
+                    </b-field>
+
+                    <!-- Attachments ------------------------------------------ -->
+                    <div class="columns is-multiline">
+                        <div class="column is-4">
+                            <b-field :label="$i18n.get('label_image')">
+                                <b-upload 
+                                        v-model="form.files"
+                                        multiple
+                                        drag-drop
+                                        @input="uploadAttachment($event)">
+                                    <section class="section">
+                                        <div class="content has-text-centered">
+                                            <p>
+                                                <b-icon
+                                                        icon="upload"
+                                                        size="is-large"/>
+                                            </p>
+                                            <p>{{ $i18n.get('instruction_image_upload_box') }}</p>
+                                        </div>
+                                    </section>
+                                </b-upload>
+                            </b-field>
+                            <div class="uploaded-files">
+                                <div 
+                                        v-for="(file, index) in form.files"
+                                        :key="index">
+                                    <span class="tag is-primary">
+                                        {{ file.name }}
+                                        <button 
+                                            class="delete is-small"
+                                            type="button"
+                                            @click="deleteFile(index)"/>
+                                    </span>
+                                    <!-- <progress class="progress is-secondary" value="15" max="100">30%</progress> -->
+                                </div>
+                            </div>   
+                        </div>  
+                    </div>
+                    <div 
+                            class="column is-narrow"
+                            v-for="(attachment, index) of item.attachments" 
+                            :key="index">
+                        <figure class="image is-128x128">
+                            <img 
+                                    :alt="attachment.title"
+                                    :src="attachment.url">
+                        </figure>
+                    </div>
+                </div>
+
+                <div class="column">
+                    <!-- Status -------------------------------- --> 
+                    <b-field 
+                            :addons="false"
+                            :label="$i18n.get('label_status')">
+                        <help-button 
+                                :title="$i18n.getHelperTitle('items', 'status')" 
+                                :message="$i18n.getHelperMessage('items', 'status')"/>
+                        <b-select 
+                                id="status-select"
+                                v-model="form.status"
+                                :placeholder="$i18n.get('instruction_select_a_status')">
+                            <option
+                                    :id="`status-option-${statusOption.value}`"
+                                    v-for="statusOption in statusOptions"
+                                    :key="statusOption.value"
+                                    :value="statusOption.value"
+                                    :disabled="statusOption.disabled">{{ statusOption.label }}
+                            </option>
+                        </b-select>
+                    </b-field> 
+                        
+                    <!-- Fields from Collection-------------------------------- -->   
+                    <tainacan-form-item                 
+                        v-for="(field, index) in fieldList"
+                        :key="index"
+                        :field="field"/>    
                 </div>
-                <div 
-                        class="column is-narrow"
-                        v-for="(attachment, index) of item.attachments" 
-                        :key="index">
-                    <figure class="image is-128x128">
-                        <img 
-                                :alt="attachment.title"
-                                :src="attachment.url">
-                    </figure>
-                </div>  
             </div>
+
             <div class="field is-grouped form-submit">
                 <div class="control">     
                     <button
@@ -213,15 +222,14 @@ export default {
                 this.$router.push(this.$routerHelper.getItemPath(this.form.collectionId, this.itemId));
             })
             .catch((errors) => {
-                for (let error of errors.errors) {     
-                    for (let attribute of Object.keys(error)){
-                        //this.editFormErrors[attribute] = error[attribute];
-                        this.$console.log(error);
+                // for (let error of errors.errors) {     
+                //     for (let attribute of Object.keys(error)){
+                //         //this.editFormErrors[attribute] = error[attribute];
+                //         this.$console.log(error);
                         
-                       eventBus.errors.push({ field_id: 7031, errors: error[attribute]});
-                    }  
-                }
-                this.$console.log(eventBus.errors);
+                //        eventBus.errors.push({ field_id: 7031, errors: error[attribute]});
+                //     }  
+                // }
                 this.formErrorMessage = errors.error_message;
 
                 this.isLoading = false;
@@ -267,7 +275,8 @@ export default {
             });
         }, 
         cancelBack(){
-            this.$router.push(this.$routerHelper.getCollectionPath(this.collectionId));
+            this.$console.log(this.fieldList);
+            //this.$router.push(this.$routerHelper.getCollectionPath(this.collectionId));
         },
         uploadAttachment($event) {
             
@@ -317,7 +326,15 @@ export default {
             return this.getFields();
         },
         formHasErrors(){
-            return eventBus.errors.length > 0;
+            // for (let field of this.fieldList) {
+            //     if (field.field.required == 'yes' &&
+            //         (field.value == '' || field.value == undefined) && 
+            //         this.form.status == 'publish') {
+            //             return true;
+            //         }
+            // }
+
+            return false;
         } 
     },
     created(){
diff --git a/src/admin/components/lists/filters-list.vue b/src/admin/components/lists/filters-list.vue
index 112f9276a..9bb46528e 100644
--- a/src/admin/components/lists/filters-list.vue
+++ b/src/admin/components/lists/filters-list.vue
@@ -259,7 +259,6 @@ export default {
             this.addNewFilter(fieldType, lastIndex);
         },
         addNewFilter(choosenField, newIndex) {
-            this.$console.log(choosenField);
             this.choosenField = choosenField;
             this.newIndex = newIndex;
             this.openedFilterId = '';
@@ -342,7 +341,7 @@ export default {
 
             // Opening collapse
             } else {
-                this.$console.log(this.choosenField);
+                
                 if (this.openedFilterId == '' && this.choosenField.id != undefined) {
                     this.availableFieldList.push(this.choosenField);
                     this.choosenField = {};
diff --git a/src/classes/field-types/date/Date.vue b/src/classes/field-types/date/Date.vue
index f406150c4..9f9daebfa 100644
--- a/src/classes/field-types/date/Date.vue
+++ b/src/classes/field-types/date/Date.vue
@@ -3,6 +3,7 @@
             :id="id"
             v-model="dateValue"
             @blur="onBlur"
+            :readonly="false"
             @input="onInput($event)"/>
 </template>
 
diff --git a/src/js/event-bus-web-components.js b/src/js/event-bus-web-components.js
index bce5e01bb..1e9f7c879 100644
--- a/src/js/event-bus-web-components.js
+++ b/src/js/event-bus-web-components.js
@@ -44,7 +44,7 @@ export const eventBus = new Vue({
                     if ( index >= 0){
                         this.errors.splice( index, 1);
                     }
-                }, error => {
+                }).catch((error) => {
                     let index = this.errors.findIndex( errorItem => errorItem.field_id === data.field_id );
                     let messages = null;
 
diff --git a/src/js/store/modules/filter/actions.js b/src/js/store/modules/filter/actions.js
index 56ffb372a..0f0372f11 100644
--- a/src/js/store/modules/filter/actions.js
+++ b/src/js/store/modules/filter/actions.js
@@ -86,7 +86,7 @@ export const updateCollectionFiltersOrder = ({ commit }, { collectionId, filters
         axios.tainacan.patch('/collections/' + collectionId, {
             filters_order: filtersOrder
         }).then( res => {
-            commit('setCollection', res.data);
+            commit('collection/setCollection', res.data, { root: true });
             resolve( res.data );
         }).catch( error => { 
             reject( error.response );