nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-18 16:22:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

add send shared link via email in edit sharing option

Browse Source
This commit is contained in:
Milos Holba
2021-01-20 18:54:12 +01:00
parent 2263cc9511
commit 98d1926ab3
9 changed files with 272 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
resources/js/components/Others/Forms/CopyInput.vue
View File

@@ -1,22 +1,29 @@
<template>
<div class="inline-wrapper icon-append copy-input" :class="size" @click="copyUrl">
<input ref="sel" :value="value" id="link-input" type="text" class="input-text" readonly>
<div class="icon">
<link-icon v-if="! isCopiedLink" size="14"></link-icon>
<check-icon v-if="isCopiedLink" size="14"></check-icon>
<div :class="[shareViaEmail ? 'multi-icon' : 'icon' ]">
<div>
<link-icon v-if="! isCopiedLink" size="14"></link-icon>
<check-icon v-if="isCopiedLink" size="14"></check-icon>
</div>
<div @click.stop.prevent="menuForEmail" v-if="! isCopiedLink && shareViaEmail">
<send-icon size="14"></send-icon>
</div>
</div>
</div>
</template>
<script>
import { LinkIcon, CheckIcon } from 'vue-feather-icons'
import { LinkIcon, CheckIcon,SendIcon } from 'vue-feather-icons'
import {events} from '@/bus'
export default {
name: 'CopyInput',
props: ['size', 'value'],
props: ['size', 'value', 'shareViaEmail'],
components: {
CheckIcon,
LinkIcon,
SendIcon,
},
data() {
return {
@@ -24,6 +31,9 @@
}
},
methods: {
menuForEmail(){
events.$emit('openSendToRecipientsMenu')
},
copyUrl() {
// Get input value
@@ -52,6 +62,46 @@
@import "@assets/vue-file-manager/_inapp-forms.scss";
@import "@assets/vue-file-manager/_forms.scss";
.multi-icon {
display: flex;
align-items: center;
background: $light_background;
border-bottom-right-radius: 8px ;
border-top-right-radius: 8px ;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12);
line,
path,
polygon {
stroke: $text !important;
}
& > * {
padding: 9px 10px;
display: flex;
align-items: center;
border-left: 1px solid $dark_background;
&:hover {
background: $text;
line,
polyline,
path,
polygon {
stroke: white !important;
}
}
&:last-child {
border-bottom-right-radius: 8px ;
border-top-right-radius: 8px ;
}
}
}
// Single page
.copy-input {
@@ -86,6 +136,33 @@
@media (prefers-color-scheme: dark) {
.multi-icon {
background: $dark_mode_foreground;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.12);
line,
path,
polygon {
stroke: $dark_mode_text_primary !important;
}
& > * {
border-left: 1px solid $dark_mode_background;
&:hover {
background: rgba($theme, 0.1);
line,
polyline,
path,
polygon {
stroke: $theme !important;
}
}
}
}
.copy-input {
input {
color: $dark_mode_text_primary;