mirror of
https://github.com/directus/directus.git
synced 2026-02-16 07:14:57 -05:00
Create composable use-edits-guard (#11018)
This commit is contained in:
@@ -106,10 +106,10 @@ import { useCollection } from '@directus/shared/composables';
|
||||
import FieldsManagement from './components/fields-management.vue';
|
||||
|
||||
import useItem from '@/composables/use-item';
|
||||
import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useCollectionsStore, useFieldsStore } from '@/stores';
|
||||
import useShortcut from '@/composables/use-shortcut';
|
||||
import unsavedChanges from '@/composables/unsaved-changes';
|
||||
import useEditsGuard from '@/composables/use-edits-guard';
|
||||
|
||||
export default defineComponent({
|
||||
components: { SettingsNavigation, FieldsManagement },
|
||||
@@ -160,20 +160,7 @@ export default defineComponent({
|
||||
return hasEdits.value;
|
||||
});
|
||||
|
||||
unsavedChanges(isSavable);
|
||||
|
||||
const confirmLeave = ref(false);
|
||||
const leaveTo = ref<string | null>(null);
|
||||
|
||||
const editsGuard: NavigationGuard = (to) => {
|
||||
if (hasEdits.value) {
|
||||
confirmLeave.value = true;
|
||||
leaveTo.value = to.fullPath;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
onBeforeRouteUpdate(editsGuard);
|
||||
onBeforeRouteLeave(editsGuard);
|
||||
const { confirmLeave, leaveTo } = useEditsGuard(isSavable);
|
||||
|
||||
return {
|
||||
t,
|
||||
|
||||
@@ -141,11 +141,11 @@ import { Preset, Filter } from '@directus/shared/types';
|
||||
import api from '@/api';
|
||||
import { useCollectionsStore, usePresetsStore } from '@/stores';
|
||||
import { getLayouts } from '@/layouts';
|
||||
import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { unexpectedError } from '@/utils/unexpected-error';
|
||||
import { useLayout } from '@directus/shared/composables';
|
||||
import useShortcut from '@/composables/use-shortcut';
|
||||
import unsavedChanges from '@/composables/unsaved-changes';
|
||||
import useEditsGuard from '@/composables/use-edits-guard';
|
||||
import { isEqual } from 'lodash';
|
||||
|
||||
type FormattedPreset = {
|
||||
@@ -210,20 +210,7 @@ export default defineComponent({
|
||||
return hasEdits.value;
|
||||
});
|
||||
|
||||
unsavedChanges(isSavable);
|
||||
|
||||
const confirmLeave = ref(false);
|
||||
const leaveTo = ref<string | null>(null);
|
||||
|
||||
const editsGuard: NavigationGuard = (to) => {
|
||||
if (hasEdits.value) {
|
||||
confirmLeave.value = true;
|
||||
leaveTo.value = to.fullPath;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
onBeforeRouteUpdate(editsGuard);
|
||||
onBeforeRouteLeave(editsGuard);
|
||||
const { confirmLeave, leaveTo } = useEditsGuard(isSavable);
|
||||
|
||||
return {
|
||||
t,
|
||||
|
||||
@@ -49,8 +49,8 @@ import { useSettingsStore, useServerStore } from '@/stores';
|
||||
import ProjectInfoSidebarDetail from './components/project-info-sidebar-detail.vue';
|
||||
import { clone } from 'lodash';
|
||||
import useShortcut from '@/composables/use-shortcut';
|
||||
import unsavedChanges from '@/composables/unsaved-changes';
|
||||
import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
|
||||
import useEditsGuard from '@/composables/use-edits-guard';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
export default defineComponent({
|
||||
components: { SettingsNavigation, ProjectInfoSidebarDetail },
|
||||
@@ -81,20 +81,7 @@ export default defineComponent({
|
||||
return noEdits.value;
|
||||
});
|
||||
|
||||
unsavedChanges(isSavable);
|
||||
|
||||
const confirmLeave = ref(false);
|
||||
const leaveTo = ref<string | null>(null);
|
||||
|
||||
const editsGuard: NavigationGuard = (to) => {
|
||||
if (!noEdits.value) {
|
||||
confirmLeave.value = true;
|
||||
leaveTo.value = to.fullPath;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
onBeforeRouteUpdate(editsGuard);
|
||||
onBeforeRouteLeave(editsGuard);
|
||||
const { confirmLeave, leaveTo } = useEditsGuard(isSavable);
|
||||
|
||||
return {
|
||||
t,
|
||||
|
||||
@@ -107,7 +107,7 @@ import { useI18n } from 'vue-i18n';
|
||||
import { defineComponent, computed, toRefs, ref } from 'vue';
|
||||
|
||||
import SettingsNavigation from '../../../components/navigation.vue';
|
||||
import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
|
||||
import { useRouter } from 'vue-router';
|
||||
import RevisionsDrawerDetail from '@/views/private/components/revisions-drawer-detail';
|
||||
import useItem from '@/composables/use-item';
|
||||
import { useUserStore } from '@/stores/';
|
||||
@@ -115,7 +115,7 @@ import RoleInfoSidebarDetail from './components/role-info-sidebar-detail.vue';
|
||||
import PermissionsOverview from './components/permissions-overview.vue';
|
||||
import UsersInvite from '@/views/private/components/users-invite';
|
||||
import useShortcut from '@/composables/use-shortcut';
|
||||
import unsavedChanges from '@/composables/unsaved-changes';
|
||||
import useEditsGuard from '@/composables/use-edits-guard';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'RolesItem',
|
||||
@@ -173,20 +173,7 @@ export default defineComponent({
|
||||
return hasEdits.value;
|
||||
});
|
||||
|
||||
unsavedChanges(isSavable);
|
||||
|
||||
const confirmLeave = ref(false);
|
||||
const leaveTo = ref<string | null>(null);
|
||||
|
||||
const editsGuard: NavigationGuard = (to) => {
|
||||
if (hasEdits.value) {
|
||||
confirmLeave.value = true;
|
||||
leaveTo.value = to.fullPath;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
onBeforeRouteUpdate(editsGuard);
|
||||
onBeforeRouteLeave(editsGuard);
|
||||
const { confirmLeave, leaveTo } = useEditsGuard(isSavable);
|
||||
|
||||
return {
|
||||
t,
|
||||
|
||||
@@ -88,12 +88,12 @@ import { useI18n } from 'vue-i18n';
|
||||
import { defineComponent, computed, toRefs, ref } from 'vue';
|
||||
|
||||
import SettingsNavigation from '../../components/navigation.vue';
|
||||
import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
|
||||
import { useRouter } from 'vue-router';
|
||||
import RevisionsDrawerDetail from '@/views/private/components/revisions-drawer-detail';
|
||||
import useItem from '@/composables/use-item';
|
||||
import SaveOptions from '@/views/private/components/save-options';
|
||||
import useShortcut from '@/composables/use-shortcut';
|
||||
import unsavedChanges from '@/composables/unsaved-changes';
|
||||
import useEditsGuard from '@/composables/use-edits-guard';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'WebhooksItem',
|
||||
@@ -148,20 +148,7 @@ export default defineComponent({
|
||||
return hasEdits.value;
|
||||
});
|
||||
|
||||
unsavedChanges(isSavable);
|
||||
|
||||
const confirmLeave = ref(false);
|
||||
const leaveTo = ref<string | null>(null);
|
||||
|
||||
const editsGuard: NavigationGuard = (to) => {
|
||||
if (hasEdits.value) {
|
||||
confirmLeave.value = true;
|
||||
leaveTo.value = to.fullPath;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
onBeforeRouteUpdate(editsGuard);
|
||||
onBeforeRouteLeave(editsGuard);
|
||||
const { confirmLeave, leaveTo } = useEditsGuard(isSavable);
|
||||
|
||||
return {
|
||||
t,
|
||||
|
||||
Reference in New Issue
Block a user