vue-intergrall-plugins 0.0.245 → 0.0.248

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

@@ -1987,6 +1987,7 @@ var script$y = {
       var _this3 = this;
 
       var varList = input.nextSibling;
+      var currentInstance = this;
       input.setAttribute("placeholder", "{{var_".concat(this.lastVar, "}}"));
       input.setAttribute("id", "{{var_".concat(this.lastVar, "}}"));
       input.addEventListener("input", function (event) {
@@ -1999,23 +2000,42 @@ var script$y = {
         input.classList.add("active");
 
         if (varList) {
-          for (var i = 0; i < varList.children.length; i++) {
-            varList.children[i].addEventListener("click", function () {
-              input.value = "[".concat(this.innerText, "]");
-              input.classList.add("active");
-              input.dispatchEvent(new Event('input'));
-            });
-          }
+          (function () {
+            var handleNextFocus = function handleNextFocus() {
+              var allInputs = document.querySelectorAll(".input-var-".concat(currentInstance.identifier));
+              var stop = false;
+
+              if (allInputs.length) {
+                allInputs.forEach(function (elem) {
+                  if (!elem.value && !stop) {
+                    stop = true;
+                    elem.focus();
+                  }
+                });
+              }
 
-          var containerGeral = document.querySelector(".tg-container");
-          varList.classList.add("visible");
-          var maxBottom = containerGeral.getBoundingClientRect().bottom,
-              currentBottom = varList.getBoundingClientRect().bottom;
+              if (!stop && _this3.$refs["template-single-button"]) _this3.$refs["template-single-button"].focus();
+            };
 
-          if (currentBottom > maxBottom) {
-            varList.style.top = "-".concat(varList.getBoundingClientRect().height, "px");
-            varList.style.borderTop = "1px solid currentColor";
-          }
+            for (var i = 0; i < varList.children.length; i++) {
+              varList.children[i].addEventListener("click", function () {
+                input.value = "[".concat(this.innerText, "]");
+                input.classList.add("active");
+                input.dispatchEvent(new Event('input'));
+                handleNextFocus();
+              });
+            }
+
+            var containerGeral = document.querySelector(".tg-container");
+            varList.classList.add("visible");
+            var maxBottom = containerGeral.getBoundingClientRect().bottom,
+                currentBottom = varList.getBoundingClientRect().bottom;
+
+            if (currentBottom > maxBottom) {
+              varList.style.top = "-".concat(varList.getBoundingClientRect().height, "px");
+              varList.style.borderTop = "1px solid currentColor";
+            }
+          })();
         }
       });
       input.addEventListener("blur", function () {
@@ -2201,7 +2221,7 @@ var __vue_inject_styles__$y = undefined;
 var __vue_scope_id__$y = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$y = "data-v-add8fb80";
+var __vue_module_identifier__$y = "data-v-affaa3f8";
 /* functional template */
 
 var __vue_is_functional_template__$y = false;
@@ -9492,6 +9512,9 @@ var script$h = {
 
       this.adjustOnSelect();
     },
+    focusSelect: function focusSelect() {
+      if (this.$refs["template-v-select"] && this.$refs["template-v-select"].$el) this.$refs["template-v-select"].$el.querySelector("input").focus();
+    },
     selectIfIsUnique: function selectIfIsUnique() {
       if (Object.keys(this.templates).length === 1) {
         for (var key in this.templates) {
@@ -9502,9 +9525,7 @@ var script$h = {
         }
       }
 
-      if (!this.codTemplate && this.$refs["template-v-select"] && this.$refs["template-v-select"].$el) {
-        this.$refs["template-v-select"].$el.querySelector("input").focus();
-      }
+      if (!this.codTemplate) this.focusSelect();
     },
     selectIfHasContact24h: function selectIfHasContact24h() {
       if (this.templates['envio_msg']) {
@@ -9651,7 +9672,7 @@ var __vue_staticRenderFns__$h = [];
 
 var __vue_inject_styles__$h = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-730cbd76_0", {
+  inject("data-v-e3f5b41e_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}.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}.tg-select .vs__selected-options>input{flex-grow:0}.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;flex:2;font-size:.7rem;padding:10px 0}.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:2.5px;border-top-right-radius:2.5px;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:2.5px;border-bottom-right-radius:2.5px;border-bottom:1px solid var(--border-color)}.ts-content footer{border:1px solid var(--border-color);border-top:unset;border-bottom-left-radius:2.5px;border-bottom-right-radius:2.5px}.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 5px;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:2.5px;display:flex}",
     map: undefined,
     media: undefined
@@ -9663,7 +9684,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-730cbd76";
+var __vue_module_identifier__$h = "data-v-e3f5b41e";
 /* functional template */
 
 var __vue_is_functional_template__$h = false;
@@ -10121,7 +10142,9 @@ var __vue_component__$n = __vue_component__$m;var textoLongo = {
       case "mp3":
       case "audio/mp3":
       case "aac":
-        tipoDoc = type;
+      case "audio/mpeg":
+      case "mpeg":
+        tipoDoc = type.startsWith("audio/") ? type : "audio/".concat(type);
         docAnexo = "".concat(dominio, "/callcenter/docs.php?mku=").concat(mku);
         nomeArquivo = name;
         audio = true;
@@ -10131,7 +10154,7 @@ var __vue_component__$n = __vue_component__$m;var textoLongo = {
       case "video":
       case "mp4":
       case "m4v":
-        tipoDoc = type;
+        tipoDoc = type.startsWith("video/") ? type : "video/".concat(type);
         docAnexo = "".concat(dominio, "/callcenter/docs.php?mku=").concat(mku);
         nomeArquivo = name;
         video = true;
@@ -10240,6 +10263,40 @@ var __vue_component__$n = __vue_component__$m;var textoLongo = {
     },
     setIcon: function setIcon() {
       this.icon = this.fileType === "pdf" ? ['fas', 'file-pdf'] : ['fas', 'file-alt'];
+    },
+    downloadAllFilesHandler: function downloadAllFilesHandler() {
+      try {
+        if (!this.$root.$refs.chatMessages || !this.$root.$refs.chatMessages.referenceSelector) return this.$emit("download-all");
+        var container = document.querySelector("".concat(this.$root.$refs.chatMessages.referenceSelector));
+        if (!container) return this.$emit("download-all");
+        var currentFilesToDownload = container.querySelectorAll("a[download]");
+        if (!currentFilesToDownload.length) return this.$emit("download-all", {
+          status: 'erro',
+          message: 'Sem anexos para fazer o download'
+        });
+        var index = 0;
+
+        var handleInterval = function handleInterval() {
+          if (index > currentFilesToDownload.length) return false;
+          currentFilesToDownload[index] && currentFilesToDownload[index].click();
+          index += 1;
+          return true;
+        };
+
+        var interval = setInterval(function () {
+          var handler = handleInterval();
+
+          if (!handler) {
+            clearInterval(interval);
+            interval = 0;
+          }
+        }, 300);
+      } catch (error) {
+        console.error("Erro ao fazer o donwload de todos anexos");
+        this.$toasted.global.defaultError({
+          msg: error.message ? error.message : error
+        });
+      }
     }
   }
 };//
@@ -11446,144 +11503,83 @@ var __vue_render__$8 = function __vue_render__() {
 
   return _c('div', {
     staticClass: "mensagem-div-anexo"
-  }, [_c('transition-group', {
-    staticClass: "anexo-transition",
+  }, [_vm._ssrNode("<div class=\"anexo-mensagem\" data-v-14bae430>", "</div>", [_vm.imageURL ? _vm._ssrNode("<img" + _vm._ssrAttr("src", _vm.imageURL) + _vm._ssrAttr("alt", _vm.dictionary.alt_msg_img) + " data-v-14bae430>", "</img>") : _vm.audio ? _vm._ssrNode("<audio controls=\"controls\" data-v-14bae430><source" + _vm._ssrAttr("src", _vm.docURL) + _vm._ssrAttr("type", _vm.fileType) + " data-v-14bae430>\n      Sem suporte para o elemento audio\n    </audio>") : _vm.video ? _vm._ssrNode("<video controls=\"controls\" data-v-14bae430><source" + _vm._ssrAttr("src", _vm.docURL) + _vm._ssrAttr("type", _vm.fileType) + " data-v-14bae430>\n      Sem suporte para o elemento video\n    </video>") : _vm.docURL ? _vm._ssrNode("<a" + _vm._ssrAttr("href", _vm.docURL) + " target=\"_blank\" rel=\"noreferrer noopener\" class=\"default-doc\" data-v-14bae430>", "</a>", [_c('fa-icon', {
+    class: [_vm.iconClass],
     attrs: {
-      "name": "fade",
-      "mode": "out-in"
+      "icon": _vm.icon
     }
-  }, [_vm.imgErro ? _c('div', {
+  }), _vm._ssrNode(" <p" + _vm._ssrAttr("title", _vm.filename) + " data-v-14bae430>" + _vm._ssrEscape(_vm._s(_vm.filename)) + "</p>")], 2) : _vm._ssrNode("<span class=\"default-doc\" data-v-14bae430>", "</span>", [_c('fa-icon', {
+    class: [_vm.iconClass ? _vm.iconClass : ''],
+    attrs: {
+      "icon": ['fas', 'file-alt']
+    }
+  }), _vm._ssrNode(" <p" + _vm._ssrAttr("title", _vm.filename) + " data-v-14bae430>" + _vm._ssrEscape(_vm._s(_vm.filename)) + "</p>")], 2), _vm._ssrNode(" "), _vm._ssrNode("<div class=\"file-actions\" data-v-14bae430>", "</div>", [_vm.imageURL ? _vm._ssrNode("<span class=\"file-action-button\" data-v-14bae430>", "</span>", [_c('fa-icon', {
     directives: [{
       name: "tippy",
       rawName: "v-tippy"
     }],
-    key: "error-msg",
-    attrs: {
-      "content": _vm.imgMsgErro
-    }
-  }, [_c('div', {
-    staticClass: "alert alert-danger",
-    attrs: {
-      "role": "alert"
-    }
-  }, [_c('fa-icon', {
-    attrs: {
-      "icon": ['fas', 'file-image']
-    }
-  }), _vm._v("\n        " + _vm._s(_vm.dictionary.img_com_erro) + "\n      ")], 1)]) : _vm._e(), _vm._v(" "), _vm.isLoading ? _c('Loader', {
-    key: "anexo-loader",
-    attrs: {
-      "small": true,
-      "slow": true
-    }
-  }) : _c('div', {
-    key: "anexo-mensagem",
-    staticClass: "anexo-mensagem"
-  }, [_vm.imageURL ? _c('img', {
-    attrs: {
-      "src": _vm.imageURL,
-      "alt": _vm.dictionary.alt_msg_img
-    },
-    on: {
-      "click": function click($event) {
-        return _vm.showImage(_vm.imageURL);
-      }
-    }
-  }) : _vm._e(), _vm._v(" "), _vm.imageURL ? _c('div', {
-    staticClass: "anexos-links-container"
-  }, [_c('a', {
-    attrs: {
-      "href": "#"
-    },
-    on: {
-      "click": function click($event) {
-        $event.preventDefault();
-        return _vm.showImage(_vm.imageURL);
-      }
-    }
-  }, [_vm._v(" " + _vm._s(_vm.dictionary.titulo_visualizar_img) + " ")]), _vm._v(" "), _c('fa-icon', {
     attrs: {
-      "icon": ['fas', 'search-plus']
-    },
-    on: {
-      "click": function click($event) {
-        return _vm.showImage(_vm.imageURL);
-      }
+      "icon": ['fas', 'search-plus'],
+      "content": "" + _vm.dictionary.titulo_visualizar_img
     }
-  })], 1) : _vm.docURL ? _c('div', {
-    staticClass: "anexo-container"
-  }, [_vm.audio || _vm.video ? [_vm.audio ? _c('audio', {
-    attrs: {
-      "src": _vm.docURL,
-      "controls": "",
-      "title": _vm.fileType + " - " + _vm.filename
-    }
-  }, [_c('p', [_vm._v(" " + _vm._s(_vm.dictionary.msg_erro_audio) + " "), _c('a', {
+  })], 1) : _vm._e(), _vm._ssrNode(" "), _vm.docURL ? _c('a', {
+    directives: [{
+      name: "tippy",
+      rawName: "v-tippy"
+    }],
+    staticClass: "file-action-button",
     attrs: {
       "href": _vm.docURL,
       "target": "_blank",
-      "rel": "noreferrer noopener"
-    }
-  }, [_vm._v(" " + _vm._s(_vm.dictionary.msg_abrir_audio) + " ")])])]) : _vm._e(), _vm._v(" "), _vm.video ? _c('video', {
-    attrs: {
-      "src": _vm.docURL,
-      "controls": "",
-      "title": _vm.fileType + " - " + _vm.filename
+      "rel": "noreferrer noopener",
+      "content": "Visualizar anexo"
     }
-  }, [_c('p', [_vm._v(" " + _vm._s(_vm.dictionary.msg_erro_video) + " "), _vm.fileType != 'erro' ? _c('a', {
+  }, [_c('fa-icon', {
     attrs: {
-      "href": _vm.docURL,
-      "target": "_blank",
-      "rel": "noreferrer noopener"
+      "icon": ['fas', 'search-plus']
     }
-  }, [_vm._v(" " + _vm._s(_vm.dictionary.msg_abrir_video) + " ")]) : _vm._e()])]) : _vm._e()] : [_vm.fileType != 'erro' ? _c('a', {
+  })], 1) : _vm._e(), _vm._ssrNode(" "), _vm.imageURL || _vm.docURL ? _c('a', {
+    directives: [{
+      name: "tippy",
+      rawName: "v-tippy"
+    }],
+    staticClass: "file-action-button",
     attrs: {
-      "href": _vm.docURL,
+      "href": _vm.imageURL ? _vm.imageURL : _vm.docURL,
+      "download": "" + _vm.filename,
       "target": "_blank",
       "rel": "noreferrer noopener",
-      "title": _vm.fileType + " - " + _vm.filename
+      "content": "Fazer o download do anexo"
     }
   }, [_c('fa-icon', {
-    class: [_vm.iconClass],
     attrs: {
-      "icon": _vm.icon
-    }
-  }), _vm._v(" "), _c('p', {
-    domProps: {
-      "textContent": _vm._s(_vm.filename)
+      "icon": ['fas', 'download']
     }
-  })], 1) : _c('p', {
-    staticClass: "arquivo-erro",
+  })], 1) : _vm._e(), _vm._ssrNode(" "), _c('span', {
+    directives: [{
+      name: "tippy",
+      rawName: "v-tippy"
+    }],
+    staticClass: "file-action-button",
     attrs: {
-      "title": _vm.fileType + " - " + _vm.filename
+      "content": "Fazer download de todos anexos da tela"
+    },
+    on: {
+      "click": _vm.downloadAllFilesHandler
     }
   }, [_c('fa-icon', {
-    attrs: {
-      "icon": ['fas', 'file-alt']
-    }
-  }), _vm._v("\n            " + _vm._s(_vm.filename) + "\n          ")], 1)]], 2) : _vm._e(), _vm._v(" "), _vm.imageURL ? _c('a', {
-    attrs: {
-      "href": _vm.imageURL,
-      "download": "" + _vm.filename,
-      "target": "_blank",
-      "rel": "noreferrer noopener"
-    }
-  }, [_vm._v(" " + _vm._s(_vm.dictionary.titulo_baixar_img) + " "), _c('fa-icon', {
     attrs: {
       "icon": ['fas', 'download']
     }
-  })], 1) : _vm._e(), _vm._v(" "), _vm.docURL ? _c('a', {
+  }), _vm._ssrNode(" "), _c('fa-icon', {
     attrs: {
-      "href": _vm.docURL,
-      "download": "" + _vm.filename,
-      "target": "_blank",
-      "rel": "noreferrer noopener"
+      "icon": ['fas', 'download']
     }
-  }, [_vm._v(" " + _vm._s(_vm.dictionary.titulo_baixar_doc) + " "), _c('fa-icon', {
+  }), _vm._ssrNode(" "), _c('fa-icon', {
     attrs: {
       "icon": ['fas', 'download']
     }
-  })], 1) : _vm._e()])], 1)], 1);
+  })], 2)], 2)], 2)]);
 };
 
 var __vue_staticRenderFns__$8 = [];
@@ -11591,8 +11587,8 @@ var __vue_staticRenderFns__$8 = [];
 
 var __vue_inject_styles__$8 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-433c38d2_0", {
-    source: ".fade-enter-active[data-v-433c38d2],.fade-leave-active[data-v-433c38d2]{transition:opacity .5s}.fade-enter[data-v-433c38d2],.fade-leave-to[data-v-433c38d2]{opacity:0}.mensagem-div-anexo[data-v-433c38d2]{width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;overflow:hidden}.anexo-container[data-v-433c38d2]{width:100%;margin-top:5px;overflow:hidden;display:flex;max-height:300px}.anexo-container .arquivo-erro[data-v-433c38d2],.anexo-container a[data-v-433c38d2]{padding:10px 15px 15px 15px;display:flex;justify-content:center;align-items:center}.anexo-container p[data-v-433c38d2]{text-overflow:ellipsis;overflow:hidden}.anexo-container .arquivo-erro[data-v-433c38d2],.anexo-container p[data-v-433c38d2]{margin:0;margin-left:15px;font-size:.9rem}.anexo-container svg[data-v-433c38d2]{font-size:2rem}.anexo-container audio[data-v-433c38d2]{outline:0;width:100%}.anexo-container video[data-v-433c38d2]{flex:1;width:100%;max-width:350px;cursor:pointer}.anexos-links-container[data-v-433c38d2]{width:100%;display:flex;justify-content:center;align-items:center}.anexos-links-container a[data-v-433c38d2]{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-right:5px;font-weight:550;color:inherit;text-decoration:none}.anexos-links-container svg[data-v-433c38d2]{cursor:pointer}.mensagem-div-anexo img[data-v-433c38d2]{cursor:pointer;margin:10px 0;min-width:35px;width:100%;max-width:250px}.anexo-transition[data-v-433c38d2]{width:100%;height:100%}.anexo-mensagem[data-v-433c38d2]{display:flex;justify-content:center;align-items:center;flex-direction:column}.alert-danger[data-v-433c38d2]{color:#721c24;background-color:#f8d7da;border-color:#f5c6cb}.alert[data-v-433c38d2]{position:relative;padding:.65rem 1.2rem;margin:5px 0;border:1px solid transparent;border-radius:.25rem;text-align:center}.alert svg[data-v-433c38d2]{font-size:1.025em;margin-right:2px}.pdf[data-v-433c38d2]{color:#e74c3c}.doc[data-v-433c38d2]{color:#006bc9}",
+  inject("data-v-14bae430_0", {
+    source: ".mensagem__principal .default-doc[data-v-14bae430]{background-color:rgba(255,255,255,.1)}.mensagem__outros .default-doc[data-v-14bae430]{background-color:rgba(100,100,100,.1)}.default-doc[data-v-14bae430]{display:flex;align-items:center;padding:10px;border-radius:5px;width:100%;max-width:100%}.default-doc svg[data-v-14bae430]{font-size:1.2rem;margin-right:5px}.default-doc p[data-v-14bae430]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-actions[data-v-14bae430]{display:flex;justify-content:flex-end;width:100%;padding:5px}.file-actions a[data-v-14bae430]{margin-right:0}.mensagem__principal .file-action-button[data-v-14bae430]{background-color:rgba(255,255,255,.1)}.mensagem__outros .file-action-button[data-v-14bae430]{background-color:rgba(100,100,100,.1)}.mensagem__principal .file-action-button[data-v-14bae430]:hover{background-color:rgba(255,255,255,.3)}.mensagem__outros .file-action-button[data-v-14bae430]:hover{background-color:rgba(100,100,100,.3)}.file-action-button[data-v-14bae430]{display:flex;justify-content:center;align-items:center;margin-left:12px;cursor:pointer;padding:5px;border-radius:5px;transition:background-color 150ms ease-in-out}.file-action-button a[data-v-14bae430]{margin:0}.fade-enter-active[data-v-14bae430],.fade-leave-active[data-v-14bae430]{transition:opacity .5s}.fade-enter[data-v-14bae430],.fade-leave-to[data-v-14bae430]{opacity:0}.mensagem-div-anexo[data-v-14bae430]{width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;overflow:hidden}.anexo-container[data-v-14bae430]{width:100%;margin-top:5px;overflow:hidden;display:flex;max-height:300px}.anexo-container .arquivo-erro[data-v-14bae430],.anexo-container a[data-v-14bae430]{padding:10px 15px 15px 15px;display:flex;justify-content:center;align-items:center}.anexo-container p[data-v-14bae430]{text-overflow:ellipsis;overflow:hidden}.anexo-container .arquivo-erro[data-v-14bae430],.anexo-container p[data-v-14bae430]{margin:0;margin-left:15px;font-size:.9rem}.anexo-container svg[data-v-14bae430]{font-size:2rem}.anexo-mensagem audio[data-v-14bae430]{outline:0;width:100%;margin-bottom:5px}.anexo-mensagem video[data-v-14bae430]{flex:1;width:100%;max-width:350px;cursor:pointer;margin-bottom:5px}.anexos-links-container[data-v-14bae430]{width:100%;display:flex;justify-content:center;align-items:center}.anexos-links-container a[data-v-14bae430]{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-right:5px;font-weight:550;color:inherit;text-decoration:none}.anexos-links-container svg[data-v-14bae430]{cursor:pointer}.mensagem-div-anexo img[data-v-14bae430]{cursor:pointer;margin:10px 0;min-width:35px;width:100%;max-width:250px}.anexo-transition[data-v-14bae430]{width:100%;height:100%}.anexo-mensagem[data-v-14bae430]{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100%}.alert-danger[data-v-14bae430]{color:#721c24;background-color:#f8d7da;border-color:#f5c6cb}.alert[data-v-14bae430]{position:relative;padding:.65rem 1.2rem;margin:5px 0;border:1px solid transparent;border-radius:.25rem;text-align:center}.alert svg[data-v-14bae430]{font-size:1.025em;margin-right:2px}.pdf[data-v-14bae430]{color:#e74c3c}.doc[data-v-14bae430]{color:#006bc9}",
     map: undefined,
     media: undefined
   });
@@ -11600,10 +11596,10 @@ var __vue_inject_styles__$8 = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$8 = "data-v-433c38d2";
+var __vue_scope_id__$8 = "data-v-14bae430";
 /* module identifier */
 
-var __vue_module_identifier__$8 = "data-v-433c38d2";
+var __vue_module_identifier__$8 = "data-v-14bae430";
 /* functional template */
 
 var __vue_is_functional_template__$8 = false;
@@ -11916,7 +11912,10 @@ var script$5 = {
     InteratividadeFormulario: InteratividadeFormulario,
     LinkPreview: LinkPreview
   },
-  props: ["smartchannel", "messageIndex", "dictionary", "autor", "origem", "msg", "link", "anexo", "imgAnexo", "tipoDoc", "docAnexo", "nomeArquivo", "audio", "video", "horario", "status", "logo", "msgTooltip", "seq", "mapa", "histMsg", "erro", "msgErro", "origemExterna", "anexos", "dominio", "corMsg", "interatividade", "msgReply", "hasReply", "iniDialogo", "dialogoId", "dialogoOrigem", "expSessao"],
+  props: ["smartchannel", "messageIndex", "dictionary", "autor", "origem", "msg", "link", "anexo", "imgAnexo", "tipoDoc", "docAnexo", "nomeArquivo", "audio", "video", "horario", "status", "logo", "msgTooltip", "seq", "mapa", "histMsg", "erro", "msgErro", "origemExterna", "anexos", "dominio", "corMsg", "interatividade", "msgReply", "hasReply", "iniDialogo", "dialogoId", "dialogoOrigem", "expSessao", "referenceSelector"],
+  created: function created() {
+    if (!this.$root.$refs.chatMessages) this.$root.$refs.chatMessages = this;
+  },
   data: function data() {
     return {
       strTooltipAux: "",
@@ -12179,7 +12178,10 @@ var __vue_render__$5 = function __vue_render__() {
         "dominio": _vm.dominio
       },
       on: {
-        "abrir-imagem": _vm.abrirImagem
+        "abrir-imagem": _vm.abrirImagem,
+        "download-all": function downloadAll($event) {
+          return _vm.$emit('download-all');
+        }
       }
     })], 1);
   }) : _vm._e(), _vm._v(" "), _vm.urlSticker ? _c('img', {
@@ -12424,7 +12426,7 @@ var __vue_staticRenderFns__$5 = [];
 
 var __vue_inject_styles__$5 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-44a68ecf_0", {
+  inject("data-v-4d7ba00c_0", {
     source: ":root{--message-color:#373737;--text-color:#FFF;--light:80;--threshold:60}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}.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
@@ -12436,7 +12438,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-44a68ecf";
+var __vue_module_identifier__$5 = "data-v-4d7ba00c";
 /* functional template */
 
 var __vue_is_functional_template__$5 = false;

package/package.json

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

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

@@ -1,43 +1,41 @@
 <template>
   <div class="mensagem-div-anexo">
-    <transition-group name="fade" mode="out-in" class="anexo-transition">
-      <div v-if="imgErro" key="error-msg" v-tippy :content="imgMsgErro">
-        <div class="alert alert-danger" role="alert">
-          <fa-icon :icon="['fas', 'file-image']" />
-          {{dictionary.img_com_erro}}
-        </div>
+    <div class="anexo-mensagem">
+      <img v-if="imageURL" @click="showImage(imageURL)" :src="imageURL" :alt="dictionary.alt_msg_img">
+      <audio v-else-if="audio" controls>
+        <source :src="docURL" :type="fileType" />
+        Sem suporte para o elemento audio
+      </audio>
+      <video v-else-if="video" controls>
+        <source :src="docURL" :type="fileType" />
+        Sem suporte para o elemento video
+      </video>
+      <a v-else-if="docURL" :href="docURL" target="_blank" rel="noreferrer noopener" class="default-doc">
+        <fa-icon :class="[iconClass]" :icon="icon" />
+        <p v-text="filename" :title="filename"></p>
+      </a>
+      <span v-else class="default-doc">
+        <fa-icon :class="[iconClass ? iconClass : '']" :icon="['fas', 'file-alt']" />
+        <p v-text="filename" :title="filename"></p>
+      </span>
+      <!-- Acoes -->
+      <div class="file-actions">
+        <span v-if="imageURL" class="file-action-button" @click="showImage(imageURL)">
+          <fa-icon :icon="['fas', 'search-plus']" v-tippy :content="`${dictionary.titulo_visualizar_img}`" />
+        </span>
+        <a v-if="docURL" :href="docURL" target="_blank" rel="noreferrer noopener" v-tippy :content="`Visualizar anexo`" class="file-action-button">
+          <fa-icon :icon="['fas', 'search-plus']" />
+        </a>
+        <a v-if="imageURL || docURL" :href="imageURL ? imageURL : docURL" :download="`${filename}`" target="_blank" rel="noreferrer noopener" v-tippy :content="`Fazer o download do anexo`" class="file-action-button">
+          <fa-icon :icon="['fas', 'download']" />
+        </a>
+        <span  class="file-action-button" v-tippy :content="`Fazer download de todos anexos da tela`" @click="downloadAllFilesHandler">
+          <fa-icon :icon="['fas', 'download']" />
+          <fa-icon :icon="['fas', 'download']" />
+          <fa-icon :icon="['fas', 'download']" />
+        </span>
       </div>
-      <Loader v-if="isLoading" :small="true" key="anexo-loader" :slow="true" />
-      <div v-else key="anexo-mensagem" class="anexo-mensagem">
-        <img v-if="imageURL" @click="showImage(imageURL)" :src="imageURL" :alt="dictionary.alt_msg_img">
-        <div class="anexos-links-container" v-if="imageURL">
-          <a href="#" @click.prevent="showImage(imageURL)"> {{ dictionary.titulo_visualizar_img }} </a>
-          <fa-icon :icon="['fas', 'search-plus']" @click="showImage(imageURL)" />
-        </div>
-        <div v-else-if="docURL" class="anexo-container">
-          <template v-if="audio || video">
-            <audio v-if="audio" :src="docURL" controls :title="`${fileType} - ${filename}`">
-              <p> {{ dictionary.msg_erro_audio }} <a :href="docURL" target="_blank" rel="noreferrer noopener"> {{ dictionary.msg_abrir_audio }} </a> </p>
-            </audio>
-            <video v-if="video" :src="docURL" controls :title="`${fileType} - ${filename}`">
-              <p> {{ dictionary.msg_erro_video }} <a v-if="fileType != 'erro'" :href="docURL" target="_blank" rel="noreferrer noopener"> {{ dictionary.msg_abrir_video }} </a> </p>
-            </video>
-          </template>
-          <template v-else>
-            <a v-if="fileType != 'erro'" :href="docURL" target="_blank" rel="noreferrer noopener" :title="`${fileType} - ${filename}`">
-              <fa-icon :class="[iconClass]" :icon="icon" />
-              <p v-text="filename"></p>
-            </a>
-            <p v-else :title="`${fileType} - ${filename}`" class="arquivo-erro">
-              <fa-icon :icon="['fas', 'file-alt']" />
-              {{ filename }}
-            </p>
-          </template>
-        </div>
-        <a v-if="imageURL" :href="imageURL" :download="`${filename}`" target="_blank" rel="noreferrer noopener"> {{ dictionary.titulo_baixar_img }} <fa-icon :icon="['fas', 'download']" /> </a>
-        <a v-if="docURL" :href="docURL" :download="`${filename}`" target="_blank" rel="noreferrer noopener"> {{ dictionary.titulo_baixar_doc }} <fa-icon :icon="['fas', 'download']" /> </a>
-      </div>
-    </transition-group>
+    </div>
   </div>
 </template>
 
@@ -105,6 +103,73 @@ export default {
 </script>
 
 <style scoped>
+  .mensagem__principal .default-doc {
+    background-color: rgba(255, 255, 255, 0.1);
+  }
+
+  .mensagem__outros .default-doc {
+    background-color: rgba(100, 100, 100, 0.1);
+  }
+
+  .default-doc {
+    display: flex;
+    align-items: center;
+    padding: 10px;
+    border-radius: 5px;
+    width: 100%;
+    max-width: 100%;
+  }
+  .default-doc svg {
+    font-size: 1.2rem;
+    margin-right: 5px;
+  }
+  .default-doc p {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .file-actions {
+    display: flex;
+    justify-content: flex-end;
+    width: 100%;
+    padding: 5px;
+  }
+  .file-actions a {
+    margin-right: 0;
+  }
+
+  .mensagem__principal .file-action-button {
+    background-color: rgba(255, 255, 255, 0.1);
+  }
+
+  .mensagem__outros .file-action-button {
+    background-color: rgba(100, 100, 100, 0.1);
+  }
+
+  .mensagem__principal .file-action-button:hover {
+    background-color: rgba(255, 255, 255, 0.3);
+  }
+
+  .mensagem__outros .file-action-button:hover {
+    background-color: rgba(100, 100, 100, 0.3);
+  }
+
+  .file-action-button {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-left: 12px;
+    cursor: pointer;
+    padding: 5px;
+    border-radius: 5px;
+    transition: background-color 150ms ease-in-out;
+  }
+
+  .file-action-button a {
+    margin: 0
+  }
+
   .fade-enter-active, .fade-leave-active {
     transition: opacity .5s;
   }
@@ -145,15 +210,19 @@ export default {
   .anexo-container svg{
     font-size: 2rem;
   }
-  .anexo-container audio{
+  
+  .anexo-mensagem audio{
     outline: none;
     width: 100%;
+    margin-bottom: 5px;
   }
-  .anexo-container video{
+  
+  .anexo-mensagem video{
     flex: 1;
     width: 100%;
     max-width: 350px;
     cursor: pointer;
+    margin-bottom: 5px;
   }
 
   .anexos-links-container{
@@ -193,6 +262,7 @@ export default {
     justify-content: center;
     align-items: center;
     flex-direction: column;
+    width: 100%;
   }
   
   .alert-danger {
@@ -222,4 +292,4 @@ export default {
   .doc {
     color: #006bc9
   }
-</style>
+</style>