vue-intergrall-plugins 0.0.265 → 0.0.267

package/dist/vue-intergrall-plugins.ssr.js

@@ -1908,10 +1908,6 @@ var createPopper = /*#__PURE__*/popperGenerator({
 //
 //
 //
-//
-//
-//
-//
 var script$y = {
   data: function data() {
     return {
@@ -2087,6 +2083,8 @@ var script$y = {
 
           fileReader.onload = function () {
             var image_preview = fileReader.result;
+            current_icon = 'image';
+            current_color = 'purple';
             _this2.headerFiles[0] = {
               file: file,
               image_preview: image_preview,
@@ -2274,6 +2272,8 @@ var script$y = {
       return isValueValid;
     },
     setImageVar: function setImageVar(file) {
+      var _this5 = this;
+
       this.$emit("set-file-var", file);
 
       if (!file) {
@@ -2282,7 +2282,9 @@ var script$y = {
       } else {
         if (this.lastVar == 0) return this.$emit("set-vars", this.template);
         if (Object.keys(this.varValues).length) return this.$emit("set-vars", this.varValues);
-        this.handleInitialFocus();
+        this.$nextTick(function () {
+          return _this5.handleInitialFocus();
+        });
       }
     },
     setVar: function setVar(event, key, notificar) {
@@ -2391,26 +2393,7 @@ var __vue_render__$y = function __vue_render__() {
     staticClass: "ts-container"
   }, [_vm._ssrNode("<div class=\"ts-content\">", "</div>", _vm._l(_vm.template.components, function (component, cIndex) {
     return _vm._ssrNode("<div" + _vm._ssrClass(null, "" + (component.type == 'footer' ? 'order-1 custom-box-shadow-bottom' : '') + (_vm.template.components.length == 1 ? 'custom-box-shadow-bottom' : '')) + ">", "</div>", [component.type === 'header' ? _vm._ssrNode("<header id=\"template_header\"" + _vm._ssrClass(null, "" + (_vm.template.components.length == 1 ? 'border-radius-5 custom-border-gray' : '')) + ">", "</header>", _vm._l(component.parameters, function (param, pIndex) {
-      return _vm._ssrNode("<div>", "</div>", [param.type === 'text' ? [_vm._ssrNode(_vm.regexVars.test(param.text) ? "<div>" + _vm._s(param.text.replace(_vm.regexVars, "<div class='ts-content__var'>" + _vm.htmlInputString + _vm.varListValues + "</div>")) + "</div>" : "<p>" + _vm._s(param.text) + "</p>")] : param.type == 'image' ? _vm._ssrNode("<div class=\"ts-image-type\">", "</div>", [_vm._ssrNode("<input type=\"file\"" + _vm._ssrAttr("accept", _vm.acceptedExtensions) + " class=\"d-none\"> "), _vm.headerFiles[0] ? [_vm.headerFiles[0].image_preview ? _c('img', {
-        directives: [{
-          name: "tippy",
-          rawName: "v-tippy",
-          value: {
-            placement: 'right'
-          },
-          expression: "{placement: 'right'}"
-        }],
-        attrs: {
-          "src": _vm.headerFiles[0].image_preview,
-          "alt": "Previa da imagem",
-          "content": _vm.headerFiles[0].name
-        },
-        on: {
-          "click": function click($event) {
-            return _vm.triggerInputFile("header-" + pIndex);
-          }
-        }
-      }) : _c('fa-icon', {
+      return _vm._ssrNode("<div>", "</div>", [param.type === 'text' ? [_vm._ssrNode(_vm.regexVars.test(param.text) ? "<div>" + _vm._s(param.text.replace(_vm.regexVars, "<div class='ts-content__var'>" + _vm.htmlInputString + _vm.varListValues + "</div>")) + "</div>" : "<p>" + _vm._s(param.text) + "</p>")] : param.type == 'image' ? _vm._ssrNode("<div class=\"ts-image-type\">", "</div>", [_vm._ssrNode("<input type=\"file\"" + _vm._ssrAttr("accept", _vm.acceptedExtensions) + " class=\"d-none\"> "), _vm.headerFiles[0] ? [_c('fa-icon', {
         directives: [{
           name: "tippy",
           rawName: "v-tippy",
@@ -2422,7 +2405,7 @@ var __vue_render__$y = function __vue_render__() {
         class: "color-" + _vm.headerFiles[0].current_color,
         attrs: {
           "icon": ['fas', _vm.headerFiles[0].current_icon],
-          "content": _vm.headerFiles[0].name
+          "content": _vm.headerFiles[0].image_preview ? "<div class='custom-tooltip-image'>\n                    <img src='" + _vm.headerFiles[0].image_preview + "' alt='" + _vm.headerFiles[0].name + "' />\n                  </div>" : _vm.headerFiles[0].name
         },
         on: {
           "click": function click($event) {
@@ -2478,7 +2461,7 @@ var __vue_inject_styles__$y = undefined;
 var __vue_scope_id__$y = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$y = "data-v-7cd51b67";
+var __vue_module_identifier__$y = "data-v-c988759e";
 /* functional template */
 
 var __vue_is_functional_template__$y = false;
@@ -9709,8 +9692,8 @@ var script$h = {
     return {
       templateOptions: [],
       codTemplate: {},
-      selectedTemplate: null // hasFile: false
-
+      selectedTemplate: null,
+      hasFile: false
     };
   },
   mounted: function mounted() {
@@ -9831,8 +9814,8 @@ var script$h = {
 
                     if (message.text.indexOf(varName) != -1) {
                       /**Gerando os obejetos de parametros da notificacao para o component */
-                      if (component.type === "header") {
-                        _this2.selectedTemplate['parameters'][component.type] = {}; //Header s? pode ter uma vari?vel
+                      if (component.type === "header" && !_this2.selectedTemplate['parameters'][component.type]) {
+                        _this2.selectedTemplate['parameters'][component.type] = {}; //Header so pode ter uma vari?vel
 
                         _this2.selectedTemplate['parameters'][component.type] = {
                           tipo: "text",
@@ -9853,6 +9836,18 @@ var script$h = {
                     keyIndex++;
                   }
                 });
+              } else if (component.type == 'header' && component.parameters.seq) {
+                if (_this2.hasFile) {
+                  if (!_this2.selectedTemplate['parameters'][component.type]) _this2.selectedTemplate['parameters'][component.type] = new Array();
+
+                  _this2.selectedTemplate['parameters'][component.type].push({
+                    tipo: 'image',
+                    template: component.parameters.seq,
+                    link: ''
+                  });
+                } else {
+                  delete _this2.selectedTemplate['parameters'][component.type];
+                }
               }
             });
           }
@@ -9862,8 +9857,9 @@ var script$h = {
       this.$emit("template-data", this.selectedTemplate);
     },
     setFileVar: function setFileVar(file) {
-      // this.hasFile = file ? true : false
+      this.hasFile = file ? true : false;
       this.$emit("set-file-var", file);
+      if (file) this.$emit("template-data", this.selectedTemplate);
     },
     setMessage: function setMessage(message) {
       this.$emit("static-message", message);
@@ -9948,8 +9944,8 @@ var __vue_staticRenderFns__$h = [];
 
 var __vue_inject_styles__$h = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-2f61c38c_0", {
-    source: "*{box-sizing:border-box}.toasted svg{margin-right:10px}.d-none{display:none}ul{list-style-type:none}h1,h2,h3,h4,p{margin:0;padding:0}.tg-container{width:100%;max-width:800px;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto}.tg-options{width:100%;display:flex}.tg-options.column{flex-direction:column}.tg-options h4{margin-right:5px}.ts-image-type{display:flex;align-items:center}.ts-image-type img{cursor:pointer}.ts-image-type svg{font-size:25px;cursor:pointer}.ts-image-type .select-image{color:#838383}.color-red{color:#e74c3c}.color-blue{color:#007bff}.color-black{color:#333}.ts-button{background-color:#fff;border-radius:10px;display:flex;justify-content:center;align-items:center;padding:3px 15px;transition:background-color 150ms ease-in-out}.ts-button:hover{background-color:#fdfdfd}.tg-select{flex:1;height:34px;overflow:hidden}.tg-select .vs__dropdown-toggle{background-color:#fff;height:34px;overflow:hidden;display:flex;align-items:center}.tg-select .vs__selected-options{height:34px;overflow:hidden}.tg-select .vs__selected-options>span{white-space:nowrap;text-overflow:ellipsis;flex:1}.vs__dropdown-option.vs__dropdown-option--selected{background-color:#1a5fad!important;color:#fff}.vs__dropdown-menu li{padding:10px 15px}.vs__dropdown-option{transition:background-color 150ms;white-space:normal}.vs__dropdown-option:nth-child(odd){background-color:#f1f1f1}.vs__dropdown-option--highlight,.vs__dropdown-option--selected,.vs__dropdown-option:active,.vs__dropdown-option:focus,.vs__dropdown-option:hover{background-color:#5897fb!important;color:#fff}.tg-component{width:100%}.ts-container{width:100%;display:flex;justify-content:space-between}.ts-content{--border-color:#CCC;--background-color:#DFF0D8;--input-background-color:#FFF;--input-border-default:#007BFF;--input-border-error:#E74C3C;--placeholder-color:#BBB;--border-radius:5px;flex:2;font-size:.7rem;padding:10px 0;display:flex;flex-direction:column}.order-1{order:1}.custom-box-shadow-bottom{box-shadow:0 3px 4px -3px rgba(0,0,0,.3)}.custom-border-gray{border:1px solid var(--border-color)!important}.ts-content footer,.ts-content header,.ts-content section{padding:3px 5px;background-color:var(--background-color)}.ts-content header,.ts-content section{border-right:1px solid var(--border-color);border-left:1px solid var(--border-color)}.ts-content header{border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius);border-top:1px solid var(--border-color)}.ts-content header{font-weight:550}.ts-content section{line-height:25px}.ts-content section.margin-bottom{border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);border-bottom:1px solid var(--border-color)}.custom-footer-style,.ts-content footer{border:1px solid var(--border-color);border-top:unset;border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.ts-content input{border:1px solid transparent;outline:0;font-size:.8rem;padding:2.5px 5px;background-color:var(--input-background-color)}.ts-content input::placeholder{color:var(--placeholder-color)}.ts-content input.active,.ts-content input:focus{border:1px solid var(--input-border-default)}.ts-content input.invalid{border:1px solid var(--input-border-error)!important}.ts-content__var{display:inline-block;position:relative}.ts-dropdown{margin:0;padding:0;position:absolute;top:19px;left:0;background:#eee;width:100%;z-index:1;transition:all 150ms;visibility:hidden;opacity:0;list-style-type:none;border:1px solid #444;border-top:unset}.ts-dropdown li{width:100%;opacity:.9;cursor:pointer;font-weight:550;padding:2px 3px;font-size:.8rem;transition:background-color 150ms}.ts-dropdown li:focus,.ts-dropdown li:focus-within,.ts-dropdown li:hover{opacity:1;background-color:#555;color:#fff}.ts-dropdown.visible{visibility:visible;opacity:1}.tg-btn{width:40%;display:flex;justify-content:center;align-items:center}.tg-btn button{border:unset;display:block;min-width:180px;height:35px;padding:0 10px;font-weight:500;background-color:#007bff;color:#fff;transition:transform .3s ease-in-out;user-select:none;cursor:pointer;box-shadow:inset 0 -2px rgba(0,0,0,.2);opacity:.9;border-radius:2.5px}.tg-btn button>svg{margin-right:5px;color:#003166}.tg-btn button:hover{opacity:1}.tg-btn button:active{opacity:1;box-shadow:inset 0 -1px rgba(0,0,0,.2);-webkit-transform:translateY(1px);-moz-transform:translateY(1px);-o-transform:translateY(1px);-ms-transform:translateY(1px);transform:translateY(1px)}.tg-btn button:active{opacity:1;box-shadow:inset 0 -1px rgba(0,0,0,.2);-webkit-transform:translateY(1px);-moz-transform:translateY(1px);-o-transform:translateY(1px);-ms-transform:translateY(1px);transform:translateY(1px)}.tg-btn button:active,.tg-btn button:focus{outline:2px solid #000}.tg-btn.small-btn{width:auto;margin:0 5px}.tg-btn.small-btn svg{margin-right:0}.tg-btn.small-btn button{min-width:35px;width:35px;padding:0;display:flex;justify-content:center;align-items:center}.tm-container{border:1px solid var(--border-color);border-radius:5px;display:flex}",
+  inject("data-v-5b32f202_0", {
+    source: "*{box-sizing:border-box}.toasted svg{margin-right:10px}.d-none{display:none}ul{list-style-type:none}h1,h2,h3,h4,p{margin:0;padding:0}.tg-container{width:100%;max-width:800px;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto}.tg-options{width:100%;display:flex}.tg-options.column{flex-direction:column}.tg-options h4{margin-right:5px}.ts-image-type{display:flex;align-items:center}.ts-image-type img{cursor:pointer}.ts-image-type svg{font-size:25px;cursor:pointer}.ts-image-type .select-image{color:#838383}.color-red{color:#e74c3c}.color-blue{color:#007bff}.color-black{color:#333}.color-purple{color:#a312a3}.custom-tooltip-image{display:flex;justify-content:center;align-items:center;overflow:visible;padding:5px}.custom-tooltip-image img{max-width:75px;max-height:75px}.ts-button{background-color:#fff;border-radius:10px;display:flex;justify-content:center;align-items:center;padding:3px 15px;transition:background-color 150ms ease-in-out}.ts-button:hover{background-color:#fdfdfd}.tg-select{flex:1;height:34px;overflow:hidden}.tg-select .vs__dropdown-toggle{background-color:#fff;height:34px;overflow:hidden;display:flex;align-items:center}.tg-select .vs__selected-options{height:34px;overflow:hidden}.tg-select .vs__selected-options>span{white-space:nowrap;text-overflow:ellipsis;flex:1}.vs__dropdown-option.vs__dropdown-option--selected{background-color:#1a5fad!important;color:#fff}.vs__dropdown-menu li{padding:10px 15px}.vs__dropdown-option{transition:background-color 150ms;white-space:normal}.vs__dropdown-option:nth-child(odd){background-color:#f1f1f1}.vs__dropdown-option--highlight,.vs__dropdown-option--selected,.vs__dropdown-option:active,.vs__dropdown-option:focus,.vs__dropdown-option:hover{background-color:#5897fb!important;color:#fff}.tg-component{width:100%}.ts-container{width:100%;display:flex;justify-content:space-between}.ts-content{--border-color:#CCC;--background-color:#DFF0D8;--input-background-color:#FFF;--input-border-default:#007BFF;--input-border-error:#E74C3C;--placeholder-color:#BBB;--border-radius:5px;flex:2;font-size:.7rem;padding:10px 0;display:flex;flex-direction:column}.order-1{order:1}.custom-box-shadow-bottom{box-shadow:0 3px 4px -3px rgba(0,0,0,.3)}.custom-border-gray{border:1px solid var(--border-color)!important}.ts-content footer,.ts-content header,.ts-content section{padding:3px 5px;background-color:var(--background-color)}.ts-content header,.ts-content section{border-right:1px solid var(--border-color);border-left:1px solid var(--border-color)}.ts-content header{border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius);border-top:1px solid var(--border-color)}.ts-content header{font-weight:550}.ts-content section{line-height:25px}.ts-content section.margin-bottom{border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius);border-bottom:1px solid var(--border-color)}.custom-footer-style,.ts-content footer{border:1px solid var(--border-color);border-top:unset;border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.ts-content input{border:1px solid transparent;outline:0;font-size:.8rem;padding:2.5px 5px;background-color:var(--input-background-color)}.ts-content input::placeholder{color:var(--placeholder-color)}.ts-content input.active,.ts-content input:focus{border:1px solid var(--input-border-default)}.ts-content input.invalid{border:1px solid var(--input-border-error)!important}.ts-content__var{display:inline-block;position:relative}.ts-dropdown{margin:0;padding:0;position:absolute;top:19px;left:0;background:#eee;width:100%;z-index:1;transition:all 150ms;visibility:hidden;opacity:0;list-style-type:none;border:1px solid #444;border-top:unset}.ts-dropdown li{width:100%;opacity:.9;cursor:pointer;font-weight:550;padding:2px 3px;font-size:.8rem;transition:background-color 150ms}.ts-dropdown li:focus,.ts-dropdown li:focus-within,.ts-dropdown li:hover{opacity:1;background-color:#555;color:#fff}.ts-dropdown.visible{visibility:visible;opacity:1}.tg-btn{width:40%;display:flex;justify-content:center;align-items:center}.tg-btn button{border:unset;display:block;min-width:180px;height:35px;padding:0 10px;font-weight:500;background-color:#007bff;color:#fff;transition:transform .3s ease-in-out;user-select:none;cursor:pointer;box-shadow:inset 0 -2px rgba(0,0,0,.2);opacity:.9;border-radius:2.5px}.tg-btn button>svg{margin-right:5px;color:#003166}.tg-btn button:hover{opacity:1}.tg-btn button:active{opacity:1;box-shadow:inset 0 -1px rgba(0,0,0,.2);-webkit-transform:translateY(1px);-moz-transform:translateY(1px);-o-transform:translateY(1px);-ms-transform:translateY(1px);transform:translateY(1px)}.tg-btn button:active{opacity:1;box-shadow:inset 0 -1px rgba(0,0,0,.2);-webkit-transform:translateY(1px);-moz-transform:translateY(1px);-o-transform:translateY(1px);-ms-transform:translateY(1px);transform:translateY(1px)}.tg-btn button:active,.tg-btn button:focus{outline:2px solid #000}.tg-btn.small-btn{width:auto;margin:0 5px}.tg-btn.small-btn svg{margin-right:0}.tg-btn.small-btn button{min-width:35px;width:35px;padding:0;display:flex;justify-content:center;align-items:center}.tm-container{border:1px solid var(--border-color);border-radius:5px;display:flex}",
     map: undefined,
     media: undefined
   });
@@ -9960,7 +9956,7 @@ var __vue_inject_styles__$h = function __vue_inject_styles__(inject) {
 var __vue_scope_id__$h = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$h = "data-v-2f61c38c";
+var __vue_module_identifier__$h = "data-v-5b32f202";
 /* functional template */
 
 var __vue_is_functional_template__$h = false;
@@ -12520,7 +12516,7 @@ var __vue_render__$5 = function __vue_render__() {
       'hist-msg': _vm.histMsg,
       'max-w-60': _vm.link && !_vm.mapa
     }
-  }, [_vm.isReply ? _c('div', {
+  }, [_vm.isReply && _vm.replyMessage ? _c('div', {
     staticClass: "mensagem-reply",
     class: "message-reply-" + _vm.origem
   }, [_vm.replyMessage ? _c('p', {
@@ -12793,7 +12789,7 @@ var __vue_staticRenderFns__$5 = [];
 
 var __vue_inject_styles__$5 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-79ea3333_0", {
+  inject("data-v-1154d016_0", {
     source: ":root{--message-color:#373737;--text-color:#FFF;--files-bg:rgba(255, 255, 255, 0.1);--files-bg-hover:rgba(255, 255, 255, 0.1);--light:80;--threshold:60}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}.mensagem-reply{padding:5px 10px;font-size:.75rem;color:#666;transition:background-color 150ms ease-in-out;border-radius:5px;margin:5px 0;overflow:hidden;max-width:100%}.mensagem-reply p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-reply-principal{border-left:3px solid transparent;background-color:rgba(100,100,100,.1)}.message-reply-principal:hover{background-color:rgba(100,100,100,.2)}.message-reply-outros{background-color:#f5f5f5;border-left:3px solid var(--message-color)}.message-reply-outros:hover{background-color:#ebebeb}.mensagem-reply-vazia{display:flex;align-items:center}.mensagem-reply-vazia svg{margin-right:5px;color:#ba181b}.mensagem{padding:14px 7px;border-radius:5px;min-width:150px;min-height:60px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;position:relative;max-width:80%;margin-bottom:10px;font-size:.75rem;word-break:break-word;-webkit-box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);-moz-box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}.mensagem.max-w-60{max-width:60%}.mensagem.mapa{width:100%}.mensagem.hist-msg{animation:show 1s}.mensagem a{margin-right:5px;font-weight:550;color:inherit;text-decoration:none}.mensagem a:hover{text-decoration:underline}.message p{white-space:pre-wrap}.mensagem-anexo a,.mensagem-div-mapa a{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.reply{cursor:pointer;position:absolute;right:53px;bottom:5px;font-size:.6rem;color:#67a332;width:.9rem;height:.9rem;display:flex;justify-content:center;align-items:center;border-radius:50%;background-color:#fff}.reply svg{margin-top:-1px;margin-right:-1px}.reply-with-2-icons{right:30px}.check{cursor:pointer;position:absolute;right:10px;bottom:2px;font-size:.7rem}.check.visualizado,.check.visualizado svg{color:#006daa}.check.verde,.check.verde svg{color:#4f772d}.check.vermelho,.check.vermelho svg{color:#ba181b}.check.cinza,.check.cinza svg{color:#999}.check.preto,.check.preto svg{color:#666}.star{cursor:pointer;position:absolute;right:30px;bottom:2px;font-size:.4rem;width:11.2px}.default-stick-size{width:180px;height:auto}.horario-envio{margin-right:15px;font-size:.7rem;position:absolute;left:10px;bottom:2px}.autor-mensagem{position:absolute;font-size:.6rem;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:90%;font-weight:700;top:2px}.mensagem__principal{width:100%;display:flex;justify-content:flex-end}.mensagem__principal>.mensagem::after{content:\"\";width:0;height:0;position:absolute;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--message-color);bottom:5px;right:-10px;transform:rotate(-90deg)}.mensagem__principal>.mensagem{background-color:var(--message-color);color:var(--text-color)}.mensagem__principal>.mensagem .horario-envio{color:var(--text-color)}.mensagem__principal>.mensagem .autor-mensagem{right:5px;color:var(--text-color)}.mensagem__outros{width:100%;display:flex}.mensagem__outros>.mensagem{background-color:#fff;color:#333}.mensagem__outros>.mensagem::after{content:\"\";width:0;height:0;position:absolute;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid #fff;bottom:5px;left:-10px;transform:rotate(90deg)}.mensagem__outros>.autor-mensagem{left:5px;color:#333}.mensagem-div-mapa{width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;margin-bottom:5px}.msg-mapa{width:100%;min-height:225px;height:100%;box-sizing:initial}.msg-mapa img{max-width:none!important}.info-mapa{list-style-type:none}.info-mapa li.title{font-size:.85em}.info-mapa li.address,.info-mapa li.url{font-size:.85em}.info-mapa li.url{font-size:.85em}.tooltip-list{margin:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}",
     map: undefined,
     media: undefined
@@ -12805,7 +12801,7 @@ var __vue_inject_styles__$5 = function __vue_inject_styles__(inject) {
 var __vue_scope_id__$5 = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$5 = "data-v-79ea3333";
+var __vue_module_identifier__$5 = "data-v-1154d016";
 /* functional template */
 
 var __vue_is_functional_template__$5 = false;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-intergrall-plugins",
-  "version": "0.0.265",
+  "version": "0.0.267",
   "description": "",
   "main": "dist/vue-intergrall-plugins.ssr.js",
   "browser": "dist/vue-intergrall-plugins.esm.js",

package/src/lib-components/Messages/ChatMessages.vue

@@ -9,7 +9,7 @@
         :dictionary="dictionary"
       />
     <div v-else class="mensagem" :class="{mapa, 'hist-msg' : histMsg, 'max-w-60' : link && !mapa}">
-      <div v-if="isReply" class="mensagem-reply" :class="`message-reply-${origem}`">
+      <div v-if="isReply && replyMessage" class="mensagem-reply" :class="`message-reply-${origem}`">
         <p v-if="replyMessage" v-html="replyMessage"></p>
         <span v-else class="mensagem-reply-vazia">
           <fa-icon :icon="['fas', 'times']" v-if="showReplyIcon" />

package/src/lib-components/Templates/TemplateGenerator.vue

@@ -96,7 +96,7 @@
         templateOptions: [],
         codTemplate: {},
         selectedTemplate: null,
-        // hasFile: false
+        hasFile: false
       }
     },
     mounted() {
@@ -201,9 +201,9 @@
                       const varName = `{{${keys[keyIndex]}}}`
                       if(message.text.indexOf(varName) != -1) {
                         /**Gerando os obejetos de parametros da notificacao para o component */
-                        if(component.type === "header") {
+                        if(component.type === "header" && !this.selectedTemplate['parameters'][component.type]) {
                           this.selectedTemplate['parameters'][component.type] = {}
-                          //Header s? pode ter uma vari?vel
+                          //Header so pode ter uma vari?vel
                           this.selectedTemplate['parameters'][component.type] = {
                             tipo: "text",
                             text: values[keyIndex]
@@ -220,17 +220,24 @@
                       keyIndex++
                     }
                   })
+                }else if(component.type == 'header' && component.parameters.seq) {
+                  if(this.hasFile) {
+                    if(!this.selectedTemplate['parameters'][component.type]) this.selectedTemplate['parameters'][component.type] = new Array()
+                    this.selectedTemplate['parameters'][component.type].push({ tipo: 'image', template: component.parameters.seq, link: '' })
+                  }else {
+                    delete this.selectedTemplate['parameters'][component.type]
+                  }
                 }
               })
             }
           }
         }
-
         this.$emit("template-data", this.selectedTemplate)
       },
       setFileVar(file) {
-        // this.hasFile = file ? true : false
+        this.hasFile = file ? true : false
         this.$emit("set-file-var", file)
+        if(file) this.$emit("template-data", this.selectedTemplate)
       },
       setMessage(message) {
         this.$emit("static-message", message)
@@ -296,6 +303,23 @@ h1, h2, h3, h4, p { margin: 0; padding: 0 }
   color: #333
 }
 
+.color-purple {
+  color: #a312a3
+}
+
+.custom-tooltip-image {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: visible;
+  padding: 5px;
+}
+
+.custom-tooltip-image img {
+  max-width: 75px;
+  max-height: 75px;
+}
+
 .ts-button {
   background-color: #FFF;
   border-radius: 10px;

package/src/lib-components/Templates/TemplateSingle.vue

@@ -27,21 +27,17 @@
             <div v-else-if="param.type == 'image'" class="ts-image-type">
               <input class="d-none" type="file" :ref="`ts-input-header-${pIndex}`" :accept="acceptedExtensions" @change="fileUpload($event)" />
               <template v-if="headerFiles[0]">
-                <img 
-                  v-if="headerFiles[0].image_preview"
-                  :src="headerFiles[0].image_preview"
-                  alt="Previa da imagem"
-                  @click="triggerInputFile(`header-${pIndex}`)"
-                  v-tippy="{placement: 'right'}"
-                  :content="headerFiles[0].name"
-                />
                 <fa-icon 
-                  v-else
                   :icon="['fas', headerFiles[0].current_icon]"
                   :class="`color-${headerFiles[0].current_color}`"
                   @click="triggerInputFile(`header-${pIndex}`)"
                   v-tippy="{placement: 'right'}"
-                  :content="headerFiles[0].name"
+                  :content="headerFiles[0].image_preview ? 
+                    `<div class='custom-tooltip-image'>
+                      <img src='${headerFiles[0].image_preview}' alt='${headerFiles[0].name}' />
+                    </div>` 
+                    : headerFiles[0].name
+                  "
                 />
               </template>
               <fa-icon 
@@ -255,6 +251,8 @@ export default {
           fileReader.readAsDataURL(file)
           fileReader.onload = () => {
             const image_preview = fileReader.result
+            current_icon = 'image'
+            current_color = 'purple'
             this.headerFiles[0] = { file, image_preview, current_icon, current_color, name }
             this.$forceUpdate()
             this.setImageVar(file)
@@ -419,7 +417,7 @@ export default {
       }else {
         if(this.lastVar == 0) return this.$emit("set-vars", this.template)
         if(Object.keys(this.varValues).length) return this.$emit("set-vars", this.varValues)
-        this.handleInitialFocus()
+        this.$nextTick(() => this.handleInitialFocus())
       }
     },
     setVar(event, key, notificar) {