damanukyan/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

admin page

Browse Source
This commit is contained in:
Артём Рассадин
2026-06-05 22:52:52 +03:00
parent f4af2fd137
commit da55c61edd
13 changed files with 275 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/pages/admin-organization/ui/AdminOrganizationPage.module.css
View File

@@ -39,9 +39,38 @@
gap: 24px;
}
.documents {
.tabs {
max-width: 900px;
margin: 24px auto 0;
margin: 0 auto 24px;
display: flex;
gap: 8px;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.tab {
background: none;
border: none;
border-bottom: 2px solid transparent;
color: var(--text-secondary, rgba(255, 255, 255, 0.6));
font-size: 15px;
font-weight: 600;
padding: 12px 16px;
cursor: pointer;
transition: color 0.2s, border-color 0.2s;
}
.tab:hover {
color: var(--text-primary, #fff);
}
.tabActive {
color: var(--text-primary, #fff);
border-bottom-color: var(--interactive, #4a6dff);
}
.tabPanel {
max-width: 900px;
margin: 0 auto;
}
.section {

53
src/pages/admin-organization/ui/AdminOrganizationPage.tsx
View File

@@ -5,9 +5,18 @@ import { ROUTES } from '@shared/config/routes'
import { FormField, Notification, PrimaryButton } from '@shared/ui'
import { AdminLoginForm } from '@widgets/admin-login-form'
import { OrganizationDocuments } from '@widgets/organization-documents'
import { OrganizationPurchaseRequests } from '@widgets/organization-purchase-requests'
import { useOrganizationForm } from '../model/useOrganizationForm'
import styles from './AdminOrganizationPage.module.css'
type Tab = 'info' | 'documents' | 'requests'
const TABS: { id: Tab; label: string }[] = [
{ id: 'info', label: 'Общая информация' },
{ id: 'documents', label: 'Документы' },
{ id: 'requests', label: 'Заявки' },
]
function formatDateTime(value: string | null): string {
if (!value) return '—'
const d = new Date(value)
@@ -21,6 +30,7 @@ export function AdminOrganizationPage() {
const navigate = useNavigate()
const { data: org, isLoading, isError } = useOrganization(organizationId)
const [notice, setNotice] = useState(false)
const [activeTab, setActiveTab] = useState<Tab>('info')
const { form, setField, handleSubmit, isSaving, error } = useOrganizationForm(
org,
organizationId ?? '',
@@ -43,32 +53,47 @@ export function AdminOrganizationPage() {
{isError && <div className={styles.state}>Не удалось загрузить организацию</div>}
{org && (
<div className={styles.tabs}>
{TABS.map((tab) => (
<button
key={tab.id}
type="button"
className={`${styles.tab} ${activeTab === tab.id ? styles.tabActive : ''}`}
onClick={() => setActiveTab(tab.id)}
>
{tab.label}
</button>
))}
</div>
)}
{org && activeTab === 'info' && (
<form className={styles.form} onSubmit={handleSubmit}>
<section className={styles.section}>
<h2 className={styles.sectionTitle}>Реквизиты</h2>
<div className={styles.grid}>
<FormField label="Наименование" value={form.name} onChange={setField('name')} required />
<FormField label="Краткое наименование" value={form.short_name} onChange={setField('short_name')} />
<FormField label="Наименование" value={form.name} onChange={setField('name')} placeholder="ООО «Ромашка»" required />
<FormField label="Краткое наименование" value={form.short_name} onChange={setField('short_name')} placeholder="Ромашка" />
<FormField label="ИНН" value={org.inn} readOnly icon="lock" />
<FormField label="ОГРН" value={form.ogrn} onChange={setField('ogrn')} />
<FormField label="КПП" value={form.kpp} onChange={setField('kpp')} />
<FormField label="Статус" value={form.status} onChange={setField('status')} />
<FormField label="ОГРН" value={form.ogrn} onChange={setField('ogrn')} placeholder="1027700132195" />
<FormField label="КПП" value={form.kpp} onChange={setField('kpp')} placeholder="770801001" />
<FormField label="Статус" value={form.status} onChange={setField('status')} placeholder="active" />
</div>
</section>
<section className={styles.section}>
<h2 className={styles.sectionTitle}>Адреса</h2>
<div className={styles.grid}>
<FormField label="Юридический адрес" value={form.legal_address} onChange={setField('legal_address')} />
<FormField label="Фактический адрес" value={form.actual_address} onChange={setField('actual_address')} />
<FormField label="Юридический адрес" value={form.legal_address} onChange={setField('legal_address')} placeholder="г. Москва, ул. Тверская, д. 1" />
<FormField label="Фактический адрес" value={form.actual_address} onChange={setField('actual_address')} placeholder="г. Москва, ул. Тверская, д. 1" />
</div>
</section>
<section className={styles.section}>
<h2 className={styles.sectionTitle}>Контакты</h2>
<div className={styles.grid}>
<FormField label="Контактное лицо" value={form.contact_person} onChange={setField('contact_person')} />
<FormField label="Контактный телефон" type="tel" value={form.contact_phone} onChange={setField('contact_phone')} />
<FormField label="Контактное лицо" value={form.contact_person} onChange={setField('contact_person')} placeholder="Иванов Иван Иванович" />
<FormField label="Контактный телефон" type="tel" value={form.contact_phone} onChange={setField('contact_phone')} placeholder="+7 (999) 000-00-00" />
</div>
</section>
@@ -93,12 +118,18 @@ export function AdminOrganizationPage() {
</form>
)}
{org && (
<div className={styles.documents}>
{org && activeTab === 'documents' && (
<div className={styles.tabPanel}>
<OrganizationDocuments orgId={org.id} />
</div>
)}
{org && activeTab === 'requests' && (
<div className={styles.tabPanel}>
<OrganizationPurchaseRequests orgId={org.id} />
</div>
)}
{notice && (
<Notification
status="success"