Merge pull request #10 from apuc/authentication
loader hover and devlist fixes
This commit is contained in:
		| @@ -156,6 +156,10 @@ | ||||
|   border: 2px solid #6aaf5c; | ||||
| } | ||||
|  | ||||
| .form__btn:hover .loader * { | ||||
|   fill: #6aaf5c; | ||||
| } | ||||
|  | ||||
| .form__btn:hover { | ||||
|   background-image: none; | ||||
|   background-color: #ffffff; | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| import React, { useState } from 'react'; | ||||
| import { useDispatch } from 'react-redux'; | ||||
| import { auth } from '../../redux/outstaffingSlice'; | ||||
| import { loading } from '../../redux/loaderSlice' | ||||
| import { loading } from '../../redux/loaderSlice'; | ||||
| import style from './AuthForPartners.module.css'; | ||||
| import ellipse from '../../images/ellipse.png'; | ||||
| import arrow from '../../images/arrow__login_page.png'; | ||||
| @@ -25,7 +25,7 @@ const AuthForPartners = () => { | ||||
|   const dispatch = useDispatch() | ||||
|   const isAuth = useSelector(selectAuth) | ||||
|   const isLoading = useSelector(selectIsLoading) | ||||
| console.log('iL',isLoading); | ||||
|    | ||||
|   const [username, setUsername] = useState('') | ||||
|   const [password, setPassword] = useState('') | ||||
|  | ||||
| @@ -67,14 +67,14 @@ console.log('iL',isLoading); | ||||
|                     onClick={!isLoading ? (e) => { | ||||
|                       e.preventDefault(); | ||||
|                       dispatch(loading(true)) | ||||
|                       fetchAuth({ | ||||
|                         username, | ||||
|                         password, | ||||
|                         dispatch: ()=> { | ||||
|                           dispatch(auth(true)) | ||||
|                           dispatch(loading(false)) | ||||
|                         } | ||||
|                       }) | ||||
|                       // fetchAuth({ | ||||
|                       //   username, | ||||
|                       //   password, | ||||
|                       //   dispatch: ()=> { | ||||
|                       //     dispatch(auth(true)) | ||||
|                       //     dispatch(loading(false)) | ||||
|                       //   } | ||||
|                       // }) | ||||
|                     } : ()=>{}} | ||||
|                   > | ||||
|                   { isLoading ? <Loader /> : 'Войти' } | ||||
|   | ||||
| @@ -21,44 +21,46 @@ const Description = ({ onLoadMore }) => { | ||||
|     <section className={style.description}> | ||||
|       <div className="container"> | ||||
|         <div className={style.description__wrapper}> | ||||
|           {filteredListArr && filteredListArr.length > 0 | ||||
|             ? filteredListArr.map((el) => ( | ||||
|                 <div className="row" key={el.id}> | ||||
|                   <div className="col-2"> | ||||
|                     <img className={style.description__img} src={male} alt="" /> | ||||
|                   </div> | ||||
|                   <div className="col-12 col-xl-6"> | ||||
|                     <h3 className={style.description__title}> | ||||
|                       <Link to={`/candidate/${el.id}`}> | ||||
|                         {SKILLS[el.position_id]}, {LEVELS[el.level]} | ||||
|                       </Link> | ||||
|                     </h3> | ||||
|           {filteredListArr | ||||
|             ? (filteredListArr.length > 0  | ||||
|               ? <></>  | ||||
|               : filteredListArr.map((el) => ( | ||||
|                   <div className="row" key={el.id}> | ||||
|                     <div className="col-2"> | ||||
|                       <img className={style.description__img} src={male} alt="" /> | ||||
|                     </div> | ||||
|                     <div className="col-12 col-xl-6"> | ||||
|                       <h3 className={style.description__title}> | ||||
|                         <Link to={`/candidate/${el.id}`}> | ||||
|                           {SKILLS[el.position_id]}, {LEVELS[el.level]} | ||||
|                         </Link> | ||||
|                       </h3> | ||||
|  | ||||
|                     {el.vc_text_short ? ( | ||||
|                       <div className={style.description__text}>{el.vc_text_short}</div> | ||||
|                     ) : ( | ||||
|                       <p className={style.description__textSecondary}>Описание отсутствует...</p> | ||||
|                     )} | ||||
|                       {el.vc_text_short ? ( | ||||
|                         <div className={style.description__text}>{el.vc_text_short}</div> | ||||
|                       ) : ( | ||||
|                         <p className={style.description__textSecondary}>Описание отсутствует...</p> | ||||
|                       )} | ||||
|                     </div> | ||||
|                     <div className="col-12 col-xl-4"> | ||||
|                       <Link to={`/candidate/${el.id}`}> | ||||
|                         <button className={style.description__button}>Подробное резюме</button> | ||||
|                       </Link> | ||||
|                     </div> | ||||
|                     <div className="col-xl-2"></div> | ||||
|                     <div className="col-12 col-xl-6"> | ||||
|                       <ul className={style.description__list}> | ||||
|                         {el.skillValues.map((e) => ( | ||||
|                           <li key={e.id} className={style.description__list__item}> | ||||
|                             {e.skill.name} | ||||
|                           </li> | ||||
|                         ))} | ||||
|                       </ul> | ||||
|                       <img className={style.description__rectangle} src={rectangle} alt="" /> | ||||
|                     </div> | ||||
|                     <div className="col-xl-4"></div> | ||||
|                   </div> | ||||
|                   <div className="col-12 col-xl-4"> | ||||
|                     <Link to={`/candidate/${el.id}`}> | ||||
|                       <button className={style.description__button}>Подробное резюме</button> | ||||
|                     </Link> | ||||
|                   </div> | ||||
|                   <div className="col-xl-2"></div> | ||||
|                   <div className="col-12 col-xl-6"> | ||||
|                     <ul className={style.description__list}> | ||||
|                       {el.skillValues.map((e) => ( | ||||
|                         <li key={e.id} className={style.description__list__item}> | ||||
|                           {e.skill.name} | ||||
|                         </li> | ||||
|                       ))} | ||||
|                     </ul> | ||||
|                     <img className={style.description__rectangle} src={rectangle} alt="" /> | ||||
|                   </div> | ||||
|                   <div className="col-xl-4"></div> | ||||
|                 </div> | ||||
|               )) | ||||
|                 ))) | ||||
|             : candidatesListArr.map((el) => ( | ||||
|                 <div className="row" key={el.id}> | ||||
|                   <div className="col-2"> | ||||
|   | ||||
| @@ -1,4 +1,6 @@ | ||||
| import SVGLoader from "react-loader-spinner"; | ||||
| import './loader.css' | ||||
|  | ||||
| export const Loader = () => { | ||||
|     return ( | ||||
|         <div className='loader'> | ||||
| @@ -7,7 +9,6 @@ export const Loader = () => { | ||||
|                 color="#fff" | ||||
|                 height={50} | ||||
|                 width={50} | ||||
|                 timeout={3000} | ||||
|             /> | ||||
|         </div> | ||||
|     ); | ||||
|   | ||||
							
								
								
									
										11
									
								
								src/components/Loader/loader.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										11
									
								
								src/components/Loader/loader.css
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,11 @@ | ||||
| .loader { | ||||
|     height: 100%; | ||||
|     width: 100%; | ||||
|     display: flex; | ||||
|     justify-content: center; | ||||
|     align-items: center; | ||||
| } | ||||
|  | ||||
| .loader:hover path { | ||||
|         fill: #6aaf5c; | ||||
| } | ||||
| @@ -1,12 +1,15 @@ | ||||
| import React from 'react'; | ||||
| import { useSelector, useDispatch } from 'react-redux'; | ||||
| import Select from 'react-select'; | ||||
| import { Loader } from '../Loader/Loader'; | ||||
| import style from './TagSelect.module.css'; | ||||
| import { selectedItems, selectItems, selectTags, filteredCandidates } from '../../redux/outstaffingSlice'; | ||||
| import { fetchItemsForId } from '../../server/server'; | ||||
| import { selectIsLoading } from '../../redux/loaderSlice'; | ||||
|  | ||||
| const TagSelect = () => { | ||||
|   const dispatch = useDispatch(); | ||||
|   const isLoading = useSelector(selectIsLoading) | ||||
|  | ||||
|   const itemsArr = useSelector(selectItems); | ||||
|  | ||||
| @@ -41,8 +44,8 @@ const TagSelect = () => { | ||||
|                     return { id: item.id, value: item.value, label: item.value }; | ||||
|                   })} | ||||
|                 /> | ||||
|                 <button onClick={handleSubmit} type="submit"> | ||||
|                   Поиск | ||||
|                 <button onClick={handleSubmit} type="submit" className={style.search__submit}> | ||||
|                 { isLoading ? <Loader /> : 'Поиск' } | ||||
|                 </button> | ||||
|               </div> | ||||
|             </div> | ||||
|   | ||||
| @@ -70,3 +70,7 @@ | ||||
|   font-size: 1.6em !important; | ||||
|   color: gray !important; | ||||
| } | ||||
|  | ||||
| .search__submit:hover .loader path { | ||||
|     fill: #6aaf5c; | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 GitHub
						GitHub