Fix Meilisearch widget reactivity

This commit is contained in:
PrivateGER 2023-05-28 02:58:20 +02:00
parent 9beda9d362
commit 4fdf331f63
1 changed files with 20 additions and 5 deletions

View File

@ -11,17 +11,32 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import {} from "vue"; import {onBeforeUnmount, onMounted} from "vue";
import bytes from "@/filters/bytes"; import bytes from "@/filters/bytes";
import {i18n} from "@/i18n"; import {i18n} from "@/i18n";
const props = defineProps<{ const props = defineProps<{
meta: any; // TODO connection: any;
meta: any;
}>(); }>();
const total_size = $computed(() => props.meta.meilisearch.size); let total_size: number = $ref(0);
const index_count = $computed(() => props.meta.meilisearch.indexed_count); let index_count: number = $ref(0);
const available = $computed(() => props.meta.meilisearch.health); let available: string = $ref("unavailable");
function onStats(stats) {
total_size = stats.meilisearch.size;
index_count = stats.meilisearch.indexed_count;
available = stats.meilisearch.available;
}
onMounted(() => {
props.connection.on("stats", onStats);
});
onBeforeUnmount(() => {
props.connection.off("stats", onStats);
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>