Files
2026-03-23 00:51:38 +09:00

89 lines
3.6 KiB
Vue

<template>
<AppLayout>
<template #header>
<div class="flex flex-row justify-between items-center">
<div>
<Link :href="route('schemas.index')" class="inline-flex items-center text-primary hover:underline text-sm">
<i class="pi pi-arrow-left mr-1"></i> Назад к схемам
</Link>
<h2 class="text-xl font-bold mt-1">{{ database.name }}</h2>
<p class="text-sm text-muted-color">{{ database.host }}:{{ database.port }}/{{ database.database }}</p>
</div>
<Button label="Синхронизировать" icon="pi pi-refresh" severity="success" size="small"
@click="syncSchema" :loading="syncing" />
</div>
</template>
<Message v-if="$page.props.flash?.success" severity="success" :life="3000" class="mb-4">
{{ $page.props.flash.success }}
</Message>
<Card>
<template #content>
<DataTable :value="database.tables" stripedRows>
<Column field="schema_name" header="Схема" sortable></Column>
<Column field="table_name" header="Таблица">
<template #body="slotProps">
<Link :href="route('schemas.table.detail', slotProps.data.id)"
class="text-primary hover:underline">
{{ slotProps.data.table_name }}
</Link>
</template>
</Column>
<Column field="comment" header="Комментарий"></Column>
<Column header="Колонки">
<template #body="slotProps">
{{ slotProps.data.columns?.length || 0 }}
</template>
</Column>
<Column header="Индексы">
<template #body="slotProps">
{{ slotProps.data.indexes?.length || 0 }}
</template>
</Column>
<Column header="Внешние ключи">
<template #body="slotProps">
{{ slotProps.data.foreignKeys?.length || 0 }}
</template>
</Column>
<Column field="last_checked_at" header="Последняя проверка">
<template #body="slotProps">
{{ slotProps.data.last_checked_at ? formatDate(slotProps.data.last_checked_at) : 'Никогда' }}
</template>
</Column>
</DataTable>
</template>
</Card>
</AppLayout>
</template>
<script setup>
import { ref } from 'vue';
import { Link, router } from '@inertiajs/vue3';
import AppLayout from '@/Layouts/AppLayout.vue';
import Card from 'primevue/card';
import DataTable from 'primevue/datatable';
import Column from 'primevue/column';
import Button from 'primevue/button';
import Message from 'primevue/message';
const props = defineProps({
database: Object,
});
const syncing = ref(false);
const formatDate = (dateString) => {
return new Date(dateString).toLocaleString('ru-RU');
};
const syncSchema = () => {
syncing.value = true;
router.post(route('schemas.sync', props.database.id), {}, {
onFinish: () => {
syncing.value = false;
}
});
};
</script>