vue-intergrall-plugins 0.0.232 → 0.0.233

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

@@ -2321,6 +2321,13 @@ var mixin_1 = mixin;function returnMessageWithHexa(originalMessage) {
 
   return output;
 }
+function formataData(data) {
+  if (!data || data == '1111-11-11') return '';
+  data = data.split("-");
+  data = data.reverse();
+  data = data.join("/");
+  return data;
+}
 function formataDataHora(dataHora, origem, cortarSegundos, dicionario) {
   dicionario = dicionario ? dicionario : {
     msg_divisao_data_hora: ' - '
@@ -10588,8 +10595,7 @@ var __vue_component__$h = /*#__PURE__*/normalizeComponent({
   staticRenderFns: __vue_staticRenderFns__$c
 }, __vue_inject_styles__$c, __vue_script__$c, __vue_scope_id__$c, __vue_is_functional_template__$c, __vue_module_identifier__$c, false, undefined, createInjectorSSR, undefined);
 
-var InteratividadePopup = __vue_component__$h;//
-var script$b = {
+var InteratividadePopup = __vue_component__$h;var script$b = {
   components: {
     InteratividadePopup: InteratividadePopup
   },
@@ -10604,6 +10610,11 @@ var script$b = {
       type: Object,
       required: true
     },
+    infoCanal: {
+      type: [Object, Array],
+      required: false,
+      default: {}
+    },
     dominio: {
       type: String,
       required: true
@@ -10617,7 +10628,35 @@ var script$b = {
       required: false
     }
   },
+  computed: {
+    situation: function situation() {
+      try {
+        var SITUACAO = this.infoCanal.SITUACAO;
+        return SITUACAO ? SITUACAO : null;
+      } catch (e) {
+        console.error("Erro ao gerar a situacao do atendimento");
+        console.error(e);
+      }
+    },
+    deadline: function deadline() {
+      try {
+        var _this$infoCanal = this.infoCanal,
+            PRAZO = _this$infoCanal.PRAZO,
+            NOME_CAMPO_PRAZO = _this$infoCanal.NOME_CAMPO_PRAZO;
+        return {
+          text: PRAZO ? formataData(PRAZO) : "---",
+          title: NOME_CAMPO_PRAZO ? NOME_CAMPO_PRAZO : this.dictionary.tit_prazo
+        };
+      } catch (e) {
+        console.error("Erro ao gerar o prazo do atendimento");
+        console.error(e);
+        return {};
+      }
+    }
+  },
   mounted: function mounted() {
+    console.log(this.infoCanal);
+
     if (this.validateInterativity()) {
       this.verifyInfoAditional();
     }
@@ -10673,6 +10712,15 @@ var script$b = {
         console.error("Erro ao pegar o objeto interatividade formulario");
         console.error(e);
       }
+    },
+    verificaInfos: function verificaInfos(text) {
+      if (typeof text === 'string') {
+        return text;
+      }
+
+      if (_typeof(text) === 'object') {
+        return text.desc;
+      }
     }
   }
 };/* script */
@@ -10688,16 +10736,16 @@ var __vue_render__$b = function __vue_render__() {
 
   return _c('div', {
     staticClass: "interatividade"
-  }, [_vm.informacao.length ? [_vm._ssrNode("<div class=\"interatividade-form-header\" data-v-7b989966>" + _vm._ssrEscape("\n      " + _vm._s(_vm.dictionary.msg_abertura_reclamacao) + "\n    ") + "</div> "), _vm._ssrNode("<div class=\"interatividade-form-body\" data-v-7b989966>", "</div>", [_vm._ssrNode(_vm._ssrList(_vm.informacao, function (form) {
-    return "<div class=\"interatividade-info-form\" data-v-7b989966>" + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-titulo-form\" data-v-7b989966>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO)) + "</p>" : "<!---->") + " " + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-description-form\" data-v-7b989966>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div>";
-  }) + " " + (_vm.informacaoAdicional.length ? "<div class=\"interatividade-form-header\" data-v-7b989966>" + _vm._ssrEscape("\n        " + _vm._s(_vm.dictionary.msg_info_adicional) + "\n      ") + "</div>" : "<!---->") + " <div class=\"interatividade-form-body\" data-v-7b989966>" + _vm._ssrList(_vm.informacaoAdicional, function (form) {
-    return "<div class=\"interatividade-add-info-form\" data-v-7b989966><div class=\"divisor-form-info-aditional\" data-v-7b989966><div class=\"info-aditional\" data-v-7b989966>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-titulo-form\" data-v-7b989966>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO + ': ')) + "</p>" : "<!---->") + "</div> <div class=\"info-aditional\" data-v-7b989966>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-description-form\" data-v-7b989966>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div></div></div>";
-  }) + "</div> <h3 class=\"m-5 text-bold\" data-v-7b989966>" + _vm._ssrEscape(_vm._s("Anexos")) + "</h3> "), _vm._ssrNode("<div class=\"d-flex flex-wrap align-items-center\" data-v-7b989966>", "</div>", _vm._l(_vm.anexos, function (ref, fileIndex) {
+  }, [_vm._ssrNode((Object.keys(_vm.infoCanal).length > 0 ? "<div data-v-61f7a677><div class=\"d-flex overflow-hidden mt-10 w-100 d-flex flex-wrap\" data-v-61f7a677>" + (_vm.situation || _vm.deadline.text ? "<div class=\"d-flex-center flex-column w-100 border-radius-10 border-1 bg-dark-white-2 border-color-gray p-10 mb-10\"" + _vm._ssrStyle(null, "" + (_vm.situation && _vm.situation.cor ? "border: 1px solid " + _vm.situation.cor : ''), null) + " data-v-61f7a677><div class=\"d-flex w-100 mb-5\" data-v-61f7a677>" + (_vm.situation ? "<strong class=\"text-ellipsis text-left fs-_85\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(_vm.dictionary.chip_situacao + ":")) + "</strong>" : "<!---->") + " " + (_vm.situation ? "<span class=\"ml-5 text-left fs-_85 text-shadow\"" + _vm._ssrStyle(null, "color: " + _vm.situation.cor, null) + " data-v-61f7a677>" + _vm._ssrEscape(_vm._s(_vm.verificaInfos(_vm.situation))) + "</span>" : "<!---->") + "</div> " + (_vm.deadline.text ? "<div class=\"d-flex w-100\" data-v-61f7a677><strong class=\"text-ellipsis text-left fs-_75\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(_vm.deadline.title + ":")) + "</strong> <span class=\"ml-5 text-nowrap text-left fs-_75\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(_vm.deadline.text)) + "</span></div>" : "<!---->") + "</div>" : "<!---->") + "</div></div>" : "<!---->") + " "), _vm.informacao.length ? [_vm._ssrNode("<div class=\"interatividade-form-header\" data-v-61f7a677>" + _vm._ssrEscape("\n      " + _vm._s(_vm.dictionary.msg_abertura_reclamacao) + "\n    ") + "</div> "), _vm._ssrNode("<div class=\"interatividade-form-body\" data-v-61f7a677>", "</div>", [_vm._ssrNode(_vm._ssrList(_vm.informacao, function (form) {
+    return "<div class=\"interatividade-info-form\" data-v-61f7a677>" + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-titulo-form\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO)) + "</p>" : "<!---->") + " " + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-description-form\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div>";
+  }) + " " + (_vm.informacaoAdicional.length ? "<div class=\"interatividade-form-header\" data-v-61f7a677>" + _vm._ssrEscape("\n        " + _vm._s(_vm.dictionary.msg_info_adicional) + "\n      ") + "</div>" : "<!---->") + " <div class=\"interatividade-form-body\" data-v-61f7a677>" + _vm._ssrList(_vm.informacaoAdicional, function (form) {
+    return "<div class=\"interatividade-add-info-form\" data-v-61f7a677><div class=\"divisor-form-info-aditional\" data-v-61f7a677><div class=\"info-aditional\" data-v-61f7a677>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-titulo-form\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO + ': ')) + "</p>" : "<!---->") + "</div> <div class=\"info-aditional\" data-v-61f7a677>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-description-form\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div></div></div>";
+  }) + "</div> <h3 class=\"m-5 text-bold\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s("Anexos")) + "</h3> "), _vm._ssrNode("<div class=\"d-flex flex-wrap align-items-center\" data-v-61f7a677>", "</div>", _vm._l(_vm.anexos, function (ref, fileIndex) {
     var name = ref.name;
     var type = ref.type;
     var mkuDownload = ref.mkuDownload;
     var mku = ref.mku;
-    return _vm._ssrNode("<div class=\"mb-5 mx-5 d-flex\" data-v-7b989966>", "</div>", [!type ? _vm._ssrNode("<img" + _vm._ssrAttr("src", _vm.dominio + "/callcenter/docs.php?mku=" + mku) + _vm._ssrAttr("alt", name) + _vm._ssrAttr("title", name) + " class=\"box-shadow max-w-75px max-h-75px cursor-pointer\" data-v-7b989966>", "</img>") : _c('fa-icon', {
+    return _vm._ssrNode("<div class=\"mb-5 mx-5 d-flex\" data-v-61f7a677>", "</div>", [!type ? _vm._ssrNode("<img" + _vm._ssrAttr("src", _vm.dominio + "/callcenter/docs.php?mku=" + mku) + _vm._ssrAttr("alt", name) + _vm._ssrAttr("title", name) + " class=\"box-shadow max-w-75px max-h-75px cursor-pointer\" data-v-61f7a677>", "</img>") : _c('fa-icon', {
       class: _vm.returnCurrentClass(type),
       attrs: {
         "icon": _vm.returnCurrentIcon(type),
@@ -10708,12 +10756,12 @@ var __vue_render__$b = function __vue_render__() {
           return _vm.openFile(mku, type);
         }
       }
-    }), _vm._ssrNode(" "), _vm._ssrNode("<a" + _vm._ssrAttr("href", _vm.dominio + "/callcenter/docs.php?mku=" + mkuDownload) + _vm._ssrAttr("download", "" + name) + " target=\"_blank\" rel=\"noreferrer noopener\"" + _vm._ssrAttr("title", "Download " + name) + " class=\"d-flex align-items-end ml-3 text-dark\" data-v-7b989966>", "</a>", [_c('fa-icon', {
+    }), _vm._ssrNode(" "), _vm._ssrNode("<a" + _vm._ssrAttr("href", _vm.dominio + "/callcenter/docs.php?mku=" + mkuDownload) + _vm._ssrAttr("download", "" + name) + " target=\"_blank\" rel=\"noreferrer noopener\"" + _vm._ssrAttr("title", "Download " + name) + " class=\"d-flex align-items-end ml-3 text-dark\" data-v-61f7a677>", "</a>", [_c('fa-icon', {
       attrs: {
         "icon": ['fas', 'download']
       }
     })], 1)], 2);
-  }), 0), _vm._ssrNode(" " + (!_vm.anexos.length ? "<p class=\"text-center mb-5\" data-v-7b989966>" + _vm._ssrEscape(_vm._s("Sem anexos")) + "</p>" : "<!---->"))], 2)] : _vm._e()], 2);
+  }), 0), _vm._ssrNode(" " + (!_vm.anexos.length ? "<p class=\"text-center mb-5\" data-v-61f7a677>" + _vm._ssrEscape(_vm._s("Sem anexos")) + "</p>" : "<!---->"))], 2)] : _vm._e()], 2);
 };
 
 var __vue_staticRenderFns__$b = [];
@@ -10721,8 +10769,8 @@ var __vue_staticRenderFns__$b = [];
 
 var __vue_inject_styles__$b = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-7b989966_0", {
-    source: ".show-x-enter-active[data-v-7b989966],.show-x-leave-enter[data-v-7b989966]{opacity:1;transform:translateX(0);transition:all .2s linear}.show-x-enter[data-v-7b989966],.show-x-leave-to[data-v-7b989966]{opacity:0;transform:translateX(5%)}.divisor-form-info-aditional[data-v-7b989966]{display:flex;align-items:center;justify-content:space-around}.info-aditional[data-v-7b989966]{border-bottom:1px solid #ccc;width:49%}.interatividade-form-header[data-v-7b989966]{background-color:#efefef;margin-top:5px;border-top-right-radius:10px;border-top-left-radius:10px;padding-left:10px;padding-right:10px;padding-top:5px;padding-bottom:5px;justify-content:space-between;display:flex;color:#333;font-weight:700;font-size:.9rem}.interatividade-form-body[data-v-7b989966]{padding:0 10px;background:#fff;border-right:1px solid #efefef;border-left:1px solid #efefef;border-bottom-left-radius:10px;border-bottom-right-radius:10px;padding-bottom:10px}.interatividade[data-v-7b989966]{margin:10px 0}.interatividade-titulo-form[data-v-7b989966]{white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden;max-width:100%;margin:0;padding:0;padding-top:5px}.interatividade-description-form[data-v-7b989966]{overflow:hidden;max-width:100%;margin:0;padding:0}.interatividade-lista[data-v-7b989966]{width:100%;min-width:200px;border-radius:15px;background-color:#fff;color:#333;margin:10px 0}.interatividade-lista-conteudo[data-v-7b989966]{padding:10px;border-bottom:1px solid #d7d7d7}.interatividade-lista-titulo[data-v-7b989966]{font-weight:700;font-size:1.2em;margin-bottom:10px}.interatividade-lista-rodape[data-v-7b989966]{color:#818181;margin-top:5px}.interatividade-lista-link[data-v-7b989966]{width:100%;text-align:center;padding:10px;color:#006eff;cursor:pointer;transition:color .2s ease-in-out}.interatividade-lista-link[data-v-7b989966]:hover{color:#00628f}.text-blue[data-v-7b989966]{color:#294ed3}.text-red[data-v-7b989966]{color:#e74c3c}.text-dark[data-v-7b989966]{color:#333}.ml-3[data-v-7b989966]{margin-left:3px}.fs-2[data-v-7b989966]{font-size:2rem}.flex-wrap[data-v-7b989966]{-ms-flex-wrap:wrap;flex-wrap:wrap}.align-items-center[data-v-7b989966]{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.d-flex[data-v-7b989966]{display:-webkit-box;display:-ms-flexbox;display:flex}.align-items-end[data-v-7b989966]{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.text-bold[data-v-7b989966]{font-weight:700}.m-5[data-v-7b989966]{margin:5px}.mb-5[data-v-7b989966]{margin-bottom:5px}.mx-5[data-v-7b989966]{margin-left:5px;margin-right:5px}.cursor-pointer[data-v-7b989966]{cursor:pointer}",
+  inject("data-v-61f7a677_0", {
+    source: ".show-x-enter-active[data-v-61f7a677],.show-x-leave-enter[data-v-61f7a677]{opacity:1;transform:translateX(0);transition:all .2s linear}.show-x-enter[data-v-61f7a677],.show-x-leave-to[data-v-61f7a677]{opacity:0;transform:translateX(5%)}.divisor-form-info-aditional[data-v-61f7a677]{display:flex;align-items:center;justify-content:space-around}.info-aditional[data-v-61f7a677]{border-bottom:1px solid #ccc;width:49%}.interatividade-form-header[data-v-61f7a677]{background-color:#efefef;margin-top:5px;border-top-right-radius:10px;border-top-left-radius:10px;padding-left:10px;padding-right:10px;padding-top:5px;padding-bottom:5px;justify-content:space-between;display:flex;color:#333;font-weight:700;font-size:.9rem}.interatividade-form-body[data-v-61f7a677]{padding:0 10px;background:#fff;border-right:1px solid #efefef;border-left:1px solid #efefef;border-bottom-left-radius:10px;border-bottom-right-radius:10px;padding-bottom:10px}.interatividade[data-v-61f7a677]{margin:10px 0}.interatividade-titulo-form[data-v-61f7a677]{white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden;max-width:100%;margin:0;padding:0;padding-top:5px}.interatividade-description-form[data-v-61f7a677]{overflow:hidden;max-width:100%;margin:0;padding:0}.interatividade-lista[data-v-61f7a677]{width:100%;min-width:200px;border-radius:15px;background-color:#fff;color:#333;margin:10px 0}.interatividade-lista-conteudo[data-v-61f7a677]{padding:10px;border-bottom:1px solid #d7d7d7}.interatividade-lista-titulo[data-v-61f7a677]{font-weight:700;font-size:1.2em;margin-bottom:10px}.interatividade-lista-rodape[data-v-61f7a677]{color:#818181;margin-top:5px}.interatividade-lista-link[data-v-61f7a677]{width:100%;text-align:center;padding:10px;color:#006eff;cursor:pointer;transition:color .2s ease-in-out}.interatividade-lista-link[data-v-61f7a677]:hover{color:#00628f}.text-blue[data-v-61f7a677]{color:#294ed3}.text-red[data-v-61f7a677]{color:#e74c3c}.text-dark[data-v-61f7a677]{color:#333}.ml-3[data-v-61f7a677]{margin-left:3px}.fs-2[data-v-61f7a677]{font-size:2rem}.flex-wrap[data-v-61f7a677]{flex-wrap:wrap}.align-items-center[data-v-61f7a677]{align-items:center}.d-flex[data-v-61f7a677]{display:flex}.align-items-end[data-v-61f7a677]{align-items:flex-end}.flex-column[data-v-61f7a677]{flex-direction:column}.text-bold[data-v-61f7a677]{font-weight:700}.m-5[data-v-61f7a677]{margin:5px}.mb-5[data-v-61f7a677]{margin-bottom:5px}.mx-5[data-v-61f7a677]{margin-left:5px;margin-right:5px}.cursor-pointer[data-v-61f7a677]{cursor:pointer}.bg-dark-white-2[data-v-61f7a677]{background-color:#f7f7f7}.border-radius-10[data-v-61f7a677]{border-radius:10px}.w-100[data-v-61f7a677]{width:100%}.overflow-hidden[data-v-61f7a677]{overflow:hidden}.mt-10[data-v-61f7a677]{margin-top:10px}.flex-wrap[data-v-61f7a677]{flex-wrap:wrap}.d-flex[data-v-61f7a677]{display:flex}.p-10[data-v-61f7a677]{padding:10px}.mb-5[data-v-61f7a677]{margin-bottom:5px}.mb-10[data-v-61f7a677]{margin-bottom:10px}.mx-10[data-v-61f7a677]{margin-left:10px;margin-right:10px}.d-flex-center[data-v-61f7a677]{display:flex;justify-content:center;align-items:center}.fs-_85[data-v-61f7a677]{font-size:.85rem}.text-ellipsis[data-v-61f7a677]{text-overflow:ellipsis}.text-left[data-v-61f7a677]{text-align:left}.text-ellipsis[data-v-61f7a677]{white-space:nowrap;overflow:hidden}.ml-5[data-v-61f7a677]{margin-left:5px}.text-shadow[data-v-61f7a677]{text-shadow:0 0 #000}",
     map: undefined,
     media: undefined
   });
@@ -10730,10 +10778,10 @@ var __vue_inject_styles__$b = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$b = "data-v-7b989966";
+var __vue_scope_id__$b = "data-v-61f7a677";
 /* module identifier */
 
-var __vue_module_identifier__$b = "data-v-7b989966";
+var __vue_module_identifier__$b = "data-v-61f7a677";
 /* functional template */
 
 var __vue_is_functional_template__$b = false;
@@ -11613,6 +11661,14 @@ var script$5 = {
       center: {},
       marker: {},
       infos: [],
+      infoCanalTeste: {
+        PRAZO: "2022-05-05",
+        SITUACAO: {
+          cod: "3",
+          desc: "Em analise pelo fornecedor",
+          cor: "#03A64A"
+        }
+      },
       mapOptions: {
         zoomControl: true,
         mapTypeControl: false,
@@ -11783,6 +11839,7 @@ var __vue_render__$5 = function __vue_render__() {
     attrs: {
       "interatividade": _vm.interatividade,
       "dominio": _vm.dominio,
+      "infoCanal": _vm.infoCanalTeste,
       "anexos": _vm.anexos,
       "dictionary": _vm.dictionary
     }
@@ -12050,7 +12107,7 @@ var __vue_staticRenderFns__$5 = [];
 
 var __vue_inject_styles__$5 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-8e87a87a_0", {
+  inject("data-v-cfb6e160_0", {
     source: ":root{--message-color:#373737}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}.mensagem{padding:14px 7px;border-radius:2.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:.85rem;word-break:break-word}.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:#fff}.mensagem__principal>.mensagem .horario-envio{color:#fff}.mensagem__principal>.mensagem .autor-mensagem{right:5px;color:#fff}.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:.7em}.info-mapa li.url{font-size:.7em}.tooltip-list{margin:0;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}",
     map: undefined,
     media: undefined
@@ -12062,7 +12119,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-8e87a87a";
+var __vue_module_identifier__$5 = "data-v-cfb6e160";
 /* functional template */
 
 var __vue_is_functional_template__$5 = false;
@@ -12482,7 +12539,7 @@ var __vue_render__$1 = function __vue_render__() {
     key: "file-loader"
   }) : _c('div', {
     key: "file-container",
-    staticClass: "mb-5 mx-5 d-flex flex-wrap align-items-end"
+    staticClass: "mb-5 mx-5 d-flex flex-wrap align-items-center"
   }, [_vm.imageURL ? _c('span', {
     staticClass: "anexo-img box-shadow",
     attrs: {
@@ -12499,7 +12556,7 @@ var __vue_render__$1 = function __vue_render__() {
       "alt": _vm.filename
     }
   })]) : _c('span', {
-    staticClass: "anexo-icone",
+    staticClass: "anexo-icone mr-5",
     class: [_vm.iconClass],
     attrs: {
       "title": "Visualizar " + _vm.filename,
@@ -12533,8 +12590,8 @@ var __vue_staticRenderFns__$1 = [];
 
 var __vue_inject_styles__$1 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-4cac2afe_0", {
-    source: ".anexo-img[data-v-4cac2afe]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;overflow:hidden;background-color:rgba(0,0,0,.2);border-radius:2.5px;cursor:pointer;opacity:.9;transition:opacity 150ms}.anexo-img[data-v-4cac2afe]:hover{opacity:1}.anexo-img img[data-v-4cac2afe]{width:95%;max-height:50px}.box-shadow[data-v-4cac2afe]{-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)}.anexo-icone[data-v-4cac2afe]:hover{opacity:1}.anexo-icone[data-v-4cac2afe]:visited{color:inherit}.anexo-icone svg[data-v-4cac2afe]{font-size:30px;z-index:1}.anexo-icone.pdf[data-v-4cac2afe]{position:relative}.anexo-icone.pdf svg[data-v-4cac2afe]{color:#e74c3c}.anexo-icone.pdf[data-v-4cac2afe]::after{content:\"\";position:absolute;bottom:2px;transform:translateY(2px);width:20px;height:20px;background-color:#fff}.anexo-icone.doc[data-v-4cac2afe]{color:#15517f}.anexo-icone.doc[data-v-4cac2afe]::after{content:\"\";position:absolute;width:20px;height:20px;background-color:#fff}.anexo-icone[data-v-4cac2afe]{opacity:.9;transition:opacity .2s;color:#222;cursor:pointer;display:flex;justify-content:center;align-items:center}.align-items-end[data-v-4cac2afe]{align-items:flex-end}.flex-wrap[data-v-4cac2afe]{flex-wrap:wrap}.d-flex[data-v-4cac2afe]{display:flex}.mb-5[data-v-4cac2afe]{margin-bottom:5px}.mx-5[data-v-4cac2afe]{margin-left:5px;margin-right:5px}",
+  inject("data-v-df17eba8_0", {
+    source: ".mr-5[data-v-df17eba8]{margin-right:5px}.anexo-img[data-v-df17eba8]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;overflow:hidden;background-color:rgba(0,0,0,.2);border-radius:2.5px;cursor:pointer;opacity:.9;transition:opacity 150ms}.anexo-img[data-v-df17eba8]:hover{opacity:1}.anexo-img img[data-v-df17eba8]{width:95%;max-height:50px}.box-shadow[data-v-df17eba8]{-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)}.anexo-icone[data-v-df17eba8]{display:flex;justify-content:center;align-items:center;font-size:30px;cursor:pointer}.anexo-icone[data-v-df17eba8]:hover{opacity:1}.anexo-icone[data-v-df17eba8]:visited{color:inherit}.anexo-icone.pdf[data-v-df17eba8]{position:relative}.anexo-icone.pdf svg[data-v-df17eba8]{color:#e74c3c}.anexo-icone.pdf[data-v-df17eba8]::after{content:\"\";position:absolute;bottom:2px;transform:translateY(2px);width:20px;height:20px}.anexo-icone.doc[data-v-df17eba8]{color:#15517f}.anexo-icone.doc[data-v-df17eba8]::after{content:\"\";position:absolute;width:20px;height:20px}.align-items-center[data-v-df17eba8]{align-items:center}.flex-wrap[data-v-df17eba8]{flex-wrap:wrap}.d-flex[data-v-df17eba8]{display:flex}.mb-5[data-v-df17eba8]{margin-bottom:5px}.mx-5[data-v-df17eba8]{margin-left:5px;margin-right:5px}",
     map: undefined,
     media: undefined
   });
@@ -12542,10 +12599,10 @@ var __vue_inject_styles__$1 = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$1 = "data-v-4cac2afe";
+var __vue_scope_id__$1 = "data-v-df17eba8";
 /* module identifier */
 
-var __vue_module_identifier__$1 = "data-v-4cac2afe";
+var __vue_module_identifier__$1 = "data-v-df17eba8";
 /* functional template */
 
 var __vue_is_functional_template__$1 = false;

package/package.json

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

package/src/lib-components/Email/EmailFile.vue

@@ -1,13 +1,13 @@
 <template>
   <transition-group name="fade" mode="out-in">
     <VueLoader v-if="isLoading" key="file-loader" />
-    <div v-else key="file-container" class="mb-5 mx-5 d-flex flex-wrap align-items-end">
+    <div v-else key="file-container" class="mb-5 mx-5 d-flex flex-wrap align-items-center">
       <span v-if="imageURL" class="anexo-img box-shadow" @click="openWindowFromURL(imageURL, true)" :title="`Visualizar ${filename}`">
         <img :src="`${imageURL}`" :alt="filename" />
       </span>
       <span 
         v-else
-        class="anexo-icone"
+        class="anexo-icone mr-5"
         :class="[iconClass]"
         @click="openWindowFromURL(docURL, false)"
         :title="`Visualizar ${filename}`"
@@ -43,6 +43,9 @@ export default {
 }
 </script>
 <style scoped>
+.mr-5 {
+  margin-right: 5px;
+}
 .anexo-img {
   display: flex;
   justify-content: center;
@@ -68,21 +71,24 @@ export default {
   -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
   box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
 }
+.anexo-icone {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 30px;
+  cursor: pointer;
+}
 .anexo-icone:hover {
-  opacity: 1;
+  opacity: 1
 }
 .anexo-icone:visited {
   color: inherit;
 }
-.anexo-icone svg {
-  font-size: 30px;
-  z-index: 1;
-}
 .anexo-icone.pdf {
   position: relative;
 }
-.anexo-icone.pdf svg{
-   color: #E74C3C;
+.anexo-icone.pdf svg {
+  color: rgb(231, 76, 60);
 }
 .anexo-icone.pdf::after {
   content: "";
@@ -91,7 +97,6 @@ export default {
   transform: translateY(2px);
   width: 20px;
   height: 20px;
-  background-color: #FFF;
 }
 .anexo-icone.doc {
   color: #15517F; 
@@ -101,20 +106,10 @@ export default {
   position: absolute;
   width: 20px;
   height: 20px;
-  background-color: #FFF;
 }
-.anexo-icone {
-  opacity: .9;
-  transition: opacity 200ms;
-  color: #222;
-  cursor: pointer;
-  display: flex;
-  justify-content: center;
+.align-items-center {
   align-items: center;
 }
-.align-items-end {
-  align-items: flex-end;
-}
 .flex-wrap {
   flex-wrap: wrap;
 }

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

@@ -4,6 +4,7 @@
         v-if="interatividade && validateInterativity()"
         :interatividade="interatividade"
         :dominio="dominio"
+        :infoCanal="infoCanalTeste"
         :anexos="anexos"
         :dictionary="dictionary"
       />
@@ -89,6 +90,7 @@ export default {
       center: {},
       marker: {},
       infos: [],
+      infoCanalTeste: {PRAZO: "2022-05-05", SITUACAO: {cod: "3", desc: "Em analise pelo fornecedor", cor: "#03A64A"}},
       mapOptions: {
         zoomControl: true,
         mapTypeControl: false,

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

@@ -1,5 +1,25 @@
 <template>
   <div class="interatividade">
+    <div v-if="Object.keys(infoCanal).length > 0">
+      <!-- CHIPS -->
+      <div class="d-flex overflow-hidden mt-10 w-100 d-flex flex-wrap">
+        <div 
+          v-if="situation || deadline.text"
+          class="d-flex-center flex-column w-100 border-radius-10 border-1 bg-dark-white-2 border-color-gray p-10 mb-10" 
+          :style="`${situation && situation.cor ? `border: 1px solid ${situation.cor}` : ''}`"
+        >
+          <div class="d-flex w-100 mb-5">
+            <strong v-if="situation" class="text-ellipsis text-left fs-_85" v-text="`${dictionary.chip_situacao}:`"></strong>
+            <span v-if="situation" :style="`color: ${situation.cor}`" class="ml-5 text-left fs-_85 text-shadow" v-text="verificaInfos(situation)"></span>
+          </div>
+          <div class="d-flex w-100" v-if="deadline.text">
+            <strong v-text="`${deadline.title}:`" class="text-ellipsis text-left fs-_75"></strong>
+            <span class="ml-5 text-nowrap text-left fs-_75" v-text="deadline.text"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- TABELA INTERATIVIDADE HO -->
     <template v-if="informacao.length">
       <div class="interatividade-form-header">
         {{dictionary.msg_abertura_reclamacao}}
@@ -41,6 +61,7 @@
 </template>
 <script>
 import InteratividadePopup from './InteratividadePopup'
+import { formataData } from '../../services/textFormatting';
 
 export default {
   components: {InteratividadePopup},
@@ -55,6 +76,11 @@ export default {
       type: Object,
       required: true
     },
+    infoCanal: {
+      type: [Object, Array],
+      required: false,
+      default: {}
+    },
     dominio: {
       type: String,
       required: true
@@ -68,7 +94,29 @@ export default {
       required: false
     }
   },
+  computed: {
+    situation() {
+      try {
+        const { SITUACAO } = this.infoCanal
+        return SITUACAO ? SITUACAO : null
+      }catch(e) {
+        console.error("Erro ao gerar a situacao do atendimento")
+        console.error(e)
+      }
+    },
+    deadline() {
+      try {
+        const { PRAZO, NOME_CAMPO_PRAZO } = this.infoCanal
+        return { text: PRAZO ? formataData(PRAZO) : "---", title: NOME_CAMPO_PRAZO ? NOME_CAMPO_PRAZO : this.dictionary.tit_prazo }
+      }catch(e) {
+        console.error("Erro ao gerar o prazo do atendimento")
+        console.error(e)
+        return {}
+      }
+    },
+  },
   mounted(){
+    console.log(this.infoCanal)
     if(this.validateInterativity()){
       this.verifyInfoAditional();
     }
@@ -116,6 +164,14 @@ export default {
           console.error(e)
       }
     },
+    verificaInfos(text){
+      if(typeof text === 'string'){
+        return text;
+      }
+      if(typeof text === 'object'){
+        return text.desc;
+      }
+    }
   }
 }
 </script>
@@ -233,24 +289,20 @@ export default {
     font-size: 2rem;
   }
   .flex-wrap {
-    -ms-flex-wrap: wrap;
     flex-wrap: wrap;
   }
   .align-items-center {
-    -webkit-box-align: center;
-    -ms-flex-align: center;
     align-items: center;
   }
   .d-flex {
-    display: -webkit-box;
-    display: -ms-flexbox;
     display: flex;
   }
   .align-items-end {
-    -webkit-box-align: end;
-    -ms-flex-align: end;
     align-items: flex-end;
   }
+  .flex-column {
+    flex-direction: column;
+  }
   .text-bold {
     font-weight: bold;
   }
@@ -267,4 +319,62 @@ export default {
   .cursor-pointer {
     cursor: pointer;
   }
+  .bg-dark-white-2 {
+    background-color: #f7f7f7;
+  }
+  .border-radius-10 {
+    border-radius: 10px;
+  }
+  .w-100 {
+    width: 100%;
+  }
+  .overflow-hidden {
+    overflow: hidden;
+  }
+  .mt-10 {
+    margin-top: 10px;
+  }
+  .flex-wrap {
+    flex-wrap: wrap;
+  }
+  .d-flex {
+    display: flex;
+  }
+  .p-10 {
+  padding: 10px;
+  }
+  .mb-5 {
+    margin-bottom: 5px;
+  }
+  .mb-10 {
+    margin-bottom: 10px;
+  }
+  .mx-10 {
+    margin-left: 10px;
+    margin-right: 10px;
+  }
+  .d-flex-center {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .fs-_85 {
+    font-size: .85rem;
+  }
+  .text-ellipsis {
+    text-overflow: ellipsis;
+  }
+  .text-left {
+    text-align: left;
+  }
+  .text-ellipsis {
+    white-space: nowrap;
+    overflow: hidden;
+  }
+  .ml-5 {
+    margin-left: 5px;
+  }
+  .text-shadow {
+    text-shadow: 0 0 #000;
+  }
 </style>