@burh/nuxt-core 1.0.500 → 1.0.502

package/components/burh-ds/Modals/ShareModal.vue

@@ -1,228 +1,228 @@
-<template>
-    <div>
-        <!-- <notifications></notifications> -->
-        <modal :show.sync="show" class="modal-share" v-on:close="resetCopy()">
-            <template slot="header">
-                <h5 class="modal-title" id="exampleModalLabel">Compartilhar</h5>
-            </template>
-
-            <ul class="list-inline mb-4 text-center">
-                <li class="list-inline-item">
-                    <a
-                        v-show="
-                            userData.user_complementary_information.facebook_url
-                        "
-                        :href="
-                            userData.user_complementary_information.facebook_url
-                        "
-                        target="_blank"
-                        rel="noopener noreferrer"
-                    >
-                        <base-button
-                            icon
-                            class="btn-facebook btn-icon rounded-circle"
-                        >
-                            <span class="btn-inner--icon"
-                                ><i class="fab fa-facebook"></i
-                            ></span>
-                        </base-button>
-                        <span class="btn-inner--text">Facebook</span>
-                    </a>
-                </li>
-                <li class="list-inline-item">
-                    <a
-                        v-show="
-                            userData.user_complementary_information.twitter_url
-                        "
-                        :href="
-                            userData.user_complementary_information.twitter_url
-                        "
-                        target="_blank"
-                        rel="noopener noreferrer"
-                    >
-                        <base-button icon class="btn-twitter rounded-circle">
-                            <span class="btn-inner--icon"
-                                ><i class="fab fa-twitter"></i
-                            ></span>
-                        </base-button>
-                        <span class="btn-inner--text">Twitter</span>
-                    </a>
-                </li>
-                <li class="list-inline-item">
-                    <a
-                        v-show="
-                            userData.user_complementary_information.linkedin_url
-                        "
-                        :href="
-                            userData.user_complementary_information.linkedin_url
-                        "
-                        target="_blank"
-                        rel="noopener noreferrer"
-                    >
-                        <base-button icon class="btn-linkedin rounded-circle">
-                            <span class="btn-inner--icon"
-                                ><i class="fab fa-linkedin"></i
-                            ></span>
-                        </base-button>
-                        <span class="btn-inner--text">Linkedin</span>
-                    </a>
-                </li>
-                <li class="plist-inline-item ointer">
-                    <a
-                        v-show="userData.user_contact.cellphone"
-                        :href="
-                            `https://api.whatsapp.com/send?phone=+55${userData.user_contact.cellphone}`
-                        "
-                        target="_blank"
-                        rel="noopener noreferrer"
-                    >
-                        <base-button icon class="btn-whatsapp rounded-circle">
-                            <span class="btn-inner--icon"
-                                ><i class="fab fa-whatsapp"></i
-                            ></span>
-                        </base-button>
-                        <span class="btn-inner--text">Whatsapp</span>
-                    </a>
-                </li>
-            </ul>
-            <div class="input-group" @click="copyToClipboard">
-                <input
-                    id="linkShareModal"
-                    type="text"
-                    readonly
-                    class="form-control pointer"
-                    :value="`${url}/${userData.slug.slug}`"
-                />
-                <div class="input-group-prepend">
-                    <button
-                        class="btn btn-outline-primary custom-copy my-0 px-2"
-                        id="btnCopyLinkShare"
-                    >
-                        Copiar
-                    </button>
-                </div>
-            </div>
-
-            <!-- <modal :show.sync="modals.modal0" class="modal-share__mini"/> -->
-            <sub-modal :show="modals">
-                <h1 class="display-3 mb-0 pb-0" slot="header">Compartilhar</h1>
-                <p class="lead mt-0">Insira aqui o número do telefone.</p>
-                <base-input
-                    class="mb-1"
-                    v-model="phoneNumber"
-                    v-mask="['(##) ####-####', '(##) #####-####']"
-                    placeholder="Ex: (15) 3342-6237"
-                    type="text"
-                    name="NumberCellphone"
-                >
-                </base-input>
-                <base-button
-                    class="btn btn-outline-primary d-block ml-auto"
-                    @click="onShareWhatsapp"
-                    >Enviar</base-button
-                >
-            </sub-modal>
-        </modal>
-    </div>
-</template>
-
-<script>
-import SubModal from './SubModal.vue';
-// import {TheMask} from 'vue-the-mask';
-import { mask } from 'vue-the-mask';
-
-export default {
-    name: 'share-modal',
-    directives: {
-        mask
-    },
-    components: {
-        SubModal
-    },
-    props: {
-        show: Boolean,
-        url: String,
-        userData: Object
-    },
-    data() {
-        return {
-            modals: {
-                modal0: false
-            },
-            phoneNumber: null
-        };
-    },
-    mounted() {
-        console.log(this.userData);
-    },
-    methods: {
-        async onShareWhatsapp() {
-            let phoneNumber = this.phoneNumber.replace(/[^\w\s]/gi, '');
-            phoneNumber = phoneNumber.replace(' ', '');
-            const pass = await this.$validator.validateAll();
-            if (!pass) {
-                return;
-            }
-            this.$shareOnWhatsapp(this.url, 55 + '' + phoneNumber);
-        },
-
-        shareJobOnFacebook() {
-            this.$shareOnFacebook(this.url, function() {
-                //
-            });
-        },
-
-        shareJobOnLinkedin() {
-            this.$shareOnLinkedin(this.url, function(popup) {
-                //
-            });
-        },
-
-        shareJobOnTwitter() {
-            this.$shareOnTwitter(this.url, function(popup) {
-                //
-            });
-        },
-
-        resetCopy() {
-            let btnCopy = document.getElementById('btnCopyLinkShare');
-            btnCopy.innerText = 'Copiar';
-            btnCopy.classList.add('btn-outline-primary');
-            btnCopy.classList.remove('btn-primary');
-        },
-        copyToClipboard() {
-            let text = document.getElementById('linkShareModal');
-            let btnCopy = document.getElementById('btnCopyLinkShare');
-            text.select();
-            document.execCommand('copy');
-
-            if (btnCopy.innerText == 'Copiado') return;
-
-            btnCopy.innerText = 'Copiado';
-            btnCopy.classList.remove('btn-outline-primary');
-            btnCopy.classList.add('btn-primary');
-            // this.$notify({
-            //   message:
-            //    `<h6 style="color: #fff;">Link copiado com sucesso!</6>`,
-            //   timeout: 5000,
-            //   icon: 'far fa-bell',
-            //   type: 'success'
-            // });
-        }
-        // getError(name) {
-        //     return this.errors.first(name);
-        // },
-        // isValid(name) {
-        //     return this.validated && !this.errors.has(name);
-        // }
-    }
-};
-</script>
-<style lang="scss">
-.pointer {
-    cursor: pointer;
-}
-.custom-copy {
-    box-shadow: none;
-}
-</style>
+<template>
+    <div>
+        <!-- <notifications></notifications> -->
+        <modal :show.sync="show" class="modal-share" v-on:close="resetCopy()">
+            <template slot="header">
+                <h5 class="modal-title" id="exampleModalLabel">Compartilhar</h5>
+            </template>
+
+            <ul class="list-inline mb-4 text-center">
+                <li class="list-inline-item">
+                    <a
+                        v-show="
+                            userData.user_complementary_information.facebook_url
+                        "
+                        :href="
+                            userData.user_complementary_information.facebook_url
+                        "
+                        target="_blank"
+                        rel="noopener noreferrer"
+                    >
+                        <base-button
+                            icon
+                            class="btn-facebook btn-icon rounded-circle"
+                        >
+                            <span class="btn-inner--icon"
+                                ><i class="fab fa-facebook"></i
+                            ></span>
+                        </base-button>
+                        <span class="btn-inner--text">Facebook</span>
+                    </a>
+                </li>
+                <li class="list-inline-item">
+                    <a
+                        v-show="
+                            userData.user_complementary_information.twitter_url
+                        "
+                        :href="
+                            userData.user_complementary_information.twitter_url
+                        "
+                        target="_blank"
+                        rel="noopener noreferrer"
+                    >
+                        <base-button icon class="btn-twitter rounded-circle">
+                            <span class="btn-inner--icon"
+                                ><i class="fab fa-twitter"></i
+                            ></span>
+                        </base-button>
+                        <span class="btn-inner--text">Twitter</span>
+                    </a>
+                </li>
+                <li class="list-inline-item">
+                    <a
+                        v-show="
+                            userData.user_complementary_information.linkedin_url
+                        "
+                        :href="
+                            userData.user_complementary_information.linkedin_url
+                        "
+                        target="_blank"
+                        rel="noopener noreferrer"
+                    >
+                        <base-button icon class="btn-linkedin rounded-circle">
+                            <span class="btn-inner--icon"
+                                ><i class="fab fa-linkedin"></i
+                            ></span>
+                        </base-button>
+                        <span class="btn-inner--text">Linkedin</span>
+                    </a>
+                </li>
+                <li class="plist-inline-item ointer">
+                    <a
+                        v-show="userData.user_contact.cellphone"
+                        :href="
+                            `https://api.whatsapp.com/send?phone=+55${userData.user_contact.cellphone}`
+                        "
+                        target="_blank"
+                        rel="noopener noreferrer"
+                    >
+                        <base-button icon class="btn-whatsapp rounded-circle">
+                            <span class="btn-inner--icon"
+                                ><i class="fab fa-whatsapp"></i
+                            ></span>
+                        </base-button>
+                        <span class="btn-inner--text">Whatsapp</span>
+                    </a>
+                </li>
+            </ul>
+            <div class="input-group" @click="copyToClipboard">
+                <input
+                    id="linkShareModal"
+                    type="text"
+                    readonly
+                    class="form-control pointer"
+                    :value="`${url}/${userData.slug.slug}`"
+                />
+                <div class="input-group-prepend">
+                    <button
+                        class="btn btn-outline-primary custom-copy my-0 px-2"
+                        id="btnCopyLinkShare"
+                    >
+                        Copiar
+                    </button>
+                </div>
+            </div>
+
+            <!-- <modal :show.sync="modals.modal0" class="modal-share__mini"/> -->
+            <sub-modal :show="modals">
+                <h1 class="display-3 mb-0 pb-0" slot="header">Compartilhar</h1>
+                <p class="lead mt-0">Insira aqui o número do telefone.</p>
+                <base-input
+                    class="mb-1"
+                    v-model="phoneNumber"
+                    v-mask="['(##) ####-####', '(##) #####-####']"
+                    placeholder="Ex: (15) 3342-6237"
+                    type="text"
+                    name="NumberCellphone"
+                >
+                </base-input>
+                <base-button
+                    class="btn btn-outline-primary d-block ml-auto"
+                    @click="onShareWhatsapp"
+                    >Enviar</base-button
+                >
+            </sub-modal>
+        </modal>
+    </div>
+</template>
+
+<script>
+import SubModal from './SubModal.vue';
+// import {TheMask} from 'vue-the-mask';
+import { mask } from 'vue-the-mask';
+
+export default {
+    name: 'share-modal',
+    directives: {
+        mask
+    },
+    components: {
+        SubModal
+    },
+    props: {
+        show: Boolean,
+        url: String,
+        userData: Object
+    },
+    data() {
+        return {
+            modals: {
+                modal0: false
+            },
+            phoneNumber: null
+        };
+    },
+    mounted() {
+        console.log(this.userData);
+    },
+    methods: {
+        async onShareWhatsapp() {
+            let phoneNumber = this.phoneNumber.replace(/[^\w\s]/gi, '');
+            phoneNumber = phoneNumber.replace(' ', '');
+            const pass = await this.$validator.validateAll();
+            if (!pass) {
+                return;
+            }
+            this.$shareOnWhatsapp(this.url, 55 + '' + phoneNumber);
+        },
+
+        shareJobOnFacebook() {
+            this.$shareOnFacebook(this.url, function() {
+                //
+            });
+        },
+
+        shareJobOnLinkedin() {
+            this.$shareOnLinkedin(this.url, function(popup) {
+                //
+            });
+        },
+
+        shareJobOnTwitter() {
+            this.$shareOnTwitter(this.url, function(popup) {
+                //
+            });
+        },
+
+        resetCopy() {
+            let btnCopy = document.getElementById('btnCopyLinkShare');
+            btnCopy.innerText = 'Copiar';
+            btnCopy.classList.add('btn-outline-primary');
+            btnCopy.classList.remove('btn-primary');
+        },
+        copyToClipboard() {
+            let text = document.getElementById('linkShareModal');
+            let btnCopy = document.getElementById('btnCopyLinkShare');
+            text.select();
+            document.execCommand('copy');
+
+            if (btnCopy.innerText == 'Copiado') return;
+
+            btnCopy.innerText = 'Copiado';
+            btnCopy.classList.remove('btn-outline-primary');
+            btnCopy.classList.add('btn-primary');
+            // this.$notify({
+            //   message:
+            //    `<h6 style="color: #fff;">Link copiado com sucesso!</6>`,
+            //   timeout: 5000,
+            //   icon: 'far fa-bell',
+            //   type: 'success'
+            // });
+        }
+        // getError(name) {
+        //     return this.errors.first(name);
+        // },
+        // isValid(name) {
+        //     return this.validated && !this.errors.has(name);
+        // }
+    }
+};
+</script>
+<style lang="scss">
+.pointer {
+    cursor: pointer;
+}
+.custom-copy {
+    box-shadow: none;
+}
+</style>