添加患者信息有效性检查,优化界面布局和错误提示

This commit is contained in:
yuchenglong
2025-11-28 11:39:07 +08:00
parent 87b3f8e539
commit f4cff05c1f
3 changed files with 79 additions and 36 deletions

View File

@@ -28,6 +28,7 @@ export interface PatientInfo {
phone: string;
marital: number;
marital_name: string;
is_valid_exam: number;
}
// VIP认证结果

View File

@@ -27,10 +27,26 @@
background: url(../../assets/u2-card.png) 100% no-repeat;
background-size: 100% 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
padding: 40px 48px;
}
.u2-info-top {
display: flex;
flex-direction: row;
align-items: center;
padding: 40px 48px;
width: 100%;
flex: 1;
}
.u2-error-msg {
width: 100%;
text-align: center;
color: red;
font-size: 28px;
font-weight: bold;
margin-top: 10px;
}
.u2-avatar-container {

View File

@@ -70,6 +70,11 @@ const U2: React.FC = () => {
};
const handleConfirm = () => {
// 判断是否为有效签到
if (!patientInfo?.is_valid_exam || patientInfo.is_valid_exam !== 1) {
// alert("当前签到无效,请联系前台工作人员处理");
return;
}
if (!idCardNo) {
alert("未获取到身份证号,请重新刷卡");
navigate("/");
@@ -130,7 +135,7 @@ const U2: React.FC = () => {
else if (genderName === "女") title = "女士";
return `尊敬的${
firstChar ? `${firstChar}${title}` : title
}欢迎您的到来`;
}请确认您的个人信息`;
};
// 返回头像地址:使用 gender_name 字段("女" 显示女性头像),忽略 photo_path
@@ -147,6 +152,17 @@ const U2: React.FC = () => {
return genderName;
};
// 脱敏证件号保留前6后4其余替换为*
const maskIdCard = (id?: string | null) => {
if (!id) return "---";
const s = String(id).trim();
if (s.length <= 10) return s.replace(/.(?!.{4})/g, "*");
const head = s.slice(0, 6);
const tail = s.slice(-4);
const middleLen = s.length - 10;
return head + "*".repeat(middleLen) + tail;
};
// 在数据加载时显示占位,加载完成后再渲染完整内容
if (loading) {
return <></>;
@@ -157,52 +173,62 @@ const U2: React.FC = () => {
<span className="u2-title">{getGreeting()}</span>
<DecorLine />
<div className="u2-info-card">
<div className="u2-avatar-container">
<img className="u2-avatar" src={getAvatarSrc()} alt="avatar" />
</div>
<div className="u2-details-list">
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.name || "---"}
</div>
<div className="u2-info-top">
<div className="u2-avatar-container">
<img className="u2-avatar" src={getAvatarSrc()} alt="avatar" />
</div>
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : getGenderLabel()}
<div className="u2-details-list">
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.name || "---"}
</div>
</div>
</div>
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.age || "---"}
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : getGenderLabel()}
</div>
</div>
</div>
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{idCardNo || patientInfo?.IdCard || "---"}
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.age || "---"}
</div>
</div>
</div>
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.phone || "---"}
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : maskIdCard(idCardNo || patientInfo?.IdCard)}
</div>
</div>
</div>
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.marital_name || "---"}
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.phone || "---"}
</div>
</div>
<div className="u2-detail-row">
<div className="u2-detail-bar" />
<div className="u2-detail-text">
{loading ? "" : patientInfo?.marital_name || "---"}
</div>
</div>
</div>
</div>
{!patientInfo?.is_valid_exam || patientInfo.is_valid_exam !== 1 ? (
<div className="u2-error-msg">
!
</div>
) : (
""
)}
</div>
<span className="u2-instruction">
<span className="u2-asterisk">*</span>