feat/update-code
This commit is contained in:
TuanVT
@@ -4,6 +4,18 @@ import React from "react";
|
||||
import { GridColumnProps } from "./interface";
|
||||
import clsx from "clsx";
|
||||
|
||||
// Mapping số cột mong muốn trên Desktop (lg/xl) thành class responsive đầy đủ
|
||||
const colResponsiveMap: Record<number, string> = {
|
||||
1: "grid-cols-1",
|
||||
2: "grid-cols-1 sm:grid-cols-2",
|
||||
3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
|
||||
4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4",
|
||||
5: "grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-5",
|
||||
6: "grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6",
|
||||
8: "grid-cols-2 sm:grid-cols-4 lg:grid-cols-8",
|
||||
12: "grid-cols-3 sm:grid-cols-6 lg:grid-cols-12",
|
||||
};
|
||||
|
||||
const GridColumn = ({
|
||||
children,
|
||||
col = 3,
|
||||
@@ -22,41 +34,19 @@ const GridColumn = ({
|
||||
/* ===== GAP ===== */
|
||||
sm ? "gap-2" : "gap-4",
|
||||
|
||||
/* ===== DEFAULT COL ===== */
|
||||
{
|
||||
"grid-cols-1": col === 1,
|
||||
"grid-cols-2": col === 2,
|
||||
"grid-cols-3": col === 3,
|
||||
"grid-cols-4": col === 4,
|
||||
"grid-cols-5": col === 5,
|
||||
"grid-cols-6": col === 6,
|
||||
"grid-cols-8": col === 8,
|
||||
"grid-cols-12": col === 12,
|
||||
},
|
||||
/* ===== RESPONSIVE GRID BY COL ===== */
|
||||
colResponsiveMap[col] || "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
|
||||
|
||||
/* ===== RESPONSIVE ===== */
|
||||
"xl:grid-cols-3", // giống default SCSS fallback
|
||||
"lg:grid-cols-2",
|
||||
"md:grid-cols-2",
|
||||
"sm:grid-cols-1",
|
||||
/* ===== CUSTOM OVERRIDES ===== */
|
||||
tabletCol3 && "md:grid-cols-3 lg:grid-cols-3",
|
||||
mobile2 && "grid-cols-2",
|
||||
|
||||
/* ===== CUSTOM RULES ===== */
|
||||
tabletCol3 && "lg:grid-cols-3",
|
||||
|
||||
mobile2 && "sm:grid-cols-2",
|
||||
|
||||
/* ===== COL 4 SPECIAL ===== */
|
||||
col === 4 && clsx("xl:grid-cols-3", "lg:grid-cols-2", "sm:grid-cols-1"),
|
||||
|
||||
/* ===== COL 5 ===== */
|
||||
col === 5 && clsx("xl:grid-cols-3", "lg:grid-cols-2", "sm:grid-cols-1"),
|
||||
|
||||
/* ===== SCROLL ===== */
|
||||
/* ===== SCROLL MODES ===== */
|
||||
scroll20 &&
|
||||
"grid-flow-col auto-cols-[20%] overflow-x-auto snap-x snap-mandatory gap-2",
|
||||
|
||||
scrollMobile85 &&
|
||||
"md:grid-cols-none md:grid-flow-col md:auto-cols-[85%] md:overflow-x-auto md:snap-x md:snap-mandatory",
|
||||
"max-md:grid-cols-none max-md:grid-flow-col max-md:auto-cols-[85%] max-md:overflow-x-auto max-md:snap-x max-md:snap-mandatory",
|
||||
|
||||
className,
|
||||
)}
|
||||
|
||||
@@ -86,14 +86,14 @@ export default function MainRegister() {
|
||||
label={
|
||||
<span>
|
||||
Họ và tên
|
||||
<span className="text-red-500"> *</span>
|
||||
{/* <span className="text-red-500"> *</span> */}
|
||||
</span>
|
||||
}
|
||||
placeholder="Nhập họ và tên"
|
||||
type="text"
|
||||
name="fullName"
|
||||
onClean
|
||||
isRequired
|
||||
// isRequired
|
||||
isBlur
|
||||
showDone
|
||||
icon={<BadgeInfo size={22} />}
|
||||
@@ -105,14 +105,14 @@ export default function MainRegister() {
|
||||
label={
|
||||
<span>
|
||||
Email
|
||||
<span className="text-red-500"> *</span>
|
||||
{/* <span className="text-red-500"> *</span> */}
|
||||
</span>
|
||||
}
|
||||
placeholder="Nhập email"
|
||||
type="email"
|
||||
name="email"
|
||||
onClean
|
||||
isRequired
|
||||
// isRequired
|
||||
isBlur
|
||||
showDone
|
||||
icon={<Mail size={22} />}
|
||||
|
||||
@@ -319,7 +319,8 @@ const UpdateConsultation = () => {
|
||||
setForm((prev) => ({ ...prev, vitalSigns: String(v) }))
|
||||
}
|
||||
/>
|
||||
|
||||
</GridColumn>
|
||||
<GridColumn col={2}>
|
||||
<InputForm
|
||||
type="text"
|
||||
label={
|
||||
@@ -338,37 +339,36 @@ const UpdateConsultation = () => {
|
||||
|
||||
<InputForm
|
||||
type="text"
|
||||
label={
|
||||
<span>
|
||||
Kế hoạch điều trị <span className="text-red-500">*</span>
|
||||
</span>
|
||||
}
|
||||
name="treatmentPlan"
|
||||
placeholder="Nhập kế hoạch điều trị"
|
||||
value={form.treatmentPlan}
|
||||
isRequired
|
||||
onChangeValue={(v) =>
|
||||
setForm((prev) => ({ ...prev, treatmentPlan: String(v) }))
|
||||
}
|
||||
/>
|
||||
|
||||
<InputForm
|
||||
type="text"
|
||||
label={
|
||||
<span>
|
||||
Ghi chú bác sĩ <span className="text-red-500">*</span>
|
||||
</span>
|
||||
}
|
||||
label={<span>Ghi chú bác sĩ</span>}
|
||||
name="doctorNotes"
|
||||
placeholder="Nhập ghi chú"
|
||||
value={form.doctorNotes}
|
||||
isRequired
|
||||
onChangeValue={(v) =>
|
||||
setForm((prev) => ({ ...prev, doctorNotes: String(v) }))
|
||||
}
|
||||
/>
|
||||
</GridColumn>
|
||||
|
||||
<TextArea
|
||||
name="treatmentPlan"
|
||||
placeholder="Nhập thông số chi tiết loại kính được chỉ định"
|
||||
label={
|
||||
<span>
|
||||
Kế hoạch điều trị
|
||||
<span className="text-red-500">*</span>
|
||||
</span>
|
||||
}
|
||||
value={form.treatmentPlan}
|
||||
isRequired
|
||||
// readOnly
|
||||
isBlur
|
||||
max={5000}
|
||||
onChangeValue={(v) =>
|
||||
setForm((prev) => ({
|
||||
...prev,
|
||||
treatmentPlan: String(v),
|
||||
}))
|
||||
}
|
||||
/>
|
||||
{eyeClinic && (
|
||||
<div className="mt-2 rounded-xl border border-blue-100 bg-[#f8fafc] p-5 transition-all">
|
||||
<h3 className="mb-4 text-sm font-bold uppercase tracking-wider text-blue-600">
|
||||
@@ -452,7 +452,6 @@ const UpdateConsultation = () => {
|
||||
!form.vitalSigns ||
|
||||
!form.diagnosis ||
|
||||
!form.treatmentPlan ||
|
||||
!form.doctorNotes ||
|
||||
updateConsultationMutation.isPending
|
||||
}
|
||||
className="min-w-[140px]"
|
||||
|
||||
@@ -255,16 +255,6 @@ const MainPagePatient = () => {
|
||||
>
|
||||
{item.fullName}
|
||||
</Link>
|
||||
{/* <Link
|
||||
href={`/patient/${item.id}`}
|
||||
className={
|
||||
isReturnWithin14Days(item.lastVisitDate)
|
||||
? "text-red-500 font-semibold hover:underline"
|
||||
: "text-blue-500 hover:underline"
|
||||
}
|
||||
>
|
||||
{item.fullName}
|
||||
</Link> */}
|
||||
</TooltipTrigger>
|
||||
|
||||
<TooltipContent>
|
||||
|
||||
Reference in New Issue
Block a user