vue-intergrall-plugins 0.0.206 → 0.0.207

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

@@ -10377,17 +10377,35 @@ var script$9 = {
       type: Object,
       required: true
     },
+    anexos: {
+      type: Array,
+      required: false
+    },
     dictionary: {
       type: Object,
       required: true
     }
   },
   mounted: function mounted() {
+    console.log(this.anexos);
+
     if (this.validateInterativity()) {
       this.verifyInfoAditional();
     }
   },
   methods: {
+    returnCurrentClass: function returnCurrentClass(isDoc) {
+      return "fs-2 cursor-pointer ".concat(isDoc == 'pdf' ? 'text-red' : 'text-blue');
+    },
+    returnCurrentIcon: function returnCurrentIcon(isDoc) {
+      return isDoc == 'pdf' ? ['fas', 'file-pdf'] : ['fas', 'file-alt'];
+    },
+    openFile: function openFile(url, isImg) {
+      var width = window.innerWidth;
+      var height = window.innerHeight;
+      var options = !isImg ? "width=".concat(width, ",height=").concat(height) : "width=auto,height=auto";
+      window.open(url, "card-file", options);
+    },
     validateInterativity: function validateInterativity() {
       try {
         if (this.interatividade.formulario && this.interatividade.formulario.length) {
@@ -10447,11 +10465,32 @@ var __vue_render__$9 = function __vue_render__() {
 
   return _c('div', {
     staticClass: "interatividade"
-  }, [_vm._ssrNode(_vm.informacao.length ? "<div class=\"interatividade-form-header\" data-v-7c3f68fa>" + _vm._ssrEscape("\n      " + _vm._s(_vm.dictionary.msg_abertura_reclamacao) + "\n    ") + "</div> <div class=\"interatividade-form-body\" data-v-7c3f68fa>" + _vm._ssrList(_vm.informacao, function (form) {
-    return "<div class=\"interatividade-info-form\" data-v-7c3f68fa>" + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-titulo-form\" data-v-7c3f68fa>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO)) + "</p>" : "<!---->") + " " + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-description-form\" data-v-7c3f68fa>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div>";
-  }) + " " + (_vm.informacaoAdicional.length ? "<div class=\"interatividade-form-header\" data-v-7c3f68fa>" + _vm._ssrEscape("\n        " + _vm._s(_vm.dictionary.msg_info_adicional) + "\n      ") + "</div>" : "<!---->") + " <div class=\"interatividade-form-body\" data-v-7c3f68fa>" + _vm._ssrList(_vm.informacaoAdicional, function (form) {
-    return "<div class=\"interatividade-add-info-form\" data-v-7c3f68fa><div class=\"divisor-form-info-aditional\" data-v-7c3f68fa><div class=\"info-aditional\" data-v-7c3f68fa>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-titulo-form\" data-v-7c3f68fa>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO + ': ')) + "</p>" : "<!---->") + "</div> <div class=\"info-aditional\" data-v-7c3f68fa>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-description-form\" data-v-7c3f68fa>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div></div></div>";
-  }) + "</div></div>" : "<!---->")]);
+  }, [_vm.informacao.length ? [_vm._ssrNode("<div class=\"interatividade-form-header\" data-v-0f484580>" + _vm._ssrEscape("\n      " + _vm._s(_vm.dictionary.msg_abertura_reclamacao) + "\n    ") + "</div> "), _vm._ssrNode("<div class=\"interatividade-form-body\" data-v-0f484580>", "</div>", [_vm._ssrNode(_vm._ssrList(_vm.informacao, function (form) {
+    return "<div class=\"interatividade-info-form\" data-v-0f484580>" + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-titulo-form\" data-v-0f484580>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO)) + "</p>" : "<!---->") + " " + (form.TIPO_TEXTO < 1000 ? "<p class=\"interatividade-description-form\" data-v-0f484580>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div>";
+  }) + " " + (_vm.informacaoAdicional.length ? "<div class=\"interatividade-form-header\" data-v-0f484580>" + _vm._ssrEscape("\n        " + _vm._s(_vm.dictionary.msg_info_adicional) + "\n      ") + "</div>" : "<!---->") + " <div class=\"interatividade-form-body\" data-v-0f484580>" + _vm._ssrList(_vm.informacaoAdicional, function (form) {
+    return "<div class=\"interatividade-add-info-form\" data-v-0f484580><div class=\"divisor-form-info-aditional\" data-v-0f484580><div class=\"info-aditional\" data-v-0f484580>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-titulo-form\" data-v-0f484580>" + _vm._ssrEscape(_vm._s(form.DESC_TIPO_TEXTO + ': ')) + "</p>" : "<!---->") + "</div> <div class=\"info-aditional\" data-v-0f484580>" + (form.TIPO_TEXTO > 999 ? "<p class=\"interatividade-description-form\" data-v-0f484580>" + _vm._ssrEscape(_vm._s(form.TEXTO)) + "</p>" : "<!---->") + "</div></div></div>";
+  }) + "</div> <h3 class=\"m-5 text-bold\" data-v-0f484580>" + _vm._ssrEscape(_vm._s("Anexos")) + "</h3> "), _vm._ssrNode("<div class=\"d-flex flex-wrap align-items-center\" data-v-0f484580>", "</div>", _vm._l(_vm.anexos, function (ref, fileIndex) {
+    var name = ref.name;
+    var url = ref.url;
+    var type = ref.type;
+    var mkuDownload = ref.mkuDownload;
+    return _vm._ssrNode("<div class=\"mb-5 mx-5 d-flex\" data-v-0f484580>", "</div>", [!type ? _vm._ssrNode("<img" + _vm._ssrAttr("src", url) + _vm._ssrAttr("alt", name) + _vm._ssrAttr("title", name) + " class=\"box-shadow max-w-75px max-h-75px cursor-pointer\" data-v-0f484580>", "</img>") : _c('fa-icon', {
+      class: _vm.returnCurrentClass(type),
+      attrs: {
+        "icon": _vm.returnCurrentIcon(type),
+        "title": name
+      },
+      on: {
+        "click": function click($event) {
+          return _vm.openFile(url, type);
+        }
+      }
+    }), _vm._ssrNode(" "), _vm._ssrNode("<a" + _vm._ssrAttr("href", 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-0f484580>", "</a>", [_c('fa-icon', {
+      attrs: {
+        "icon": ['fas', 'download']
+      }
+    })], 1)], 2);
+  }), 0), _vm._ssrNode(" " + (!_vm.anexos.length ? "<p class=\"text-center mb-5\" data-v-0f484580>" + _vm._ssrEscape(_vm._s("Sem anexos")) + "</p>" : "<!---->"))], 2)] : _vm._e()], 2);
 };
 
 var __vue_staticRenderFns__$9 = [];
@@ -10459,8 +10498,8 @@ var __vue_staticRenderFns__$9 = [];
 
 var __vue_inject_styles__$9 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-7c3f68fa_0", {
-    source: ".show-x-enter-active[data-v-7c3f68fa],.show-x-leave-enter[data-v-7c3f68fa]{opacity:1;transform:translateX(0);transition:all .2s linear}.show-x-enter[data-v-7c3f68fa],.show-x-leave-to[data-v-7c3f68fa]{opacity:0;transform:translateX(5%)}.divisor-form-info-aditional[data-v-7c3f68fa]{display:flex;align-items:center;justify-content:space-around}.info-aditional[data-v-7c3f68fa]{border-bottom:1px solid #ccc;width:49%}.interatividade-form-header[data-v-7c3f68fa]{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-7c3f68fa]{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-7c3f68fa]{margin:10px 0}.interatividade-titulo-form[data-v-7c3f68fa]{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-7c3f68fa]{overflow:hidden;max-width:100%;margin:0;padding:0}.interatividade-lista[data-v-7c3f68fa]{width:100%;min-width:200px;border-radius:15px;background-color:#fff;color:#333;margin:10px 0}.interatividade-lista-conteudo[data-v-7c3f68fa]{padding:10px;border-bottom:1px solid #d7d7d7}.interatividade-lista-titulo[data-v-7c3f68fa]{font-weight:700;font-size:1.2em;margin-bottom:10px}.interatividade-lista-rodape[data-v-7c3f68fa]{color:#818181;margin-top:5px}.interatividade-lista-link[data-v-7c3f68fa]{width:100%;text-align:center;padding:10px;color:#006eff;cursor:pointer;transition:color .2s ease-in-out}.interatividade-lista-link[data-v-7c3f68fa]:hover{color:#00628f}",
+  inject("data-v-0f484580_0", {
+    source: ".show-x-enter-active[data-v-0f484580],.show-x-leave-enter[data-v-0f484580]{opacity:1;transform:translateX(0);transition:all .2s linear}.show-x-enter[data-v-0f484580],.show-x-leave-to[data-v-0f484580]{opacity:0;transform:translateX(5%)}.divisor-form-info-aditional[data-v-0f484580]{display:flex;align-items:center;justify-content:space-around}.info-aditional[data-v-0f484580]{border-bottom:1px solid #ccc;width:49%}.interatividade-form-header[data-v-0f484580]{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-0f484580]{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-0f484580]{margin:10px 0}.interatividade-titulo-form[data-v-0f484580]{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-0f484580]{overflow:hidden;max-width:100%;margin:0;padding:0}.interatividade-lista[data-v-0f484580]{width:100%;min-width:200px;border-radius:15px;background-color:#fff;color:#333;margin:10px 0}.interatividade-lista-conteudo[data-v-0f484580]{padding:10px;border-bottom:1px solid #d7d7d7}.interatividade-lista-titulo[data-v-0f484580]{font-weight:700;font-size:1.2em;margin-bottom:10px}.interatividade-lista-rodape[data-v-0f484580]{color:#818181;margin-top:5px}.interatividade-lista-link[data-v-0f484580]{width:100%;text-align:center;padding:10px;color:#006eff;cursor:pointer;transition:color .2s ease-in-out}.interatividade-lista-link[data-v-0f484580]:hover{color:#00628f}.text-blue[data-v-0f484580]{color:#294ed3}.text-red[data-v-0f484580]{color:#e74c3c}.text-dark[data-v-0f484580]{color:#333}.ml-3[data-v-0f484580]{margin-left:3px}.fs-2[data-v-0f484580]{font-size:2rem}.flex-wrap[data-v-0f484580]{-ms-flex-wrap:wrap;flex-wrap:wrap}.align-items-center[data-v-0f484580]{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.d-flex[data-v-0f484580]{display:-webkit-box;display:-ms-flexbox;display:flex}.align-items-end[data-v-0f484580]{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.text-bold[data-v-0f484580]{font-weight:700}.m-5[data-v-0f484580]{margin:5px}.mb-5[data-v-0f484580]{margin-bottom:5px}.mx-5[data-v-0f484580]{margin-left:5px;margin-right:5px}.cursor-pointer[data-v-0f484580]{cursor:pointer}",
     map: undefined,
     media: undefined
   });
@@ -10468,10 +10507,10 @@ var __vue_inject_styles__$9 = function __vue_inject_styles__(inject) {
 /* scoped */
 
 
-var __vue_scope_id__$9 = "data-v-7c3f68fa";
+var __vue_scope_id__$9 = "data-v-0f484580";
 /* module identifier */
 
-var __vue_module_identifier__$9 = "data-v-7c3f68fa";
+var __vue_module_identifier__$9 = "data-v-0f484580";
 /* functional template */
 
 var __vue_is_functional_template__$9 = false;
@@ -11619,6 +11658,7 @@ var __vue_render__$3 = function __vue_render__() {
   }, [_vm.interatividade && _vm.validateInterativity() ? _c('InteratividadeFormulario', {
     attrs: {
       "interatividade": _vm.interatividade,
+      "anexos": _vm.anexos,
       "dictionary": _vm.dictionary
     }
   }) : _c('div', {
@@ -11884,7 +11924,7 @@ var __vue_staticRenderFns__$3 = [];
 
 var __vue_inject_styles__$3 = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-257d4492_0", {
+  inject("data-v-7621b8ba_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.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
@@ -11896,7 +11936,7 @@ var __vue_inject_styles__$3 = function __vue_inject_styles__(inject) {
 var __vue_scope_id__$3 = undefined;
 /* module identifier */
 
-var __vue_module_identifier__$3 = "data-v-257d4492";
+var __vue_module_identifier__$3 = "data-v-7621b8ba";
 /* functional template */
 
 var __vue_is_functional_template__$3 = false;

package/package.json

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

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

@@ -3,6 +3,7 @@
     <InteratividadeFormulario 
         v-if="interatividade && validateInterativity()"
         :interatividade="interatividade"
+        :anexos="anexos"
         :dictionary="dictionary"
       />
     <div v-else class="mensagem" :class="{mapa, 'hist-msg' : histMsg}">

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

@@ -24,6 +24,17 @@
             </div>
           </div>
         </div>
+        <h3 class="m-5 text-bold" v-text="`Anexos`"></h3>
+        <div class="d-flex flex-wrap align-items-center">
+          <div v-for="({ name, url, type, mkuDownload }, fileIndex) in anexos" :key="`file-${fileIndex}`" class="mb-5 mx-5 d-flex">
+            <img class="box-shadow max-w-75px max-h-75px cursor-pointer" @click="openFile(url, type)" v-if="!type" :src="url" :alt="name" :title="name" />
+            <fa-icon v-else :icon="returnCurrentIcon(type)" @click="openFile(url, type)" :class="returnCurrentClass(type)" :title="name" />
+            <a class="d-flex align-items-end ml-3 text-dark" :href="mkuDownload" :download="`${name}`" target="_blank" rel="noreferrer noopener" :title="`Download ${name}`">
+              <fa-icon :icon="['fas', 'download']" />
+            </a>
+          </div>
+        </div>
+        <p v-if="!anexos.length" class="text-center mb-5" v-text="`Sem anexos`"></p>
       </div>
     </template>
   </div>
@@ -44,17 +55,34 @@ export default {
       type: Object,
       required: true
     },
+    anexos: {
+      type: Array,
+      required: false
+    },
     dictionary: {
       type: Object,
       required: true
     }
   },
   mounted(){
+    console.log(this.anexos)
     if(this.validateInterativity()){
       this.verifyInfoAditional();
     }
   },
   methods: {
+    returnCurrentClass(isDoc) {
+      return `fs-2 cursor-pointer ${isDoc == 'pdf' ? 'text-red' : 'text-blue'}`
+    },
+    returnCurrentIcon(isDoc) {
+      return isDoc == 'pdf' ? ['fas', 'file-pdf'] : ['fas', 'file-alt']
+    },
+    openFile(url, isImg) {
+      const width = window.innerWidth
+      const height = window.innerHeight
+      const options = !isImg ? `width=${width},height=${height}` : "width=auto,height=auto"
+      window.open(url, "card-file", options)
+    },
     validateInterativity(){
       try {
         if(this.interatividade.formulario && this.interatividade.formulario.length){
@@ -190,5 +218,54 @@ export default {
   .interatividade-lista-link:hover {
     color: rgb(0, 98, 143);
   }
-  
+  .text-blue {
+    color: #294ED3;
+  }
+  .text-red {
+    color: #E74C3C
+  }
+  .text-dark {
+    color: #333;
+  }
+  .ml-3 {
+    margin-left: 3px;
+  }
+  .fs-2 {
+    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;
+  }
+  .text-bold {
+    font-weight: bold;
+  }
+  .m-5 {
+    margin: 5px;
+  }
+  .mb-5 {
+    margin-bottom: 5px;
+  }
+  .mx-5 {
+    margin-left: 5px;
+    margin-right: 5px;
+  }
+  .cursor-pointer {
+    cursor: pointer;
+  }
 </style>