feat: 为索引按钮添加动画

- 为索引按钮添加动画，在索引过程中使用动画表示进度

src/meilisearch_module/meili-index.vue

@@ -16,8 +16,8 @@
 		</template>
 
 		<template #actions>
-			<v-button xSmall color="primary" @click="handleReindexAll">
+			<v-button :disabled="reindexingAll" xSmall color="primary" @click="handleReindexAll">
-				一键重建
+				<span>一键重建</span>
 			</v-button>
 		</template>
 
@@ -29,7 +29,7 @@
 				</template>"
 
 				<template #item.actions="{ item }">
-					<v-button xSmall @click="handleReindex(item)">刷新索引</v-button>
+					<v-button :disabled="reindexing[item.id]" xSmall @click="handleReindex(item)">刷新索引</v-button>
 				</template>
 			</v-table>
 		</section>
@@ -40,9 +40,10 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue';
 import { useApi } from '@directus/extensions-sdk';
+import type { MeiliIndexConfig } from '../types/meilisearch';
 
 const api = useApi();
-const configs = ref([]);
+const configs = ref<MeiliIndexConfig[]>([]);
 const headers = [
 	{ text: '集合名称', value: 'collection_name' },
 	{ text: '索引名称', value: 'index_name' },
@@ -50,28 +51,40 @@ const headers = [
 	{ text: '操作', value: 'actions', sortable: false },
 ];
 
+const reindexingAll = ref(false);
+const reindexing = ref<Record<string, boolean>>({});
+
 const fetchConfigs = async () => {
-	const resp = await api.get('/items/meili_index_configs', { params: { limit: -1 } });
+	const resp = await api.get<{ data: MeiliIndexConfig[] }>('/items/meili_index_configs', { params: { limit: -1 } });
+	console.log(resp)
 	configs.value = resp.data.data;
+
+	reindexing.value = Object.fromEntries(configs.value.map(c => [c.id, false]));
 }
 
 const handleReindexAll = async () => {
 	try {
+		reindexingAll.value = true;
 		await api.post('/meilisearch/reindex');
 		console.log('Reindexing all started successfully');
 	} catch (error) {
 		console.error('Reindexing all failed:', error);
+	} finally {
+		reindexingAll.value = false;
 	}
 }
 
-const handleReindex = async (item: any) => {
+const handleReindex = async (item: MeiliIndexConfig) => {
 	if (!item.enabled) return;
 	const configId = item.id;
 	try {
+		reindexing.value[configId] = true;
 		await api.post(`/meilisearch/reindex/${configId}`);
 		console.log('Reindexing started successfully');
 	} catch (error) {
 		console.error('Reindexing failed:', error);
+	} finally {
+		reindexing.value[configId] = false;
 	}
 
 };