Files
gemory/src/pages/market/Acquisitions.vue
T

29 lines
1.1 KiB
Vue

<script setup lang="ts">
import {AcquisitionsPanel, useAcquiredTypesStore} from '@/market/acquisition';
import {ArrowPathIcon} from '@heroicons/vue/24/outline';
import {useAutoRefresh} from '@/composables';
import {ref} from 'vue';
const acquiredTypesStore = useAcquiredTypesStore();
const panel = ref<InstanceType<typeof AcquisitionsPanel>>();
const refresh = async () => {
await panel.value?.refresh();
}
const {active: autoRefresh, toggle: toggleAutoRefresh} = useAutoRefresh(refresh, 5 * 60 * 1000);
</script>
<template>
<div class="mt-4">
<div class="flex">
<div class="ms-auto flex">
<button class="rounded-e-none" @click="refresh">Refresh</button>
<button class="rounded-s-none border-s-0 flex items-center" :class="{ 'bg-slate-700': autoRefresh }" title="Auto refresh" @click="toggleAutoRefresh">
<ArrowPathIcon class="w-5 h-5" :class="{ 'animate-spin': autoRefresh }" />
</button>
</div>
</div>
<AcquisitionsPanel ref="panel" :items="acquiredTypesStore.acquiredTypes" ignoredColumns="date" />
</div>
</template>