1<!--** 2 * 2007-2020 PrestaShop and Contributors 3 * 4 * NOTICE OF LICENSE 5 * 6 * This source file is subject to the Academic Free License 3.0 (AFL-3.0) 7 * that is bundled with this package in the file LICENSE.txt. 8 * It is also available through the world-wide-web at this URL: 9 * https://opensource.org/licenses/AFL-3.0 10 * If you did not receive a copy of the license and are unable to 11 * obtain it through the world-wide-web, please send an email 12 * to license@prestashop.com so we can send you a copy immediately. 13 * 14 * @author PrestaShop SA <contact@prestashop.com> 15 * @copyright 2007-2020 PrestaShop SA and Contributors 16 * @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0) 17 * International Registered Trademark & Property of PrestaShop SA 18 *--> 19<script> 20 import EventBus from '@components/EventBus'; 21 22 /** 23 * This component display a modal where you can create a wishlist 24 */ 25 export default { 26 name: 'Share', 27 props: { 28 url: { 29 type: String, 30 required: true, 31 default: '#', 32 }, 33 title: { 34 type: String, 35 required: true, 36 default: 'Share wishlist', 37 }, 38 label: { 39 type: String, 40 required: true, 41 default: 'Share link', 42 }, 43 cancelText: { 44 type: String, 45 required: true, 46 default: 'Cancel', 47 }, 48 copyText: { 49 type: String, 50 required: true, 51 default: 'Copy text', 52 }, 53 copiedText: { 54 type: String, 55 required: true, 56 default: 'Copied', 57 }, 58 }, 59 data() { 60 return { 61 value: '', 62 isHidden: true, 63 actionText: '', 64 }; 65 }, 66 methods: { 67 /** 68 * Toggle the modal 69 */ 70 toggleModal() { 71 this.isHidden = !this.isHidden; 72 }, 73 /** 74 * Copy the link in the input value 75 */ 76 copyLink() { 77 const shareInput = document.querySelector( 78 '.wishlist-share .form-control', 79 ); 80 81 shareInput.select(); 82 shareInput.setSelectionRange(0, 99999); 83 84 document.execCommand('copy'); 85 86 this.actionText = this.copiedText; 87 88 this.toggleModal(); 89 90 EventBus.$emit('showToast', { 91 detail: { 92 type: 'success', 93 message: 'copyText', 94 }, 95 }); 96 }, 97 }, 98 mounted() { 99 this.actionText = this.copyText; 100 101 /** 102 * Register to the event showCreateWishlist so others components can toggle this modal 103 * 104 * @param {String} 'showCreateWishlist' 105 */ 106 EventBus.$on('showShareWishlist', async (event) => { 107 this.actionText = this.copyText; 108 this.value = event.detail.shareUrl; 109 this.toggleModal(); 110 }); 111 }, 112 }; 113</script> 114 115<style lang="scss" type="text/scss" scoped> 116 .wishlist { 117 &-create { 118 .wishlist-modal { 119 display: block; 120 opacity: 0; 121 pointer-events: none; 122 z-index: 0; 123 124 &.show { 125 opacity: 1; 126 pointer-events: all; 127 z-index: 1053; 128 } 129 } 130 } 131 } 132</style> 133