feat: add dia e horario de atendimento

ctrlmais · Apr 12, 2022 · 0ea07d3 · 0ea07d3
1 parent a5749cb
commit 0ea07d3
Showing 1 changed file with 60 additions and 19 deletions.
diff --git a/src/components/CardBarbeiro/index.tsx b/src/components/CardBarbeiro/index.tsx
@@ -4,6 +4,8 @@ import { BsCalendar, BsClock } from 'react-icons/bs';
 import Avvvatars from 'avvvatars-react';
 import { CardBarbeiroProps } from 'types/IComponents';
 
+import { getDiaSemana } from 'utils/semanas';
+
 import { getPhoto } from 'services/get/photo';
 
 import styles from './CardBarbeiro.module.scss';
@@ -12,6 +14,9 @@ export function CardBarbeiro(props: CardBarbeiroProps) {
   const [photo, setPhoto] = useState('');
   const [name, setName] = useState('');
 
+  const diaAtual = String(new Date().getDay());
+  const schedules = JSON.parse(props.barbeiro?.schedules);
+
   async function getPhotoUser(id: string) {
     const { data, error, status } = await getPhoto(id);
 
@@ -36,28 +41,64 @@ export function CardBarbeiro(props: CardBarbeiroProps) {
     }
   }, [props.barbeiro]);
 
+  function getDiasFuncionamento() {
+    const dias = [] as string[];
+    schedules?.map((schedule: any) => {
+      if (schedule.week_day !== '') {
+        dias.push(getDiaSemana(schedule?.week_day));
+      }
+    });
+    return dias;
+  }
+
+  function getHorarioAtual(week_day: string) {
+    const horario = [] as string[];
+    schedules?.map((schedule: any) => {
+      if (schedule.week_day === week_day) {
+        horario.push(schedule.from + ' às ' + schedule.to);
+      }
+    });
+    return horario;
+  }
+
   return (
-    <>
-      <div className={styles.card} onClick={props.onClick} key={props.barbeiro?.id}>
-        <div className={styles.containerImg}>
-          {photo === '' && (props.barbeiro?.avatar_url === null || props.barbeiro?.avatar_url === undefined) ? (
-            <Avvvatars value={props.barbeiro?.nome || ''} size={72} />
+    <div className={styles.card} onClick={props.onClick} key={props.barbeiro?.id}>
+      <div className={styles.containerImg}>
+        {photo === '' && (props.barbeiro?.avatar_url === null || props.barbeiro?.avatar_url === undefined) ? (
+          <Avvvatars value={props.barbeiro?.nome || ''} size={72} />
+        ) : (
+          <img src={photo || props.barbeiro?.avatar_url || props.barbeiro?.picture} alt={props.barbeiro?.nome} />
+        )}
+      </div>
+      <div className={styles.containerInfo}>
+        <h2 className={styles.title}>{name || props.barbeiro?.nome}</h2>
+        <strong className={styles.info}>
+          {schedules === undefined || schedules === null ? (
+            <>
+              <BsCalendar color="#FF9000" size={16} style={{ marginRight: '12px' }} />
+              Sem data definida
+            </>
+          ) : (
+            <>
+              <BsCalendar color="#FF9000" size={16} style={{ marginRight: '12px' }} />
+              {getDiasFuncionamento()[0]} à {getDiasFuncionamento()[getDiasFuncionamento().length - 1]}
+            </>
+          )}
+        </strong>
+        <strong className={styles.info}>
+          {schedules === undefined || schedules === null ? (
+            <>
+              <BsClock color="#FF9000" size={16} style={{ marginRight: '12px' }} />
+              Sem horário definido
+            </>
           ) : (
-            <img src={photo || props.barbeiro?.avatar_url || props.barbeiro?.picture} alt={props.barbeiro?.nome} />
+            <>
+              <BsClock color="#FF9000" size={16} style={{ marginRight: '12px' }} />
+              Hoje de {getHorarioAtual(diaAtual)}
+            </>
           )}
-        </div>
-        <div className={styles.containerInfo}>
-          <h2 className={styles.title}>{name || props.barbeiro?.nome}</h2>
-          <strong className={styles.info}>
-            <BsCalendar color="#FF9000" size={16} style={{ marginRight: '12px' }} />
-            Segunda à Domingo
-          </strong>
-          <strong className={styles.info}>
-            <BsClock color="#FF9000" size={16} style={{ marginRight: '12px' }} />
-            8h às 22h
-          </strong>
-        </div>
+        </strong>
       </div>
-    </>
+    </div>
   );
 }