brusoff/project-replica
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
brusnitsyn
2026-03-23 00:51:38 +09:00
commit 07854e0a9d
110 changed files with 19528 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
resources/js/Pages/Databases/SourceDatabaseForm.vue Normal file
View File

@@ -0,0 +1,114 @@
<template>
<AppLayout>
<template #header>
<h2 class="font-bold">
{{ database?.id ? 'Редактирование' : 'Создание' }} исходной БД
</h2>
</template>
<Card class="max-w-2xl">
<template #content>
<form @submit.prevent="submit" class="flex flex-col gap-4">
<div>
<label for="name" class="block text-sm font-medium mb-1">Название *</label>
<InputText id="name" v-model="form.name" class="w-full" :class="{ 'p-invalid': form.errors.name }" />
<small class="p-error">{{ form.errors.name }}</small>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label for="host" class="block text-sm font-medium mb-1">Хост *</label>
<InputText id="host" v-model="form.host" class="w-full" :class="{ 'p-invalid': form.errors.host }" />
<small class="p-error">{{ form.errors.host }}</small>
</div>
<div>
<label for="port" class="block text-sm font-medium mb-1">Порт *</label>
<InputText id="port" v-model="form.port" class="w-full" :class="{ 'p-invalid': form.errors.port }" />
<small class="p-error">{{ form.errors.port }}</small>
</div>
</div>
<div>
<label for="database" class="block text-sm font-medium mb-1">Имя базы данных *</label>
<InputText id="database" v-model="form.database" class="w-full" :class="{ 'p-invalid': form.errors.database }" />
<small class="p-error">{{ form.errors.database }}</small>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label for="username" class="block text-sm font-medium mb-1">Пользователь *</label>
<InputText id="username" v-model="form.username" class="w-full" :class="{ 'p-invalid': form.errors.username }" />
<small class="p-error">{{ form.errors.username }}</small>
</div>
<div>
<label for="password" class="block text-sm font-medium mb-1">
Пароль {{ database?.id ? '(оставьте пустым для сохранения текущего)' : '*' }}
</label>
<Password id="password" v-model="form.password" class="w-full" :class="{ 'p-invalid': form.errors.password }"
:feedback="false" toggle-mask />
<small class="p-error">{{ form.errors.password }}</small>
</div>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label for="driver" class="block text-sm font-medium mb-1">Драйвер</label>
<Dropdown id="driver" v-model="form.driver"
:options="[
{ label: 'PostgreSQL', value: 'pgsql' },
{ label: 'Microsoft SQL Server', value: 'mssql' }
]"
optionLabel="label" optionValue="value"
class="w-full" />
</div>
<div>
<label for="description" class="block text-sm font-medium mb-1">Описание</label>
<InputText id="description" v-model="form.description" class="w-full" />
</div>
</div>
<div class="flex gap-2 pt-4">
<Button type="submit" label="Сохранить" icon="pi pi-check" :loading="form.processing" />
<Link :href="route('databases.source.index')">
<Button type="button" label="Отмена" severity="secondary" />
</Link>
</div>
</form>
</template>
</Card>
</AppLayout>
</template>
<script setup>
import { useForm, Link } from '@inertiajs/vue3';
import AppLayout from '@/Layouts/AppLayout.vue';
import Card from 'primevue/card';
import InputText from 'primevue/inputtext';
import Textarea from 'primevue/textarea';
import Button from 'primevue/button';
import Password from 'primevue/password';
import Dropdown from 'primevue/dropdown';
const props = defineProps({
database: Object,
});
const form = useForm({
name: props.database?.name || '',
host: props.database?.host || '',
port: props.database?.port || 5432,
database: props.database?.database || '',
username: props.database?.username || '',
password: '',
driver: props.database?.driver || 'pgsql',
description: props.database?.description || '',
});
const submit = () => {
if (props.database?.id) {
form.put(route('databases.source.update', props.database.id));
} else {
form.post(route('databases.source.store'));
}
};
</script>

131
resources/js/Pages/Databases/SourceDatabases.vue Normal file
View File

@@ -0,0 +1,131 @@
<template>
<AppLayout>
<template #header>
<div class="flex flex-row justify-between items-center w-full">
<h2 class="font-bold">Исходные базы данных</h2>
<Link :href="route('databases.source.create')">
<Button icon="pi pi-plus" label="Добавить БД" size="small" />
</Link>
</div>
</template>
<Message v-if="$page.props.flash?.success" severity="success" :life="3000" class="mb-4">
{{ $page.props.flash.success }}
</Message>
<Message v-if="$page.props.flash?.error" severity="error" :life="3000" class="mb-4">
{{ $page.props.flash.error }}
</Message>
<Card>
<template #content>
<DataTable :value="databases" stripedRows>
<Column field="name" header="Название" sortable></Column>
<Column field="host" header="Хост" sortable></Column>
<Column field="port" header="Порт" sortable></Column>
<Column field="database" header="База данных" sortable></Column>
<Column field="driver" header="Драйвер" sortable></Column>
<Column field="tables_count" header="Таблиц" sortable></Column>
<Column field="is_active" header="Статус">
<template #body="slotProps">
<Tag :value="slotProps.data.is_active ? 'Активна' : 'Неактивна'"
:severity="slotProps.data.is_active ? 'success' : 'danger'" />
</template>
</Column>
<Column header="Действия">
<template #body="slotProps">
<div class="flex gap-2">
<Button icon="pi pi-play" severity="info" size="small"
@click="testConnection(slotProps.data)"
title="Проверить подключение" />
<Button icon="pi pi-refresh" severity="success" size="small"
@click="syncSchema(slotProps.data)"
title="Синхронизировать" />
<Link :href="route('databases.source.edit', slotProps.data.id)">
<Button icon="pi pi-pencil" severity="secondary" size="small"
title="Редактировать" />
</Link>
<Button icon="pi pi-trash" severity="danger" size="small"
@click="confirmDelete(slotProps.data)"
title="Удалить" />
</div>
</template>
</Column>
</DataTable>
</template>
</Card>
<Dialog v-model:visible="testingConnection" modal header="Проверка подключения" :style="{ width: '300px' }">
<div class="flex items-center gap-3">
<ProgressSpinner style="width: 30px; height: 30px" />
<span>Проверка подключения к базе данных...</span>
</div>
</Dialog>
<Dialog v-model:visible="deletingDialog" modal header="Подтверждение удаления" :style="{ width: '400px' }">
<p>Вы уверены, что хотите удалить базу данных "<strong>{{ databaseToDelete?.name }}</strong>"?</p>
<template #footer>
<Button label="Отмена" icon="pi pi-times" @click="deletingDialog = false" severity="secondary" />
<Button label="Удалить" icon="pi pi-trash" @click="deleteDatabase" severity="danger" />
</template>
</Dialog>
</AppLayout>
</template>
<script setup>
import { ref } from 'vue';
import { Link, router } from '@inertiajs/vue3';
import AppLayout from '@/Layouts/AppLayout.vue';
import DataTable from 'primevue/datatable';
import Column from 'primevue/column';
import Button from 'primevue/button';
import Tag from 'primevue/tag';
import Message from 'primevue/message';
import Card from 'primevue/card';
import Dialog from 'primevue/dialog';
import ProgressSpinner from 'primevue/progressspinner';
const props = defineProps({
databases: Array,
});
const testingConnection = ref(false);
const deletingDialog = ref(false);
const databaseToDelete = ref(null);
const testConnection = async (database) => {
testingConnection.value = true;
try {
const response = await fetch(route('databases.source.test', database.id));
const result = await response.json();
testingConnection.value = false;
if (result.success) {
alert(`Подключение успешно!\nВерсия PostgreSQL: ${result.version}`);
} else {
alert(`Ошибка подключения: ${result.message}`);
}
} catch (error) {
testingConnection.value = false;
alert(`Ошибка: ${error.message}`);
}
};
const syncSchema = (database) => {
if (confirm(`Синхронизировать схему из "${database.name}"?`)) {
router.post(route('databases.source.sync', database.id));
}
};
const confirmDelete = (database) => {
databaseToDelete.value = database;
deletingDialog.value = true;
};
const deleteDatabase = () => {
router.delete(route('databases.source.destroy', databaseToDelete.value.id));
deletingDialog.value = false;
databaseToDelete.value = null;
};
</script>

114
resources/js/Pages/Databases/TargetDatabaseForm.vue Normal file
View File

@@ -0,0 +1,114 @@
<template>
<AppLayout>
<template #header>
<h2 class="text-xl font-bold">
{{ database?.id ? 'Редактирование' : 'Создание' }} целевой БД
</h2>
</template>
<Card class="max-w-2xl">
<template #content>
<form @submit.prevent="submit" class="flex flex-col gap-4">
<div>
<label for="name" class="block text-sm font-medium mb-1">Название *</label>
<InputText id="name" v-model="form.name" class="w-full" :class="{ 'p-invalid': form.errors.name }" />
<small class="p-error">{{ form.errors.name }}</small>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label for="host" class="block text-sm font-medium mb-1">Хост *</label>
<InputText id="host" v-model="form.host" class="w-full" :class="{ 'p-invalid': form.errors.host }" />
<small class="p-error">{{ form.errors.host }}</small>
</div>
<div>
<label for="port" class="block text-sm font-medium mb-1">Порт *</label>
<InputText id="port" v-model="form.port" class="w-full" :class="{ 'p-invalid': form.errors.port }" />
<small class="p-error">{{ form.errors.port }}</small>
</div>
</div>
<div>
<label for="database" class="block text-sm font-medium mb-1">Имя базы данных *</label>
<InputText id="database" v-model="form.database" class="w-full" :class="{ 'p-invalid': form.errors.database }" />
<small class="p-error">{{ form.errors.database }}</small>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label for="username" class="block text-sm font-medium mb-1">Пользователь *</label>
<InputText id="username" v-model="form.username" class="w-full" :class="{ 'p-invalid': form.errors.username }" />
<small class="p-error">{{ form.errors.username }}</small>
</div>
<div>
<label for="password" class="block text-sm font-medium mb-1">
Пароль {{ database?.id ? '(оставьте пустым для сохранения текущего)' : '*' }}
</label>
<Password id="password" v-model="form.password" class="w-full" :class="{ 'p-invalid': form.errors.password }"
:feedback="false" toggle-mask />
<small class="p-error">{{ form.errors.password }}</small>
</div>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<label for="driver" class="block text-sm font-medium mb-1">Драйвер</label>
<Dropdown id="driver" v-model="form.driver"
:options="[
{ label: 'PostgreSQL', value: 'pgsql' },
{ label: 'Microsoft SQL Server', value: 'mssql' }
]"
optionLabel="label" optionValue="value"
class="w-full" />
</div>
<div>
<label for="description" class="block text-sm font-medium mb-1">Описание</label>
<InputText id="description" v-model="form.description" class="w-full" />
</div>
</div>
<div class="flex gap-2 pt-4">
<Button type="submit" label="Сохранить" icon="pi pi-check" :loading="form.processing" />
<Link :href="route('databases.target.index')">
<Button type="button" label="Отмена" severity="secondary" />
</Link>
</div>
</form>
</template>
</Card>
</AppLayout>
</template>
<script setup>
import { useForm, Link } from '@inertiajs/vue3';
import AppLayout from '@/Layouts/AppLayout.vue';
import Card from 'primevue/card';
import InputText from 'primevue/inputtext';
import Textarea from 'primevue/textarea';
import Button from 'primevue/button';
import Password from 'primevue/password';
import Dropdown from 'primevue/dropdown';
const props = defineProps({
database: Object,
});
const form = useForm({
name: props.database?.name || '',
host: props.database?.host || '',
port: props.database?.port || 5432,
database: props.database?.database || '',
username: props.database?.username || '',
password: '',
driver: props.database?.driver || 'pgsql',
description: props.database?.description || '',
});
const submit = () => {
if (props.database?.id) {
form.put(route('databases.target.update', props.database.id));
} else {
form.post(route('databases.target.store'));
}
};
</script>

118
resources/js/Pages/Databases/TargetDatabases.vue Normal file
View File

@@ -0,0 +1,118 @@
<template>
<AppLayout>
<template #header>
<div class="flex justify-between items-center">
<h2 class="text-xl font-bold">Целевые базы данных</h2>
<Link :href="route('databases.target.create')">
<Button icon="pi pi-plus" label="Добавить БД" />
</Link>
</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="databases" stripedRows>
<Column field="name" header="Название" sortable></Column>
<Column field="host" header="Хост" sortable></Column>
<Column field="port" header="Порт" sortable></Column>
<Column field="database" header="База данных" sortable></Column>
<Column field="driver" header="Драйвер" sortable></Column>
<Column field="migration_schedules_count" header="Расписаний" sortable></Column>
<Column field="is_active" header="Статус">
<template #body="slotProps">
<Tag :value="slotProps.data.is_active ? 'Активна' : 'Неактивна'"
:severity="slotProps.data.is_active ? 'success' : 'danger'" />
</template>
</Column>
<Column header="Действия">
<template #body="slotProps">
<div class="flex gap-2">
<Button icon="pi pi-play" severity="info" size="small"
@click="testConnection(slotProps.data)"
title="Проверить подключение" />
<Link :href="route('databases.target.edit', slotProps.data.id)">
<Button icon="pi pi-pencil" severity="secondary" size="small"
title="Редактировать" />
</Link>
<Button icon="pi pi-trash" severity="danger" size="small"
@click="confirmDelete(slotProps.data)"
title="Удалить" />
</div>
</template>
</Column>
</DataTable>
</template>
</Card>
<Dialog v-model:visible="testingConnection" modal header="Проверка подключения" :style="{ width: '300px' }">
<div class="flex items-center gap-3">
<ProgressSpinner style="width: 30px; height: 30px" />
<span>Проверка подключения к базе данных...</span>
</div>
</Dialog>
<Dialog v-model:visible="deletingDialog" modal header="Подтверждение удаления" :style="{ width: '400px' }">
<p>Вы уверены, что хотите удалить базу данных "<strong>{{ databaseToDelete?.name }}</strong>"?</p>
<template #footer>
<Button label="Отмена" icon="pi pi-times" @click="deletingDialog = false" severity="secondary" />
<Button label="Удалить" icon="pi pi-trash" @click="deleteDatabase" severity="danger" />
</template>
</Dialog>
</AppLayout>
</template>
<script setup>
import { ref } from 'vue';
import { Link, router } from '@inertiajs/vue3';
import AppLayout from '@/Layouts/AppLayout.vue';
import DataTable from 'primevue/datatable';
import Column from 'primevue/column';
import Button from 'primevue/button';
import Tag from 'primevue/tag';
import Message from 'primevue/message';
import Card from 'primevue/card';
import Dialog from 'primevue/dialog';
import ProgressSpinner from 'primevue/progressspinner';
const props = defineProps({
databases: Array,
});
const testingConnection = ref(false);
const deletingDialog = ref(false);
const databaseToDelete = ref(null);
const testConnection = async (database) => {
testingConnection.value = true;
try {
const response = await fetch(route('databases.target.test', database.id));
const result = await response.json();
testingConnection.value = false;
if (result.success) {
alert(`Подключение успешно!\nВерсия PostgreSQL: ${result.version}`);
} else {
alert(`Ошибка подключения: ${result.message}`);
}
} catch (error) {
testingConnection.value = false;
alert(`Ошибка: ${error.message}`);
}
};
const confirmDelete = (database) => {
databaseToDelete.value = database;
deletingDialog.value = true;
};
const deleteDatabase = () => {
router.delete(route('databases.target.destroy', databaseToDelete.value.id));
deletingDialog.value = false;
databaseToDelete.value = null;
};
</script>