Adds 'Item not saved' warning on select status. Moves Save button next to select.

src/admin/components/edition/collection-edition-form.vue

@@ -1,9 +1,14 @@
 <template>
     <div :class="{'primary-page' : isNewCollection }">
-        <b-tag 
+        <div class="tainacan-page-title">
-                v-if="collection != null && collection != undefined" 
+            <h2>{{ $i18n.get('title_collection_edition') }}</h2>
-                :type="'is-' + getStatusColor(collection.status)" 
+            <a 
-                v-text="collection.status"/>
+                    @click="$router.go(-1)"
+                    class="back-link is-secondary">
+                {{ $i18n.get('return') }}
+            </a>
+            <hr>
+        </div>
         <form 
                 v-if="collection != null && collection != undefined" 
                 class="tainacan-form" 
@@ -421,20 +426,6 @@ export default {
                 this.isLoading = false;
             });
         },
-        getStatusColor(status) {
-            switch(status) {
-                case 'publish': 
-                    return 'success'
-                case 'draft':
-                    return 'info'
-                case 'private': 
-                    return 'warning'
-                case 'trash':
-                    return 'danger'
-                default:
-                    return 'info'
-            }
-        },
         createNewCollection() {
             // Puts loading on Draft Collection creation
             this.isLoading = true;

src/admin/components/edition/item-edition-form.vue

@@ -15,8 +15,55 @@
                 label-width="120px">
             <div class="columns">
                 <div class="column is-4">
+
+                    <!-- Status -------------------------------- --> 
+                    <label class="section-label">{{ $i18n.get('label_status') }}</label>
+                    <help-button 
+                            :title="$i18n.getHelperTitle('items', 'status')" 
+                            :message="$i18n.getHelperMessage('items', 'status')"/>
+                    <div class="document-box">
+                        <div class="field">
+                            <b-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>
+                            <p 
+                                    v-if="item.status == 'auto-draft'"
+                                    class="help is-danger">
+                                {{ $i18n.get('info_item_not_saved') }}
+                            </p>
+                        </div> 
+                        <div class="field is-grouped">
+                            <!-- <div class="control">     
+                                <button
+                                        id="button-cancel-item-creation"
+                                        class="button is-outlined"
+                                        type="button"
+                                        @click="cancelBack">{{ $i18n.get('cancel') }}</button>
+                            </div> -->
+                            <div class="control">
+                                <button
+                                        id="button-submit-item-creation"
+                                        @click.prevent="onSubmit"
+                                        class="button is-success" 
+                                        >{{ $i18n.get('save') }}</button> 
+                            </div>
+                        </div>
+                        <p class="help is-danger">{{ formErrorMessage }}</p> 
+                    </div>
+                        
                     <!-- Document -------------------------------- -->
                     <label class="section-label">{{ form.document != undefined && form.document != null && form.document != '' ? $i18n.get('label_document') : $i18n.get('label_document_empty') }}</label>
+                    <help-button 
+                            :title="$i18n.getHelperTitle('items', 'document')" 
+                            :message="$i18n.getHelperMessage('items', 'document')"/>
                     <div class="document-box">
                         <div 
                                 v-if="form.document != undefined && form.document != null &&
@@ -160,6 +207,9 @@
 
                     <!-- Thumbnail -------------------------------- --> 
                     <label class="section-label">{{ $i18n.get('label_thumbnail') }}</label>
+                    <help-button 
+                            :title="$i18n.getHelperTitle('items', 'featured_img_id')" 
+                            :message="$i18n.getHelperMessage('items', 'featured_img_id')"/>
                     <div class="document-box">
                         <div class="thumbnail-field">
                             <a 
@@ -223,27 +273,6 @@
                                 :icon=" collapseAll ? 'menu-down' : 'menu-right'" />
                     </a>
 
-                    <!-- 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"
@@ -253,24 +282,6 @@
   
                 </div>
             </div>
-
-            <div class="field is-grouped form-submit">
-                <div class="control">     
-                    <button
-                            id="button-cancel-item-creation"
-                            class="button is-outlined"
-                            type="button"
-                            @click="cancelBack">{{ $i18n.get('cancel') }}</button>
-                </div>
-                <div class="control">
-                    <button
-                            id="button-submit-item-creation"
-                            @click.prevent="onSubmit"
-                            class="button is-success" 
-                            >{{ $i18n.get('save') }}</button> 
-                </div>
-            </div>
-            <p class="help is-danger">{{ formErrorMessage }}</p> 
         </form>
 
         <b-loading 
@@ -442,9 +453,9 @@ export default {
             this.form.document = '';
             this.updateItemDocument({ item_id: this.itemId, document: this.form.document, document_type: this.form.document_type });
         },
-        cancelBack(){
+        // cancelBack(){
-            this.$router.push(this.$routerHelper.getCollectionPath(this.collectionId));
+        //     this.$router.push(this.$routerHelper.getCollectionPath(this.collectionId));
-        },
+        // },
         deleteThumbnail() {
             this.updateThumbnail({itemId: this.itemId, thumbnailId: 0})
             .then(() => {

src/admin/scss/tainacan-admin.scss

@@ -143,6 +143,9 @@ html {
         .button.is-outlined {
             color: $tertiary;
         }
+        &.has-only-save {
+            justify-content: end !important;
+        }
     }
     .label { 
         font-weight: normal;

src/admin/tainacan-admin-i18n.php

@@ -200,6 +200,7 @@ return [
 	'info_no_page_found'                       => __( 'No page was found with this name.', 'tainacan' ),
 	'info_no_user_found'                       => __( 'No user was found with this name.', 'tainacan' ),
 	'info_no_item_found'                       => __( 'No item was found here with these filters.', 'tainacan' ),
+	'info_item_not_saved'           		   => __( 'Warning: Item not saved.', 'tainacan' ),
 	'info_no_moderator_on_collection'          => __( "This collection doesn't have any moderator yet.", 'tainacan' ),
 	'info_error_deleting_collection'           => __( 'Error on deleting collection.', 'tainacan' ),
 	'info_error_deleting_category'             => __( 'Error on deleting category', 'tainacan' ),