11<script setup>
22import { Listing , DropdownItem , Header , Button } from " @statamic/cms/ui" ;
3- import { requireElevatedSession } from " @statamic/cms"
3+ import { requireElevatedSession } from " @statamic/cms" ;
44import { useBackupStore } from " ../store" ;
55import { ref , watch } from " vue" ;
66import { useResumable } from " ../resumable" ;
77
8- const props = defineProps ([' chunkSize' ]);
8+ const props = defineProps ([" chunkSize" ]);
99
1010const backupStore = useBackupStore ();
1111
@@ -14,102 +14,144 @@ const listing = ref(null);
1414const dropZone = ref (null );
1515const browseTarget = ref (null );
1616
17- const { files } = useResumable ({ chunkSize: props .chunkSize ?? 2 * 1024 * 1024 , dropZone, browseTarget, onFileUploaded: (file ) => {
18- listing .value .refresh ();
19- }});
17+ const { files } = useResumable ({
18+ chunkSize: props .chunkSize ?? 2 * 1024 * 1024 ,
19+ dropZone,
20+ browseTarget,
21+ onFileUploaded: (file ) => {
22+ listing .value .refresh ();
23+ },
24+ });
2025
2126backupStore .startPolling ();
2227
23- watch (() => backupStore .status , (newStatus , oldStatus ) => {
28+ watch (
29+ () => backupStore .status ,
30+ (newStatus , oldStatus ) => {
31+ if (oldStatus === " initializing" ) return ;
2432 if (newStatus !== oldStatus) {
25- listing .value .refresh ();
33+ listing .value .refresh ();
2634 }
27- });
28-
29-
30- const restoreFrom = async (id ) => {
31-
32- try {
33- await requireElevatedSession ();
34-
35- const { data } = await window .Statamic .$app .config .globalProperties .$axios .post (cp_url (` api/backups/restore/${ id} ` ));
35+ }
36+ );
3637
37- Statamic . $toast . info ( __ ( data . message ));
38- } catch (e) {
39- console .error (e );
38+ const withErrHandling = ( fn ) => async ( params ) => {
39+ return fn (params). catch (( err ) => {
40+ console .error (err );
4041
41- if (error .response .data .message ) {
42- Statamic .$toast .error (message);
43- } else {
44- Statamic .$toast .error (__ (' statamic-backup::backup.restore.failed' ));
45- }
42+ if (err .response ) {
43+ Statamic .$toast .error (err .response .data .message );
44+ } else {
45+ Statamic .$toast .error (err .message );
4646 }
47- }
47+ });
48+ };
4849
49- const queueBackup = async () => {
50- try {
51- backupStore .setStatus (' backup_in_progress' );
50+ const queueRestore = withErrHandling (async (id ) => {
51+ await requireElevatedSession ();
5252
53- const { data } = await window .Statamic .$app .config .globalProperties .$axios .post (cp_url (" api/backups" ));
53+ const { data } =
54+ await window .Statamic .$app .config .globalProperties .$axios .post (
55+ cp_url (` api/backups/restore/${ id} ` )
56+ );
5457
55- Statamic .$toast .info (__ (data .message ));
56- listing .value .refresh ();
57- } catch (e) {
58- console .error (e);
58+ Statamic .$toast .info (__ (data .message ));
59+ });
5960
60- if (error .response .data .message ) {
61- Statamic .$toast .error (message);
62- } else {
63- Statamic .$toast .error (__ (' statamic-backup::backup.restore.failed' ));
64- }
65- }
66- }
61+ const queueBackup = withErrHandling (async () => {
62+ backupStore .setStatus (" backup_in_progress" );
6763
68- const deleteBackup = async (id ) => {
69- try {
70- await requireElevatedSession ();
64+ const { data } =
65+ await window .Statamic .$app .config .globalProperties .$axios .post (
66+ cp_url (" api/backups" )
67+ );
7168
72- const { data } = await window .Statamic .$app .config .globalProperties .$axios .delete (cp_url (` api/backups/${ id} ` ));
69+ Statamic .$toast .info (__ (data .message ));
70+ listing .value .refresh ();
71+ });
7372
74- Statamic .$toast .info (__ (data .message ));
75- listing .value .refresh ();
76- } catch (e) {
77- console .error (e);
73+ const deleteBackup = withErrHandling (async (id ) => {
74+ await requireElevatedSession ();
7875
79- if (error .response .data .message ) {
80- Statamic .$toast .error (message);
81- } else {
82- Statamic .$toast .error (__ (' statamic-backup::backup.destroy.failed' ));
83- }
84- }
85- }
76+ const { data } =
77+ await window .Statamic .$app .config .globalProperties .$axios .delete (
78+ cp_url (` api/backups/${ id} ` )
79+ );
8680
81+ Statamic .$toast .info (__ (data .message ));
82+ listing .value .refresh ();
83+ });
8784< / script>
8885
8986< template>
90- < Header : icon= " database" : title= " __('statamic-backup::backup.title')" >
91- < Button variant= " subtle" ref= " browseTarget" > {{ __ (" statamic-backup::backup.upload.label" ) }}< / Button>
92- < Button variant= " primary" v- on: click= " queueBackup"
93- : disabled= " !backupStore.abilities.backup.isPossible" > {{ __ (" statamic-backup::backup.create" ) }}< / Button>
94- < / Header>
95-
96- < p v- for = " file in files" : key= " file.file.uniqueIdentifier" class = " mb-2" >
97- < span> {{ file .file .fileName }}< / span>
98- < span v- if = " file.status === 'uploading'" > - {{ Math .round (file .progress * 100 ) }}% < / span>
99- < span v- if = " file.status === 'retrying'" > - {{ __ (' statamic-backup::backup.upload.retrying' ) }}< / span>
100- < span v- if = " file.status === 'error'" class = " text-red-600" > - {{ __ (' statamic-backup::backup.upload.error' ) }}< / span>
101- < / p>
102-
103- < Listing ref= " listing" : allowSearch= " false" : allowCustomizingColumns= " false" : url= " cp_url('api/backups')" >
104- < template #prepended- row- actions= " { row }" >
105- < DropdownItem v- if = " backupStore.abilities.download.isPermitted"
106- : text= " __('statamic-backup::backup.download.label')"
107- : href= " `${cp_url('api/backups/download')}/${row.id}`" / >
108- < DropdownItem v- if = " backupStore.abilities.restore.isPermitted"
109- : disabled= " !backupStore.abilities.restore.isPossible" @click= " restoreFrom(row.id)"
110- : text= " __('statamic-backup::backup.restore.label')" / >
111- < DropdownItem v- if = " backupStore.abilities.destroy.isPermitted" variant= " destructive"
112- @click= " deleteBackup(row.id)" : text= " __('statamic-backup::backup.destroy.label')" / >
113- < / template>
114- < / Listing>
87+ < Header : icon= " database" : title= " __('statamic-backup::backup.title')" >
88+ < Button variant= " subtle" ref= " browseTarget" > {{
89+ __ (" statamic-backup::backup.upload.label" )
90+ }}< / Button>
91+ < Button
92+ variant= " primary"
93+ v- on: click= " queueBackup"
94+ : disabled= " !backupStore.abilities.backup.isPossible"
95+ : loading= " backupStore.status === 'backup_in_progress'"
96+ >
97+ {{ __ (" statamic-backup::backup.create" ) }}
98+ < / Button>
99+ < / Header>
100+
101+ < p v- for = " file in files" : key= " file.file.uniqueIdentifier" class = " mb-2" >
102+ < span> {{ file .file .fileName }}< / span>
103+ < span v- if = " file.status === 'uploading'" >
104+ - {{ Math .round (file .progress * 100 ) }}% < / span
105+ >
106+ < span v- if = " file.status === 'retrying'" >
107+ - {{ __ (" statamic-backup::backup.upload.retrying" ) }}< / span
108+ >
109+ < span v- if = " file.status === 'error'" class = " text-red-600" >
110+ - {{ __ (" statamic-backup::backup.upload.error" ) }}< / span
111+ >
112+ < / p>
113+
114+ < Listing
115+ ref= " listing"
116+ : allowSearch= " false"
117+ : allowCustomizingColumns= " false"
118+ : url= " cp_url('api/backups')"
119+ : columns= " [
120+ {
121+ field: 'name',
122+ label: __('statamic-backup::backup.name'),
123+ visible: true,
124+ },
125+ {
126+ field: 'created_at',
127+ label: __('statamic-backup::backup.created_at'),
128+ visible: true,
129+ },
130+ {
131+ field: 'size',
132+ label: __('statamic-backup::backup.size'),
133+ visible: true,
134+ },
135+ ]"
136+ >
137+ < template #prepended- row- actions= " { row }" >
138+ < DropdownItem
139+ v- if = " backupStore.abilities.download.isPermitted"
140+ : text= " __('statamic-backup::backup.download.label')"
141+ : href= " `${cp_url('api/backups/download')}/${row.id}`"
142+ / >
143+ < DropdownItem
144+ v- if = " backupStore.abilities.restore.isPermitted"
145+ : disabled= " !backupStore.abilities.restore.isPossible"
146+ v- on: click= " queueRestore(row.id)"
147+ : text= " __('statamic-backup::backup.restore.label')"
148+ / >
149+ < DropdownItem
150+ v- if = " backupStore.abilities.destroy.isPermitted"
151+ variant= " destructive"
152+ v- on: click= " deleteBackup(row.id)"
153+ : text= " __('statamic-backup::backup.destroy.label')"
154+ / >
155+ < / template>
156+ < / Listing>
115157< / template>
0 commit comments