feat(caveman): add new caveman communication mode with intensity levels

This commit is contained in:
hamed
2026-06-23 19:10:00 +03:30
parent 2b00443af7
commit 3c867d1e09
7 changed files with 201 additions and 408 deletions
+64 -104
View File
@@ -1313,6 +1313,25 @@ function MyPatientsPageInner() {
);
}
function patientAvatar(name: string, size = 28) {
return (
<div
style={{
width: size, height: size, borderRadius: "50%", flexShrink: 0,
background: "linear-gradient(145deg, #f8945a, #f0682a)",
color: "#fff", display: "flex", alignItems: "center",
justifyContent: "center", fontWeight: 700, fontSize: size * 0.42,
}}
>
{(name === "—" ? "؟" : name).charAt(0)}
</div>
);
}
function fileNumber(record: PatientRecord): string {
return `P-${record.uuid.slice(0, 8).toUpperCase()}`;
}
function PatientCard({
record,
onOpen,
@@ -1322,122 +1341,63 @@ function PatientCard({
}) {
const name = getPatientName(record);
const phone = getPatientPhone(record);
const nationalCode = getPatientNationalCode(record);
const infoRow = (label: string, value: React.ReactNode) => (
<div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: 13 }}>
<span style={{ color: "var(--text-3)" }}>{label}:</span>
<span dir="ltr" style={{ color: "var(--text-2)" }}>{value}</span>
</div>
);
return (
<div
className="card"
style={{ padding: 16, display: "flex", flexDirection: "column", gap: 12, cursor: "pointer" }}
onClick={onOpen}
>
<div style={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
<span className="mini-btn" style={{ pointerEvents: "none" }}>···</span>
<div style={{ display: "flex", alignItems: "center", gap: 8 }}>
<b style={{ fontSize: 14 }}>{name}</b>
{patientAvatar(name)}
</div>
</div>
{infoRow("شماره پرونده", fileNumber(record))}
{infoRow("موبایل", phone)}
<div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: 13 }}>
<span style={{ color: "var(--text-3)" }}>برچسبها:</span>
<span style={{ color: "var(--text-3)" }}></span>
</div>
</div>
);
}
function PatientRow({
record,
onOpen,
}: {
record: PatientRecord;
onOpen: () => void;
}) {
const name = getPatientName(record);
return (
<div
className="card"
style={{
padding: 16,
display: "flex",
flexDirection: "column",
gap: 14,
padding: "12px 16px", display: "flex", alignItems: "center", gap: 14,
cursor: "pointer",
transition: "border-color .15s, box-shadow .15s",
}}
onClick={onOpen}
>
<div style={{ display: "flex", alignItems: "center", gap: 12 }}>
<div
className="avatar"
style={{
width: 44,
height: 44,
borderRadius: "50%",
background:
"linear-gradient(145deg, #f8945a, #f0682a)",
color: "#fff",
display: "flex",
alignItems: "center",
justifyContent: "center",
fontWeight: 700,
fontSize: 17,
flexShrink: 0,
}}
>
{(name === "—" ? "؟" : name).charAt(0)}
</div>
<div style={{ minWidth: 0, flex: 1 }}>
<div
style={{
fontWeight: 600,
fontSize: 15,
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
}}
>
{name}
</div>
<div
style={{
fontSize: 12,
color: "var(--text-3)",
marginTop: 2,
}}
>
{formatDate(record.created_at)}
</div>
</div>
</div>
<div
style={{
display: "flex",
flexDirection: "column",
gap: 7,
fontSize: 13,
color: "var(--text-2)",
}}
>
<div
style={{ display: "flex", alignItems: "center", gap: 7 }}
>
<PhoneIcon
style={{
width: 14,
color: "var(--text-3)",
flexShrink: 0,
}}
/>
<span dir="ltr">{phone}</span>
</div>
<div
style={{ display: "flex", alignItems: "center", gap: 7 }}
>
<IdentificationIcon
style={{
width: 14,
color: "var(--text-3)",
flexShrink: 0,
}}
/>
<span dir="ltr">
{nationalCode ?? (
<span style={{ color: "var(--text-3)" }}>
کد ملی ثبت نشده
</span>
)}
</span>
</div>
</div>
{patientAvatar(name, 38)}
<b style={{ fontSize: 14, minWidth: 140 }}>{name}</b>
<span style={{ fontSize: 13, color: "var(--text-3)" }} dir="ltr">{fileNumber(record)}</span>
<span style={{ fontSize: 13, color: "var(--text-2)", flex: 1 }} dir="ltr">{getPatientPhone(record)}</span>
<button
className="btn primary sm"
style={{
width: "100%",
justifyContent: "center",
display: "flex",
alignItems: "center",
gap: 5,
}}
onClick={(e) => {
e.stopPropagation();
onOpen();
}}
onClick={(e) => { e.stopPropagation(); onOpen(); }}
>
<FolderOpenIcon style={{ width: 14 }} />
مشاهده پرونده
<FolderOpenIcon style={{ width: 14 }} /> مشاهده
</button>
</div>
);