优化 U2 页面,添加头像容器样式,更新问候语生成逻辑
This commit is contained in:
@@ -33,6 +33,12 @@
|
|||||||
padding: 40px 48px;
|
padding: 40px 48px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.u2-avatar-container {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
.u2-avatar {
|
.u2-avatar {
|
||||||
max-width: 290px;
|
max-width: 290px;
|
||||||
height: auto;
|
height: auto;
|
||||||
|
|||||||
@@ -17,7 +17,7 @@ const U2: React.FC = () => {
|
|||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
const idCardNo = localStorage.getItem("lastIdCardNo");
|
const idCardNo = localStorage.getItem("lastIdCardNo");
|
||||||
const [patientInfo, setPatientInfo] = useState<PatientInfo | null>(null);
|
const [patientInfo, setPatientInfo] = useState<PatientInfo | null>(null);
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState<boolean>(() => !!idCardNo);
|
||||||
const [isVip, setIsVip] = useState<number | null>(null);
|
const [isVip, setIsVip] = useState<number | null>(null);
|
||||||
const vipCalledRef = React.useRef(false);
|
const vipCalledRef = React.useRef(false);
|
||||||
|
|
||||||
@@ -84,8 +84,10 @@ const U2: React.FC = () => {
|
|||||||
getOptionalItemList(idCardNo)
|
getOptionalItemList(idCardNo)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
if (res.Status === 200) {
|
if (res.Status === 200) {
|
||||||
|
localStorage.setItem(
|
||||||
localStorage.setItem("selectedExamId", res.Data.packageInfo.physical_exam_id.toString() || "")
|
"selectedExamId",
|
||||||
|
res.Data.packageInfo.physical_exam_id.toString() || ""
|
||||||
|
);
|
||||||
|
|
||||||
const isPackageUndecided =
|
const isPackageUndecided =
|
||||||
res.Data?.packageInfo?.is_optional_package === 1 &&
|
res.Data?.packageInfo?.is_optional_package === 1 &&
|
||||||
@@ -115,12 +117,46 @@ const U2: React.FC = () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 根据性别和姓名生成问候称呼:取姓名第一个字 + (先生|女士|先生/女士)
|
||||||
|
const getGreeting = () => {
|
||||||
|
// 在加载中或没有姓名时不返回欢迎语,避免先渲染空的问候
|
||||||
|
if (loading || !patientInfo?.name) return "";
|
||||||
|
const name = patientInfo.name.trim();
|
||||||
|
const firstChar = name ? name.charAt(0) : "";
|
||||||
|
const genderName = (patientInfo?.gender_name || "").trim();
|
||||||
|
const sex = (patientInfo as any)?.sex;
|
||||||
|
let title = "";
|
||||||
|
if (genderName === "男" || sex === "1" || sex === 1) title = "先生";
|
||||||
|
else if (genderName === "女" || sex === "2" || sex === 2) title = "女士";
|
||||||
|
return `尊敬的${
|
||||||
|
firstChar ? `${firstChar} ${title}` : title
|
||||||
|
},欢迎您的到来:`;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 返回头像地址:优先使用读到的本地照片路径(file:///),否则使用默认 avatar
|
||||||
|
const getAvatarSrc = () => {
|
||||||
|
const photoPath = (patientInfo as any)?.photo_path || "";
|
||||||
|
if (!photoPath) return avatar;
|
||||||
|
// 如果已经是 file:// 协议,直接返回
|
||||||
|
if (photoPath.startsWith("file://")) return photoPath;
|
||||||
|
// 将 Windows 路径转换为 file:/// 格式(把反斜杠改为斜杠)
|
||||||
|
const normalized = photoPath.replace(/\\/g, "/").replace(/\\/g, "/");
|
||||||
|
return `file:///${normalized}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 在数据加载时显示占位,加载完成后再渲染完整内容
|
||||||
|
if (loading) {
|
||||||
|
return <></>;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="u2-root">
|
<div className="u2-root">
|
||||||
<span className="u2-title">尊敬的张先生/女士,欢迎您的到来:</span>
|
<span className="u2-title">{getGreeting()}</span>
|
||||||
<DecorLine />
|
<DecorLine />
|
||||||
<div className="u2-info-card">
|
<div className="u2-info-card">
|
||||||
<img className="u2-avatar" src={avatar} alt="avatar" />
|
<div className="u2-avatar-container">
|
||||||
|
<img className="u2-avatar" src={getAvatarSrc()} alt="avatar" />
|
||||||
|
</div>
|
||||||
<div className="u2-details-list">
|
<div className="u2-details-list">
|
||||||
<div className="u2-detail-row">
|
<div className="u2-detail-row">
|
||||||
<div className="u2-detail-bar" />
|
<div className="u2-detail-bar" />
|
||||||
|
|||||||
Reference in New Issue
Block a user