export const faqs: Faq[] = [
{
id: 1,
title: "Регистрация в личном кабинете",
description:
"Узнайте, как зарегистрироваться в личном кабинете и активировать его",
content: "<div><p>Cоздайте логин и пароль для дальнейшего входа в ЛК</p><p>Введите имя,фамилию и номер телефона</p><p>И активируйте кнопку</p></div>"
},
{
id: 2,
title: "Настройки",
description:
"Регулируйте настройки личного кабинета под свои потребности.Проверяйте устройства перед консультациями",
content: "<div><p>Перейдите в раздел 'Настройки' и напротив каждого пункта поставте галочки под свои индивидуальные потребности</p></div>"
},
{
id: 3,
title: "Здоровье",
description:
"Узнайте, как воспользоватся быстрым поиском врача,заказать телемедицинскую консультацию или просмотреть новости вашей клиники",
content: "<div><p>В разделе 'Здоровье' вы сможете ознакомиться с последними новостями вашей клиники или найти необходимого врача.</p><p>Перейдите в раздел 'Видеочат для общения с врачом' и восползуйтесь услугой телемедицинская консультация </p></div>"
},
{MockService.onGet("/faq").reply(() => {
return [200, faqs];
});
export const FAQ = () => {
const classes = useStyles();
const [{ device }] = useAppStore();
const switchDeviceSize = device.isMobile ? 12 : 4;
const [currentFaqs, setCurrentFaqs] = useState<Faq[]>([]);
useEffect(() => {
(async () => {
try {
const faqs = await HttpService.get<Faq[]>("/faq");
setCurrentFaqs(faqs);
console.log(faqs);
} catch (error) {}
})();
}, []);
return (
<div>
<div className={classes.root}>
<GridContainer>
<GridRow>
<GridColumn>
<header className={classes.headerSearch}>
<GridColumn>
<div className={classes.mainHeading}>
Какую информацию вы хотите найти?
</div>
</GridColumn>
<GridColumn size={10} offset={1}>
<Input
type="text"
placeholder="Найдите всё, что требуется(онлайн-консультация,
добавление записи в медкарту...)"
fullWidth
classes={{
inputWrapper: classes.searchField,
}}
startAdornment={
<InputAdornment
position="start"
classes={{ root: classes.searchImg }}
>
<Search></Search>
</InputAdornment>
}
/>
</GridColumn>
</header>
</GridColumn>
</GridRow>
<GridRow>
{currentFaqs.map((card) => {
return (
<GridColumn size={switchDeviceSize}>
<Link to={`/faq/${card.id}`} className={classes.cardLink}>
<div className={classes.blockCard} key={card.id}>
<div className={classes.boxTitle}>
<p className={classes.titleSection}>{card.title}</p>
<p className={classes.textSection}>{card.description}</p>
</div>
</div>
</Link>
</GridColumn>
);
})}
</GridRow>
</GridContainer>
</div>
</div>
);
};MockService.onGet(/faqs\/\d+$/).reply(() => {
return [200, faqs[0]]
});type Params = {
id: string;
}
MockService.onGet(/faq\/\d+$/).reply(() => {
return [200, faqs[0]]
});
export const FaqCards = () => {
const { id } = useParams<Params>();
console.log(id)
const [currentFaqs, setCurrentFaqs] = useState<Faq[] | null>();
const classes = useStyles();
useEffect(() => {
(async () => {
try {
const faqsId = await HttpService.get<Faq[]>(`/faqs/${id}`);
setCurrentFaqs(faqsId);
} catch (error) {}
})();
},[id]);
if(currentFaqs === null) return null;
else {
return (
<div className={classes.root}>
<GridContainer>
<GridRow>
<GridColumn>
<div className={classes.cards}key={id}>
<div className={classes.blockTitle}>
<p className={classes.title}>{faqs.title}</p>
<p className={classes.content}>{faqs.content}</p>
</div>
</div>
</GridColumn>
</GridRow>
</GridContainer>
</div>
);
};
};MockService.onGet("/faq").reply(() => {
return [200, faqs];
});
export const FAQ = () => {
const classes = useStyles();
const [{ device }] = useAppStore();
const switchDeviceSize = device.isMobile ? 12 : 4;
const [currentFaqs, setCurrentFaqs] = useState<Faq[]>([]);
useEffect(() => {
(async () => {
try {
const faqs = await HttpService.get<Faq[]>("/faq");
setCurrentFaqs(faqs);
console.log(faqs);
} catch (error) {}
})();
}, []);
return (
<div>
<div className={classes.root}>
<GridContainer>
<GridRow>
<GridColumn>
<header className={classes.headerSearch}>
<GridColumn>
<div className={classes.mainHeading}>
Какую информацию вы хотите найти?
</div>
</GridColumn>
<GridColumn size={10} offset={1}>
<Input
type="text"
placeholder="Найдите всё, что требуется(онлайн-консультация,
добавление записи в медкарту...)"
fullWidth
classes={{
inputWrapper: classes.searchField,
}}
startAdornment={
<InputAdornment
position="start"
classes={{ root: classes.searchImg }}
>
<Search></Search>
</InputAdornment>
}
/>
</GridColumn>
</header>
</GridColumn>
</GridRow>
<GridRow>
{currentFaqs.map((card) => {
return (
<GridColumn size={switchDeviceSize}>
<Link to={`/faq/${card.id}`}>
<div className={classes.blockCard} key={card.id}>
<div className={classes.boxTitle}>
<p className={classes.titleSection}>{card.title}</p>
<p className={classes.textSection}>{card.content}</p>
</div>
</div>
</Link>
</GridColumn>
);
})}
</GridRow>
</GridContainer>
</div>
</div>
);
};