添加温馨提示页面

src/App.tsx

@@ -12,6 +12,7 @@ import UI6 from "./pages/UI6/UI6";
 import UI7 from "./pages/UI7/UI7";
 import UI8 from "./pages/UI8/UI8";
 import UI9 from "./pages/UI9/UI9";
+import UI81 from "./pages/UI81/UI81";
 
 function App() {
   const [time, setTime] = useState<string>(() => formatDate(new Date()));
@@ -57,6 +58,7 @@ function App() {
           <Route path="/UI6" element={<UI6 />} />
           <Route path="/UI7" element={<UI7 />} />
           <Route path="/UI8" element={<UI8 />} />
+          <Route path="/UI81" element={<UI81 />} />
           <Route path="/UI9" element={<UI9 />} />
         </Routes>
       </div>

src/components/ConfirmButton.css

@@ -2,8 +2,7 @@
   position: relative;
   width: 395px;
   height: 112px;
-  background: url("../assets/buttons/confirm-button.png") center center
-    no-repeat;
+  background: url("../assets/buttons/confirm-button.png") center center no-repeat;
   background-size: 100% 100%;
   border: none;
   cursor: pointer;
@@ -24,7 +23,6 @@
 }
 
 .confirm-button-text {
-  width: 151px;
   height: 49px;
   overflow-wrap: break-word;
   color: rgba(255, 255, 255, 1);
@@ -34,4 +32,4 @@
   text-align: center;
   white-space: nowrap;
   line-height: 51px;
-}
+}

src/pages/UI8/UI8.tsx

@@ -317,7 +317,7 @@ const UI8: React.FC = () => {
       alert("打印失败，请重试");
     } finally {
       setIsPrinting(false);
-      navigate("/UI9");
+      navigate("/UI81");
     }
   }, [originPdfUrls, pdfFiles, printers.length, selectedPrinter]);
 

src/pages/UI81/UI81.css

@@ -0,0 +1,138 @@
+.ui81-table-container {
+  width: 754px;
+  max-height: 881px;
+  overflow-y: auto;
+  overflow-x: hidden;
+  /* 隐藏滚动条但保持滚动功能 */
+  scrollbar-width: none;
+  /* Firefox */
+  -ms-overflow-style: none;
+  /* IE 和 Edge */
+}
+
+.ui81-table-container::-webkit-scrollbar {
+  display: none;
+  /* Chrome, Safari, Opera */
+}
+
+.ui81-table {
+  width: 754px;
+  border-collapse: collapse;
+  background-color: #ffffff;
+}
+
+.ui81-table-header {
+  color: rgba(0, 45, 93, 1);
+  font-size: 32px;
+  font-family: NotoSansCJKsc-Bold;
+  font-weight: 700;
+  text-align: center;
+  padding: 10px;
+  border: 1px solid rgba(0, 45, 93, 0.2);
+  background-color: rgba(233, 242, 245, 1);
+  position: sticky;
+  top: 0;
+  z-index: 10;
+}
+
+.ui81-table-dept {
+  width: 200px;
+  background-color: #b12651;
+  color: white;
+}
+
+.ui81-table-project {
+  width: 554px;
+  background-color: #053875;
+  color: white;
+}
+
+.ui81-table-row {
+  border-bottom: 2px solid #d3d3d3;
+  border-right: 2px solid #d3d3d3;
+}
+
+.ui81-table-dept-cell {
+  color: black;
+  background-color: #daeef2;
+  font-size: 24px;
+  font-family: NotoSansCJKsc-Medium;
+  font-weight: 500;
+  padding-left: 20px;
+  border-right: 2px solid #d3d3d3;
+  border-left: 2px solid #d3d3d3;
+}
+
+.ui81-table-project-cell {
+  color: black;
+  font-size: 24px;
+  padding: 0;
+  font-family: NotoSansCJKsc-Regular;
+  text-align: left;
+}
+
+.ui81-project-item {
+  border-bottom: 2px solid #d3d3d3;
+  line-height: 1.5;
+}
+
+.ui81-project-item:last-child {
+  border-bottom: none;
+}
+
+.ui81-error-container {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  gap: 20px;
+}
+
+.ui81-error-container img {
+  position: relative;
+  top: 4px;
+}
+
+.ui81-confirm-section {
+  width: 896px;
+  position: fixed;
+  bottom: 300px;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+}
+
+.ui81-paragraph {
+  width: 800px;
+  height: auto;
+  overflow-wrap: break-word;
+  color: rgba(0, 45, 93, 1);
+  font-size: 28px;
+  font-family: NotoSansCJKsc-Medium;
+  font-weight: 500;
+  text-align: center;
+  line-height: 26px;
+  margin: 0 0 53px 0;
+  text-align: left;
+
+
+}
+
+.ui81-paragraph h4 {
+  font-size: 32px;
+  font-family: NotoSansCJKsc-Bold;
+  font-weight: 700;
+  text-align: left;
+  line-height: 40px;
+  margin-bottom: 60px;
+}
+
+.ui81-paragraph p {
+  font-size: 32px;
+  font-family: NotoSansCJKsc-Medium;
+  font-weight: 500;
+  text-align: left;
+  line-height: 60px;
+  margin-bottom: 20px;
+}

src/pages/UI81/UI81.tsx

@@ -0,0 +1,90 @@
+import React, { useEffect, useState } from "react";
+import "./UI81.css";
+import "../../assets/css/basic.css";
+import { useNavigate } from "react-router-dom";
+import ConfirmButton from "../../components/ConfirmButton";
+import DecorLine from "../../components/DecorLine";
+import { getPackagItemDetail } from "../../api/hisApi";
+import errorIcon from "../../assets/error.png";
+
+const UI81: React.FC = () => {
+  const navigate = useNavigate();
+
+  const handleBack = () => {
+    navigate(-1);
+  };
+
+  const handleConfirm = () => {
+    navigate("/UI9");
+  };
+
+  const [ListData, setListData] = useState<any[]>([]);
+  const [PackageInfo, setPackageInfo] = useState<any>({});
+  useEffect(() => {
+    getListData();
+  }, []);
+
+
+  const getListData = async () => {
+    const id_no = localStorage.getItem("lastIdCardNo");
+    if (!id_no) {
+      alert("请先输入身份证号");
+      return;
+    }
+    const res = await getPackagItemDetail(id_no as string);
+    if (res.Status === 200) {
+      // 处理数据：将 project_id 和 project_name 字符串分离为数组
+      const processedData = res.Data.listPackDetail.map((item: any) => {
+        // 将 project_id 字符串按中文顿号分割为数组
+        const project_ids = item.project_id
+          ? item.project_id.split("、").map((id: string) => id.trim()).filter((id: string) => id)
+          : [];
+
+        // 将 project_name 字符串按中文顿号分割为数组
+        const project_names = item.project_name
+          ? item.project_name.split("、").map((name: string) => name.trim()).filter((name: string) => name)
+          : [];
+
+        return {
+          ...item,
+          project_ids,
+          project_names,
+        };
+      });
+
+      setListData(processedData);
+      setPackageInfo(res.Data.packagItemInfo);
+    } else {
+      alert(`获取列表数据失败: ${res.Message}`);
+    }
+  };
+
+
+  return (
+    <div className="basic-root">
+      <div className="basic-white-block">
+        <div className="basic-content">
+          <div className="ui81-error-container">
+            <img src={errorIcon} alt="error" />
+            <span className="basic-title">温馨提示</span>
+          </div>
+          <DecorLine />
+
+          <span className="ui81-paragraph">
+            <h4>尊敬的 {localStorage.getItem("name")} 先生/女士，体检过程中请您特别留意：</h4>
+            <p>1、若您已怀孕或正在备孕，请务必提前告知工作人员，我们将为您避免放射类检查。</p>
+            <p>2、若您有糖尿病史或易发低血糖，请提前告知工作人员，我们将在完成空腹项目后优先安排用餐。</p>
+            <p>3、若您有长期服用任何药物、或体检过程中感到头晕、心慌等不适，请随时告知工作人员。</p>
+          </span>
+
+
+          <div className="ui81-confirm-section">
+            <ConfirmButton text="我知道了" onClick={handleConfirm} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default UI81;