update

2026-08-01 15:15:34 +04:00
parent 87b518cf4e
commit 9697c98999
50 changed files with 2619 additions and 1 deletions
@@ -0,0 +1,114 @@
+'use client';
+
+import { Form, Input, Select, Button, message } from 'antd';
+import { useLanguage } from '@/app/context/LanguageContext';
+
+const { TextArea } = Input;
+
+export default function TicketForm() {
+  const { t, locale } = useLanguage();
+  const [form] = Form.useForm();
+
+  const handleFinish = async (values) => {
+    // -------------------------------------------------------------------
+    // TODO: Connect to the real ticketing/support API.
+    //
+    // import axios from 'axios';
+    //
+    // try {
+    //   await axios.post('/api/tickets', values);
+    // } catch (err) {
+    //   message.error('...');
+    //   return;
+    // }
+    // -------------------------------------------------------------------
+    console.log('Ticket submitted (placeholder):', values);
+    message.success(t.ticket.successMsg);
+    form.resetFields();
+  };
+
+  return (
+    <section id="support" className="relative px-6 md:px-16 py-20 md:py-28 bg-page border-t border-subtle">
+      <div className="max-w-2xl mx-auto">
+        <div className="text-center mb-10">
+          <span className="text-brand-400 text-sm font-semibold tracking-wide">{t.ticket.eyebrow}</span>
+          <h2 className="text-2xl md:text-4xl font-extrabold brand-gradient-text mt-3 mb-3">
+            {t.ticket.title}
+          </h2>
+          <p className="text-secondary text-sm md:text-base">{t.ticket.subtitle}</p>
+        </div>
+
+        <Form
+          form={form}
+          layout="vertical"
+          onFinish={handleFinish}
+          requiredMark={false}
+          initialValues={{ priority: 'medium' }}
+        >
+          <div className="grid md:grid-cols-2 gap-x-4">
+            <Form.Item
+              label={<span className="text-secondary">{t.ticket.name}</span>}
+              name="name"
+              rules={[{ required: true, message: t.ticket.requiredMsg }]}
+            >
+              <Input size="large" placeholder={t.ticket.namePlaceholder} />
+            </Form.Item>
+
+            <Form.Item
+              label={<span className="text-secondary">{t.ticket.phone}</span>}
+              name="phone"
+              rules={[
+                { required: true, message: t.ticket.requiredMsg },
+                { pattern: /^[0-9+\s-]{7,15}$/, message: t.ticket.invalidPhone },
+              ]}
+            >
+              <Input size="large" placeholder={t.ticket.phonePlaceholder} dir="ltr" />
+            </Form.Item>
+          </div>
+
+          <div className="grid md:grid-cols-2 gap-x-4">
+            <Form.Item
+              label={<span className="text-secondary">{t.ticket.email}</span>}
+              name="email"
+              rules={[{ type: 'email', message: t.ticket.invalidEmail }]}
+            >
+              <Input size="large" placeholder={t.ticket.emailPlaceholder} dir="ltr" />
+            </Form.Item>
+
+            <Form.Item
+              label={<span className="text-secondary">{t.ticket.priority}</span>}
+              name="priority"
+            >
+              <Select
+                size="large"
+                options={t.ticket.priorities.map((p) => ({ value: p.value, label: p.label }))}
+              />
+            </Form.Item>
+          </div>
+
+          <Form.Item
+            label={<span className="text-secondary">{t.ticket.subject}</span>}
+            name="subject"
+            rules={[{ required: true, message: t.ticket.requiredMsg }]}
+          >
+            <Input size="large" placeholder={t.ticket.subjectPlaceholder} />
+          </Form.Item>
+
+          <Form.Item
+            label={<span className="text-secondary">{t.ticket.message}</span>}
+            name="message"
+            rules={[{ required: true, message: t.ticket.requiredMsg }]}
+          >
+            <TextArea rows={5} placeholder={t.ticket.messagePlaceholder} />
+          </Form.Item>
+
+          <Form.Item className="mb-0">
+            <Button type="primary" size="large" htmlType="submit" block>
+              {t.ticket.submit}
+            </Button>
+          </Form.Item>
+        </Form>
+      </div>
+    </section>
+  );
+}