vue-intergrall-plugins 1.0.96 → 1.0.98

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

@@ -2317,9 +2317,6 @@ var createPopper = /*#__PURE__*/popperGenerator({
 //
 //
 //
-//
-//
-//
 
 var script$B = {
   data: function data() {
@@ -2814,7 +2811,7 @@ var __vue_render__$B = function __vue_render__() {
           value: {
             placement: 'right'
           },
-          expression: "{placement: 'right'}"
+          expression: "{ placement: 'right' }"
         }],
         class: "color-" + _vm.headerFiles[0].current_color,
         attrs: {
@@ -2833,7 +2830,7 @@ var __vue_render__$B = function __vue_render__() {
           value: {
             placement: 'right'
           },
-          expression: "{placement: 'right'}"
+          expression: "{ placement: 'right' }"
         }],
         staticClass: "select-image",
         attrs: {
@@ -2845,6 +2842,85 @@ var __vue_render__$B = function __vue_render__() {
             return _vm.triggerInputFile("header-" + pIndex);
           }
         }
+      })], 2) : param.type == 'document' ? _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",
+          value: {
+            placement: 'right'
+          },
+          expression: "{ placement: 'right' }"
+        }],
+        class: "color-" + _vm.headerFiles[0].current_color,
+        attrs: {
+          "icon": ['fas', _vm.headerFiles[0].current_icon],
+          "content": _vm.headerFiles[0].name
+        },
+        on: {
+          "click": function click($event) {
+            return _vm.triggerInputFile("header-" + pIndex);
+          }
+        }
+      })] : _c('fa-icon', {
+        directives: [{
+          name: "tippy",
+          rawName: "v-tippy",
+          value: {
+            placement: 'right'
+          },
+          expression: "{ placement: 'right' }"
+        }],
+        staticClass: "select-image",
+        attrs: {
+          "icon": ['fas', 'file-alt'],
+          "content": "Selecionar anexo"
+        },
+        on: {
+          "click": function click($event) {
+            return _vm.triggerInputFile("header-" + pIndex);
+          }
+        }
+      })], 2) : param.type == 'video' ? _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",
+          value: {
+            placement: 'right'
+          },
+          expression: "{ placement: 'right' }"
+        }],
+        class: "color-" + _vm.headerFiles[0].current_color,
+        attrs: {
+          "icon": ['fas', _vm.headerFiles[0].current_icon],
+          "content": _vm.headerFiles[0].name
+        },
+        on: {
+          "click": function click($event) {
+            return _vm.triggerInputFile("header-" + pIndex);
+          }
+        }
+      })] : _c('fa-icon', {
+        directives: [{
+          name: "tippy",
+          rawName: "v-tippy",
+          value: {
+            placement: 'right'
+          },
+          expression: "{ placement: 'right' }"
+        }],
+        staticClass: "select-image",
+        staticStyle: {
+          "font-size": "1.2rem"
+        },
+        attrs: {
+          "icon": ['fas', 'video'],
+          "content": "Selecionar anexo"
+        },
+        on: {
+          "click": function click($event) {
+            return _vm.triggerInputFile("header-" + pIndex);
+          }
+        }
       })], 2) : _vm._e()], 2);
     }), 0) : _vm._e(), _vm._ssrNode(" " + (component.type === 'body' ? "<section id=\"template_body\"" + _vm._ssrClass(null, (_vm.template.components.length == 1 ? 'border-radius-5 custom-border-gray' : '') + " " + (!_vm.hasButtonOrFooterComponent ? 'custom-footer-style custom-box-shadow-bottom custom-border-gray' : '')) + ">" + _vm._ssrList(component.parameters, function (param, pIndex) {
       return "<div>" + (param.type === 'text' ? _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>" : "<!---->") + "</div>";
@@ -2859,7 +2935,7 @@ var __vue_render__$B = function __vue_render__() {
     attrs: {
       "icon": ['fas', 'paper-plane']
     }
-  }), _vm._ssrNode(_vm._ssrEscape("\n          " + _vm._s(_vm.dictionary.btn_contatar_clientes) + " \n        "))] : _c('fa-icon', {
+  }), _vm._ssrNode(_vm._ssrEscape("\n          " + _vm._s(_vm.dictionary.btn_contatar_clientes) + "\n        "))] : _c('fa-icon', {
     attrs: {
       "icon": ['fas', 'paper-plane']
     }
@@ -2869,7 +2945,7 @@ var __vue_render__$B = function __vue_render__() {
     attrs: {
       "icon": ['fas', 'paper-plane']
     }
-  }), _vm._ssrNode(_vm._ssrEscape("\n          " + _vm._s(_vm.dictionary.btn_contatar_clientes_com_bot) + " \n        "))] : _c('fa-icon', {
+  }), _vm._ssrNode(_vm._ssrEscape("\n          " + _vm._s(_vm.dictionary.btn_contatar_clientes_com_bot) + "\n        "))] : _c('fa-icon', {
     attrs: {
       "icon": ['fas', 'paper-plane']
     }
@@ -2880,7 +2956,7 @@ var __vue_staticRenderFns__$B = [];
 /* style */
 var __vue_inject_styles__$B = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-43cc7945_0", {
+  inject("data-v-18b271ca_0", {
     source: ".btn-red button{background-color:red}.btn-red svg{color:#b60000}.container-btns{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}",
     map: undefined,
     media: undefined
@@ -2889,7 +2965,7 @@ var __vue_inject_styles__$B = function __vue_inject_styles__(inject) {
 /* scoped */
 var __vue_scope_id__$B = undefined;
 /* module identifier */
-var __vue_module_identifier__$B = "data-v-43cc7945";
+var __vue_module_identifier__$B = "data-v-18b271ca";
 /* functional template */
 var __vue_is_functional_template__$B = false;
 /* style inject shadow dom */
@@ -6207,7 +6283,7 @@ var script$k = {
                 if (_this2.hasFile) {
                   if (!_this2.selectedTemplate["parameters"][component.type]) _this2.selectedTemplate["parameters"][component.type] = new Array();
                   _this2.selectedTemplate["parameters"][component.type].push({
-                    tipo: "image",
+                    tipo: _this2.selectedTemplate["parameters"][component.type],
                     template: component.parameters.seq,
                     link: ""
                   });
@@ -6309,7 +6385,7 @@ var __vue_staticRenderFns__$k = [];
 /* style */
 var __vue_inject_styles__$k = function __vue_inject_styles__(inject) {
   if (!inject) return;
-  inject("data-v-a48815f2_0", {
+  inject("data-v-5550ae37_0", {
     source: ".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;gap:10px}.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:11.2px;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:12.8px;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:12.8px;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:auto;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
@@ -6318,7 +6394,7 @@ var __vue_inject_styles__$k = function __vue_inject_styles__(inject) {
 /* scoped */
 var __vue_scope_id__$k = undefined;
 /* module identifier */
-var __vue_module_identifier__$k = "data-v-a48815f2";
+var __vue_module_identifier__$k = "data-v-5550ae37";
 /* functional template */
 var __vue_is_functional_template__$k = false;
 /* style inject shadow dom */

package/package.json

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

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

@@ -2,46 +2,23 @@
   <div class="tg-container" v-if="templates && identifier">
     <div class="tg-options" :class="{ column: columnSelect }">
       <h4>Template:</h4>
-      <v-select
-        class="tg-select"
-        appendToBody
-        :calculatePosition="calculateSelectPosition"
-        :options="templateOptions"
-        :value="codTemplate"
-        :reduce="(template) => template.cod"
-        :clearable="false"
-        @input="setTemplate"
-        :getOptionLabel="(template) => template.label"
-        ref="template-v-select"
-      >
+      <v-select class="tg-select" appendToBody :calculatePosition="calculateSelectPosition" :options="templateOptions"
+        :value="codTemplate" :reduce="(template) => template.cod" :clearable="false" @input="setTemplate"
+        :getOptionLabel="(template) => template.label" ref="template-v-select">
         <div slot="no-options" v-text="dictionary.msg_sem_resultados"></div>
       </v-select>
     </div>
     <template v-if="selectedTemplate">
       <div class="tg-component" v-if="selectedTemplate.components">
-        <TemplateSingle
-          :key="codTemplate"
-          :template="selectedTemplate"
-          @set-vars="setFinalMessage"
-          @set-file-var="setFileVar"
-          :hasButton="hasButton"
-          :iconButton="iconButton"
-          @click-trigger="$emit('click-trigger')"
-          :identifier="identifier"
-          :allVariables="allVariables"
-          :dictionary="dictionary"
-          :hasSecondaryButton="hasSecondaryButton"
-          @dispatch-clients-with-bot="$emit('dispatch-clients-with-bot')"
-        />
+        <TemplateSingle :key="codTemplate" :template="selectedTemplate" @set-vars="setFinalMessage"
+          @set-file-var="setFileVar" :hasButton="hasButton" :iconButton="iconButton"
+          @click-trigger="$emit('click-trigger')" :identifier="identifier" :allVariables="allVariables"
+          :dictionary="dictionary" :hasSecondaryButton="hasSecondaryButton"
+          @dispatch-clients-with-bot="$emit('dispatch-clients-with-bot')" />
       </div>
       <div class="tg-component" v-else>
-        <TemplateMessage
-          @final-message="setMessage"
-          :hasButton="hasButton"
-          :iconButton="iconButton"
-          @click-trigger="$emit('click-trigger', true)"
-          :dictionary="dictionary"
-        />
+        <TemplateMessage @final-message="setMessage" :hasButton="hasButton" :iconButton="iconButton"
+          @click-trigger="$emit('click-trigger', true)" :dictionary="dictionary" />
       </div>
     </template>
   </div>
@@ -160,9 +137,8 @@ export default {
         if (this.templates[key])
           this.templateOptions.push({
             cod: key,
-            label: `${this.concatTemplateMessage(this.templates[key])} (${
-              this.templates[key].title
-            })`,
+            label: `${this.concatTemplateMessage(this.templates[key])} (${this.templates[key].title
+              })`,
           });
       }
     },
@@ -259,7 +235,7 @@ export default {
                   if (!this.selectedTemplate["parameters"][component.type])
                     this.selectedTemplate["parameters"][component.type] = new Array();
                   this.selectedTemplate["parameters"][component.type].push({
-                    tipo: "image",
+                    tipo: this.selectedTemplate["parameters"][component.type],
                     template: component.parameters.seq,
                     link: "",
                   });
@@ -299,9 +275,11 @@ export default {
   width: 100%;
   display: flex;
 }
+
 .tg-options.column {
   flex-direction: column;
 }
+
 .tg-options h4 {
   margin-right: 5px;
 }
@@ -372,6 +350,7 @@ export default {
   height: 34px;
   overflow: hidden;
 }
+
 .tg-select .vs__dropdown-toggle {
   background-color: #fff;
   height: 34px;
@@ -379,11 +358,13 @@ export default {
   display: flex;
   align-items: center;
 }
+
 .tg-select .vs__selected-options {
   height: 34px;
   overflow: hidden;
 }
-.tg-select .vs__selected-options > span {
+
+.tg-select .vs__selected-options>span {
   white-space: nowrap;
   text-overflow: ellipsis;
   flex: 1;
@@ -402,9 +383,11 @@ export default {
   transition: background-color 150ms;
   white-space: normal;
 }
+
 .vs__dropdown-option:nth-child(odd) {
   background-color: #f1f1f1;
 }
+
 .vs__dropdown-option:hover,
 .vs__dropdown-option:focus,
 .vs__dropdown-option:active,
@@ -441,42 +424,52 @@ export default {
   display: flex;
   flex-direction: column;
 }
+
 .order-1 {
   order: 1;
 }
+
 .custom-box-shadow-bottom {
   box-shadow: 0px 3px 4px -3px rgba(0, 0, 0, 0.3);
 }
+
 .custom-border-gray {
   border: 1px solid var(--border-color) !important;
 }
+
 .ts-content header,
 .ts-content section,
 .ts-content footer {
   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);
 }
+
 .ts-content footer,
 .custom-footer-style {
   border: 1px solid var(--border-color);
@@ -484,6 +477,7 @@ export default {
   border-bottom-left-radius: var(--border-radius);
   border-bottom-right-radius: var(--border-radius);
 }
+
 .ts-content input {
   border: 1px solid transparent;
   outline: 0;
@@ -491,16 +485,20 @@ export default {
   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;
@@ -522,6 +520,7 @@ export default {
   border: 1px solid #444;
   border-top: unset;
 }
+
 .ts-dropdown li {
   width: 100%;
   opacity: 0.9;
@@ -531,6 +530,7 @@ export default {
   font-size: 12.8px;
   transition: background-color 150ms;
 }
+
 .ts-dropdown li:hover,
 .ts-dropdown li:focus-within,
 .ts-dropdown li:focus {
@@ -538,16 +538,19 @@ export default {
   background-color: #555;
   color: #fff;
 }
+
 .ts-dropdown.visible {
   visibility: visible;
   opacity: 1;
 }
+
 .tg-btn {
   width: auto;
   display: flex;
   justify-content: center;
   align-items: center;
 }
+
 .tg-btn button {
   border: unset;
   display: block;
@@ -564,13 +567,16 @@ export default {
   opacity: 0.9;
   border-radius: 2.5px;
 }
-.tg-btn button > svg {
+
+.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, 0.2);
@@ -580,6 +586,7 @@ export default {
   -ms-transform: translateY(1px);
   transform: translateY(1px);
 }
+
 .tg-btn button:active {
   opacity: 1;
   box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
@@ -589,17 +596,21 @@ export default {
   -ms-transform: translateY(1px);
   transform: translateY(1px);
 }
+
 .tg-btn button:focus,
 .tg-btn button:active {
   outline: 2px solid black;
 }
+
 .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;