Files
tcc-vamos-frontend/src/components/UserSearchInfos/UserSearchInfos.tsx
Hugo Falcao e8209762c0 wip
2022-09-06 20:49:00 -03:00

60 lines
1.7 KiB
TypeScript

import {
IonBadge,
IonButton,
IonCardSubtitle,
IonCol,
IonIcon,
IonRow,
} from "@ionic/react";
import { call, callOutline, navigateOutline } from "ionicons/icons";
import "./UserSearchInfos.css";
export const UserSearchInfos = (record: any) => {
console.log(record.record);
return (
<div className="overlayContainer">
<IonCardSubtitle>{record.record.user.name}</IonCardSubtitle>
{/* <IonNote color="medium">{ record.record.addressFrom }</IonNote> */}
<IonBadge color="dark">
{record.record.user.star_rating
? `${record.record.user.star_rating} estrelas`
: "Sem avaliações"}
</IonBadge>
<p>
<IonIcon icon={navigateOutline} size="large" />
&nbsp;{record.record.address_to}
</p>
{record.record.user.phone_number && (
<p>
<IonIcon icon={call} />
&nbsp;{record.record.user.phone_number}
</p>
)}
<IonRow className="ion-no-padding ion-no-margin ion-margin-top">
<IonCol size="12" className="ion-no-padding ion-no-margin">
<IonButton
color="primary"
fill="solid"
size="small"
expand="block"
routerLink={`/perfil/${record.record.user.id_user}`}
>
Ver mais informações &rarr;
</IonButton>
</IonCol>
</IonRow>
<IonRow className="ion-no-padding ion-no-margin">
<IonCol size="12" className="ion-no-padding ion-no-margin">
<IonButton color="primary" fill="outline" size="small" expand="block">
<IonIcon icon={callOutline} />
</IonButton>
</IonCol>
</IonRow>
</div>
);
};