131 lines
6.5 KiB
Vue
131 lines
6.5 KiB
Vue
<template>
|
|
<AppLayout>
|
|
<template #header>
|
|
<div>
|
|
<Link :href="route('schemas.show', table.source_database.id)" 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">
|
|
{{ table.schema_name }}.{{ table.table_name }}
|
|
</h2>
|
|
</div>
|
|
</template>
|
|
|
|
<div class="grid gap-6">
|
|
<!-- Колонки -->
|
|
<Card header="Колонки">
|
|
<template #content>
|
|
<DataTable :value="table.columns" stripedRows scrollable scrollHeight="400px">
|
|
<Column field="column_name" header="Колонка"></Column>
|
|
<Column field="data_type" header="Тип"></Column>
|
|
<Column field="is_nullable" header="NULL">
|
|
<template #body="slotProps">
|
|
<Tag :value="slotProps.data.is_nullable ? 'Да' : 'Нет'"
|
|
:severity="slotProps.data.is_nullable ? 'info' : 'warning'" />
|
|
</template>
|
|
</Column>
|
|
<Column field="is_primary_key" header="PK">
|
|
<template #body="slotProps">
|
|
<i v-if="slotProps.data.is_primary_key" class="pi pi-check text-green-600"></i>
|
|
<i v-else class="pi pi-times text-gray-300"></i>
|
|
</template>
|
|
</Column>
|
|
<Column field="is_foreign_key" header="FK">
|
|
<template #body="slotProps">
|
|
<i v-if="slotProps.data.is_foreign_key" class="pi pi-link text-blue-600"></i>
|
|
<i v-else class="pi pi-times text-gray-300"></i>
|
|
</template>
|
|
</Column>
|
|
<Column field="is_indexed" header="Индекс">
|
|
<template #body="slotProps">
|
|
<i v-if="slotProps.data.is_indexed" class="pi pi-check text-green-600"></i>
|
|
<i v-else class="pi pi-times text-gray-300"></i>
|
|
</template>
|
|
</Column>
|
|
<Column field="column_default" header="По умолчанию"></Column>
|
|
<Column header="Настройки миграции">
|
|
<template #body="slotProps">
|
|
<div class="flex items-center gap-2">
|
|
<InputText v-model="slotProps.data.target_column_name"
|
|
placeholder="Имя в цели"
|
|
size="small"
|
|
class="w-32" />
|
|
<Button icon="pi pi-check" size="small" severity="success"
|
|
@click="saveColumn(slotProps.data)" />
|
|
</div>
|
|
</template>
|
|
</Column>
|
|
</DataTable>
|
|
</template>
|
|
</Card>
|
|
|
|
<!-- Индексы -->
|
|
<Card header="Индексы">
|
|
<template #content>
|
|
<DataTable :value="table.indexes" stripedRows>
|
|
<Column field="index_name" header="Название"></Column>
|
|
<Column field="index_type" header="Тип"></Column>
|
|
<Column field="is_unique" header="Уникальный">
|
|
<template #body="slotProps">
|
|
<Tag :value="slotProps.data.is_unique ? 'Да' : 'Нет'"
|
|
:severity="slotProps.data.is_unique ? 'success' : 'secondary'" />
|
|
</template>
|
|
</Column>
|
|
<Column field="is_primary" header="Первичный">
|
|
<template #body="slotProps">
|
|
<Tag :value="slotProps.data.is_primary ? 'Да' : 'Нет'"
|
|
:severity="slotProps.data.is_primary ? 'warning' : 'secondary'" />
|
|
</template>
|
|
</Column>
|
|
<Column field="columns" header="Колонки">
|
|
<template #body="slotProps">
|
|
<span v-if="Array.isArray(slotProps.data.columns)">
|
|
{{ slotProps.data.columns.join(', ') }}
|
|
</span>
|
|
<span v-else>{{ slotProps.data.columns }}</span>
|
|
</template>
|
|
</Column>
|
|
</DataTable>
|
|
</template>
|
|
</Card>
|
|
|
|
<!-- Внешние ключи -->
|
|
<Card header="Внешние ключи">
|
|
<template #content>
|
|
<DataTable :value="table.foreignKeys" stripedRows>
|
|
<Column field="constraint_name" header="Ограничение"></Column>
|
|
<Column field="column_name" header="Колонка"></Column>
|
|
<Column field="referenced_table" header="Таблица ссылки"></Column>
|
|
<Column field="referenced_column" header="Колонка ссылки"></Column>
|
|
<Column field="on_delete" header="ON DELETE"></Column>
|
|
<Column field="on_update" header="ON UPDATE"></Column>
|
|
</DataTable>
|
|
</template>
|
|
</Card>
|
|
</div>
|
|
</AppLayout>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { router, Link } 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 Tag from 'primevue/tag';
|
|
import InputText from 'primevue/inputtext';
|
|
import Button from 'primevue/button';
|
|
|
|
const props = defineProps({
|
|
table: Object,
|
|
});
|
|
|
|
const saveColumn = (column) => {
|
|
router.put(route('schemas.columns.update', column.id), {
|
|
target_column_name: column.target_column_name,
|
|
}, {
|
|
preserveScroll: true,
|
|
});
|
|
};
|
|
</script>
|