mirror of
https://github.com/solidtime-io/solidtime.git
synced 2026-08-08 00:02:15 +01:00
91 lines
3.6 KiB
Vue
91 lines
3.6 KiB
Vue
<script setup lang="ts">
|
|
import PrimaryButton from '@/packages/ui/src/Buttons/PrimaryButton.vue';
|
|
import { ref } from 'vue';
|
|
import { useNotificationsStore } from '@/utils/notification';
|
|
import { api, type OrganizationExportResponse } from '@/packages/api/src';
|
|
import { getCurrentOrganizationId } from '@/utils/useUser';
|
|
import DialogModal from '@/packages/ui/src/DialogModal.vue';
|
|
import SecondaryButton from '@/packages/ui/src/Buttons/SecondaryButton.vue';
|
|
import { ArrowUpOnSquareIcon, InformationCircleIcon } from '@heroicons/vue/24/outline';
|
|
import { CardTitle } from '@/packages/ui/src';
|
|
import Card from '@/Components/Common/Card.vue';
|
|
import { useOrganizationStore } from '@/utils/useOrganization';
|
|
|
|
const showResultModal = ref(false);
|
|
const loading = ref(false);
|
|
const exportResponse = ref<OrganizationExportResponse | null>(null);
|
|
|
|
const { organization } = useOrganizationStore();
|
|
const { handleApiRequestNotifications } = useNotificationsStore();
|
|
|
|
async function exportData() {
|
|
loading.value = true;
|
|
const organizationId = getCurrentOrganizationId();
|
|
if (organizationId) {
|
|
try {
|
|
const response = await handleApiRequestNotifications(
|
|
() =>
|
|
api.exportOrganization(undefined, {
|
|
params: {
|
|
organization: organizationId,
|
|
},
|
|
}),
|
|
'Organization data exported successfully.',
|
|
'Exporting organization data failed.'
|
|
);
|
|
if (response) {
|
|
showResultModal.value = true;
|
|
exportResponse.value = response;
|
|
window.open(response.download_url, '_self')?.focus();
|
|
}
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<DialogModal closeable :show="showResultModal" @close="showResultModal = false">
|
|
<template #title>The export was successful!</template>
|
|
<template #content>
|
|
<div class="pb-6">
|
|
The download should start automatically. If it does not
|
|
<a
|
|
class="font-semibold text-accent-200 hover:text-accent-300"
|
|
target="_self"
|
|
:href="exportResponse?.download_url"
|
|
>click here</a
|
|
>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<SecondaryButton @click="showResultModal = false"> Close </SecondaryButton>
|
|
</template>
|
|
</DialogModal>
|
|
<div>
|
|
<CardTitle title="Export Data" :icon="ArrowUpOnSquareIcon"></CardTitle>
|
|
<Card class="mb-3">
|
|
<div class="py-2 px-3 sm:px-4 text-sm flex items-center space-x-3">
|
|
<InformationCircleIcon class="h-5 min-w-0 w-5 text-bg-tertiary" />
|
|
<p class="flex-1">
|
|
Export your solidtime organization data. This will include all clients,
|
|
projects, tasks, and time entries. You will receive a zip file with json files
|
|
for each entity.
|
|
</p>
|
|
</div>
|
|
</Card>
|
|
<Card>
|
|
<div class="py-6 flex-col items-center flex space-y-5 text-center text-sm">
|
|
<div>
|
|
The following organization will be exported: <br />
|
|
<strong class="font-semibold">{{ organization?.name }}</strong>
|
|
</div>
|
|
<PrimaryButton :loading @click="exportData"
|
|
>Export Organization Data
|
|
</PrimaryButton>
|
|
</div>
|
|
</Card>
|
|
</div>
|
|
</template>
|