vue-intergrall-plugins 0.0.236 → 0.0.239

package/package.json

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

package/src/lib-components/Chat/BtnFiles.vue

@@ -7,7 +7,7 @@
     </transition> -->
     <fa-icon :icon="['fas', 'paperclip']" :title="dictionary.title_selecionar_anexo" />
     <transition name="fade">
-      <span v-if="fileSize > 0" @click.stop="toggleFilePreview" v-tippy :content="dictionary.msg_abrir_anexos" :class="`${fileSettings.filePreviewStyle == 2 ? 'files-counter-2' : 'files-counter'}`">
+      <span v-if="fileSize > 0" @click.stop="toggleFilePreview" v-tippy :content="!fileSettings.handleFilePreview ? dictionary.msg_abrir_anexos : `${file.length} anexo(s) selecionado(s)`" :class="`${fileSettings.filePreviewStyle == 2 ? 'files-counter-2' : 'files-counter'}`">
         <template v-if="fileSettings.filePreviewStyle == 1">
           {{ fileSize }}
         </template>
@@ -236,7 +236,7 @@ export default {
       if(fileInput) fileInput.click()
       if(!fileInput) if (!document.querySelector(".toasted.toasted-primary.error")) this.$toasted.global.defaultError()
     },
-    isFileValid(type, fileName) {
+    isFileValid(type, fileName, fileType) {
       if((type == "img" && !this.fileSettings.imagesExtensions) || (type == "doc" && !this.fileSettings.docsExtensions)) {
         this.$toasted.global.defaultInfo({ msg: this.dictionary.sem_extensoes_parametrizadas })
         this.hasAnyFile = false
@@ -244,7 +244,7 @@ export default {
       }
       const extensions = type === "img" ? this.fileSettings.imagesExtensions : this.fileSettings.docsExtensions
       const regex = new RegExp("("+extensions+")", "i")
-      if(regex.test(fileName)) return true
+      if(regex.test(fileName) || regex.test(fileType)) return true
       this.hasAnyFile = false
       this.showToastedValidFormats()
       return false
@@ -266,6 +266,19 @@ export default {
         const isStackable = this.fileSettings.stackFiles && this.fileSettings.multiple
         this.file =  filesAux.length ? isStackable ? this.file.concat(...filesAux) : filesAux : this.file
         if(!this.file.length) return
+
+        let sizeInBytes = 0
+        Array.from(this.file).forEach(file => sizeInBytes += file.size)
+        const sizeInMb = parseFloat((sizeInBytes / (1024*1024)).toFixed(2))
+        if(sizeInMb == 0) {
+          this.file = []
+          return this.$toasted.global.defaultInfo({ msg: this.dictionary.msg_arquivo_invalido }) 
+        }
+        if(sizeInMb >= 9.5) {
+          this.file = []
+          return this.$toasted.global.defaultInfo({ msg: `Limite de 9.5 MB por arquivo` })
+        }
+
         if(this.file.length > this.fileSettings.max) {
           this.file = []
           return this.$toasted.global.defaultInfo({ msg: `Limite de ${this.fileSettings.max} arquivos` })
@@ -274,7 +287,7 @@ export default {
         this.fileSize = this.file.length
         if(!this.fileSettings.multiple) {
           this.file = this.file[0]
-          this.singleFileUpload(type, this.file.name)
+          this.singleFileUpload(type, this.file.name, this.file.type)
         }else {
           this.multipleFileUpload()
         }
@@ -309,7 +322,7 @@ export default {
         const singleFileType = this.returnFileType(file)
         if(!singleFileType) file.invalid = true
         file.imgOrDoc = singleFileType ? singleFileType : ""
-        if(this.isFileValid(file.imgOrDoc, file.name)) {
+        if(this.isFileValid(file.imgOrDoc, file.name, file.type)) {
           if(file.imgOrDoc == "img") {
             const fileReader = new FileReader();
             waitForImageLoad = true
@@ -337,8 +350,8 @@ export default {
 
       if(this.isDoc && !waitForImageLoad) this.emitFileVars()
     },
-    singleFileUpload(type, fileName) {
-      if(this.isFileValid(type, fileName)) {
+    singleFileUpload(type, fileName, fileType) {
+      if(this.isFileValid(type, fileName, fileType)) {
         const fileReader = new FileReader()
         if(type === "img") {
           fileReader.onload = () => this.imagePreview = fileReader.result 

package/src/lib-components/Chat/BtnScreenShare.vue

@@ -0,0 +1,32 @@
+<template>
+  <div class="text-footer-actions--btn" @click="$emit('toggle-standard-messages')" :title="dictionary.title_screen_share">
+    <fa-icon :icon="['fas', 'desktop']" />
+    <fa-icon :icon="['fas', 'share']" />
+  </div>
+</template>
+
+<style scoped>
+  .text-footer-actions--btn {
+    position: relative;
+  }
+  .text-footer-actions--btn > svg:nth-child(1) {
+    font-size: 1.2rem;
+  }
+  .text-footer-actions--btn > svg:nth-child(2) {
+    font-size: .6rem;
+    position: absolute;
+    transform: translateY(-2px)
+  }
+</style>
+
+<script>
+export default {
+  props: {
+    dictionary: {
+      type: Object,
+      default: {},
+      required: false
+    }
+  }
+}
+</script>

package/src/lib-components/Chat/TextFooter.vue

@@ -38,12 +38,13 @@
         :message="message"
         :maxCharacters="textareaSettings.maxCharacters"
       />
-      <div class="text-footer-actions" v-if="buttons.hasSendButton">
-        <span class="text-footer-actions--btn" :title="dictionary.title_enviar_msg" @click="sendMessageHandler">
-          <fa-icon :icon="['fas', 'paper-plane']" />
-        </span>
-      </div>
-      <div v-if="buttons.hasFiles || buttons.hasAudio || buttons.hasExpand || formattedMessageSettings.hasStandardMessages" class="text-footer-actions" :class="{'outside-buttons' : cssStyle.outsideButtons && !audioFile}">
+      <div v-if="buttons.hasFiles || buttons.hasAudio || buttons.hasExpand || formattedMessageSettings.hasStandardMessages || buttons.hasScreenShare" class="text-footer-actions" :class="{'outside-buttons' : cssStyle.outsideButtons && !audioFile}">
+        <BtnScreenShare 
+          v-show="buttons.hasScreenShare && !audioFile"
+          @handle-screen-share="handleScreenShare"
+          :dictionary="dictionary"
+          :ref="`${textId}-screen-share`"
+        />
         <BtnMic 
           v-show="buttons.hasAudio && !audioFile"
           :dictionary="dictionary"
@@ -79,6 +80,11 @@
           :dictionary="dictionary"
         />
       </div>
+      <div class="text-footer-actions" v-if="buttons.hasSendButton">
+        <span class="text-footer-actions--btn" :title="dictionary.title_enviar_msg" @click="sendMessageHandler">
+          <fa-icon :icon="['fas', 'paper-plane']" />
+        </span>
+      </div>
     </div>
     <transition name="fade">
       <StandardMessages 
@@ -116,14 +122,15 @@ import BtnFiles from "./BtnFiles"
 import BtnExpand from "./BtnExpand"
 import BtnStandardMessages from "./BtnStandardMessages"
 import StandardMessages from "./StandardMessages"
+import BtnScreenShare from "./BtnScreenShare"
 
 export default {
-  components: { BtnEmojis, Loader, BtnMic, BtnFiles, BtnExpand, RemainingCharacters, BtnStandardMessages, StandardMessages },
+  components: { BtnEmojis, Loader, BtnMic, BtnFiles, BtnExpand, RemainingCharacters, BtnStandardMessages, StandardMessages, BtnScreenShare },
   mixins: [ clickaway ],
   props: {
     buttons: {
       type: Object,
-      default: () => { return { hasEmojis: false, hasSendButton: false, hasFiles: false, hasAudio: false, hasExpand: false } },
+      default: () => { return { hasEmojis: false, hasSendButton: false, hasFiles: false, hasAudio: false, hasExpand: false, hasScreenShare: false } },
       required: false
     },
     cssStyle: {
@@ -463,6 +470,9 @@ export default {
         console.error(e)
       }
     },
+    handleScreenShare() {
+      this.$emit("handle-screen-share")
+    },
     toggleStandardMessages() {
       this.showStandardMessages = !this.showStandardMessages
     },