--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/src_js/iconolab-bundle/src/components/editor/Tooltip.vue Wed Feb 15 16:42:06 2017 +0100
@@ -0,0 +1,105 @@
+<template>
+
+ <form>
+ <button @click="close" type="button" class="close" data-dismiss="alert" aria-label="Close">
+ <span aria-hidden="true">×</span>
+ </button>
+ <div class="form-group" v-bind:class="titleFormGroup" 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">
+ </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">
+ <label class="control-label">Mots-clé</label>
+ <tag-list ref="taglist" v-bind:original-tags="originalTags"></tag-list>
+ </div>
+ <button @click="save" class="btn btn-block btn-sm btn-primary">Valider</button>
+ </form>
+
+</template>
+
+<script>
+
+ import TagList from '../tagform/TagList.vue'
+
+ export default {
+ props: [
+ 'original-title',
+ 'original-description',
+ 'original-tags'
+ ],
+ components: {
+ 'tag-list': TagList
+ },
+ data() {
+ return {
+ title: '',
+ description: '',
+ tags: [],
+ error: false
+ }
+ },
+ computed: {
+ titleFormGroup: function() {
+ return {
+ 'has-error': this.error
+ }
+ }
+ },
+ mounted() {
+ if (this.originalTitle) {
+ this.title = this.originalTitle;
+ }
+ if (this.originalDescription) {
+ this.description = this.originalDescription;
+ }
+ this.$on('error', (err) => {
+ if (err.title) {
+ this.error = true;
+ }
+ });
+ },
+ methods: {
+ close: function(e) {
+ e.preventDefault();
+ this.$emit('close');
+ },
+ save: function(e) {
+ e.preventDefault();
+
+ this.error = false;
+ if (this.title.trim().length === 0) {
+ this.$emit('error', {
+ title: true
+ });
+ return;
+ }
+
+ this.$emit('save', {
+ title: this.title,
+ description: this.description,
+ tags: this.$refs.taglist.tags
+ });
+ }
+ }
+ }
+
+</script>
+
+<style>
+.popover {
+ min-width: 300px;
+}
+.popover-content .form-group {
+ margin-bottom: 10px;
+}
+.popover-content .form-group label {
+ font-size: 12px;
+}
+.popover-content .taglist {
+ margin: 10px 0 15px;
+}
+</style>