apps/web: add Link to /conditions
This commit is contained in:
vchikalkin
parent
1c16fc2ec0
commit
73b3a87c2a
@ -4,8 +4,10 @@ import wretch from 'wretch';
|
||||
|
||||
const api = wretch(urls.URL_UIS).errorType('json');
|
||||
|
||||
export async function getData(params: t.Request) {
|
||||
const url = `/${params.slug}?${new URLSearchParams(params.searchParams)}`;
|
||||
type CreateUrl = (path: string) => string;
|
||||
|
||||
export async function getData(createUrl: CreateUrl) {
|
||||
const url = createUrl('');
|
||||
|
||||
return api
|
||||
.get(url)
|
||||
@ -13,8 +15,8 @@ export async function getData(params: t.Request) {
|
||||
.then((res) => res);
|
||||
}
|
||||
|
||||
export async function getMetaData(params: t.Request) {
|
||||
const url = `/${params.slug}/meta?${new URLSearchParams(params.searchParams)}`;
|
||||
export async function getMetaData(createUrl: CreateUrl) {
|
||||
const url = createUrl('/meta');
|
||||
|
||||
return api
|
||||
.get(url)
|
||||
@ -22,8 +24,8 @@ export async function getMetaData(params: t.Request) {
|
||||
.then((res) => res);
|
||||
}
|
||||
|
||||
export async function getConfig(params: t.Request) {
|
||||
const url = `/${params.slug}/config`;
|
||||
export async function getConfig(createUrl: CreateUrl) {
|
||||
const url = createUrl('/config');
|
||||
|
||||
return api
|
||||
.get(url)
|
||||
@ -31,8 +33,8 @@ export async function getConfig(params: t.Request) {
|
||||
.then((res) => res);
|
||||
}
|
||||
|
||||
export async function getConditions(params: t.Request) {
|
||||
const url = `/${params.slug}/conditions?${new URLSearchParams(params.searchParams)}`;
|
||||
export async function getConditions(createUrl: CreateUrl) {
|
||||
const url = createUrl('/conditions');
|
||||
|
||||
return api
|
||||
.get(url)
|
||||
|
||||
@ -1,14 +1,18 @@
|
||||
/* eslint-disable react/forbid-component-props */
|
||||
import * as apiIUS from '@/api/ius/query';
|
||||
import { Conditions } from '@/components/Conditions';
|
||||
import { makeCreateUrl } from '@/utils/url';
|
||||
import type { Metadata } from 'next';
|
||||
import { Background } from 'ui';
|
||||
|
||||
type Props = {
|
||||
params: { slug: string };
|
||||
searchParams: { [key: string]: string | string[] | undefined };
|
||||
searchParams: string | string[][] | Record<string, string>;
|
||||
};
|
||||
|
||||
export async function generateMetadata({ params, searchParams }: Props): Promise<Metadata> {
|
||||
const { title } = await apiIUS.getConfig({ searchParams, ...params });
|
||||
const createUrl = makeCreateUrl(`/${params.slug}`, searchParams);
|
||||
const { title } = await apiIUS.getConfig(createUrl);
|
||||
const text = `Условия: ${title} | Эволюция`;
|
||||
|
||||
return {
|
||||
@ -22,7 +26,12 @@ export async function generateMetadata({ params, searchParams }: Props): Promise
|
||||
}
|
||||
|
||||
export default async function Page({ params, searchParams }: Props) {
|
||||
const conditions = await apiIUS.getConditions({ searchParams, ...params });
|
||||
const createUrl = makeCreateUrl(`/${params.slug}`, searchParams);
|
||||
const conditions = await apiIUS.getConditions(createUrl);
|
||||
|
||||
return <Conditions html={conditions} />;
|
||||
return (
|
||||
<Background className="justify-center">
|
||||
<Conditions html={conditions} />
|
||||
</Background>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,14 +1,17 @@
|
||||
import * as apiIUS from '@/api/ius/query';
|
||||
import { Form } from '@/components/Form';
|
||||
import { FormButtons, FormElements, FormHeader } from '@/components/Form';
|
||||
import { makeCreateUrl } from '@/utils/url';
|
||||
import type { Metadata } from 'next';
|
||||
import { Background, Divider } from 'ui';
|
||||
|
||||
type Props = {
|
||||
params: { slug: string };
|
||||
searchParams: { [key: string]: string | string[] | undefined };
|
||||
searchParams: string | string[][] | Record<string, string>;
|
||||
};
|
||||
|
||||
export async function generateMetadata({ params, searchParams }: Props): Promise<Metadata> {
|
||||
const { title } = await apiIUS.getConfig({ searchParams, ...params });
|
||||
const createUrl = makeCreateUrl(`/${params.slug}`, searchParams);
|
||||
const { title } = await apiIUS.getConfig(createUrl);
|
||||
const text = `${title} | Эволюция`;
|
||||
|
||||
return {
|
||||
@ -22,9 +25,20 @@ export async function generateMetadata({ params, searchParams }: Props): Promise
|
||||
}
|
||||
|
||||
export default async function Page({ params, searchParams }: Props) {
|
||||
const data = await apiIUS.getData({ searchParams, ...params });
|
||||
const metaData = await apiIUS.getMetaData({ searchParams, ...params });
|
||||
const { title } = await apiIUS.getConfig({ searchParams, ...params });
|
||||
const createUrl = makeCreateUrl(`/${params.slug}`, searchParams);
|
||||
|
||||
return <Form data={data} metaData={metaData} title={title} />;
|
||||
const data = await apiIUS.getData(createUrl);
|
||||
const metaData = await apiIUS.getMetaData(createUrl);
|
||||
const { title } = await apiIUS.getConfig(createUrl);
|
||||
|
||||
const props = { data, metaData, title };
|
||||
|
||||
return (
|
||||
<Background>
|
||||
<FormHeader {...props} url={'/ius' + createUrl('/conditions')} />
|
||||
<FormElements {...props} />
|
||||
<Divider />
|
||||
<FormButtons />
|
||||
</Background>
|
||||
);
|
||||
}
|
||||
|
||||
@ -1,15 +1,8 @@
|
||||
/* eslint-disable react/no-danger */
|
||||
/* eslint-disable react/forbid-component-props */
|
||||
import { Background } from 'ui';
|
||||
|
||||
type Props = {
|
||||
readonly html: string;
|
||||
};
|
||||
|
||||
export function Conditions({ html }: Props) {
|
||||
return (
|
||||
<Background className="justify-center">
|
||||
<div dangerouslySetInnerHTML={{ __html: html }} className="justify-center" />
|
||||
</Background>
|
||||
);
|
||||
return <div dangerouslySetInnerHTML={{ __html: html }} className="justify-center" />;
|
||||
}
|
||||
|
||||
@ -1,6 +1,10 @@
|
||||
/* eslint-disable react/forbid-component-props */
|
||||
/* eslint-disable react/no-unused-prop-types */
|
||||
'use client';
|
||||
import type { ResponseGetData, ResponseMetaData } from '@/api/ius/types';
|
||||
import { mapFieldTypeElement } from '@/config/elements';
|
||||
import { Background, Button, Divider, ElementContainer, Heading } from 'ui';
|
||||
import Link from 'next/link';
|
||||
import { Button, ElementContainer, Heading } from 'ui';
|
||||
|
||||
type Props = {
|
||||
readonly data: ResponseGetData;
|
||||
@ -8,42 +12,54 @@ type Props = {
|
||||
readonly title: string;
|
||||
};
|
||||
|
||||
export function Form({ data, metaData, title }: Props) {
|
||||
export function FormHeader({ title, url }: Props & { readonly url: string }) {
|
||||
return (
|
||||
<Background>
|
||||
<div className="flex justify-between">
|
||||
<Heading size={2}>{title}</Heading>
|
||||
<div className="mt-2 grid auto-rows-auto grid-cols-1 gap-2 gap-x-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
{Object.keys(metaData).map((name) => {
|
||||
const { fieldType, label, max, min = 0, visible, ...props } = metaData[name];
|
||||
|
||||
if (!visible) return false;
|
||||
|
||||
const Element = mapFieldTypeElement[fieldType];
|
||||
|
||||
return (
|
||||
<ElementContainer
|
||||
key={name}
|
||||
id={name}
|
||||
title={fieldType === 'CHECKBOX' ? '' : metaData[name].label}
|
||||
>
|
||||
<Element
|
||||
id={name}
|
||||
defaultValue={data[name]}
|
||||
title={label}
|
||||
min={min}
|
||||
max={max}
|
||||
{...props}
|
||||
/>
|
||||
</ElementContainer>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<Divider />
|
||||
<div className="grid grid-cols-1 gap-2 gap-x-4 md:grid-cols-3">
|
||||
<Button intent="outline-danger">Отмена</Button>
|
||||
<Button intent="secondary">Возврат на доработку</Button>
|
||||
<Button>Сохранить</Button>
|
||||
</div>
|
||||
</Background>
|
||||
<Link href={url} className="text-primary-600 text-sm font-medium hover:underline">
|
||||
Посмотреть условия
|
||||
</Link>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function FormButtons() {
|
||||
return (
|
||||
<div className="grid grid-cols-1 gap-2 gap-x-4 md:grid-cols-3">
|
||||
<Button intent="outline-danger">Отмена</Button>
|
||||
<Button intent="secondary">Возврат на доработку</Button>
|
||||
<Button>Сохранить</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function FormElements({ data, metaData }: Props) {
|
||||
return (
|
||||
<div className="mt-2 grid auto-rows-auto grid-cols-1 gap-2 gap-x-4 md:grid-cols-2 lg:grid-cols-3">
|
||||
{Object.keys(metaData).map((name) => {
|
||||
const { fieldType, label, max, min = 0, visible, ...props } = metaData[name];
|
||||
|
||||
if (!visible) return false;
|
||||
|
||||
const Element = mapFieldTypeElement[fieldType];
|
||||
|
||||
return (
|
||||
<ElementContainer
|
||||
key={name}
|
||||
id={name}
|
||||
title={fieldType === 'CHECKBOX' ? '' : metaData[name].label}
|
||||
>
|
||||
<Element
|
||||
id={name}
|
||||
defaultValue={data[name]}
|
||||
title={label}
|
||||
min={min}
|
||||
max={max}
|
||||
{...props}
|
||||
/>
|
||||
</ElementContainer>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
10
apps/web/utils/url.ts
Normal file
10
apps/web/utils/url.ts
Normal file
@ -0,0 +1,10 @@
|
||||
export function makeCreateUrl(
|
||||
path: string,
|
||||
searchParams?: string | string[][] | Record<string, string>
|
||||
) {
|
||||
return function (route: string) {
|
||||
if (searchParams) return `${path}${route}?${new URLSearchParams(searchParams)}`;
|
||||
|
||||
return path + route;
|
||||
};
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user