mirror of https://github.com/docusealco/docuseal
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
2.3 KiB
103 lines
2.3 KiB
<template>
|
|
<div
|
|
class="dropdown"
|
|
:class="{ 'dropdown-open': isLoading }"
|
|
>
|
|
<label tabindex="0">
|
|
<IconBrandGoogleDrive class="w-5 h-5 inline-block mr-1 cursor-pointer" />
|
|
</label>
|
|
<ul
|
|
tabindex="0"
|
|
:style="{ backgroundColor }"
|
|
class="dropdown-content z-[1] shadow menu rounded-box"
|
|
>
|
|
<li>
|
|
<a
|
|
:href="`https://drive.google.com/file/d/${googleDriveFileId}/view?usp=sharing`"
|
|
data-turbo="false"
|
|
target="_blank"
|
|
class="flex items-center"
|
|
>
|
|
<IconExternalLink class="w-4 h-4 flex-shrink-0" />
|
|
<span>{{ t('view') }}</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<form
|
|
ref="form"
|
|
class="flex items-center"
|
|
@submit.prevent="upload({ path: uploadUrl })"
|
|
>
|
|
<input
|
|
:id="inputId"
|
|
ref="input"
|
|
:value="googleDriveFileId"
|
|
type="hidden"
|
|
name="google_drive_file_ids[]"
|
|
>
|
|
<button
|
|
type="submit"
|
|
:disabled="isLoading"
|
|
class="flex items-center w-full space-x-2"
|
|
>
|
|
<IconRefresh
|
|
class="w-4 h-4 flex-shrink-0"
|
|
:class="{ 'animate-spin': isLoading }"
|
|
/>
|
|
<span>{{ message }}</span>
|
|
</button>
|
|
</form>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Upload from './upload'
|
|
import { IconRefresh, IconBrandGoogleDrive, IconExternalLink } from '@tabler/icons-vue'
|
|
|
|
export default {
|
|
name: 'GoogleDriveDocumentSettings',
|
|
components: {
|
|
IconRefresh,
|
|
IconBrandGoogleDrive,
|
|
IconExternalLink
|
|
},
|
|
inject: ['baseFetch', 't', 'backgroundColor'],
|
|
props: {
|
|
templateId: {
|
|
type: [Number, String],
|
|
required: true
|
|
},
|
|
googleDriveFileId: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
},
|
|
emits: ['success'],
|
|
data () {
|
|
return {
|
|
isLoading: false
|
|
}
|
|
},
|
|
computed: {
|
|
inputId () {
|
|
return 'el' + Math.random().toString(32).split('.')[1]
|
|
},
|
|
uploadUrl () {
|
|
return `/templates/${this.templateId}/google_drive_documents`
|
|
},
|
|
message () {
|
|
if (this.isLoading) {
|
|
return this.t('syncing')
|
|
} else {
|
|
return this.t('sync')
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
upload: Upload.methods.upload
|
|
}
|
|
}
|
|
</script>
|