ваше сообщение коммита
This commit is contained in:
111
frontend/src/views/tables/CreateTableView.vue
Normal file
111
frontend/src/views/tables/CreateTableView.vue
Normal file
@@ -0,0 +1,111 @@
|
||||
<template>
|
||||
<BaseLayout>
|
||||
<div class="create-table-container">
|
||||
<h2>Создать новую таблицу</h2>
|
||||
<form @submit.prevent="handleCreateTable" class="create-table-form">
|
||||
<label>Название таблицы</label>
|
||||
<input v-model="newTableName" required placeholder="Введите название" />
|
||||
<label>Описание</label>
|
||||
<textarea v-model="newTableDescription" placeholder="Описание (необязательно)" />
|
||||
<label>Источник для ИИ ассистента</label>
|
||||
<select v-model="newTableIsRagSourceId" required>
|
||||
<option :value="1">Да</option>
|
||||
<option :value="2">Нет</option>
|
||||
</select>
|
||||
<div class="form-actions">
|
||||
<button type="submit">Создать</button>
|
||||
<button type="button" @click="goBack">Отмена</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
import tablesService from '../../services/tablesService';
|
||||
|
||||
const router = useRouter();
|
||||
const newTableName = ref('');
|
||||
const newTableDescription = ref('');
|
||||
const newTableIsRagSourceId = ref(2);
|
||||
|
||||
async function handleCreateTable() {
|
||||
if (!newTableName.value) return;
|
||||
await tablesService.createTable({
|
||||
name: newTableName.value,
|
||||
description: newTableDescription.value,
|
||||
isRagSourceId: newTableIsRagSourceId.value
|
||||
});
|
||||
router.push({ name: 'tables-list' });
|
||||
}
|
||||
function goBack() {
|
||||
router.back();
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.create-table-container {
|
||||
max-width: 500px;
|
||||
margin: 2rem auto;
|
||||
background: #fff;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 2px 16px rgba(0,0,0,0.07);
|
||||
padding: 2rem 1.5rem;
|
||||
}
|
||||
.create-table-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.1em;
|
||||
}
|
||||
.create-table-form label {
|
||||
font-weight: 500;
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
.create-table-form input,
|
||||
.create-table-form textarea,
|
||||
.create-table-form select {
|
||||
border: 1px solid #ececec;
|
||||
border-radius: 7px;
|
||||
padding: 0.5em 0.8em;
|
||||
font-size: 1em;
|
||||
background: #fafbfc;
|
||||
}
|
||||
.create-table-form textarea {
|
||||
min-height: 60px;
|
||||
resize: vertical;
|
||||
}
|
||||
.form-actions {
|
||||
display: flex;
|
||||
gap: 1em;
|
||||
margin-top: 1.2em;
|
||||
}
|
||||
.form-actions button[type="submit"] {
|
||||
background: #2ecc40;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.form-actions button[type="submit"]:hover {
|
||||
background: #27ae38;
|
||||
}
|
||||
.form-actions button[type="button"] {
|
||||
background: #eaeaea;
|
||||
color: #333;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.form-actions button[type="button"]:hover {
|
||||
background: #d5d5d5;
|
||||
}
|
||||
</style>
|
||||
58
frontend/src/views/tables/DeleteTableView.vue
Normal file
58
frontend/src/views/tables/DeleteTableView.vue
Normal file
@@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<BaseLayout>
|
||||
<div class="delete-table-confirm">
|
||||
<h2>Удалить таблицу?</h2>
|
||||
<p>Вы уверены, что хотите удалить эту таблицу? Это действие необратимо.</p>
|
||||
<div class="actions">
|
||||
<button class="danger" @click="remove">Удалить</button>
|
||||
<button @click="cancel">Отмена</button>
|
||||
</div>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
<script setup>
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
import axios from 'axios';
|
||||
const $route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
async function remove() {
|
||||
await axios.delete(`/api/tables/${$route.params.id}`);
|
||||
router.push({ name: 'tables-list' });
|
||||
}
|
||||
function cancel() {
|
||||
router.push({ name: 'user-table-view', params: { id: $route.params.id } });
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.delete-table-confirm {
|
||||
max-width: 400px;
|
||||
margin: 2em auto;
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,0.07);
|
||||
padding: 2em 1.5em;
|
||||
text-align: center;
|
||||
}
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 1em;
|
||||
margin-top: 2em;
|
||||
justify-content: center;
|
||||
}
|
||||
.danger {
|
||||
background: #ff4d4f;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
font-size: 1em;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.danger:hover {
|
||||
background: #d9363e;
|
||||
}
|
||||
</style>
|
||||
81
frontend/src/views/tables/EditTableView.vue
Normal file
81
frontend/src/views/tables/EditTableView.vue
Normal file
@@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<BaseLayout>
|
||||
<div class="edit-table-form">
|
||||
<h2>Редактировать таблицу</h2>
|
||||
<form @submit.prevent="save">
|
||||
<label>Название</label>
|
||||
<input v-model="name" required />
|
||||
<label>Описание</label>
|
||||
<textarea v-model="description" />
|
||||
<label>Источник для ИИ ассистента</label>
|
||||
<select v-model="isRagSourceId" required>
|
||||
<option :value="1">Да</option>
|
||||
<option :value="2">Нет</option>
|
||||
</select>
|
||||
<div class="actions">
|
||||
<button type="submit">Сохранить</button>
|
||||
<button type="button" @click="cancel">Отмена</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
import axios from 'axios';
|
||||
const $route = useRoute();
|
||||
const router = useRouter();
|
||||
const name = ref('');
|
||||
const description = ref('');
|
||||
const isRagSourceId = ref(2);
|
||||
|
||||
onMounted(async () => {
|
||||
const { data } = await axios.get(`/api/tables/${$route.params.id}`);
|
||||
name.value = data.name;
|
||||
description.value = data.description;
|
||||
isRagSourceId.value = data.is_rag_source_id || 2;
|
||||
});
|
||||
|
||||
async function save() {
|
||||
await axios.patch(`/api/tables/${$route.params.id}`, {
|
||||
name: name.value,
|
||||
description: description.value,
|
||||
isRagSourceId: isRagSourceId.value
|
||||
});
|
||||
router.push({ name: 'user-table-view', params: { id: $route.params.id } });
|
||||
}
|
||||
function cancel() {
|
||||
router.push({ name: 'user-table-view', params: { id: $route.params.id } });
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.edit-table-form {
|
||||
max-width: 400px;
|
||||
margin: 2em auto;
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,0.07);
|
||||
padding: 2em 1.5em;
|
||||
}
|
||||
.edit-table-form label {
|
||||
display: block;
|
||||
margin-top: 1em;
|
||||
font-weight: 500;
|
||||
}
|
||||
.edit-table-form input, .edit-table-form textarea {
|
||||
width: 100%;
|
||||
margin-top: 0.5em;
|
||||
padding: 0.5em;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #ddd;
|
||||
font-size: 1em;
|
||||
}
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 1em;
|
||||
margin-top: 2em;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
112
frontend/src/views/tables/TableView.vue
Normal file
112
frontend/src/views/tables/TableView.vue
Normal file
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<BaseLayout>
|
||||
<div class="tableview-header-row">
|
||||
<button class="nav-btn" @click="goToTables">Таблицы</button>
|
||||
<button class="nav-btn" @click="goToCreate">Создать таблицу</button>
|
||||
<button class="close-btn" @click="closeTable">Закрыть</button>
|
||||
<button class="action-btn" @click="goToEdit">Редактировать</button>
|
||||
<button class="danger-btn" @click="goToDelete">Удалить</button>
|
||||
</div>
|
||||
<UserTableView :table-id="Number($route.params.id)" />
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
import UserTableView from '../../components/tables/UserTableView.vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
const $route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
function closeTable() {
|
||||
if (window.history.length > 1) {
|
||||
router.back();
|
||||
} else {
|
||||
router.push({ name: 'home' });
|
||||
}
|
||||
}
|
||||
|
||||
function goToEdit() {
|
||||
router.push({ name: 'edit-table', params: { id: $route.params.id } });
|
||||
}
|
||||
|
||||
function goToDelete() {
|
||||
router.push({ name: 'delete-table', params: { id: $route.params.id } });
|
||||
}
|
||||
|
||||
function goToTables() {
|
||||
router.push({ name: 'tables-list' });
|
||||
}
|
||||
|
||||
function goToCreate() {
|
||||
router.push({ name: 'create-table' });
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tableview-header-row {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
margin: 1.2em 0 0.5em 0;
|
||||
}
|
||||
.close-btn {
|
||||
background: #ff4d4f;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
font-size: 1em;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.close-btn:hover {
|
||||
background: #d9363e;
|
||||
}
|
||||
.action-btn {
|
||||
background: #2ecc40;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
font-size: 1em;
|
||||
margin-left: 0.7em;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.action-btn:hover {
|
||||
background: #27ae38;
|
||||
}
|
||||
.danger-btn {
|
||||
background: #ff4d4f;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
font-size: 1em;
|
||||
margin-left: 0.7em;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.danger-btn:hover {
|
||||
background: #d9363e;
|
||||
}
|
||||
.nav-btn {
|
||||
background: #eaeaea;
|
||||
color: #333;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 0.5em 1.2em;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
font-size: 1em;
|
||||
transition: background 0.2s;
|
||||
margin-right: 0.7em;
|
||||
}
|
||||
.nav-btn:hover {
|
||||
background: #d5d5d5;
|
||||
}
|
||||
</style>
|
||||
11
frontend/src/views/tables/TablesListView.vue
Normal file
11
frontend/src/views/tables/TablesListView.vue
Normal file
@@ -0,0 +1,11 @@
|
||||
<template>
|
||||
<BaseLayout>
|
||||
<h2>Список таблиц</h2>
|
||||
<UserTablesList />
|
||||
</BaseLayout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import BaseLayout from '../../components/BaseLayout.vue';
|
||||
import UserTablesList from '../../components/tables/UserTablesList.vue';
|
||||
</script>
|
||||
Reference in New Issue
Block a user