olxovski/Buh-nr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: olxovski:backend
Branches Tags
olxovski:main olxovski:backend olxovski:back_alpha
...
pull from: olxovski:back_alpha
Branches Tags
olxovski:backend olxovski:main olxovski:back_alpha

1 Commits
backend ... back_alpha

Author SHA1 Message Date
Ольховский Дмитрий
4163e00c75 Сделал альфа версию веб-сервера и интеграцию с базой данных 2026-03-02 22:39:04 +03:00
12 changed files with 3112 additions and 51 deletions
Expand all files Collapse all files

BIN
data.db Normal file
View File

Binary file not shown.

2653
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

8
package.json
View File

@@ -6,11 +6,15 @@
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
"build": "vite build", "build": "vite build",
"preview": "vite preview" "preview": "vite preview",
"start": "node server.js"
}, },
"dependencies": { "dependencies": {
"express": "^5.2.1",
"naive-ui": "^2.43.2", "naive-ui": "^2.43.2",
"vue": "^3.5.25" "sqlite3": "^5.1.7",
"vue": "^3.5.25",
"vue-router": "^5.0.3"
}, },
"devDependencies": { "devDependencies": {
"@vitejs/plugin-vue": "^6.0.2", "@vitejs/plugin-vue": "^6.0.2",

265
report.html Normal file
View File

@@ -0,0 +1,265 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Отчёт об изменениях — проект Buhuchet</title>
<style>
body {
font-family: 'Times New Roman', Times, serif;
font-size: 14pt;
margin: 2.5cm 3cm;
color: #000;
line-height: 1.5;
}
h1 {
font-size: 18pt;
text-align: center;
margin-bottom: 6pt;
}
h2 {
font-size: 14pt;
margin-top: 18pt;
margin-bottom: 4pt;
border-bottom: 1px solid #555;
padding-bottom: 2pt;
}
h3 {
font-size: 13pt;
margin-top: 12pt;
margin-bottom: 2pt;
}
.subtitle {
text-align: center;
color: #444;
margin-bottom: 20pt;
}
.meta {
text-align: center;
font-size: 11pt;
color: #666;
margin-bottom: 30pt;
}
table {
width: 100%;
border-collapse: collapse;
margin: 8pt 0 16pt;
font-size: 12pt;
}
th {
background: #f0f0f0;
border: 1px solid #999;
padding: 6pt 8pt;
text-align: left;
}
td {
border: 1px solid #ccc;
padding: 5pt 8pt;
vertical-align: top;
}
tr:nth-child(even) td { background: #fafafa; }
code {
font-family: 'Courier New', monospace;
font-size: 11pt;
background: #f4f4f4;
padding: 1pt 4pt;
border-radius: 2pt;
}
.new-file { color: #1a7a1a; font-weight: bold; }
.mod-file { color: #7a4a00; font-weight: bold; }
ul { margin: 4pt 0 8pt 20pt; }
li { margin-bottom: 3pt; }
.section-num {
font-weight: bold;
margin-right: 6pt;
}
hr { border: none; border-top: 1px solid #ddd; margin: 20pt 0; }
</style>
</head>
<body>
<h1>Отчёт об изменениях проекта</h1>
<p class="subtitle">Проект: <strong>Buhuchet</strong> — лендинг услуг удалённого бухгалтера</p>
<p class="meta">Дата: 02.03.2026 &nbsp;|&nbsp; Ветка: back_alpha</p>
<hr>
<h2>1. Общая сводка изменений</h2>
<p>В ходе двух итераций разработки в проект были внесены следующие изменения:</p>
<ul>
<li>Добавлен веб-сервер на Express.js с поддержкой SPA и API</li>
<li>Внедрён клиентский роутинг (Vue Router) с двумя страницами</li>
<li>Создана страница-заглушка для оформления заказа</li>
<li>Добавлена база данных SQLite с таблицей регионов</li>
<li>Данные в селекторе городов теперь загружаются из БД через API</li>
</ul>
<hr>
<h2>2. Итерация 1 — Express сервер и страница-заглушка</h2>
<h3>2.1 Установленные зависимости</h3>
<table>
<tr><th>Пакет</th><th>Версия</th><th>Назначение</th></tr>
<tr><td><code>express</code></td><td>^5.2.1</td><td>Веб-сервер</td></tr>
<tr><td><code>vue-router</code></td><td>^5.0.3</td><td>Клиентский роутинг SPA</td></tr>
</table>
<h3>2.2 Новые файлы</h3>
<table>
<tr><th>Файл</th><th>Тип</th><th>Описание</th></tr>
<tr>
<td><code>server.js</code></td>
<td><span class="new-file">Новый</span></td>
<td>Express-сервер, порт 3000. Отдаёт статику из <code>dist/</code>, SPA-fallback на <code>index.html</code> для всех неизвестных маршрутов.</td>
</tr>
<tr>
<td><code>src/router/index.js</code></td>
<td><span class="new-file">Новый</span></td>
<td>Конфигурация Vue Router: маршрут <code>/</code> → HomePage, <code>/order</code> → OrderPage.</td>
</tr>
<tr>
<td><code>src/pages/HomePage.vue</code></td>
<td><span class="new-file">Новый</span></td>
<td>Главная страница, содержимое перенесено из <code>App.vue</code>.</td>
</tr>
<tr>
<td><code>src/pages/OrderPage.vue</code></td>
<td><span class="new-file">Новый</span></td>
<td>Страница-заглушка оформления заявки. Отображает название выбранного тарифа (из query-параметра <code>?tariff=</code>), кнопку «Вернуться назад».</td>
</tr>
</table>
<h3>2.3 Изменённые файлы</h3>
<table>
<tr><th>Файл</th><th>Тип</th><th>Изменение</th></tr>
<tr>
<td><code>src/main.js</code></td>
<td><span class="mod-file">Изменён</span></td>
<td>Импорт и подключение <code>vue-router</code>: <code>app.use(router)</code>.</td>
</tr>
<tr>
<td><code>src/App.vue</code></td>
<td><span class="mod-file">Изменён</span></td>
<td>Весь контент перенесён в <code>HomePage.vue</code>. Осталось только <code>&lt;router-view /&gt;</code> как точка монтирования роутера.</td>
</tr>
<tr>
<td><code>src/components/TariffCards.vue</code></td>
<td><span class="mod-file">Изменён</span></td>
<td>Кнопка «Выбрать» теперь вызывает <code>selectTariff(tariff)</code>, которая выполняет навигацию: <code>router.push({ path: '/order', query: { tariff: tariff.title } })</code>.</td>
</tr>
<tr>
<td><code>package.json</code></td>
<td><span class="mod-file">Изменён</span></td>
<td>Добавлен скрипт <code>"start": "node server.js"</code> для запуска Express.</td>
</tr>
</table>
<hr>
<h2>3. Итерация 2 — База данных SQLite и динамический селектор регионов</h2>
<h3>3.1 Установленные зависимости</h3>
<table>
<tr><th>Пакет</th><th>Версия</th><th>Назначение</th></tr>
<tr><td><code>sqlite3</code></td><td>^5.1.7</td><td>Работа с базой данных SQLite</td></tr>
</table>
<h3>3.2 База данных</h3>
<p>Файл базы данных: <code>data.db</code> (создаётся автоматически при первом запуске сервера).</p>
<table>
<tr><th>Объект БД</th><th>Тип</th><th>Описание</th></tr>
<tr>
<td><code>regions</code></td>
<td>Таблица</td>
<td>
Поля: <code>id</code> (INTEGER PK AUTOINCREMENT), <code>region_name</code> (TEXT).<br>
Начальные данные: <em>Москва, Санкт-Петербург, Казань</em>.
</td>
</tr>
<tr>
<td><code>region_list</code></td>
<td>VIEW (представление)</td>
<td>
<code>SELECT id, region_name FROM regions ORDER BY id</code>.<br>
Используется функцией <code>getRegions()</code> для абстракции доступа к данным.
</td>
</tr>
</table>
<h3>3.3 Новые файлы</h3>
<table>
<tr><th>Файл</th><th>Тип</th><th>Описание</th></tr>
<tr>
<td><code>db/database.js</code></td>
<td><span class="new-file">Новый</span></td>
<td>
Модуль работы с БД. Экспортирует:
<ul>
<li><code>initializeDatabase()</code> — создаёт таблицу, VIEW и заполняет начальными данными при первом запуске;</li>
<li><code>getRegions()</code> — функция получения регионов через представление <code>region_list</code> (не прямой запрос к таблице).</li>
</ul>
</td>
</tr>
</table>
<h3>3.4 Изменённые файлы</h3>
<table>
<tr><th>Файл</th><th>Тип</th><th>Изменение</th></tr>
<tr>
<td><code>server.js</code></td>
<td><span class="mod-file">Изменён</span></td>
<td>
Добавлены:
<ul>
<li>Импорт <code>initializeDatabase</code> и <code>getRegions</code> из <code>./db/database.js</code>;</li>
<li>Маршрут <code>GET /api/regions</code> — возвращает JSON-массив регионов из БД;</li>
<li>Запуск сервера теперь происходит после успешной инициализации БД.</li>
</ul>
</td>
</tr>
<tr>
<td><code>src/components/SiteHeader.vue</code></td>
<td><span class="mod-file">Изменён</span></td>
<td>
Добавлены:
<ul>
<li>Секция <code>&lt;script setup&gt;</code> с <code>ref</code> и <code>onMounted</code>;</li>
<li>Запрос к <code>/api/regions</code> при монтировании компонента;</li>
<li>Динамический рендеринг опций через <code>v-for</code>, <code>v-model</code>;</li>
<li>Состояние загрузки («Загрузка...») до получения данных с сервера.</li>
</ul>
Удалены захардкоженные <code>&lt;option&gt;</code> (Москва, Санкт-Петербург, Казань).
</td>
</tr>
</table>
<hr>
<h2>4. Архитектура потока данных</h2>
<p style="font-family: 'Courier New', monospace; font-size: 11pt; background: #f4f4f4; padding: 10pt; border-left: 3px solid #999;">
data.db (SQLite)<br>
&nbsp;&nbsp;└── таблица <em>regions</em><br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;└── VIEW <em>region_list</em><br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;└── db/database.js :: getRegions()<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;└── server.js :: GET /api/regions<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;└── SiteHeader.vue :: fetch('/api/regions') → &lt;select&gt;
</p>
<hr>
<h2>5. Запуск проекта</h2>
<table>
<tr><th>Режим</th><th>Команда</th><th>Описание</th></tr>
<tr><td>Разработка (Vite)</td><td><code>npm run dev</code></td><td>Hot reload, порт 5173. API запросы к /api/* не проксируются — нужен отдельный запуск сервера или настройка прокси в vite.config.js</td></tr>
<tr><td>Сборка</td><td><code>npm run build</code></td><td>Собирает проект в папку <code>dist/</code></td></tr>
<tr><td>Продакшн (Express)</td><td><code>npm start</code></td><td>Запускает Express на порту 3000. Требует предварительной сборки.</td></tr>
</table>
<hr>
<p style="text-align:center; font-size: 11pt; color: #888; margin-top: 30pt;">
Отчёт подготовлен автоматически &mdash; Claude Sonnet 4.6 &mdash; 02.03.2026
</p>
</body>
</html>

29
server.js Normal file
View File

@@ -0,0 +1,29 @@
import express from 'express'
import Database from 'sqlite3'
import { fileURLToPath } from 'url'
import { dirname, join } from 'path'
const __dirname = dirname(fileURLToPath(import.meta.url))
const app = express()
const PORT = 3000
const db = new Database.Database(join(__dirname, 'data.db'))
app.use(express.static(join(__dirname, 'dist')))
// получение списка регионов из БД
app.get('/api/regions', (_req, res) => {
db.all('SELECT id, region_name FROM regions ORDER BY id', (err, rows) => {
if (err) return res.status(500).json({ error: 'Ошибка получения регионов' })
res.json(rows)
})
})
// и что им не понравилось в *?
app.get('/{*splat}', (_req, res) => {
res.sendFile(join(__dirname, 'dist', 'index.html'))
})
app.listen(PORT, () => {
console.log(`Сервер запущен: http://localhost:${PORT}`)
})

38
src/App.vue
View File

@@ -1,47 +1,11 @@
<template> <template>
<router-view />
<div class="app">
<SiteHeader />
<main class="container">
<TaxModeSelector v-model="selectedMode" />
<TariffCards :mode="selectedMode" />
<MarqueeBar />
<PriceTable />
<ServicesGrid />
<AdvantagesSection />
</main>
<Footer />
</div>
</template> </template>
<script setup>
import { ref } from 'vue'
import SiteHeader from './components/SiteHeader.vue'
import TaxModeSelector from './components/TaxModeSelector.vue'
import TariffCards from './components/TariffCards.vue'
import MarqueeBar from './components/MarqueeBar.vue'
import PriceTable from './components/PriceTable.vue'
import ServicesGrid from './components/ServicesGrid.vue'
import AdvantagesSection from './components/AdvantagesSection.vue'
import Footer from './components/Footer.vue'
const selectedMode = ref('special')
</script>
<style> <style>
body { body {
margin: 0; margin: 0;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
color: #000; color: #000;
} }
.app {
background: linear-gradient(90deg, #ffd400, #ff0000);
min-height: 100vh;
}
.container {
margin: 0 auto;
padding: 40px 60px 80px;
}
</style> </style>

32
src/components/SiteHeader.vue
View File

@@ -7,10 +7,15 @@
<div class="col center"> <div class="col center">
<div class="title">Удалённый бухгалтер</div> <div class="title">Удалённый бухгалтер</div>
<select class="city"> <select class="city" v-model="selectedRegion">
<option>Москва</option> <option v-if="regions.length === 0" disabled value="">Загрузка...</option>
<option>Санкт-Петербург</option> <option
<option>Казань</option> v-for="region in regions"
:key="region.id"
:value="region.region_name"
>
{{ region.region_name }}
</option>
</select> </select>
</div> </div>
@@ -21,6 +26,25 @@
</header> </header>
</template> </template>
<script setup>
import { ref, onMounted } from 'vue'
const regions = ref([])
const selectedRegion = ref('')
onMounted(async () => {
try {
const res = await fetch('/api/regions')
regions.value = await res.json()
if (regions.value.length > 0) {
selectedRegion.value = regions.value[0].region_name
}
} catch (err) {
console.error('Не удалось загрузить регионы:', err)
}
})
</script>
<style scoped> <style scoped>
.header { .header {
padding: 25px 0; padding: 25px 0;

9
src/components/TariffCards.vue
View File

@@ -31,7 +31,7 @@
{{ tariff.price }} ₽ {{ tariff.price }} ₽
</div> </div>
<n-button type="primary" block> <n-button type="primary" block @click="selectTariff(tariff)">
Выбрать Выбрать
</n-button> </n-button>
</n-card> </n-card>
@@ -41,6 +41,13 @@
<script setup> <script setup>
import { computed } from 'vue' import { computed } from 'vue'
import { useRouter } from 'vue-router'
const router = useRouter()
function selectTariff(tariff) {
router.push({ path: '/order', query: { tariff: tariff.title } })
}
const props = defineProps({ const props = defineProps({
mode: { mode: {

4
src/main.js
View File

@@ -2,9 +2,9 @@ import { createApp } from 'vue'
import './style.css' import './style.css'
import App from './App.vue' import App from './App.vue'
import naive from 'naive-ui' import naive from 'naive-ui'
import router from './router/index.js'
const app = createApp(App) const app = createApp(App)
app.use(naive) app.use(naive)
app.use(router)
app.mount('#app') app.mount('#app')

40
src/pages/HomePage.vue Normal file
View File

@@ -0,0 +1,40 @@
<template>
<div class="app">
<SiteHeader />
<main class="container">
<TaxModeSelector v-model="selectedMode" />
<TariffCards :mode="selectedMode" />
<MarqueeBar />
<PriceTable />
<ServicesGrid />
<AdvantagesSection />
</main>
<Footer />
</div>
</template>
<script setup>
import { ref } from 'vue'
import SiteHeader from '../components/SiteHeader.vue'
import TaxModeSelector from '../components/TaxModeSelector.vue'
import TariffCards from '../components/TariffCards.vue'
import MarqueeBar from '../components/MarqueeBar.vue'
import PriceTable from '../components/PriceTable.vue'
import ServicesGrid from '../components/ServicesGrid.vue'
import AdvantagesSection from '../components/AdvantagesSection.vue'
import Footer from '../components/Footer.vue'
const selectedMode = ref('special')
</script>
<style scoped>
.app {
background: linear-gradient(90deg, #ffd400, #ff0000);
min-height: 100vh;
}
.container {
margin: 0 auto;
padding: 40px 60px 80px;
}
</style>

72
src/pages/OrderPage.vue Normal file
View File

@@ -0,0 +1,72 @@
<template>
<div class="order-page">
<div class="order-card">
<div class="order-icon">📋</div>
<h1>Оформление заявки</h1>
<p class="order-subtitle">Тариф: <strong>{{ tariffName }}</strong></p>
<p class="order-description">
Страница в разработке. Скоро здесь хоть что-нибудь появится.
</p>
<n-button type="primary" size="large" @click="goBack">
← Вернуться назад
</n-button>
</div>
</div>
</template>
<script setup>
import { computed } from 'vue'
import { useRouter, useRoute } from 'vue-router'
const router = useRouter()
const route = useRoute()
const tariffName = computed(() => route.query.tariff || 'Не выбран')
function goBack() {
router.push('/')
}
</script>
<style scoped>
.order-page {
background: linear-gradient(90deg, #ffd400, #ff0000);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
.order-card {
background: #fff;
border-radius: 16px;
padding: 60px 80px;
text-align: center;
max-width: 500px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
}
.order-icon {
font-size: 64px;
margin-bottom: 20px;
}
h1 {
font-size: 28px;
margin: 0 0 12px;
color: #111;
}
.order-subtitle {
font-size: 18px;
color: #444;
margin-bottom: 20px;
}
.order-description {
font-size: 15px;
color: #777;
line-height: 1.6;
margin-bottom: 36px;
}
</style>

13
src/router/index.js Normal file
View File

@@ -0,0 +1,13 @@
import { createRouter, createWebHistory } from 'vue-router'
import HomePage from '../pages/HomePage.vue'
import OrderPage from '../pages/OrderPage.vue'
const routes = [
{ path: '/', component: HomePage },
{ path: '/order', component: OrderPage }
]
export default createRouter({
history: createWebHistory(),
routes
})