2020-11-25床头卡共用类逻辑（私用）
2020-11-25 10:28
床头卡不会自己显示，由安卓调用一个新的webview，加载显示页面，调用前端方法getData，传递响应参数，查询显示数据。
主要功能点：
- 1、暴露 getData 方法供安卓调用(在各自页面暴露，并且初始化回调方法)
- 2、优先处理床位号（在各自页面处理）
- 3、从安卓端获取病人信息（主要使用病人id）
- 如果有病人id，根据病人id查询病人数据
- 如果没有，使用床位+护理单元查询病人数据
- 查出数据后保存给安卓
- 4、获取系统配置信息（用户患者姓名保护、二维码显示等）
- 5、查询护理标签、患者标签并处理显示，当前患者标签主要是调整过敏、饮食的字体颜色和背景色
- 6、清空数据
使用关键代码：
1、引入：
<script src="bedSideCardAssets/lib/jquery-3.3.1.min.js"></script> <script src="bedSideCardAssets/js/DealCard.js"></script>
2、初始化实例（在各自页面写）：
// 初始化床头卡处理实例 var cardDealFun = new DealCard() cardDealFun.dealInfoDataCallback = (data)=>renderData(data) // 初始化页面显示回调函数 cardDealFun.showLabelCallback = ()=>renderLabel() // 护理标签显示回调函数 cardDealFun.clearPageCallback = ()=>clearInfo() // 清除页面显示回调函数 cardDealFun.renderQrCodeCallback = (text)=>renderQrCode(text) // 初始化二维码 cardDealFun.GuoandYinshiCallback = (data)=>GuoandYinshi(data) // 病患标签(过敏、饮食)处理回调函数
3、暴露getData方法
//暴漏给安卓调用 window.getData = function (bedno, ucode, etnType, optype, jsonData) { // 处理床位号的方法 renderBedName(bedno) cardDealFun.init(bedno, ucode, etnType, optype, jsonData) }
4、处理类完整代码：
/** *床头卡请求数据、处理数据统一类： * 请求病人信息、处理病人信息、请求标签、处理标签的方法统一 * 再有床头卡，直接引入使用 * * 床头卡处理逻辑： * 1、暴露 getData 方法供安卓调用(在各自页面暴露，并且初始化回调方法) * 2、优先处理床位号（在各自页面处理） * 3、从安卓端获取病人信息（主要使用病人id） * 如果有病人id，根据病人id查询病人数据 * 如果没有，使用床位+护理单元查询病人数据 * 查出数据后保存给安卓 * 4、获取系统配置信息（用户患者姓名保护、二维码显示等） * 5、清空数据 * * * 使用方式（在各自页面书写）： * // 初始化床头卡处理实例 var cardDealFun = new DealCard() cardDealFun.dealInfoDataCallback = (data)=>renderData(data) // 初始化页面显示回调函数（renderData是自己页面定义的初始化页面的方法） cardDealFun.showLabelCallback = ()=>renderLabel() // 护理标签显示回调函数（renderLabel是自己页面定义的显示标签的方法） cardDealFun.clearPageCallback = ()=>clearInfo() // 清除页面显示回调函数（clearInfo是自己页面定义的清除页面显示内容的方法） cardDealFun.showRoomInfoCallback = (data)=>showRoomInfo(data) // 处理显示科主任、护士长、护理组长、医疗组长回调函数（showRoomInfo是各自页面定义的显示“科主任、护士长、护理组长、医疗组长”的方法） //暴漏给安卓调用 window.getData = function (bedno, ucode, etnType, optype, jsonData) { // 处理床位号的回调方法 renderBedName(bedno) cardDealFun.init(bedno, ucode, etnType, optype, jsonData) } * */ class DealCard { public patientId:string = ''; //病人id public bedname:string = ''; //床位名 public deptId:string = ''; //科室id public orgId:string = ''; //orgId public patientInfo:any = { patientIn: {}, nurseLevelConfig: {} } // 病人信息 public isFilterName:boolean = false; //是否床头卡患者姓名保护 public labelInfo:any = []; //所有标签数据 public cardPatientlabel:any = []; //患者标签接口查出来的数据 public patientLabel:any = []; //该病人的标签 public API_patidntid:string = '/bnms/app-bn/patient-in-list/by-patient-in-and-info'; //根据病患id查询的接口 public API_deptbedname:string = '/bnms/app-bn/patient-in-list/by-dept-id-bed-name-one-new'; //根据床位号和护理单元查询的接口 public API_NursingLabelInfo:string = '/bnms/app-bn/patient-in-view-list/card-nursing-label'; // 获取护理标签数据 public API_CardPatientLabelInfo:string = '/bnms/app-bn/patient-in-view-list/card-patient-label'; // 获取患者标签数据 public API_roomInfo:string = '/hsms/app-hs/nursing-group/roomInfo'; // 获取房间科主任、护士长、护理组长、医疗组长数据 public dealInfoDataCallback:any = null; // 处理显示页面数据回调函数 public showLabelCallback:any = null; // 处理显示标签回调函数 public showRoomInfoCallback:any = null; // 处理显示科主任、护士长、护理组长、医疗组长回调函数 public clearPageCallback:any = null; // 清除页面显示回调函数 public renderQrCodeCallback:any = null; // 初始化二维码回调函数 public showPatLabelCallback:any = null; // 病患标签处理回调函数 public GuoandYinshiCallback:any = null; // 病患标签(过敏、饮食)处理回调函数 public init(bedno:string, ucode:string, etnType:string, optype:string, jsonData:any){ console.log(bedno, ucode, etnType, optype, jsonData) const _this:any = this this.bedname = bedno this.patientId = '' if (ucode)this.deptId = ucode let patientInfo:any = null try { //从安卓获取用户信息 // @ts-ignore if (window.android && window.android.getPatientInfo) patientInfo = window.android.getPatientInfo() //只是判断是否有用户信息 if (patientInfo !== null && patientInfo !== '') patientInfo = JSON.parse(patientInfo) // 获取系统配置 let Sys = "" // @ts-ignore if (window.android && window.android.getSystemConfig) Sys = window.android.getSystemConfig() //系统配置仅为了获取是否姓名脱敏 // 中心医院定制需要显示二维码 if (Sys !== '' && Sys !== null) { var J = JSON.parse(Sys); console.log('床头卡sys', J); this.isFilterName = J.isFilterNameBedHead // 是否初始化二维码 if (J.QRCodeBedSide && J.QRCodeBedSide.state && J.QRCodeBedSide.text !== '' && J.QRCodeBedSide.text !== null && _this.renderQrCodeCallback && _this.renderQrCodeCallback!=='' && _this.renderQrCodeCallback !== null ) _this.renderQrCodeCallback(J.QRCodeBedHead.text) } } catch (e) { console.log("调用安卓方法，获取病患信息并解析。解析系统配置数据。有错误日志！！！！！！"); } //记录病人id if (patientInfo && patientInfo !== null) this.patientId = patientInfo.patientId //数据拉取 if (Number(optype) === 1) { // 页面重载：根据病人id(登陆了) 或者 护理单元+床位名(没登录) 查询 this.getpatientInfoAPI() } else if (Number(optype) === 2) { //处理缓存数据 console.log('渲染：缓存数据'); this.dealInfoData(JSON.parse(jsonData)) } } // 查询接口 private getpatientInfoAPI(){ const _this:any = this if (_this.patientId && _this.patientId !== null && _this.patientId !== '') { // 如果有病患信息，根据病患id查 // @ts-ignore $.ajax({ type: "GET", url: _this.API_patidntid, //MngUser/GetCardInfo data: { patientId: _this.patientId }, async: false, success: function (data:any) { _this.dealInfoData(data) }, error: function () { } }) } else { // 如果没有病患id，根据 护理单元+床位名 查 // @ts-ignore $.ajax({ type: "GET", url: _this.API_deptbedname, //MngUser/GetCardInfo data: { deptId: _this.deptId, bedName: _this.bedname }, async: false, success: function (data:any) { _this.dealInfoData(data) }, error: function () { } }) } } /** * 处理数据显示在页面上，处理方法在各自页面定义 * @param data */ private dealInfoData(data:any) { const _this:any = this if(data.data === null){ _this.clearPageCallback() return } //回写给安卓数据,需要JSON字符串形式 // @ts-ignore if (window.android && window.android.getAndroidData) { if (data.data && data.data !== null) data.data.databy = 'patientId'; // @ts-ignore window.android.getAndroidData(JSON.stringify(data)); } if (data.data) { _this.orgId = data.data.patientSelectDtos[0].patientIn.orgId _this.patientInfo = data.data.patientSelectDtos[0] } // 回调显示页面 if (_this.dealInfoDataCallback !== null && _this.dealInfoDataCallback)_this.dealInfoDataCallback(data) } // 获取护理标签数据 public getBedCardLabel() { const _this:any = this // @ts-ignore $.ajax({ type: "GET", url: _this.API_NursingLabelInfo, //MngUser/GetCardInfo data: { deptId: _this.deptId, orgId: _this.orgId }, async: false, success: function (data:any) { _this.labelInfo = data.data; _this.dealLabelNurs() }, error: function () { } }) } /** * 获取患者标签 */ public getCartPatientLabel(){ const _this:any = this // @ts-ignore $.ajax({ type: "GET", url: _this.API_CardPatientLabelInfo, data: { deptId: _this.deptId }, async: false, success: function (data:any) { _this.cardPatientlabel = data.data; if(_this.showPatLabelCallback && _this.showPatLabelCallback !==null)_this.showPatLabelCallback() // 处理过敏和饮食的字体颜色和背景色 if(_this.GuoandYinshiCallback && _this.GuoandYinshiCallback !==null){ let config:any = { allergy:null, // 过敏 diet:null, // 饮食 } for(let i = 0 ; i < _this.cardPatientlabel.length ; i++){ let v = _this.cardPatientlabel[i] if(!v || v.labelShowInfo === '' || v.labelShowInfo === null)continue if(v.labelSql === 'diet' || v.labelSql === 'allergy'){ let labelShowInfo = JSON.parse(v.labelShowInfo) if(labelShowInfo.item.length > 0 && labelShowInfo.item[0] && labelShowInfo.item[0]['config']) config[v.labelSql] = labelShowInfo.item[0]['config'] } } _this.GuoandYinshiCallback(config) } }, error: function () { } }) } /** * 获取房间科主任、护士长、护理组长、医疗组长数据 */ public getRoomInfo(){ const _this:any = this try{ // @ts-ignore let roomId:string|null = JSON.parse(localStorage.getItem("deviceInfo")).ROOM_ID // @ts-ignore $.ajax({ type: "GET", url: _this.API_roomInfo, data: { deptId: _this.deptId, roomId: roomId }, async: false, success: function (data:any) { if(_this.showRoomInfoCallback && _this.showRoomInfoCallback!==null)_this.showRoomInfoCallback(data) }, error: function () { } }) }catch (e) { console.log('获取房间科主任、护士长、护理组长、医疗组长数据中报错了', e) } } /** * 处理护理标签数据 * 根据患者信息返回的患者标签数据 (patientInfo.patientInfoDtos = patientInListData) 和 查询的护理标签数据（labelInfo）进行匹配病患标签 * 匹配规则： * 1、labelInfo[i]['labelShowInfo'] !==null ,非空 * 2、labelInfo[i]['dataSources'] === 3 需要用labelInfo[i]['labelSql']去比对患者基本信息接口中的 patientInListData[i]['labelSql'] 数据,匹配到之后， 再匹配patientInListData[i]['infoValue']不为空 AND patientInListData[i]['labelType'] === 201 * 3、labelInfo[i]['dataSources'] === 1 || labelInfo[i]['dataSources'] === 2 || labelInfo[i]['dataSources'] === 4 需要匹配 labelInfo[i]['labelValue'] 是否包含这个病患的床位（bedName） * * */ private dealLabelNurs() { const _this:any = this _this.patientLabel = [] for(let i = 0 ; i < _this.labelInfo.length ;i++){ const v = _this.labelInfo[i] if (v.labelShowInfo !== null && v.labelShowInfo !== "") { if (Number(v.dataSources) === 3) { for(let ii = 0 ; ii < _this.patientInfo.patientInfoDtos.length ; ii++){ let v2 = _this.patientInfo.patientInfoDtos[ii] if (v2.labelSql === v.labelSql && v2.infoValue !== '' && v2.labelType === "201") { // 过滤掉可能重复的数据 const j = { labelId: v.labelId, labelName: v.labelName, type: v.labelShowType, img: (!v.labelShowInfo || v.labelShowInfo === '' || v.labelShowInfo === null || v.labelShowInfo.indexOf('|') > -1) ? './bedSideCardAssets/car2.png' : v.labelShowInfo, labelShowInfo: v.labelShowInfo }; _this.patientLabel.push(j); } } } else if ( Number(v.dataSources) === 1 || Number(v.dataSources) === 2 || Number(v.dataSources) === 4 ) { if (v.labelValue.indexOf(_this.bedName) > -1) { const j = { labelId: v.labelId, labelName: v.labelName, type: v.labelShowType, img: (!v.labelShowInfo || v.labelShowInfo === '' || v.labelShowInfo === null || v.labelShowInfo.indexOf('|') > -1) ? './bedSideCardAssets/car2.png' : v.labelShowInfo, labelShowInfo: v.labelShowInfo }; _this.patientLabel.push(j); } } } } if (_this.showLabelCallback && _this.showLabelCallback !== null)_this.showLabelCallback() } }
5、一个床头卡页面的完整实例代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>床头卡</title>
<script src="bedSideCardAssets/lib/jquery-3.3.1.min.js"></script>
<script src="bedSideCardAssets/js/DealCard.js"></script>
<script>
(function () {
var styleN = document.createElement("style");
var width = document.documentElement.clientWidth / 1024;
styleN.innerHTML = 'html{font-size:' + width + 'px!important}';
document.head.appendChild(styleN);
})();
</script>
<style>
body {
background-image: linear-gradient(to right, #B6D6FE, #556EEC);
}
* {
font-family: '黑体';
}
.main-view {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.top-view {
height: 275rem;
width: 100%;
box-sizing: border-box;
padding: 15rem 25rem 0 25rem;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
.top {
position: relative;
width: 100%;
height: 100%;
background-image: linear-gradient(to right, #fff, #E6F1FF);
border-radius: 25rem;
border-bottom-left-radius: 75rem;
box-shadow: 0 0 7rem 5rem rgba(99, 99, 99, 0.2);
display: flex;
}
.top-left {
width: 260rem;
height: 260rem;
background-image: linear-gradient(to right top, #536CEC, #54A3FC);
border-top-right-radius: 75rem;
border-bottom-left-radius: 75rem;
display: flex;
justify-content: center;
align-items: center;
font-size: 230rem;
color: #fff;
font-weight: bold;
font-family: "黑体";
}
.top-right {
flex: 1;
display: flex;
flex-direction: column;
padding: 5rem 0;
box-sizing: border-box;
}
.top-right-view,
.top-right-view2,
.top-right-view3 {
width: 100%;
flex: 1;
display: flex;
box-sizing: border-box;
align-items: center;
}
.top-right-view {
padding: 40rem 0 0 25rem;
}
.top-right-view2 {
flex: 0.8 !important;
padding: 0 15rem;
box-sizing: border-box;
align-items: flex-end;
}
.top-right-name {
font-size: 100rem;
font-weight: bold;
color: #536bec;
max-width: 430rem;
padding-top: 2rem;
}
.top-right-info-view {
padding-left: 10rem;
padding-top: 0rem;
display: flex;
flex-direction: column;
}
.top-right-level {
color: #fff;
background-color: #ccc;
font-size: 30rem;
border-top-left-radius: 50rem;
border-top-right-radius: 50rem;
border-bottom-right-radius: 50rem;
display: flex;
justify-content: center;
align-items: center;
padding: 2rem 15rem;
margin-bottom: 10rem;
margin-right: auto;
visibility: hidden;
}
.top-right-other {
display: flex;
align-items: center;
}
.top-right-sex {
font-size: 30rem;
}
.top-right-time {
font-size: 30rem;
margin-left: 10rem;
}
.top-right-text {
font-size: 30rem;
}
.top-right-text2 {
font-size: 30rem;
margin-left: 40rem;
}
.top-right-view3-card {
background-color: #D7E0F2;
min-width: 465rem;
height: 50rem;
border-top-right-radius: 50rem;
border-bottom-right-radius: 50rem;
display: flex;
align-items: center;
padding: 0 30rem 0 15rem;
}
.top-right-view3-card-text {
display: flex;
align-items: flex-end;
}
.top-right-view3-card-text-key {
font-size: 25rem;
color: #666;
margin-bottom: 2rem;
}
.top-right-view3-card-text-value {
font-size: 30rem;
margin-left: 10rem;
}
.top-right-doct {
margin-right: 25rem;
}
.left-auto {
margin-left: auto;
}
.bottom-view {
position: absolute;
top: 90rem;
left: 15rem;
bottom: 16rem;
right: 15rem;
box-sizing: border-box;
padding: 190rem 0 0 0;
z-index: 5;
background-color: #fff;
border-radius: 25rem;
box-shadow: 0 0 7rem 5rem rgba(99, 99, 99, 0.2);
overflow: hidden;
}
.bottom {
height: 100%;
display: flex;
flex-direction: column;
position: relative;
}
.bottom-background {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.bottom-view1 {
flex: 1;
overflow: hidden;
display: flex;
}
.bottom-view1 marquee {
height: 100%;
}
.bottom-view1-icon-view {
width: 65rem;
display: flex;
align-items: center;
}
.bottom-view1-icon-left {
width: 100%;
height: 60rem;
background-image: linear-gradient(to top, #CDE2FF, #fff);
display: flex;
justify-content: center;
align-items: center;
font-size: 35rem;
color: #526BEA;
border-top-right-radius: 15rem;
border-bottom-right-radius: 15rem;
}
.bottom-view1-icon-right {
width: 100%;
height: 60rem;
background-image: linear-gradient(to top, #CDE2FF, #fff);
display: flex;
justify-content: center;
align-items: center;
font-size: 35rem;
color: #526BEA;
border-top-left-radius: 15rem;
border-bottom-left-radius: 15rem;
}
.bottom-view1-text-view {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
font-size: 35rem;
padding: 10rem 20rem;
box-sizing: border-box;
}
.bottom-view1-line-view {
width: 1rem;
display: flex;
align-items: center;
}
.bottom-view1-line-view div {
height: 50rem;
width: 100%;
background-color: #4FA7BF;
}
.bottom-view2 {
flex: 1;
display: flex;
align-items: center;
padding: 0 5rem;
box-sizing: border-box;
}
.bottom-list-view {
display: flex;
align-items: center;
}
.bottom-scroll-view {
position: relative;
left: 0;
width: auto;
min-width: 0;
flex-shrink: 0;
display: flex;
}
.bottom-line {
height: 1rem;
}
.bottom-item {
width: 180rem;
position: relative;
margin: 0 8rem;
}
.bottom-item img {
width: 100%;
}
.bottom-item div {
position: absolute;
width: 100%;
bottom: 20rem;
left: 0;
text-align: center;
font-size: 25rem;
}
#inTime {
font-size: 30rem;
margin-right: 10rem;
}
#patientAge,
#inpNo,
#doctorName,
#nurseName {
font-size: 30rem;
}
#bottom-scroll-view-marquee {
display: none;
}
</style>
</head>
<body>
<div class="main-view">
<div class="top-view">
<div class="top">
<div class="top-left" id="bedName">..</div>
<div class="top-right">
<div class="top-right-view">
<div class="top-right-name" id="patientName">..</div>
<div class="top-right-info-view">
<div class="top-right-level" id="nurseLevel">..</div>
<div class="top-right-other">
<div class="top-right-sex" id="sex">..</div>
<div class="top-right-time" id="patientAge">..</div>
</div>
</div>
</div>
<div class="top-right-view2">
<div class="top-right-text">住院号：<span id="inpNo">..</span></div>
<div class="top-right-text2"><span id="inTime">..</span>入院</div>
</div>
<div class="top-right-view3">
<div class="top-right-view3-card">
<div class="top-right-view3-card-text top-right-doct">
<div class="top-right-view3-card-text-key">主管医生</div>
<div class="top-right-view3-card-text-value" id="doctorName">..</div>
</div>
<div class="top-right-view3-card-text left-auto">
<div class="top-right-view3-card-text-key">责任护士</div>
<div class="top-right-view3-card-text-value" id="nurseName">..</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bottom-view">
<div class="bottom">
<img class="bottom-background" src="./bedSideCardAssets/bottomBack.jpg" alt="">
<div class="bottom-view1">
<div class="bottom-view1-icon-view">
<div class="bottom-view1-icon-left">敏</div>
</div>
<div class="bottom-view1-text-view" id="allergy">..</div>
<div class="bottom-view1-line-view">
<div></div>
</div>
<div class="bottom-view1-text-view" id="diet">..</div>
<div class="bottom-view1-icon-view">
<div class="bottom-view1-icon-right">食</div>
</div>
</div>
<img class="bottom-line" src="./bedSideCardAssets/line.png" alt="">
<div class="bottom-view2">
<marquee behavior="scroll" direction="left" scrollamount="6" scrolldelay="60"
id="bottom-scroll-view-marquee">
<div class="bottom-list-view">
<div class="bottom-scroll-view">
<!-- <div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div> -->
</div>
</div>
</marquee>
<div class="bottom-scroll-view" id="bottom-scroll-view">
<!-- <div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div>
<div class="bottom-item"><img src="./bedSideCardAssets/car2.png" alt="">
<div>防跌倒</div>
</div> -->
</div>
</div>
</div>
</div>
</div>
</body>
</html>
<script>
document.querySelectorAll('.top-left')[0].addEventListener('click', function () {
window.history.back();
})
// 初始化床头卡处理实例
var cardDealFun = new DealCard()
cardDealFun.dealInfoDataCallback = (data)=>renderData(data) // 初始化页面显示回调函数
cardDealFun.showLabelCallback = ()=>renderLabel() // 护理标签显示回调函数
cardDealFun.clearPageCallback = ()=>clearInfo() // 清除页面显示回调函数
cardDealFun.GuoandYinshiCallback = (data)=>GuoandYinshi(data) // 病患标签(过敏、饮食)处理回调函数
//暴漏给安卓调用
window.getData = function (bedno, ucode, etnType, optype, jsonData) {
// 处理床位号的回调方法
if (bedno) {
renderBedName(bedno); //床号
}
cardDealFun.init(bedno, ucode, etnType, optype, jsonData)
}
//数据绑定到页面
function renderData(resData) {
if (resData.data) {
var data = resData.data.patientSelectDtos[0].patientIn;
renderPatientName(data.patientName); //病人姓名
document.getElementById('sex').innerText = data.sex; //性别
document.getElementById('patientAge').innerText = data.patientAge; //年龄
document.getElementById('inpNo').innerText = data.inpNo; //住院号
var _inTime = new Date(data.inTime); //入院日期
document.getElementById('inTime').innerText = _inTime.getFullYear() + '-' + (_inTime.getMonth() + 1) + '-' + _inTime.getDate();
document.getElementById('doctorName').innerText = data.doctorName || '暂无'; //主管医生
document.getElementById('nurseName').innerText = data.nurseName || '暂无'; //责任护士
renderAllergy(data.allergy); //过敏
renderDiet(data.diet); //饮食
//护理等级绑定
var levelConfig = resData.data.patientSelectDtos[0].nurseLevelConfig;
var levelDom = document.getElementById('nurseLevel');
if (levelConfig) {
levelDom.style.visibility = "";
levelDom.style.color = levelConfig.fontColor;
levelDom.style.backgroundColor = levelConfig.backgroundColor;
levelDom.innerText = levelConfig.nurseLevelName;
} else levelDom.style.visibility = "hidden";
// 获取护理标签
cardDealFun.getBedCardLabel()
// 获取患者标签
cardDealFun.getCartPatientLabel()
} else {
//清空数据显示
clearInfo();
}
}
//清空数据显示
function clearInfo() {
document.getElementById('bottom-scroll-view').innerHTML = ""; //护理标签
document.getElementById('patientName').innerHTML = "暂无"; //病人姓名
document.getElementById('sex').innerText = ''; //性别
document.getElementById('patientAge').innerText = ''; //年龄
document.getElementById('inpNo').innerText = '暂无'; //住院号
document.getElementById('inTime').innerText = ''; //入院日期
document.getElementById('doctorName').innerText = '暂无'; //主管医生
document.getElementById('nurseName').innerText = '暂无'; //责任护士
document.getElementById('allergy').innerText = "暂无"; //过敏
document.getElementById('diet').innerText = "暂无"; //饮食
document.getElementById('nurseLevel').style.visibility = "hidden"; //护理等级
$('#allergy,#diet').css({
'color':'#000',
'background-color':'#fff'
})
}
//床号渲染
function renderBedName(_bedName) {
var _dom = document.getElementById('bedName');
_dom.innerText = _bedName;
//最长要处理14位
if (_bedName.length == 3) _dom.style.fontSize = "170rem";
else if (_bedName.length == 4) _dom.style.fontSize = "120rem";
else if (_bedName.length == 5) _dom.style.fontSize = "100rem";
else if (_bedName.length == 6) _dom.style.fontSize = "80rem";
else if (_bedName.length == 7) _dom.style.fontSize = "70rem";
else if (_bedName.length > 7) {
_dom.style.fontSize = "70rem";
_dom.style.wordBreak = "break-all";
_dom.style.textAlign = "center";
}
}
//病人姓名渲染
function renderPatientName(name) {
//脱敏
if (cardDealFun.isFilterName) {
if (name.length <= 1) return;
else if (name.length == 2) name = name.substr(0, 1) + '*';
else {
var _n = name.substr(0, 1);
var _count = 0;
for (var i = 0; i < name.length - 2; i++) {
//如果有3个星，就不加了
if (_count > 2) break;
_n += '*';
_count++;
}
_n += name.substr(name.length - 1, 1);
name = _n;
}
}
var _dom = document.getElementById('patientName');
_dom.innerText = name;
if (cardDealFun.isFilterName) {
//脱敏可以不用滚动
} else {
//超出5个字就滚动
if (name.length > 4) {
_dom.innerHTML = '<marquee behavior="scroll" direction="left" scrollamount="4" scrolldelay="60">' + name + '</marquee>';
} else {
}
}
}
//过敏渲染
function renderAllergy(data) {
if (data) {
//大于26个字符开始滚动
if (data.length <= 26) document.getElementById('allergy').innerText = data || "暂无";
else document.getElementById('allergy').innerHTML = '<marquee behavior="scroll" direction="up" scrollamount="2">' + data + '</marquee>';
} else {
document.getElementById('allergy').innerText = data || "暂无";
}
}
//饮食渲染
function renderDiet(data) {
if (data) {
//大于26个字符开始滚动
if (data.length <= 26) document.getElementById('diet').innerText = data || "暂无";
else document.getElementById('diet').innerHTML = '<marquee behavior="scroll" direction="up" scrollamount="2">' + data + '</marquee>';
} else {
document.getElementById('diet').innerText = data || "暂无";
}
}
/**
* 病患标签处理(过敏、饮食)
*/
function GuoandYinshi(data){
console.log('data---',data)
if(data.allergy !== null){ //过敏
$('#allergy').css({
'color':data.allergy.fontColor,
'background-color':data.allergy.backGroundColor
})
}
if(data.diet !== null){ // 饮食
$('#diet').css({
'color':data.diet.fontColor,
'background-color':data.diet.backGroundColor
})
}
}
//护理标签获取并渲染
//请求需要参数patientIn.deptId、patientIn.orgId，所以需要在请求回调中调用
function renderLabel() {
const labelList = cardDealFun.patientLabel
var domView = document.getElementById('bottom-scroll-view');
var _marq = document.getElementById('bottom-scroll-view-marquee');
var _sv = _marq.getElementsByClassName('bottom-scroll-view')[0];
_sv.innerHTML = '';
domView.innerHTML = '';
//渲染
//如果标签长度超过6个，准备启动动画展示
if (labelList.length > 6) {
domView.style.display = "none";
_marq.style.display = "block";
for (var i = 0; i < labelList.length; i++) {
_sv.innerHTML += '<div class="bottom-item"><img src="' + labelList[i].img + '" alt=""><div>' + labelList[i].labelName + '</div></div>';
}
} else {
_marq.style.display = "none";
domView.style.display = 'flex';
for (var i = 0; i < labelList.length; i++) {
domView.innerHTML += '<div class="bottom-item"><img src="' + labelList[i].img + '" alt=""><div>' + labelList[i].labelName + '</div></div>';
}
}
}
</script>
