final ref hw13

This commit is contained in:
neko
2022-09-27 11:30:20 +03:00
parent 97110cb2ba
commit b25f4b4f5b
3 changed files with 80 additions and 36 deletions

View File

@@ -8,56 +8,74 @@ import error400 from './images/400.svg'
import error500 from './images/500.svg'
import errorUnknown from './images/error.svg'
axios.interceptors.response.use(
(response) => response,
(error) => {
console.log(error)
if (typeof error.response === 'undefined') {
console.log(error)
}
return Promise.reject(error)
}
)
/*
* 1 - дописать функцию send
* 2 - дизэйблить кнопки пока идёт запрос
* 3 - сделать стили в соответствии с дизайном
* */
const HW13 = () => {
const [answer, setAnswer] = useState('')
const [code, setCode] = useState('')
const [text, setText] = useState('')
const [info, setInfo] = useState('')
const [image, setImage] = useState('')
const send = (x?: boolean | null) => () => {
const url =
x === null
? 'https://xxxxxx.ccc'
: 'https://neko-cafe-back.herokuapp.com/auth/test'
? 'https://xxxxxx.ccc' // имитация запроса на не корректный адрес
: 'https://incubator-personal-page-back.herokuapp.com/api/3.0/homework/test'
setAnswer('...loading')
setCode('')
setImage('')
setText('')
setInfo('...loading')
axios
.post(url, {success: x})
.then((res) => {
setAnswer(res.data.errorText)
setCode('Код 200!')
setImage(success200)
// дописать
setText(res.data.errorText)
setInfo(res.data.info)
res.status === 200 && setImage(success200)
})
.catch((e) => {
console.log(e)
setAnswer(e.response?.data?.errorText || e.message)
// дописать
setText(e.response?.data?.errorText || e.message)
setInfo(e.response?.data?.info || e.name)
e.response?.status === 400 && setImage(error400)
e.response?.status === 500 && setImage(error500)
e.response?.status === 0 && setImage(errorUnknown)
switch (e.response?.status) {
case 400: {
setCode('Ошибка 400!')
setImage(error400)
break
}
case 500: {
setCode('Ошибка 500!')
setImage(error500)
break
}
default: {
setCode('Error!')
setImage(errorUnknown)
}
}
})
}
return (
<div id={'hw13'}>
<div className={s2.hwTitle}>Homework #13</div>
<div className={s2.hw}>
{/*для автоматической проверки дз (не менять)*/}
<div className={s.buttonsContainer}>
<SuperButton
id={'hw13-send-true'}
onClick={send(true)}
xType={'secondary'}
disabled={answer === '...loading'}
// дописать
disabled={info === '...loading'}
>
Send true
</SuperButton>
@@ -65,7 +83,8 @@ const HW13 = () => {
id={'hw13-send-false'}
onClick={send(false)}
xType={'secondary'}
disabled={answer === '...loading'}
// дописать
disabled={info === '...loading'}
>
Send false
</SuperButton>
@@ -73,32 +92,38 @@ const HW13 = () => {
id={'hw13-send-undefined'}
onClick={send(undefined)}
xType={'secondary'}
disabled={answer === '...loading'}
// дописать
disabled={info === '...loading'}
>
Send undefined
</SuperButton>
<SuperButton
id={'hw13-send-null'}
onClick={send(null)}
onClick={send(null)} // имитация запроса на не корректный адрес
xType={'secondary'}
disabled={answer === '...loading'}
// дописать
disabled={info === '...loading'}
>
Send null
</SuperButton>
</div>
<div className={s.responseContainer}>
<div className={s.imageContainer}>
{image !== '' && <img src={image} alt="status"/>}
{image && <img src={image} className={s.image} alt="status"/>}
</div>
<div className={s.textContainer}>
<div id={'hw13-answer'} className={s.answer}>
{answer}
<div id={'hw13-code'} className={s.code}>
{code}
</div>
<div id={'hw13-text'} className={s.text}>
{text}
</div>
<div id={'hw13-info'} className={s.info}>
{info}
</div>
</div>
</div>
</div>
</div>