adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-14 11:12:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

show action blocked modal with instructions instead of small notification when server returns action blocked error

Browse Source
This commit is contained in:
Gregor Vostrak
2024-09-04 16:20:35 +02:00
committed by Constantin Graf
parent 30ed47d3fb
commit 48b2bb436e
3 changed files with 81 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
resources/js/Components/NotificationContainer.vue
View File

@@ -11,12 +11,65 @@
:message="notification.message"></Notification>
</div>
</div>
<DialogModal :show="showActionBlockedModal">
<template #title>
<div class="flex space-x-2">
<span> Action blocked </span>
</div>
</template>
<template #content>
<div
class="rounded-full flex items-center justify-center w-16 h-16 mx-auto border border-border-tertiary bg-secondary">
<XCircleIcon class="w-10"></XCircleIcon>
</div>
<div class="max-w-sm text-center mx-auto py-4 text-base">
<p class="py-1">
Your organization is currently
<strong class="font-semibold"
>blocked from performing this action</strong
>
</p>
<p class="py-1">
To unblock your organization, please
<strong class="font-semibold">
upgrade to a premium plan</strong
>
or remove all users except the owner.
</p>
<Link href="/billing">
<PrimaryButton
type="button"
class="mt-6"
v-if="isBillingActivated() && canUpdateOrganization()">
<CreditCardIcon class="w-5 h-5 me-2" />
Go to Billing
</PrimaryButton>
</Link>
</div>
</template>
<template #footer>
<SecondaryButton @click="showActionBlockedModal = false">
Cancel</SecondaryButton
>
</template>
</DialogModal>
</template>
<script setup lang="ts">
import Notification from '@/Components/Common/Notification/Notification.vue';
import { storeToRefs } from 'pinia';
import { useNotificationsStore } from '@/utils/notification';
import DialogModal from '@/packages/ui/src/DialogModal.vue';
import { isBillingActivated } from '@/utils/billing';
import { canUpdateOrganization } from '@/utils/permissions';
import { CreditCardIcon, XCircleIcon } from '@heroicons/vue/20/solid';
import { Link } from '@inertiajs/vue3';
import PrimaryButton from '../packages/ui/src/Buttons/PrimaryButton.vue';
import SecondaryButton from '../packages/ui/src/Buttons/SecondaryButton.vue';
const { notifications } = storeToRefs(useNotificationsStore());
const { notifications, showActionBlockedModal } = storeToRefs(
useNotificationsStore()
);
</script>