horacio/turnosxpress
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: implement rating summary service methods and integrate rating display components into the organization header and pending ratings page

Browse Source
This commit is contained in:
Horacio Daniel Ros
2026-07-22 12:13:50 -03:00
parent 383a5bc6b4
commit da3c3abb52
27 changed files with 1334 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files
txclient/src/app/landing/org/[oid]/page.tsx
+80 -67
View File
@@ -58,6 +58,8 @@ import turnosXpressTheme from "@core/app/theme/turnosXpress";
import { useParams } from "next/navigation";
import dayjs from "dayjs";
import { useConfirmStore } from "@core/Store/Confirm.Store";
import ReviewsCarousel from "@core/app/components/ReviewsCarousel/ReviewsCarousel";
import { RatingTargetType } from "@core/Models/Ratings.model";
enum VIEW {
POSTS = "posts",
@@ -592,92 +594,94 @@ export default function OrganizationPublicProfile() {
</div>
</div>
)}
<div className={style.organizationMap}>{LocationInfo(orgData)}</div>
<div
ref={refDivContent}
style={{
border: "1px solid var(--gray-light)",
borderRadius: "10px",
marginTop: "30px",
width: "100%",
marginBottom: "30px",
backgroundColor: "var(--white)",
}}
>
<div className={style.organizationProfileColumns}>
<div className={style.organizationMap}>{LocationInfo(orgData)}</div>
<div className={style.organizationMainColumn}>
<div
ref={refDivContent}
style={{
display: "flex",
flexDirection: "row",
justifyContent: "space-between",
borderBottom: "1px solid var(--gray-light)",
border: "1px solid var(--gray-light)",
borderRadius: "10px",
marginTop: "30px",
width: "100%",
marginBottom: "30px",
backgroundColor: "var(--white)",
}}
>
<div
style={{
height: "50px",
display: "flex",
alignItems: "center",
gap: "20px",
flexDirection: "row",
justifyContent: "space-between",
borderBottom: "1px solid var(--gray-light)",
}}
>
<div
style={getHeaderItemStyle(VIEW.POSTS)}
onClick={() => {
setView(VIEW.POSTS);
processAddButton(VIEW.POSTS);
style={{
height: "50px",
display: "flex",
alignItems: "center",
gap: "20px",
}}
>
Posts
</div>
<div
style={getHeaderItemStyle(VIEW.SERVICES)}
onClick={() => {
setView(VIEW.SERVICES);
processAddButton(VIEW.SERVICES);
}}
>
Servicios
</div>
{checkShowInfo() && (
<div
style={getHeaderItemStyle(VIEW.INFO)}
style={getHeaderItemStyle(VIEW.POSTS)}
onClick={() => {
setView(VIEW.INFO);
processAddButton(VIEW.INFO);
setView(VIEW.POSTS);
processAddButton(VIEW.POSTS);
}}
>
Contacto
Posts
</div>
<div
style={getHeaderItemStyle(VIEW.SERVICES)}
onClick={() => {
setView(VIEW.SERVICES);
processAddButton(VIEW.SERVICES);
}}
>
Servicios
</div>
{checkShowInfo() && (
<div
style={getHeaderItemStyle(VIEW.INFO)}
onClick={() => {
setView(VIEW.INFO);
processAddButton(VIEW.INFO);
}}
>
Contacto
</div>
)}
</div>
{view === VIEW.SERVICES && (
<div style={{ display: "flex", justifyContent: "flex-end" }}>
<ButtonGroup
variant="outlined"
aria-label="Basic button group"
sx={{ marginTop: "10px", marginRight: "30px" }}
>
<IconButton onClick={() => setViewMode("card")}>
<GridViewOutlinedIcon
sx={{
color:
viewMode === "card" ? "var(--wine-red)" : "ineherit",
}}
/>
</IconButton>
<IconButton onClick={() => setViewMode("grid")}>
<SplitscreenOutlinedIcon
sx={{
color:
viewMode === "grid" ? "var(--wine-red)" : "ineherit",
}}
/>
</IconButton>
</ButtonGroup>
</div>
)}
</div>
{view === VIEW.SERVICES && (
<div style={{ display: "flex", justifyContent: "flex-end" }}>
<ButtonGroup
variant="outlined"
aria-label="Basic button group"
sx={{ marginTop: "10px", marginRight: "30px" }}
>
<IconButton onClick={() => setViewMode("card")}>
<GridViewOutlinedIcon
sx={{
color:
viewMode === "card" ? "var(--wine-red)" : "ineherit",
}}
/>
</IconButton>
<IconButton onClick={() => setViewMode("grid")}>
<SplitscreenOutlinedIcon
sx={{
color:
viewMode === "grid" ? "var(--wine-red)" : "ineherit",
}}
/>
</IconButton>
</ButtonGroup>
</div>
)}
</div>
<div>
<div>
{view === VIEW.POSTS && (
<div
ref={refPostsContainer}
@@ -867,7 +871,16 @@ export default function OrganizationPublicProfile() {
</div>
)}
</div>
</div>
</div>
</div>
<ReviewsCarousel
targetType={RatingTargetType.COMPANY}
targetId={orgData.id}
title="Lo que dicen quienes ya visitaron esta organización"
subtitle="Opiniones reales de personas que reservaron turnos acá."
className={style.organizationReviews}
/>
</div>
)}
</>
txclient/src/app/landing/org/[oid]/profile.module.css
+38 -3
View File
@@ -1,5 +1,6 @@
@media (max-width: 800px) {
.organizationContent {
position: relative;
display: flex;
flex-direction: column;
align-items: flex-start;
@@ -7,7 +8,14 @@
margin-left: 30px;
margin-right: 30px;
gap: 20px;
overflow: hidden;
overflow: visible;
}
.organizationProfileColumns {
display: flex;
flex-direction: column;
gap: 20px;
width: 100%;
}
.organizationMap {
@@ -80,6 +88,14 @@
margin-bottom: 10px;
}
.organizationMainColumn {
width: 100%;
}
.organizationReviews {
margin-bottom: 30px;
}
.organizationServices {
margin-bottom: 30px;
}
@@ -87,15 +103,29 @@
@media (min-width: 801px) {
.organizationContent {
position: relative;
display: flex;
flex-direction: row;
align-items: flex-start;
flex-direction: column;
align-items: stretch;
/*margin-top: 30px;*/
margin-left: 30px;
margin-right: 30px;
gap: 20px;
}
.organizationProfileColumns {
display: flex;
flex-direction: row;
align-items: flex-start;
gap: 20px;
width: 100%;
}
.organizationMainColumn {
width: 100%;
min-width: 0;
}
.organizationMap {
border: solid 1px var(--gray-light);
border-radius: 10px;
@@ -136,4 +166,9 @@
width: 100%;
overflow: hidden;
}
.organizationReviews {
margin-bottom: 30px;
width: 100%;
}
}