src_js/iconolab-bundle/src/components/editor/Tooltip.vue
changeset 450 8602c254b9eb
parent 400 c85505149eea
--- a/src_js/iconolab-bundle/src/components/editor/Tooltip.vue	Fri Mar 17 18:17:07 2017 +0100
+++ b/src_js/iconolab-bundle/src/components/editor/Tooltip.vue	Mon Mar 20 12:26:06 2017 +0100
@@ -4,17 +4,19 @@
         <button @click="close" type="button" class="close" data-dismiss="alert" aria-label="Close">
             <span aria-hidden="true">&times;</span>
         </button>
-        <div class="form-group" v-bind:class="titleFormGroup" style="clear: both;">
+        <div class="form-group" v-bind:class="titleFormGroupClass" style="clear: both;">
             <label class="control-label">Titre</label>
-            <input name="title" v-model="title" type="text" class="form-control input-sm" placeholder="Donnez un titre court">
+            <input name="title" v-model="title" type="text" class="form-control input-sm" placeholder="Donnez un titre court" @input="titleError = false">
+            <span class="help-block small" v-show="titleError">Vous devez spécifier un titre</span>
         </div>
         <div class="form-group">
             <label class="control-label">Description</label>
             <textarea name="description" v-model="description" class="form-control input-sm" placeholder="Décrivez ce que vous voyez"></textarea>
         </div>
-        <div class="form-group">
+        <div class="form-group" v-bind:class="tagsFormGroupClass">
             <label class="control-label">Mots-clés</label>
-            <tag-list ref="taglist" v-bind:original-tags="originalTags"></tag-list>
+            <tag-list ref="taglist" v-bind:original-tags="originalTags" @change="tagsError = false"></tag-list>
+            <span class="help-block small" v-show="tagsError">Vous devez spécifier au moins un mot-clé</span>
         </div>
         <button @click="save" class="btn btn-block btn-sm btn-primary">Valider</button>
     </form>
@@ -39,13 +41,19 @@
                 title: '',
                 description: '',
                 tags: [],
-                error: false
+                titleError: false,
+                tagsError: false
             }
         },
         computed: {
-            titleFormGroup: function() {
+            titleFormGroupClass: function() {
                 return {
-                    'has-error': this.error
+                    'has-error': this.titleError
+                }
+            },
+            tagsFormGroupClass: function() {
+                return {
+                    'has-error': this.tagsError
                 }
             }
         },
@@ -56,11 +64,6 @@
             if (this.originalDescription) {
                 this.description = this.originalDescription;
             }
-            this.$on('error', (err) => {
-                if (err.title) {
-                    this.error = true;
-                }
-            });
         },
         methods: {
             close: function(e) {
@@ -70,11 +73,17 @@
             save: function(e) {
                 e.preventDefault();
 
-                this.error = false;
+                Object.assign(this, {
+                    titleError: false,
+                    tagsError: false,
+                });
                 if (this.title.trim().length === 0) {
-                    this.$emit('error', {
-                        title: true
-                    });
+                    this.titleError = true;
+                }
+                if (this.$refs.taglist.tags.length === 0) {
+                    this.tagsError = true;
+                }
+                if (this.titleError || this.tagsError) {
                     return;
                 }