rockfic/next
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(components): add loading spinner to client-only fallback slot

Browse Source
This commit is contained in:
✑ ☙◦❀ The Tablet ☯ GamerGirlandCo ❀◦❧ 2024-03-16 20:26:05 -04:00
parent 7b8a089d95
commit dcda8143f9
Signed by: tablet
GPG Key ID: 924A5F6AF051E87C
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/story/create/storyForm.vue
View File

@ -3,6 +3,7 @@
import { v4 } from "uuid"; import { v4 } from "uuid";
import lmove from "lodash-move"; import lmove from "lodash-move";
import { Field, FieldArray, useForm, useFieldArray } from "vee-validate"; import { Field, FieldArray, useForm, useFieldArray } from "vee-validate";
import { ASpin } from "#components";
import { storySchema } from "@client/storyFormSchema"; import { storySchema } from "@client/storyFormSchema";
import { FormStory, defaultChapter } from "@client/types/form/story"; import { FormStory, defaultChapter } from "@client/types/form/story";
import { autoEdit, autoSave, debouncedAutoEdit, debouncedAutoSave } from "@client/utils"; import { autoEdit, autoSave, debouncedAutoEdit, debouncedAutoSave } from "@client/utils";
@ -112,7 +113,7 @@
<a-divider /> <a-divider />
<!-- <test1/> --> <!-- <test1/> -->
<field-array name="chapters" v-slot="{ fields, push, remove, move }"> <field-array name="chapters" v-slot="{ fields, push, remove, move }">
<client-only> <client-only :fallback="h(ASpin)">
<div> <div>
<div v-for="(element, index) in data.chapters"> <div v-for="(element, index) in data.chapters">
<client-only> <client-only>
@ -151,6 +152,11 @@
</div> </div>
</client-only> </client-only>
<client-only> <client-only>
<template #fallback>
<div style="display: flex; justify-content: center">
<a-spin />
</div>
</template>
<draggable <draggable
:component-data="{ type: 'transtion-group', 'data-testid': 'storyform.chapters' }" :component-data="{ type: 'transtion-group', 'data-testid': 'storyform.chapters' }"
@start="drag = true" @start="drag = true"