@mashka818/exam-de-template 1.0.0

package/exam-project/client/src/pages/RequestFormPage.jsx

@@ -0,0 +1,178 @@
+
+import { useEffect, useState } from 'react';
+import { Link, useNavigate } from 'react-router-dom';
+import Layout from '../components/Layout.jsx';
+import FormField from '../components/FormField.jsx';
+import PageImage from '../components/PageImage.jsx';
+import { api } from '../api.js';
+import { formatPhoneInput, validateRequestForm } from '../utils/validation.js';
+
+const inputClass =
+  'w-full rounded-lg border border-slate-300 px-3 py-2 focus:outline-none focus:ring-2 focus:ring-cyan-400';
+
+export default function RequestFormPage() {
+  const navigate = useNavigate();
+  const [services, setServices] = useState([]);
+  const [form, setForm] = useState({
+    address: '',
+    contactPhone: '',
+    scheduledAt: '',
+    paymentType: '',
+    serviceTypeId: '',
+    isCustomService: false,
+    customService: '',
+  });
+  const [errors, setErrors] = useState({});
+  const [serverError, setServerError] = useState('');
+
+  useEffect(() => {
+    api.getServices().then(setServices).catch(() => {});
+  }, []);
+
+  const set = (field) => (e) => {
+    const value = e.target.type === 'checkbox' ? e.target.checked : e.target.value;
+    let v = value;
+    if (field === 'contactPhone') v = formatPhoneInput(value);
+    setForm((f) => ({ ...f, [field]: v }));
+    setErrors((err) => ({ ...err, [field]: undefined }));
+  };
+
+  const submit = async (e) => {
+    e.preventDefault();
+    setServerError('');
+    const localErrors = validateRequestForm(form);
+    if (Object.keys(localErrors).length) {
+      setErrors(localErrors);
+      return;
+    }
+    try {
+      await api.createRequest({
+        address: form.address,
+        contactPhone: form.contactPhone,
+        scheduledAt: new Date(form.scheduledAt).toISOString(),
+        paymentType: form.paymentType,
+        serviceTypeId: form.isCustomService ? null : Number(form.serviceTypeId),
+        isCustomService: form.isCustomService,
+        customService: form.isCustomService ? form.customService : null,
+      });
+      navigate('/requests');
+    } catch (err) {
+      if (err.data?.errors) setErrors(err.data.errors);
+      else setServerError(err.data?.message || err.message);
+    }
+  };
+
+  return (
+    <Layout variant="dashboard">
+      <p className="text-white/70 text-xs mb-2">Пункт 4 задания</p>
+      <PageImage imageKey="newRequestBanner" className="w-full h-20 object-cover rounded-xl mb-4" />
+
+      <Link
+        to="/requests"
+        className="inline-block text-sm text-white/90 underline mb-4 hover:text-white"
+      >
+        ← Назад к истории заявок (п.3)
+      </Link>
+
+      <form
+        onSubmit={submit}
+        className="bg-white rounded-2xl shadow-lg p-6 animate-fade-up border border-cyan-100"
+        noValidate
+      >
+        
+        <h1 className="text-xl font-bold text-cyan-900 mb-1">Формирование заявки</h1>
+        <p className="text-sm text-slate-500 mb-6">Все поля обязательны</p>
+
+        <FormField label="Адрес" error={errors.address}>
+          <input
+            className={`${inputClass} ${errors.address ? 'input-error' : ''}`}
+            value={form.address}
+            onChange={set('address')}
+            placeholder="Адрес выполнения услуги"
+          />
+        </FormField>
+
+        <FormField label="Контактные данные (телефон)" error={errors.contactPhone}>
+          <input
+            placeholder="+7(999)-123-45-67"
+            className={`${inputClass} ${errors.contactPhone ? 'input-error' : ''}`}
+            value={form.contactPhone}
+            onChange={set('contactPhone')}
+          />
+        </FormField>
+
+        <FormField label="Желаемая дата и время получения услуги" error={errors.scheduledAt}>
+          <input
+            type="datetime-local"
+            className={`${inputClass} ${errors.scheduledAt ? 'input-error' : ''}`}
+            value={form.scheduledAt}
+            onChange={set('scheduledAt')}
+          />
+        </FormField>
+
+        {!form.isCustomService && (
+          <FormField label="Вид услуги" error={errors.serviceTypeId}>
+            <select
+              className={`${inputClass} ${errors.serviceTypeId ? 'input-error' : ''}`}
+              value={form.serviceTypeId}
+              onChange={set('serviceTypeId')}
+            >
+              <option value="">— выберите из списка —</option>
+              {services.map((s) => (
+                <option key={s.id} value={s.id}>
+                  {s.name}
+                </option>
+              ))}
+            </select>
+            <p className="text-xs text-slate-400 mt-1">
+              Из задания: общий клининг, генеральная, послестроительная, химчистка
+            </p>
+          </FormField>
+        )}
+
+        
+        <label className="flex items-center gap-2 mb-4 cursor-pointer">
+          <input
+            type="checkbox"
+            checked={form.isCustomService}
+            onChange={set('isCustomService')}
+            className="rounded border-slate-300 text-cyan-600"
+          />
+          <span className="text-sm">Иная услуга</span>
+        </label>
+
+        {form.isCustomService && (
+          <FormField label="Опишите, какая услуга вам необходима" error={errors.customService}>
+            <textarea
+              rows={3}
+              className={`${inputClass} ${errors.customService ? 'input-error' : ''}`}
+              value={form.customService}
+              onChange={set('customService')}
+            />
+          </FormField>
+        )}
+
+        <FormField label="Предпочтительный тип оплаты" error={errors.paymentType}>
+          <select
+            className={`${inputClass} ${errors.paymentType ? 'input-error' : ''}`}
+            value={form.paymentType}
+            onChange={set('paymentType')}
+          >
+            <option value="">— выберите —</option>
+            <option value="cash">Наличные</option>
+            <option value="card">Банковская карта</option>
+          </select>
+        </FormField>
+
+        {serverError && <p className="field-error mb-3">{serverError}</p>}
+
+        <button
+          type="submit"
+          className="w-full rounded-xl bg-cyan-600 text-white py-3 font-semibold hover:bg-cyan-700 transition"
+        >
+          Отправить заявку
+        </button>
+      </form>
+    </Layout>
+  );
+}

package/exam-project/client/src/pages/RequestsPage.jsx

@@ -0,0 +1,94 @@
+
+import { useEffect, useState } from 'react';
+import { Link } from 'react-router-dom';
+import Layout from '../components/Layout.jsx';
+import PageImage from '../components/PageImage.jsx';
+import { api } from '../api.js';
+
+const statusColors = {
+  new: 'bg-amber-100 text-amber-800',
+  in_progress: 'bg-blue-100 text-blue-800',
+  completed: 'bg-emerald-100 text-emerald-800',
+  cancelled: 'bg-red-100 text-red-800',
+};
+
+export default function RequestsPage() {
+  const [requests, setRequests] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    api
+      .getMyRequests()
+      .then(setRequests)
+      .catch((e) => setError(e.message))
+      .finally(() => setLoading(false));
+  }, []);
+
+  return (
+    <Layout variant="dashboard">
+      <div className="animate-fade-up">
+        <p className="text-white/70 text-xs mb-1">Пункт 3 задания</p>
+        <PageImage imageKey="requestsBanner" className="w-full h-20 object-cover rounded-xl mb-4" />
+
+        
+        <h1 className="text-xl font-bold text-white drop-shadow mb-1">Создание заявки</h1>
+        <p className="text-white/80 text-sm mb-6">
+          История ваших заявок и переход к оформлению новой
+        </p>
+
+        <Link
+          to="/requests/form"
+          className="block mb-8 rounded-2xl bg-white p-5 shadow-lg border-2 border-teal-400 hover:border-teal-500 transition group"
+        >
+          <div className="flex items-center justify-between gap-3">
+            <div className="text-left">
+              <p className="font-bold text-teal-800 text-lg">Оставить новую заявку</p>
+              <p className="text-slate-600 text-sm mt-1">
+                Страница формирования заявки: адрес, контакты, услуга, дата, оплата
+              </p>
+            </div>
+            <span className="text-3xl text-teal-600 group-hover:translate-x-1 transition">→</span>
+          </div>
+        </Link>
+
+        <h2 className="text-lg font-semibold text-white mb-3">История заявок</h2>
+
+        {loading && <p className="text-white/80">Загрузка…</p>}
+        {error && <p className="text-red-200">{error}</p>}
+
+        {!loading && requests.length === 0 && (
+          <div className="bg-white rounded-xl p-6 text-center text-slate-600 shadow">
+            <PageImage imageKey="emptyRequests" className="w-32 h-auto mx-auto mb-3 opacity-80" />
+            Заявок пока нет. Нажмите «Оставить новую заявку» выше.
+          </div>
+        )}
+
+        <ul className="space-y-3">
+          {requests.map((r, i) => (
+            <li
+              key={r.id}
+              className="bg-white rounded-xl p-4 shadow animate-slide-in border-l-4 border-teal-500"
+              style={{ animationDelay: `${i * 0.05}s` }}
+            >
+              <div className="flex justify-between items-start gap-2 mb-2">
+                <span className="font-medium text-slate-800">{r.serviceName}</span>
+                <span className={`text-xs px-2 py-0.5 rounded-full ${statusColors[r.status]}`}>
+                  {r.statusLabel}
+                </span>
+              </div>
+              <p className="text-sm text-slate-600">Адрес: {r.address}</p>
+              <p className="text-sm text-slate-600">Контакты: {r.contactPhone}</p>
+              <p className="text-xs text-slate-500 mt-1">
+                {new Date(r.scheduledAt).toLocaleString('ru-RU')} · {r.paymentLabel}
+              </p>
+              {r.cancelReason && (
+                <p className="text-xs text-red-600 mt-2">Причина отмены: {r.cancelReason}</p>
+              )}
+            </li>
+          ))}
+        </ul>
+      </div>
+    </Layout>
+  );
+}

package/exam-project/client/src/utils/validation.js

@@ -0,0 +1,54 @@
+
+
+/** Телефон строго в формате задания — менять вместе с подсказкой на форме */
+export const PHONE_REGEX = /^\+7\(\d{3}\)-\d{3}-\d{2}-\d{2}$/;
+export const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+export const FIO_REGEX = /^[А-Яа-яЁё\s-]+$/;
+
+/** Регистрация — поля users */
+export function validateRegistration(form) {
+  const errors = {};
+  if (!form.login?.trim()) errors.login = 'Логин обязателен';
+  if (!form.password) errors.password = 'Пароль обязателен';
+  else if (form.password.length < 6) errors.password = 'Минимум 6 символов';
+  if (!form.fullName?.trim()) errors.fullName = 'ФИО обязательно';
+  else if (!FIO_REGEX.test(form.fullName.trim())) errors.fullName = 'Только кириллица и пробелы';
+  if (!form.phone?.trim()) errors.phone = 'Телефон обязателен';
+  else if (!PHONE_REGEX.test(form.phone.trim())) errors.phone = 'Формат: +7(XXX)-XXX-XX-XX';
+  if (!form.email?.trim()) errors.email = 'Email обязателен';
+  else if (!EMAIL_REGEX.test(form.email.trim())) errors.email = 'Некорректный email';
+  return errors;
+}
+
+/** Новая заявка — поля requests */
+export function validateRequestForm(form) {
+  const errors = {};
+  if (!form.address?.trim()) errors.address = 'Адрес обязателен';
+  if (!form.contactPhone?.trim()) errors.contactPhone = 'Телефон обязателен';
+  else if (!PHONE_REGEX.test(form.contactPhone.trim()))
+    errors.contactPhone = 'Формат: +7(XXX)-XXX-XX-XX';
+  if (!form.scheduledAt) errors.scheduledAt = 'Укажите дату и время';
+  if (!form.paymentType) errors.paymentType = 'Выберите оплату';
+  if (form.isCustomService) {
+    if (!form.customService?.trim()) errors.customService = 'Опишите услугу';
+  } else if (!form.serviceTypeId) {
+    errors.serviceTypeId = 'Выберите услугу';
+  }
+  return errors;
+}
+
+/** Маска телефона при вводе — можно оставить для любой темы с тем же форматом */
+export function formatPhoneInput(value) {
+  const digits = value.replace(/\D/g, '').slice(0, 11);
+  if (!digits.length) return '';
+  let d = digits;
+  if (d[0] === '8') d = '7' + d.slice(1);
+  if (d[0] !== '7') d = '7' + d;
+  const p = d.slice(1);
+  let out = '+7';
+  if (p.length > 0) out += `(${p.slice(0, 3)}`;
+  if (p.length >= 3) out += `)-${p.slice(3, 6)}`;
+  if (p.length >= 6) out += `-${p.slice(6, 8)}`;
+  if (p.length >= 8) out += `-${p.slice(8, 10)}`;
+  return out;
+}

package/exam-project/client/vite.config.js

@@ -0,0 +1,17 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
+
+
+export default defineConfig({
+  plugins: [react(), tailwindcss()],
+  server: {
+    port: 5173,
+    proxy: {
+      '/api': {
+        target: 'http://localhost:3001',
+        changeOrigin: true,
+      },
+    },
+  },
+});

package/exam-project/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "exam-de-workspace",
+  "version": "1.0.0",
+  "private": true,
+  "description": "Локальный проект ДЭ (exam-project). Публикация: npm run publish:npm из корня репозитория",
+  "type": "module",
+  "scripts": {
+    "install:all": "npm install && npm install --prefix server && npm install --prefix client",
+    "db:init": "npm run db:init --prefix server",
+    "dev": "concurrently \"npm run dev --prefix server\" \"npm run dev --prefix client\"",
+    "dev:server": "npm run dev --prefix server",
+    "dev:client": "npm run dev --prefix client",
+    "build": "npm run build --prefix client"
+  },
+  "devDependencies": {
+    "concurrently": "^9.1.2"
+  }
+}

package/exam-project/scripts/init-project.js

@@ -0,0 +1,86 @@
+#!/usr/bin/env node
+/**
+ * Экзамен: создать exam-project + exam-guides в текущей папке.
+ * npx @mashka818/exam-de-template@1.0.0 init
+ */
+import { execSync } from 'child_process';
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const PACKAGE_ROOT = path.resolve(__dirname, '..');
+
+const SKIP_DIRS = new Set(['node_modules', '.git', 'dist', '.pack-tmp']);
+
+function copyTree(src, dest) {
+  if (!fs.existsSync(src)) return;
+  fs.mkdirSync(dest, { recursive: true });
+  for (const entry of fs.readdirSync(src, { withFileTypes: true })) {
+    if (SKIP_DIRS.has(entry.name)) continue;
+    const s = path.join(src, entry.name);
+    const d = path.join(dest, entry.name);
+    if (entry.isDirectory()) copyTree(s, d);
+    else {
+      if (entry.name === '.env' && s.replace(/\\/g, '/').includes('/server/')) continue;
+      fs.mkdirSync(path.dirname(d), { recursive: true });
+      fs.copyFileSync(s, d);
+    }
+  }
+}
+
+const examRoot = process.argv.includes('--here')
+  ? process.cwd()
+  : process.argv[2]
+    ? path.resolve(process.argv[2])
+    : process.cwd();
+
+const skipInstall = process.argv.includes('--no-install');
+
+const srcProject = path.join(PACKAGE_ROOT, 'exam-project');
+const srcGuides = path.join(PACKAGE_ROOT, 'exam-guides');
+const destProject = path.join(examRoot, 'exam-project');
+const destGuides = path.join(examRoot, 'exam-guides');
+
+console.log('\n=== exam-de-init ===\n');
+console.log(`Папка экзамена: ${examRoot}\n`);
+
+if (!fs.existsSync(srcProject)) {
+  console.error('В пакете нет exam-project/. Обновите npm publish.');
+  process.exit(1);
+}
+
+if (fs.existsSync(destProject) && !process.argv.includes('--force')) {
+  console.log('Уже есть exam-project/. Добавьте --force для перезаписи.');
+  process.exit(1);
+}
+
+console.log('Копирую exam-project/ …');
+if (fs.existsSync(destProject)) fs.rmSync(destProject, { recursive: true, force: true });
+copyTree(srcProject, destProject);
+
+if (fs.existsSync(srcGuides)) {
+  console.log('Копирую exam-guides/ …');
+  if (fs.existsSync(destGuides)) fs.rmSync(destGuides, { recursive: true, force: true });
+  copyTree(srcGuides, destGuides);
+} else {
+  console.warn('В пакете нет exam-guides/ — только чистый проект.');
+}
+
+if (skipInstall) {
+  console.log('\nГотово (--no-install).\n');
+  process.exit(0);
+}
+
+console.log('\nУстановка зависимостей в exam-project/ …\n');
+execSync('npm install', { cwd: destProject, stdio: 'inherit' });
+execSync('npm run install:all', { cwd: destProject, stdio: 'inherit' });
+
+console.log('\n=== Готово ===\n');
+console.log('  exam-project/  — правите и запускаете здесь');
+console.log('  exam-guides/   — шпоры; удалите перед сдачей\n');
+console.log('Дальше:');
+console.log('  cd exam-project');
+console.log('  copy server\\.env.example server\\.env');
+console.log('  npm run db:init');
+console.log('  npm run dev\n');

package/exam-project/scripts/prepack.js

@@ -0,0 +1,27 @@
+/**
+ * Проверка перед npm pack — в архив не должны попасть node_modules и .env
+ */
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const root = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..');
+
+const bad = [];
+
+for (const sub of ['node_modules', 'client/node_modules', 'server/node_modules', 'client/dist']) {
+  if (fs.existsSync(path.join(root, sub))) {
+    bad.push(sub);
+  }
+}
+
+if (fs.existsSync(path.join(root, 'server/.env'))) {
+  console.warn('prepack: server/.env есть локально — в .npmignore, в архив не попадёт.');
+}
+
+if (bad.length) {
+  console.warn('prepack: в проекте есть (в .npmignore, в tgz не войдут):');
+  bad.forEach((b) => console.warn(`  - ${b}`));
+}
+
+console.log('prepack: ok — запускайте npm pack');

package/exam-project/scripts/unpack-template.js

@@ -0,0 +1,105 @@
+#!/usr/bin/env node
+/**
+ * Распаковка шаблона из npm-пакета в папку проекта (экзамен / новый ПК).
+ * Вызов: npx exam-de-unpack
+ *        npx exam-de-unpack C:\DE\my-project
+ *        npx exam-de-unpack --here
+ */
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const PACKAGE_ROOT = path.resolve(__dirname, '..');
+
+const SKIP_DIRS = new Set([
+  'node_modules',
+  '.git',
+  'dist',
+  'exam-starter',
+  'design',
+]);
+
+const SKIP_ROOT_FILES = new Set([
+  'exam-template-moy-ne-sam-1.0.0.tgz',
+]);
+
+function shouldSkipDir(name) {
+  return SKIP_DIRS.has(name);
+}
+
+function shouldSkipFile(relPath) {
+  const base = path.basename(relPath);
+  if (SKIP_ROOT_FILES.has(base)) return true;
+  if (base.endsWith('.tgz')) return true;
+  if (relPath.replace(/\\/g, '/').includes('server/.env')) return true;
+  return false;
+}
+
+function parseTarget() {
+  const args = process.argv.slice(2).filter((a) => !a.startsWith('-'));
+  if (process.argv.includes('--here') || args.length === 0) {
+    return process.cwd();
+  }
+  return path.resolve(args[0]);
+}
+
+function copyRecursive(srcDir, destDir, relative = '') {
+  if (!fs.existsSync(srcDir)) return;
+
+  const entries = fs.readdirSync(srcDir, { withFileTypes: true });
+
+  for (const entry of entries) {
+    const rel = relative ? `${relative}/${entry.name}` : entry.name;
+    const src = path.join(srcDir, entry.name);
+    const dest = path.join(destDir, entry.name);
+
+    if (entry.isDirectory()) {
+      if (shouldSkipDir(entry.name)) continue;
+      if (!fs.existsSync(dest)) fs.mkdirSync(dest, { recursive: true });
+      copyRecursive(src, dest, rel);
+      continue;
+    }
+
+    if (shouldSkipFile(rel)) continue;
+
+    const destEnv = path.join(destDir, 'server', '.env');
+    if (rel === 'server/.env' && fs.existsSync(path.join(destDir, 'server', '.env'))) {
+      console.log('  пропуск (уже есть): server/.env');
+      continue;
+    }
+
+    fs.mkdirSync(path.dirname(dest), { recursive: true });
+    fs.copyFileSync(src, dest);
+  }
+}
+
+const target = parseTarget();
+const force = process.argv.includes('--force');
+
+console.log('');
+console.log('=== exam-de-unpack: шаблон ДЭ ===');
+console.log(`Из: ${PACKAGE_ROOT}`);
+console.log(`В:  ${target}`);
+console.log('');
+
+if (!fs.existsSync(target)) {
+  fs.mkdirSync(target, { recursive: true });
+}
+
+const marker = path.join(target, 'client', 'src', 'App.jsx');
+if (fs.existsSync(marker) && !force) {
+  console.log('В папке уже есть шаблон (client/src/App.jsx).');
+  console.log('Чтобы перезаписать: npx exam-de-unpack --force');
+  process.exit(0);
+}
+
+copyRecursive(PACKAGE_ROOT, target);
+
+console.log('Готово. Дальше в этой папке:');
+console.log('  npm install');
+console.log('  npm run install:all');
+console.log('  настроить server/.env');
+console.log('  npm run db:init');
+console.log('  npm run dev');
+console.log('');

package/exam-project/server/db/init.js

@@ -0,0 +1,50 @@
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import bcrypt from 'bcryptjs';
+import dotenv from 'dotenv';
+import { pool } from './pool.js';
+
+dotenv.config();
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+
+async function runSqlFile(filename) {
+  const sql = fs.readFileSync(path.join(__dirname, filename), 'utf8');
+  await pool.query(sql);
+}
+
+async function seedAdmin() {
+  // --- Учётка админа по заданию ДЭ (п.5) — менять здесь ---
+
+  const login = 'adminka';
+  const password = 'password';
+  const hash = await bcrypt.hash(password, 10);
+
+  await pool.query(
+    `INSERT INTO users (login, password_hash, full_name, phone, email, role)
+     VALUES ($1, $2, $3, $4, $5, 'admin')
+     ON CONFLICT (login) DO UPDATE SET
+       password_hash = EXCLUDED.password_hash,
+       role = 'admin'`,
+    [login, hash, 'Администратор системы', '+7(000)-000-00-00', 'admin@moynesam.local']
+  );
+  console.log('Админ: логин adminka, пароль password');
+}
+
+async function main() {
+  try {
+    await runSqlFile('schema.sql');
+    await runSqlFile('seed.sql');
+    await seedAdmin();
+    console.log('База данных готова.');
+  } catch (err) {
+    console.error('Ошибка инициализации:', err.message);
+    process.exit(1);
+  } finally {
+    await pool.end();
+  }
+}
+
+main();

package/exam-project/server/db/pool.js

@@ -0,0 +1,11 @@
+
+import pg from 'pg';
+import dotenv from 'dotenv';
+
+dotenv.config();
+
+const { Pool } = pg;
+
+export const pool = new Pool({
+  connectionString: process.env.DATABASE_URL,
+});