From e43e598f0d0d36855b7c5f2518f62d3d406a8aec Mon Sep 17 00:00:00 2001
From: zhangchen <1652267879@qq.com>
Date: 星期二, 09 九月 2025 16:47:12 +0800
Subject: [PATCH] Merge branch 'master' of http://dh.leon056.com:7499/r/data2/Single_application into ID1766-添加推送登录功能
---
src/store/type/bedsideAuxiliaryScreen.type.ts | 185 ++++++--
src/views/mobile/bedsideAuxiliaryScreen/pages/SignedIn.vue | 1155 +++++++++++++++++++++++++++++++++++++++----------
src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue | 17
3 files changed, 1,059 insertions(+), 298 deletions(-)
diff --git a/src/store/type/bedsideAuxiliaryScreen.type.ts b/src/store/type/bedsideAuxiliaryScreen.type.ts
index 000a25d..2415e3a 100644
--- a/src/store/type/bedsideAuxiliaryScreen.type.ts
+++ b/src/store/type/bedsideAuxiliaryScreen.type.ts
@@ -1,5 +1,6 @@
import { tryConvertToInt, deepClone } from "@/utils/utils";
import { Local } from "@/utils/storage";
+import dayjs from "dayjs";
export interface IotInfo {
属性历史列表: any[];
床号: string;
@@ -124,6 +125,37 @@
透析龄: number | null;
iot_血液流速: number | null;
透析液流量: number | null;
+ 血流量: string;
+ 处方钠: number | null;
+ 葡萄糖: string;
+ 钙: number | null;
+ 上次透析血压列表: any[];
+ 上次透析超滤总量: number | null;
+ 四点血压图数据: 四点血压图数据[] | null;
+ 患者出生日期: string;
+ 置换总量: number | null;
+}
+
+export interface 四点血压图数据 {
+ 干体重: number | null;
+ 透析日期周几: number | null;
+ 透前体重: number | null;
+ 置换总量: number | null;
+ 脱水百分比: number | null;
+ 血压2_前半程最低舒张压: number | null;
+ 血压4_透后舒张压: number | null;
+ 血压4_透后收缩压: number | null;
+ 超滤总量: number | null;
+ 透析时间: string | null; // 格式为 HH:mm
+ 血压1_透前收缩压: number | null;
+ 实际超滤量: number | null;
+ 血压3_后半程最低收缩压: number | null;
+ 透析日期: number | null; // 时间戳（毫秒）
+ 血压3_后半程最低舒张压: number | null;
+ 透后体重: number | null;
+ 血压2_前半程最低收缩压: number | null;
+ 透后体重减干体重的差值: number | null;
+ 血压1_透前舒张压: number | null;
患者出生日期: string;
}
@@ -311,36 +343,70 @@
};
export interface SignedIn {
- abnormalItems: AnomalyIndex[];
- dialysisPlan: string; // 透析方案
- prescriptionDehydrationVolume: number | null; // 透析处方脱水量
- dialyzer: string; // 透析器
- averageDehydrationRate: string; // 最近平均脱水量
- maximumDehydrationCapacity: string; // 最近最大脱水量
- maximumDehydrationCapacityDate: string; // 最近最大脱水量日期
- dryWeight: number | null; // 干体重
- preDialysisWeight: number | null; // 透前称重
- weightAfterLastDialysis: number | null; // 上次透后称重
- weightIncrease: number | null; // 体重增加
- weightIncreaseRate: number | null; // 体重增长率
- maximumDehydrationDuration: string;
+ 治疗模式: string;
+ 置换方式: string;
+ 处方脱水量: number | null;
+ 置换总量: number | null;
+ 透析器: string;
+ 抗凝剂: Anticoagulant[];
+ 最近平均脱水量: string;
+ 最近最大脱水量: string;
+ 最近最大脱水量透析时长: string;
+ 最近最大脱水量透析日期: string;
+ 处方备注: string;
+ 处方血流量: string;
+ 透析液流量: number | null;
+ 处方钠: number | null;
+ 葡萄糖: string;
+ 钙: number | null;
+ 干体重: number | null;
+ 脱水量: number | null;
+ 透前体重: number | null;
+ 上次透后体重: number | null;
+ 上次透析单所属日期: string;
+ 透析时长: string;
+ 透析时长2: string; // 透析时长2,
+ 上次透析血压列表: number[];
+ 上次透析超滤量: number | null;
+ 临时医嘱列表: any[];
+ 本次透析单所属日期: string; // 本次透析单所属日期
+ 体重增长_透前_上次透后: number | null; // 体重增长(透前-上次透后)
+ 体重增持_透前_干体重: number | null; // 体重增长(透前-干体重)
+ 四点血压图数据: 四点血压图数据[];
}
export const defaultSignedIn = (): SignedIn => {
return {
- abnormalItems: [], // 异常指标列表
- dialysisPlan: "", // 透析方案
- prescriptionDehydrationVolume: null, // 透析处方脱水量
- dialyzer: "", // 透析器
- averageDehydrationRate: "", // 最近平均脱水量
- maximumDehydrationCapacity: "", // 最近最大脱水量
- maximumDehydrationCapacityDate: "", // 最近最大脱水量日期
- dryWeight: null, // 干体重
- preDialysisWeight: null, // 透前称重
- weightAfterLastDialysis: null, // 上次透后称重
- weightIncrease: null, // 体重增加
- weightIncreaseRate: null, // 体重增长率
- maximumDehydrationDuration: '',
+ 治疗模式: '',
+ 置换方式: '',
+ 处方脱水量: null,
+ 置换总量: null,
+ 透析时长: '',
+ 透析时长2: '',
+ 透析器: '',
+ 抗凝剂: [],
+ 最近平均脱水量: '',
+ 最近最大脱水量: '',
+ 最近最大脱水量透析时长: '',
+ 最近最大脱水量透析日期: '',
+ 处方备注: '',
+ 处方血流量: '',
+ 透析液流量: null,
+ 处方钠: null,
+ 葡萄糖: '',
+ 钙: null,
+ 干体重: null,
+ 脱水量: null,
+ 透前体重: null,
+ 上次透后体重: null,
+ 上次透析单所属日期: '',
+ 上次透析血压列表: [],
+ 上次透析超滤量: null,
+ 临时医嘱列表: [],
+ 本次透析单所属日期: "",
+ 体重增长_透前_上次透后: null, // 体重增长(透前-上次透后)
+ 体重增持_透前_干体重: null, // 体重增长(透前-干体重)
+ 四点血压图数据: [],
};
};
@@ -436,6 +502,7 @@
age: "", // 年龄
gender: "", // 性别
patForm: EPatForm.OUTPATIENT_SERVICE, // 患者来源
+ 患者出生日期: "", // 患者出生日期
patFormNumber: "", // 住院门诊号
customConfiguration: defaultCustomconfiguration(), // 自定义配置项
// @ts-ignore
@@ -453,7 +520,7 @@
export const defaultCustomconfiguration = (): Customconfiguration => {
return {
患者信息是否加密显示: 0,
- 是否显示患者出生年月日: 0
+ 是否显示患者出生年月日: 0,
}
}
@@ -507,7 +574,7 @@
result.gender = seeMsg.透析状态?.性别 + "";
result.patForm = seeMsg.透析状态?.患者来源;
result.patFormNumber = seeMsg.透析状态?.患者门诊住院号;
- result.患者出生日期 = seeMsg.透析状态?.患者出生日期;
+ result.患者出生日期 = seeMsg.透析状态?.患者出生日期 || "";
// 未签到页面需要显示的
if (treatmentStatus === EMedStatus.NOT_CHECKED_IN) {
@@ -528,25 +595,45 @@
else if (treatmentStatus === EMedStatus.SIGNED_IN) {
result.pageType = EPageType.SIGNED_IN;
const signedIn = defaultSignedIn();
- signedIn.abnormalItems = seeMsg.透析状态?.异常检验指标 ?? [];
- signedIn.dialysisPlan = seeMsg.透析状态?.透析方案 ?? "";
- signedIn.prescriptionDehydrationVolume =
- seeMsg.透析状态?.处方脱水量 ?? null;
- signedIn.dialyzer = seeMsg.透析状态?.透析器 ?? "";
- signedIn.averageDehydrationRate = seeMsg.透析状态?.最近平均脱水量 ?? "";
- signedIn.maximumDehydrationCapacity =
- seeMsg.透析状态?.最近最大脱水量 ?? "";
- signedIn.maximumDehydrationCapacityDate =
- seeMsg.透析状态?.最近最大脱水量日期 ?? "";
- signedIn.dryWeight = seeMsg.透析状态?.干体重 ?? null;
- signedIn.preDialysisWeight = seeMsg.透析状态?.透前称重 ?? null;
- signedIn.weightAfterLastDialysis =
- seeMsg.透析状态?.上次透后称重 ?? null;
- signedIn.weightIncrease = seeMsg.透析状态?.体重增加 ?? null;
- signedIn.weightIncreaseRate = seeMsg.透析状态?.体重增长率 ?? null;
- signedIn.maximumDehydrationDuration =
- seeMsg.透析状态?.最近最大脱水量透析时长 ?? "";
+ signedIn.置换方式 = seeMsg.透析状态?.置换方式 ?? "";
+ signedIn.治疗模式 = seeMsg.透析状态?.透析方案 ?? "";
+ signedIn.处方脱水量 = seeMsg.透析状态?.处方脱水量 ?? null;
+ signedIn.置换总量 = seeMsg.透析状态?.置换总量 ?? null;
+ signedIn.透析器 = seeMsg.透析状态?.透析器 ?? "";
+ signedIn.抗凝剂 = seeMsg.透析状态?.抗凝剂列表 ?? [];
+ signedIn.最近平均脱水量 = seeMsg.透析状态?.最近平均脱水量 ?? "";
+ signedIn.最近最大脱水量 = seeMsg.透析状态?.最近最大脱水量 ?? "";
+ signedIn.最近最大脱水量透析时长 = seeMsg.透析状态?.最近最大脱水量透析时长 ?? "";
+ signedIn.最近最大脱水量透析日期 = seeMsg.透析状态?.最近最大脱水量日期 ?? "";
+ signedIn.处方备注 = seeMsg.透析状态?.透析处方备注 ?? "";
+ signedIn.处方血流量 = seeMsg.透析状态?.血流量 ?? "";
+ signedIn.透析液流量 = seeMsg.透析状态?.透析液流量 ?? null;
+ signedIn.处方钠 = seeMsg.透析状态?.处方钠 ?? null;
+ signedIn.葡萄糖 = seeMsg.透析状态?.葡萄糖 ?? "";
+ signedIn.钙 = seeMsg.透析状态?.钙 ?? null;
+ signedIn.干体重 = seeMsg.透析状态?.干体重 ?? null;
+ signedIn.脱水量 = seeMsg.透析状态?.处方脱水量 ?? null;
+ signedIn.透前体重 = seeMsg.透析状态?.透前称重 ?? null;
+ signedIn.上次透后体重 = seeMsg.透析状态?.上次透后称重 ?? null;
+ signedIn.上次透析单所属日期 = "";
+ signedIn.透析时长 = seeMsg.透析状态?.透析处方的时长_小时 + ':' + seeMsg.透析状态?.透析处方的时长_分钟;
+ signedIn.透析时长2 = seeMsg.透析状态?.透析处方的时长_小时 + ' h ';
+ if (seeMsg.透析状态?.透析处方的时长_分钟 && !['00', '0'].includes(seeMsg.透析状态?.透析处方的时长_分钟)) {
+ signedIn.透析时长2 += seeMsg.透析状态?.透析处方的时长_分钟 + ' min';
+ }
+ signedIn.上次透析血压列表 = seeMsg.透析状态?.上次透析血压列表 ?? [];
+ signedIn.上次透析超滤量 = seeMsg.透析状态?.上次透析超滤总量 ?? null;
+ signedIn.临时医嘱列表 = seeMsg.透析状态?.透析单医嘱列表 ?? [];
+ signedIn.本次透析单所属日期 = "";
+ signedIn.体重增长_透前_上次透后 = signedIn.透前体重 - signedIn.上次透后体重;
+ signedIn.体重增持_透前_干体重 = signedIn.透前体重 - signedIn.干体重;
+ signedIn.四点血压图数据 = seeMsg.透析状态?.四点血压图数据 ?? [];
+
+ if (signedIn.四点血压图数据 && signedIn.四点血压图数据.length > 0) {
+ signedIn.上次透析单所属日期 = dayjs(signedIn.四点血压图数据[0].透析日期).format("YYYY-MM-DD");
+ // signedIn.本次透析单所属日期 = dayjs(signedIn.四点血压图数据[0].透析日期).format("YYYY-MM-DD");
+ }
result.signedIn = signedIn;
}
// 剩下的全使用治疗中的页面
@@ -671,6 +758,12 @@
result = "前";
} else if (mode === "后置换") {
result = "后";
+ } else if (mode === "中置换") {
+ result = "中";
+ } else if (mode === "混合置换") {
+ result = "混合";
+ } else if (mode === "/") {
+ result = "";
}
return result;
};
diff --git a/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue b/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
index 6faafca..f7f3f13 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/components/Card.vue
@@ -8,6 +8,9 @@
<div class="card-header" :class="props.headerClassName">
<img :src="props.icon" class="card-icon" alt="" srcset="" />
<span class="card-title">{{ props.title }}</span>
+ <span class="card-right-text" v-if="$slots.right">
+ <slot name="right" />
+ </span>
</div>
<div class="card-main">
<slot />
@@ -42,6 +45,7 @@
height: 100%;
.card-header {
+ position: relative;
flex: 0 0 6px;
display: flex;
align-items: center;
@@ -65,6 +69,19 @@
overflow: hidden;
text-overflow: ellipsis;
}
+ .card-right-text {
+ position: absolute;
+ right: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 500;
+ font-size: 4px;
+ color: #333333;
+ line-height: 5px;
+ text-align: right;
+ font-style: normal;
+ }
}
.card-main {
diff --git a/src/views/mobile/bedsideAuxiliaryScreen/pages/SignedIn.vue b/src/views/mobile/bedsideAuxiliaryScreen/pages/SignedIn.vue
index 0483c5d..9e9d42f 100644
--- a/src/views/mobile/bedsideAuxiliaryScreen/pages/SignedIn.vue
+++ b/src/views/mobile/bedsideAuxiliaryScreen/pages/SignedIn.vue
@@ -1,7 +1,7 @@
<template>
<div class="signed-in-container" :style="{ '--height': height + 'px' }">
<div class="row1">
- <div class="row1-col1">
+ <div class="col row1-col1">
<el-image
:src="pageData.patientPhone"
style="width: 100%; height: 100%"
@@ -11,174 +11,280 @@
</template>
</el-image>
</div>
- <div class="row1-col2">
+ <div class="col row1-col2">
<Card
- title="异常指标"
- :icon="xinlvImg"
+ title="治疗模式"
+ :icon="tslImg"
background-color="#ffffff"
+ class="mini-card row1-col2-row1"
header-class-name="mihi-header"
>
- <div class="dialysis-mode-content">
- <span
- v-for="(item, index) in pageData.abnormalItems"
- :key="index"
- class="abnormal-indicator"
- :style="{ color: formatTestColr(item.结果标记) }"
- >
- {{ getItemName(item.项目名称) }}
- {{ formatTestFlag(item.结果标记) }}
- </span>
+ <div class="item-box dialysis-mode-content">
+ <span class="text-1">{{
+ formatSubstituteMode(pageData.置换方式)
+ }}</span>
+ <span class="text-2">{{ pageData.治疗模式 }}</span>
</div>
</Card>
- </div>
- <div class="row1-col3">
- <div class="row1-col3-row1">
- <Card
- title="治疗模式"
- :icon="zlmsImg"
- background-color="#ffffff"
- class="row1-col3-row1-item"
- header-class-name="mihi-header"
- >
- <div class="item-box dialysis-mode-content">
- {{ pageData.dialysisPlan }}
- </div>
- </Card>
- <Card
- title="治疗状态"
- :icon="zlztImg"
- background-color="#ffffff"
- class="row1-col3-row1-item"
- header-class-name="mihi-header"
- >
- <div class="item-box treatment-status">已签到</div>
- </Card>
- </div>
<Card
title="处方脱水量"
:icon="cljdImg"
background-color="#ffffff"
- class="row1-col3-row2"
+ class="mini-card row1-col2-row2"
header-class-name="mihi-header"
>
<div class="item-box prescription-ehydration-olume">
- {{ pageData.prescriptionDehydrationVolume }} L
+ <span
+ >{{ pageData.处方脱水量 }}
+ <template v-if="pageData.处方脱水量">L</template></span
+ >
</div>
</Card>
</div>
- <div class="row1-col4">
+ <div class="col row1-col3">
<Card
- title="透析器(显示规格)"
+ title="置换总量"
+ :icon="zlztImg"
+ background-color="#ffffff"
+ class="mini-card row1-col3-row1"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box total-amount-replacement">
+ <span>{{ pageData.置换总量 }}</span>
+ </div>
+ </Card>
+ <Card
+ title="透析时长"
+ :icon="cljdImg"
+ background-color="#ffffff"
+ class="mini-card row1-col3-row2"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box dialysis-duration">
+ <span>{{ pageData.透析时长2 }}</span>
+ </div>
+ </Card>
+ </div>
+ <div class="col row1-col4">
+ <Card
+ title="透析器"
:icon="txqImg"
background-color="#ffffff"
- class="row1-col4-row"
+ class="mini-card row1-col4-row1"
header-class-name="mihi-header"
>
<div class="item-box dialyzer">
- {{ pageData.dialyzer }}
+ <span>{{ pageData.透析器 }}</span>
</div>
</Card>
+ <Card
+ title="抗凝剂"
+ :icon="tslImg"
+ background-color="#ffffff"
+ class="mini-card row1-col4-row2"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box anticoagulant">
+ <div
+ v-for="(item, index) in pageData.抗凝剂"
+ :key="index"
+ class="list-item"
+ >
+ <div class="list-item-name">
+ {{ item.name }}
+ </div>
+ <div class="list-item-num">
+ <span>首剂：{{ item.首剂 }}{{ item.单位 }}</span>
+ <span
+ >追加/维持：{{
+ item.是否为追加 ? item.追加剂量 : item.维持剂量
+ }}{{ item.单位 }}</span
+ >
+ </div>
+ <div class="list-item-num">
+ <span>总量：{{ item.总量 }}{{ item.单位 }}</span>
+ </div>
+ </div>
+ </div>
+ </Card>
+ </div>
+ <div class="col row1-col5">
<Card
title="脱水量详情"
:icon="cljdImg"
background-color="#ffffff"
- class="row1-col4-row"
- header-class-name="mihi-header"
+ class="mini-card row1-col5-row1"
+ header-class-name="mini-header"
>
- <div class="dehydrated-level left-0">
+ <div class="dehydrated-level">
<div class="dehydrated-level-item">
<span class="item-left"
- >平均脱水量:{{ pageData.averageDehydrationRate }} L</span
+ >平均脱水量：{{ pageData.最近平均脱水量 }} L</span
>
<span class="item-right">(最近9次)</span>
</div>
<div class="dehydrated-level-item">
- <span class="item-left"
- ><span
- >最大脱水量:{{ pageData.maximumDehydrationCapacity }} L</span
- >
- <template v-if="pageData.maximumDehydrationDuration"
+ <div class="item-left">
+ <span>最大脱水量：{{ pageData.最近最大脱水量 }} L</span>
+ <template v-if="pageData.最近最大脱水量透析时长"
>/
<span class="level-dete">{{
- pageData.maximumDehydrationDuration
+ formatDuration(pageData.最近最大脱水量透析时长)
}}</span>
</template>
- </span>
-
+ </div>
<span class="item-right"
- >({{ pageData.maximumDehydrationCapacityDate }})</span
+ >({{ pageData.最近最大脱水量透析日期 }})</span
>
</div>
+ </div>
+ </Card>
+ <Card
+ title="处方备注"
+ :icon="maibo2Img"
+ background-color="#ffffff"
+ class="mini-card row1-col5-row2"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box prescription-remarks">
+ <span>{{ pageData.处方备注 }}</span>
</div>
</Card>
</div>
</div>
<div class="row2">
- <Card
- title="干体重"
- :icon="tizhongImg"
- background-color="#ffffff"
- class="row2-item"
- header-class-name="big-header"
- >
- <div class="weight-box">
- <span class="weight-text">{{ pageData.dryWeight }}</span>
- <span class="unit-text">kg</span>
- </div>
- </Card>
- <Card
- title="透前体重"
- :icon="tizhongImg"
- background-color="#ffffff"
- class="row2-item"
- header-class-name="big-header"
- >
- <div class="weight-box">
- <span class="weight-text">{{ pageData.preDialysisWeight }}</span>
- <span class="unit-text">kg</span>
- </div>
- </Card>
- <Card
- title="上次透后体重"
- :icon="tizhongImg"
- background-color="#ffffff"
- class="row2-item"
- header-class-name="big-header"
- >
- <div class="weight-box">
- <span class="weight-text">{{
- pageData.weightAfterLastDialysis
- }}</span>
- <span class="unit-text">kg</span>
- </div>
- </Card>
- <Card
- title="体重增长"
- :icon="tizhongImg"
- background-color="#ffffff"
- class="row2-item"
- header-class-name="big-header"
- >
- <div class="weight-box">
- <span v-if="pageData.weightIncreaseRate > 0" class="weight-text"
- >+</span
+ <div class="col row2-col1">
+ <div class="row2-col1-row1">
+ <Card
+ title="处方血流量"
+ :icon="cljdImg"
+ background-color="#ffffff"
+ class="mini-card row2-col1-row1-col1"
+ header-class-name="mihi-header"
>
- <span class="weight-text">{{ pageData.weightIncrease }}</span>
- <span class="unit-text">kg</span>
+ <div class="item-box blood-flow">
+ <span>{{ pageData.处方血流量 }}</span>
+ </div>
+ </Card>
+ <Card
+ title="处方钠"
+ :icon="cljdImg"
+ background-color="#ffffff"
+ class="mini-card row2-col1-row1-col2"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box prescription-sodium">
+ <span>{{ pageData.处方钠 }}</span>
+ </div>
+ </Card>
</div>
- </Card>
- <Card
- title="增长率"
- :icon="tizhongImg"
- background-color="#ffffff"
- class="row2-item"
- header-class-name="big-header"
- >
- <div class="weight-box">
- <span class="weight-text">{{ pageData.weightIncreaseRate }}</span>
- <span class="unit-text">%</span>
+ <div class="row2-col1-row2">
+ <Card
+ title="透析液流量"
+ :icon="cljdImg"
+ background-color="#ffffff"
+ class="mini-card row2-col1-row2-col1"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box dialysis-fluid-flow-rate">
+ <span>{{ pageData.透析液流量 }}</span>
+ </div>
+ </Card>
+ <Card
+ title="透析液种类"
+ :icon="cljdImg"
+ background-color="#ffffff"
+ class="mini-card row2-col1-row2-col2"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box types-dialysis-fluid">
+ <div>葡萄糖:{{ pageData.葡萄糖 }}</div>
+ <div>钙:{{ pageData.钙 }}</div>
+ </div>
+ </Card>
</div>
- </Card>
+ <Card
+ title="治疗状态"
+ :icon="zlztImg"
+ background-color="#ffffff"
+ class="mini-card row2-col1-row3"
+ header-class-name="mihi-header"
+ >
+ <div class="item-box treatment-status">
+ <span>已签到</span>
+ </div>
+ </Card>
+ </div>
+ <div class="col row2-col2">
+ <Card
+ title="参考指标"
+ :icon="tizhongImg"
+ background-color="#ffffff"
+ class="reference-indicators"
+ header-class-name="mihi-header"
+ >
+ <template #right>
+ {{ nowDateText }}
+ </template>
+ <table class="item-box reference-indicators-content">
+ <tbody>
+ <tr>
+ <td>血压<br />超滤量<br /></td>
+ <td
+ ref="bloodPressureRectangularChart"
+ style="overflow: hidden"
+ >
+ <canvas width="1px" height="1px" />
+ </td>
+ </tr>
+ <tr>
+ <td>干体重</td>
+ <td>{{ fourPointBloodPressureMap.干体重 }}kg</td>
+ </tr>
+ <tr>
+ <td>体重增长</td>
+ <td class="flex-td">
+ <span class="sub-text">(透前-上次透后)</span
+ ><span class="right-text">{{ weightGain1 }}kg</span>
+ </td>
+ </tr>
+ <tr>
+ <td>体重增长</td>
+ <td class="flex-td">
+ <span class="sub-text">(透前-干体重)</span><span class="text-right">{{ weightGain2 }}kg</span>
+ </td>
+ </tr>
+ <!-- <tr>
+ <td>脱水量</td>
+ <td>{{ pageData.脱水量 }}%</td>
+ </tr> -->
+ <tr>
+ <td>透前体重</td>
+ <td>{{ fourPointBloodPressureMap?.透前体重 }}kg</td>
+ </tr>
+ <tr>
+ <td>透后体重</td>
+ <td>{{ fourPointBloodPressureMap?.透后体重 }}kg</td>
+ </tr>
+ <tr>
+ <td>透析时间</td>
+ <td>{{ fourPointBloodPressureMap?.透析时间 }}</td>
+ </tr>
+ </tbody>
+ </table>
+ </Card>
+ </div>
+ <div class="col row2-col3">
+ <Card
+ title="临时医嘱"
+ :icon="yizhuImg"
+ background-color="#ffffff"
+ class="mini-card"
+ header-class-name="mini-header"
+ >
+ <DoctorAdvice :list="pageData.临时医嘱列表" />
+ </Card>
+ </div>
</div>
<div class="row3">
<BlockBotttom
@@ -203,13 +309,20 @@
class="btn"
/>
</div>
+ <!-- 定时任务 -->
+ <ScheduledTaskDialog ref="scheduledTaskDialogRef" />
</div>
</template>
<script lang="ts" setup name="SignedIn">
-import { computed } from "vue";
+import { computed, defineAsyncComponent, onMounted, ref, watch } from "vue";
+import dayjs from "dayjs";
+import "dayjs/locale/zh-cn";
+dayjs.locale("zh-cn");
// @ts-ignore
import Card from "../components/Card.vue";
+import DoctorAdvice from "../components/DoctorAdvice/index.vue";
import { useBedsideAuxiliaryScreenStore } from "@/store/bedsideAuxiliaryScreen";
+import type { 四点血压图数据 } from "@/store/type/bedsideAuxiliaryScreen.type";
import tslImg from "@/img/tsl.png";
import dingShiImg from "@/img/dingshi2.png";
import jiaoHaoImg from "@/img/jiaoHao.png";
@@ -220,15 +333,21 @@
import cljdImg from "@/img/cljd.png";
import txqImg from "@/img/txq.png";
import tizhongImg from "@/img/tizhong.png";
+import yizhuImg from "@/img/yizhu.png";
+import maibo2Img from "@/img/maibo2.png";
import {
getItemName,
formatTestColr,
formatTestFlag,
+ formatSubstituteMode,
} from "@/store/type/bedsideAuxiliaryScreen.type";
// @ts-ignore
import BlockBotttom from "../components/BlockBotttom.vue";
-import { ElMessage } from "element-plus/es";
+import { ElMessage } from "element-plus";
+const ScheduledTaskDialog = defineAsyncComponent(
+ () => import("../components/ScheduledTask.vue")
+);
interface Props {
height: number;
@@ -237,14 +356,82 @@
const bedsideAuxiliaryScreenStore = useBedsideAuxiliaryScreenStore();
+const bloodPressureRectangularChart = ref<HTMLElement | null>(null);
+const scheduledTaskDialogRef = ref<any>(null);
+
+
const pageData = computed(() => {
return Object.assign(bedsideAuxiliaryScreenStore.deviceData.signedIn, {
patientPhone: bedsideAuxiliaryScreenStore.deviceData.patientPhone,
});
});
+const fourPointBloodPressureMap = computed(() => {
+ let result = {};
+ if (
+ pageData.value.四点血压图数据 &&
+ pageData.value.四点血压图数据.length > 0
+ ) {
+ result = pageData.value.四点血压图数据[0];
+ }
+ return result;
+});
+
+const nowDateText = computed(() => {
+ if (fourPointBloodPressureMap.value?.透析日期) {
+ let result = dayjs(fourPointBloodPressureMap.value?.透析日期).format(
+ "YYYY-MM-DD"
+ );
+ result += `(${dayjs(fourPointBloodPressureMap.value?.透析日期).format(
+ "ddd"
+ )})`;
+ return result;
+ }
+ return "";
+});
+
+const weightGain1 = computed(() => {
+ if (
+ pageData.value.四点血压图数据 &&
+ pageData.value.四点血压图数据.length > 1
+ ) {
+ const value =
+ pageData.value.四点血压图数据[0].透前体重 -
+ pageData.value.四点血压图数据[1].透后体重;
+ const formattedValue = Number.isInteger(value)
+ ? value
+ : Number(value.toFixed(1));
+ return formattedValue;
+ }
+ return "";
+});
+
+const weightGain2 = computed(() => {
+ const value =
+ fourPointBloodPressureMap.value.透前体重 -
+ fourPointBloodPressureMap.value.干体重;
+ const formattedValue = Number.isInteger(value)
+ ? value
+ : Number(value.toFixed(1));
+ return formattedValue;
+});
+
+
+watch(
+ () => pageData.value.四点血压图数据,
+ (newVal) => {
+ genderBloodPressureRectangularChart(newVal);
+});
+
/** 点击定时任务 */
-const onScheduledTasksClick = () => {};
+const onScheduledTasksClick = () => {
+ if (
+ !bedsideAuxiliaryScreenStore.deviceCode ||
+ !bedsideAuxiliaryScreenStore.deviceData.deviceCode
+ )
+ return ElMessage.warning("未初始化或正在进行初始化操作中");
+ scheduledTaskDialogRef.value?.openDialog();
+};
const onCallBumberClick = () => {
ElMessage({
@@ -259,6 +446,254 @@
type: "warning",
});
};
+
+const genderBloodPressureRectangularChart = (datas: 四点血压图数据[] | null) => {
+ if (!bloodPressureRectangularChart.value) return;
+
+ const benchmarkData = { width: 386, height: 280 };
+
+ // 获取容器宽高（90% 缩放）
+ const containerWidth = bloodPressureRectangularChart.value.offsetWidth * 0.9;
+ const containerHeight = bloodPressureRectangularChart.value.offsetHeight * 0.9;
+
+ // 获取设备像素比
+ const dpr = window.devicePixelRatio || 1;
+
+ // 等比例缩放因子（保持比例）
+ const scale = Math.min(
+ containerWidth / benchmarkData.width,
+ containerHeight / benchmarkData.height
+ );
+
+ // 计算实际画布 CSS 尺寸
+ const cssWidth = benchmarkData.width * scale;
+ const cssHeight = benchmarkData.height * scale;
+
+ // 获取 canvas
+ let canvas = bloodPressureRectangularChart.value.querySelector("canvas");
+ if (!canvas) {
+ canvas = document.createElement("canvas");
+ bloodPressureRectangularChart.value.appendChild(canvas);
+ }
+
+ // 物理像素
+ canvas.width = cssWidth * dpr;
+ canvas.height = cssHeight * dpr;
+ canvas.style.width = `${cssWidth}px`;
+ canvas.style.height = `${cssHeight}px`;
+
+ const ctx = canvas.getContext("2d");
+ if (!ctx) return;
+
+ // 先清除画布（按物理像素）
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+ // 缩放到实际坐标系（dpr & scale）
+ ctx.save();
+ ctx.scale(dpr * scale, dpr * scale);
+
+ // 基准坐标系：benchmarkData.width × benchmarkData.height
+ const chartWidth = benchmarkData.width;
+ const chartHeight = benchmarkData.height;
+
+ // ========== 绘制基线 ==========
+ const upperLimitY = chartHeight * 0.5; // 200
+ ctx.beginPath();
+ ctx.moveTo(0, upperLimitY);
+ ctx.lineTo(chartWidth, upperLimitY);
+ ctx.strokeStyle = "red";
+ ctx.lineWidth = 1;
+ ctx.stroke();
+
+ const lowerLimitY = chartHeight * (1 - 0.2857); // 140
+ ctx.beginPath();
+ ctx.moveTo(0, lowerLimitY);
+ ctx.lineTo(chartWidth, lowerLimitY);
+ ctx.strokeStyle = "blue";
+ ctx.lineWidth = 1;
+ ctx.stroke();
+
+ // ========== 血压数据 ==========
+ const measurements = [
+ { systolic: datas?.[0]?.血压1_透前收缩压 ?? 0, diastolic: datas?.[0]?.血压1_透前舒张压 ?? 0 },
+ { systolic: datas?.[0]?.血压2_前半程最低收缩压 ?? 0, diastolic: datas?.[0]?.血压2_前半程最低舒张压 ?? 0 },
+ { systolic: datas?.[0]?.血压3_后半程最低收缩压 ?? 0, diastolic: datas?.[0]?.血压3_后半程最低舒张压 ?? 0 },
+ { systolic: datas?.[0]?.血压4_透后收缩压 ?? 0, diastolic: datas?.[0]?.血压4_透后舒张压 ?? 0 },
+ ];
+
+ const measurementWidth = chartWidth / (measurements.length + 1);
+
+ // 收缩压线
+ let systolicEnd = { x: 0, y: 0 };
+ ctx.beginPath();
+ ctx.moveTo(measurementWidth, chartHeight - measurements[0].systolic);
+ for (let i = 1; i < measurements.length; i++) {
+ const x = (i + 1) * measurementWidth;
+ ctx.lineTo(x, chartHeight - measurements[i].systolic);
+ if (i === measurements.length - 1) {
+ systolicEnd = { x, y: chartHeight - measurements[i].systolic };
+ }
+ }
+ ctx.strokeStyle = "black";
+ ctx.stroke();
+
+ // 舒张压线
+ let diastolicEnd = { x: 0, y: 0 };
+ ctx.beginPath();
+ ctx.moveTo(measurementWidth, chartHeight - measurements[0].diastolic);
+ for (let i = 1; i < measurements.length; i++) {
+ const x = (i + 1) * measurementWidth;
+ ctx.lineTo(x, chartHeight - measurements[i].diastolic);
+ if (i === measurements.length - 1) {
+ diastolicEnd = { x, y: chartHeight - measurements[i].diastolic };
+ }
+ }
+ ctx.strokeStyle = "black";
+ ctx.stroke();
+
+ // 连接起始 & 结束
+ ctx.beginPath();
+ ctx.moveTo(measurementWidth, chartHeight - measurements[0].systolic);
+ ctx.lineTo(measurementWidth, chartHeight - measurements[0].diastolic);
+ ctx.moveTo(systolicEnd.x, systolicEnd.y);
+ ctx.lineTo(diastolicEnd.x, diastolicEnd.y);
+ ctx.stroke();
+
+ // ========== 文本 ==========
+ const baseFontSize = 24;
+ ctx.font = `${baseFontSize}px Arial`;
+ ctx.textAlign = "center";
+ ctx.textBaseline = "middle";
+ ctx.fillStyle = "black";
+
+ measurements.forEach((m, i) => {
+ const x = (i + 1) * measurementWidth;
+ ctx.fillText(m.systolic.toString(), x, chartHeight - m.systolic - 5);
+ ctx.fillText(m.diastolic.toString(), x, chartHeight - m.diastolic + 10);
+ });
+
+ // ========== 圆柱体 ==========
+ const 计算脱水量刻度 = 100 / (datas?.[0]?.超滤总量 || 1);
+ const cylinderX = chartWidth * 0.9;
+ const cylinderY = chartHeight;
+ const cylinderRadius = 6;
+ const cylinderHeight = 计算脱水量刻度 * (datas?.[0]?.超滤总量 || 0);
+ const 体重增长_透前减干体重 = weightGain2.value;
+ const 透前减干体重减超滤总量差值 =
+ Math.round(
+ (体重增长_透前减干体重 - (datas?.[0]?.超滤总量 || 0)) * 10
+ ) / 10;
+
+
+ drawCylinder(
+ ctx,
+ chartHeight,
+ 1, // 因为已经 scale 过了
+ cylinderX,
+ cylinderY,
+ cylinderRadius,
+ cylinderHeight,
+ datas?.[0]?.超滤总量?.toString() ?? "0 L",
+ datas?.[0]?.脱水百分比 ?? 0,
+ datas?.[0]?.透后体重减干体重的差值 ?? 0,
+ 体重增长_透前减干体重,
+ 透前减干体重减超滤总量差值,
+ );
+
+ ctx.restore(); // 恢复
+};
+
+
+
+const drawCylinder = (
+ ctx: CanvasRenderingContext2D,
+ canvasHeight: number,
+ scale: number,
+ x: number,
+ y: number,
+ radius: number,
+ height: number,
+ 超滤总量: string, // 超滤总量
+ 脱水百分比: number, // 脱水百分比
+ 透后体重减干体重的差值: number, // 透后体重减干体重的差值
+ 体重增长_透前减干体重: number, // 体重增长_透前减干体重
+ 透前减干体重减超滤总量差值: number, // 透前减干体重减超滤总量差值
+) => {
+ ctx.beginPath();
+ ctx.arc(x, y + height, radius, 0, Math.PI * 2);
+ ctx.fillStyle = "#409EFF"; // 填充蓝色
+ ctx.strokeStyle = "#409EFF";
+ if (脱水百分比 > 3) {
+ ctx.fillStyle = "#E6A23C"; // 填充黄色
+ ctx.strokeStyle = "#E6A23C";
+ } else if (脱水百分比 > 5) {
+ ctx.fillStyle = "#F56C6C"; // 填充红色
+ ctx.strokeStyle = "#F56C6C";
+ }
+ ctx.fill();
+ ctx.stroke();
+
+ // 绘制侧面矩形
+ ctx.beginPath();
+ ctx.moveTo(x - radius, y - height);
+ ctx.lineTo(x - radius, y + height);
+ ctx.lineTo(x + radius, y + height);
+ ctx.lineTo(x + radius, y - height);
+ ctx.closePath();
+ ctx.fill();
+ ctx.stroke();
+
+ const cylinderWidth = radius;
+ const textX = x + cylinderWidth + 20; // 文本位置在圆柱体右侧
+
+ const baseFontSize = 16;
+
+ // 添加文本说明
+
+ // 如果超滤总量 与 体重增长_透前减干体重 相等，则显示 "/超滤总量"
+ if (Number(超滤总量) && 体重增长_透前减干体重 === Number(超滤总量)) {
+ ctx.font = `${baseFontSize * scale}px Arial`;
+ ctx.textAlign = "center";
+ ctx.fillStyle = "#07c160";
+ ctx.fillText('/' + 超滤总量, textX, canvasHeight - height + height * 0.3 + 10);
+ } else {
+ // 透析前-干体重
+ ctx.font = `${baseFontSize * scale}px Arial`;
+ ctx.textAlign = "center";
+ ctx.fillStyle = "#409EFF";
+ ctx.fillText(体重增长_透前减干体重 + '', textX, canvasHeight - height + 10);
+ // 超滤总量
+ ctx.font = `${baseFontSize * scale}px Arial`;
+ ctx.textAlign = "center";
+ ctx.fillStyle = "#07c160";
+ ctx.fillText(超滤总量, textX, canvasHeight - height + height * 0.3 + 10);
+ }
+
+
+
+ if (透前减干体重减超滤总量差值 > 0) {
+ ctx.font = `${baseFontSize * scale}px Arial`;
+ ctx.textAlign = "center";
+ ctx.fillStyle = "#000000";
+ ctx.fillText(透前减干体重减超滤总量差值 + "", textX, canvasHeight - 10); // 文本位于圆柱上方一点
+ }
+};
+
+function formatDuration(input: string): string {
+ const match = input.match(/(\d+)小时(\d+)分钟/);
+ if (!match) return input; // 如果不符合格式，直接返回原字符串
+
+ const hours = parseInt(match[1], 10);
+ const minutes = parseInt(match[2], 10);
+
+ if (minutes > 0) {
+ return `${hours}h${minutes}min`;
+ }
+ return `${hours}h`;
+}
+onMounted(() => {
+ genderBloodPressureRectangularChart(pageData.value.四点血压图数据);
+});
</script>
<style lang="less" scoped>
* {
@@ -269,176 +704,317 @@
height: var(--height);
overflow: hidden;
.row1 {
- height: 37.44%;
- margin-bottom: 4px;
+ height: 38.38%;
overflow: hidden;
+ margin-bottom: 1.07%;
display: flex;
align-items: center;
justify-content: space-between;
- .row1-col1 {
- flex: 0 0 14.86%;
+ .col {
height: 100%;
border-radius: 2px;
overflow: hidden;
- }
- .row1-col2 {
- flex: 0 0 32.86%;
- height: 100%;
- .dialysis-mode-content {
- height: 100%;
- .abnormal-indicator {
- display: inline-block;
- margin-right: 6px;
- margin-bottom: 4px;
- font-family: PingFangSC, PingFang SC;
- font-weight: 600;
- font-size: 5px;
- line-height: 6px;
- text-align: left;
- font-style: normal;
- }
+ &.row1-col1 {
+ flex: 0 0 14.86%;
}
- }
- .row1-col3 {
- flex: 0 0 23.71%;
- height: 100%;
- display: flex;
- flex-direction: column;
- gap: 4px;
- .row1-col3-row1 {
- flex: 1;
+ &.row1-col2 {
+ flex: 0 0 14.57%;
display: flex;
+ flex-direction: column;
gap: 4px;
- .row1-col3-row1-item {
- flex: 1;
- }
- }
- .row1-col3-row2 {
- flex: 1;
- }
- }
- .row1-col4 {
- flex: 0 0 25.14%;
- height: 100%;
- display: flex;
- flex-direction: column;
- gap: 4px;
- .row1-col4-row {
- flex: 1;
- .dehydrated-level {
- padding-left: 6px;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: space-between;
- &.left-0 {
- padding-left: 0;
- }
- .dehydrated-level-item {
- width: 100%;
+ .row1-col2-row1 {
+ flex: 0 0 40%;
+ .dialysis-mode-content {
display: flex;
align-items: center;
- .item-left {
- flex: 1;
+ justify-content: center;
+ .text-1 {
font-family: PingFangSC, PingFang SC;
font-weight: 600;
- font-size: 4px;
+ font-size: 6px;
+ color: #c9a589;
+ line-height: 8px;
+ text-align: center;
+ font-style: normal;
+ }
+ .text-2 {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #d58e56;
+ line-height: 12px;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ }
+ .row1-col2-row2 {
+ flex: 0 0 60%;
+ .prescription-ehydration-olume {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 11px;
+ color: #e87d00;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ }
+ &.row1-col3 {
+ flex: 0 0 14.57%;
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ .row1-col3-row1 {
+ flex: 0 0 40%;
+ .total-amount-replacement {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #d58e56;
+ line-height: 13px;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ .row1-col3-row2 {
+ flex: 0 0 60%;
+ .dialysis-duration {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 8px;
+ color: #333333;
+ line-height: 11px;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ }
+ &.row1-col4 {
+ flex: 0 0 25.71%;
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ .row1-col4-row1 {
+ flex: 0 0 40%;
+ .dialyzer {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #333333;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ .row1-col4-row2 {
+ flex: 0 0 60%;
+ .anticoagulant {
+ .list-item {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 4.5px;
color: #333333;
line-height: 6px;
+ text-align: left;
font-style: normal;
- .level-dete {
+ .list-item-name {
+ // margin-bottom: 2px;
+ }
+ }
+ }
+ }
+ }
+ &.row1-col5 {
+ flex: 0 0 25.71%;
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ .row1-col5-row1 {
+ flex: 0 0 40%;
+ .dehydrated-level {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: space-between;
+ .dehydrated-level-item {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ .item-left {
+ flex: 1;
font-family: PingFangSC, PingFang SC;
font-weight: 600;
font-size: 4px;
- color: #d58e56;
- text-align: left;
+ color: #333333;
+ line-height: 6px;
+ font-style: normal;
+ .level-dete {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 4px;
+ color: #d58e56;
+ text-align: left;
+ font-style: normal;
+ }
+ }
+ .item-right {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 4px;
+ color: #777777;
+ line-height: 6px;
font-style: normal;
}
}
- .item-right {
- font-family: PingFangSC, PingFang SC;
- font-weight: 600;
- font-size: 4px;
- color: #777777;
- line-height: 6px;
- font-style: normal;
- }
+ }
+ }
+ .row1-col5-row2 {
+ flex: 0 0 60%;
+ .prescription-remarks {
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 500;
+ font-size: 4px;
+ color: #9a1717;
+ line-height: 6px;
+ text-align: left;
+ font-style: normal;
}
}
}
}
}
.row2 {
- height: 21.72%;
+ height: 44.56%;
overflow: hidden;
+ margin-bottom: 1.07%;
display: flex;
- gap: 4px;
- .row2-item {
- flex: 1;
-
- .weight-box {
+ justify-content: space-between;
+ .col {
+ height: 100%;
+ border-radius: 2px;
+ overflow: hidden;
+ &.row2-col1 {
+ flex: 0 0 38%;
display: flex;
- align-items: flex-end;
- justify-content: center;
- gap: 2px;
- align-items: baseline;
- .weight-text {
- font-family: PingFangSC, PingFang SC;
- font-weight: 600;
- font-size: 11px;
- color: #333333;
- text-align: center;
- font-style: normal;
+ flex-direction: column;
+ justify-content: space-between;
+ .row2-col1-row1 {
+ height: 34%;
+ display: flex;
+ gap: 4px;
+ .row2-col1-row1-col1 {
+ flex: 1;
+ height: 100%;
+ .blood-flow {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #333333;
+ line-height: 12px;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ .row2-col1-row1-col2 {
+ flex: 1;
+ height: 100%;
+ .prescription-sodium {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #333333;
+ line-height: 12px;
+ text-align: center;
+ font-style: normal;
+ }
+ }
}
- .unit-text {
- font-family: PingFangSC, PingFang SC;
- font-weight: 600;
- font-size: 7px;
- color: #333333;
- text-align: center;
- font-style: normal;
+ .row2-col1-row2 {
+ height: 34%;
+ display: flex;
+ gap: 4px;
+ .row2-col1-row2-col1 {
+ flex: 1;
+ height: 100%;
+ .dialysis-fluid-flow-rate {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #333333;
+ line-height: 12px;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ .row2-col1-row2-col2 {
+ flex: 1;
+ height: 100%;
+ .types-dialysis-fluid {
+ display: flex;
+ flex-direction: column;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 4.2px;
+ color: #333333;
+ font-style: normal;
+ }
+ }
}
+ .row2-col1-row3 {
+ height: 22.3%;
+ flex-direction: row;
+ .treatment-status {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 600;
+ font-size: 9px;
+ color: #70a3dd;
+ text-align: center;
+ font-style: normal;
+ }
+ }
+ }
+ &.row2-col2 {
+ flex: 0 0 18.2%;
+ }
+ &.row2-col3 {
+ flex: 0 0 41.4%;
}
}
}
.row3 {
- position: absolute;
- width: 100%;
- bottom: 2px;
- height: 13.33%;
+ height: 11.92%;
+ overflow: hidden;
+ background: #fff;
display: flex;
align-items: center;
justify-content: flex-end;
padding-right: 13px;
- overflow: hidden;
- background: #ffffff;
border-radius: 2px;
.btn {
margin-left: 9px;
}
}
- .item-box {
- height: 100%;
- display: flex;
- align-items: center;
- justify-content: center;
- font-family: PingFangSC, PingFang SC;
- font-weight: 600;
- font-size: 8px;
- color: #70a3dd;
- text-align: center;
- font-style: normal;
- &.dialysis-mode-content {
- color: #d58e56;
- }
- &.treatment-status {
- color: #70a3dd;
- }
- &.prescription-ehydration-olume {
- color: #8079cb;
- }
- }
- // card header class
:deep(.mihi-header) {
flex: 0 0 4px;
.card-icon {
@@ -449,14 +1025,89 @@
font-size: 4px;
}
}
- :deep(.big-header) {
- flex: 0 0 9px;
- .card-icon {
- width: 9px;
- height: 9px;
+}
+.item-box {
+ height: 100%;
+ overflow-y: auto !important;
+}
+:deep(.mini-header) {
+ flex: 0 0 4px !important;
+ .card-icon {
+ width: 4px !important;
+ height: 4px !important;
+ }
+ .card-title {
+ font-size: 4px !important;
+ }
+}
+</style>
+// <style lang="less">
+// .reference-indicators {
+// padding: 0 !important;
+// .card-header {
+// padding: 3px 4px;
+// }
+// }
+//
+</style>
+<style lang="less">
+.reference-indicators {
+ padding: 0 !important;
+ .card-header {
+ padding: 3px 4px;
+ margin-bottom: 0 !important;
+ }
+ .reference-indicators-content {
+ width: 100%;
+ border-collapse: collapse;
+ td {
+ border: 1px solid #dfdfdf; /* 黑色边框 */
+ border-left: none;
+ text-align: center;
+ vertical-align: middle;
}
- .card-title {
- font-size: 5px;
+ & td:first-child {
+ width: 36%;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 400;
+ font-size: 3px;
+ color: #333333;
+ text-align: center;
+ font-style: normal;
+ }
+ & td:last-child {
+ position: relative;
+ width: 64%;
+ border-right: none;
+ font-family: PingFangSC, PingFang SC;
+ font-weight: 500;
+ font-size: 3.6px;
+ color: #333333;
+ text-align: center;
+ font-style: normal;
+ &.flex-td {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ width: 100%;
+ }
+ .sub-text {
+ font-size: 3px;
+ color: #666;
+ margin-right: 1.2px;
+ white-space: nowrap;
+ }
+ // .text-right {
+ // position: absolute;
+ // right: 0;
+ // top: 50%;
+ // transform: translateY(-50%);
+ // font-size: 3px;
+ // color: #666;
+ // }
+ }
+ & tr:not(:first-child) td {
+ height: 6px;
}
}
}
--
Gitblit v1.8.0