|
|
<script setup>
|
|
|
/**
|
|
|
* name：
|
|
|
* user：ckbg
|
|
|
* date：2024年9月21日
|
|
|
*/
|
|
|
import { ref } from "vue";
|
|
|
import { $api, $response, $image } from "@/api";
|
|
|
import { onShow } from "@dcloudio/uni-app";
|
|
|
|
|
|
import { useStore } from "@/store";
|
|
|
const $store = useStore();
|
|
|
const mountedAction = async () => {
|
|
|
uni.showLoading({
|
|
|
title: "加载中",
|
|
|
});
|
|
|
if (tjhNum.value) {
|
|
|
await getList(); //
|
|
|
}
|
|
|
};
|
|
|
|
|
|
const $props = defineProps({
|
|
|
tjh: {
|
|
|
type: String,
|
|
|
default: "",
|
|
|
},
|
|
|
});
|
|
|
const bgjl_obj = ref(false);
|
|
|
const wzbg_list = ref(null);
|
|
|
|
|
|
let tabIndex = ref(1); // 标签索引
|
|
|
let currentIndex = ref(0); // 标签索引完整报告
|
|
|
|
|
|
const getBtn = (e) => {
|
|
|
tabIndex.value = e;
|
|
|
getList();
|
|
|
};
|
|
|
const getList = async () => {
|
|
|
// 获取 结论建议
|
|
|
console.log(tabIndex.value, "tabIndex");
|
|
|
let obj = {
|
|
|
tijian_num: tjhNum.value, //
|
|
|
hospital_id: $store.save.hospital,
|
|
|
};
|
|
|
let url = "GetReportJieLunJianYi";
|
|
|
if (tabIndex.value == 1) {
|
|
|
url = "GetReportDetaiList";
|
|
|
}
|
|
|
const response = await $api(url, obj);
|
|
|
$response(response, () => {
|
|
|
console.log(response.data, "response");
|
|
|
if (tabIndex.value == 1) {
|
|
|
for (let key in response.data.list) {
|
|
|
response.data.list[key].isopen = false;
|
|
|
}
|
|
|
wzbg_list.value = response.data.list;
|
|
|
console.log(response.data.list);
|
|
|
} else {
|
|
|
bgjl_obj.value = response.data.info;
|
|
|
}
|
|
|
console.log(wzbg_list.value, "wzbg_list.value");
|
|
|
|
|
|
uni.hideLoading();
|
|
|
});
|
|
|
};
|
|
|
|
|
|
const isopen = ref(false); //默认展开全部检查
|
|
|
const config_ref = ref(null);
|
|
|
const tjhNum = ref(""); //url参数
|
|
|
|
|
|
const configRef = (e) => {
|
|
|
if (!config_ref.value) {
|
|
|
config_ref.value = e;
|
|
|
tjhNum.value = $props.tjh;
|
|
|
console.log(tjhNum.value, "tjh"); //url参数
|
|
|
mountedAction();
|
|
|
}
|
|
|
};
|
|
|
const dqArr = ref([]);
|
|
|
const collapseClick = async (e) => {
|
|
|
let id = e; //当前id
|
|
|
let itemWithId120 = null; //当前id的对象 itemWithId120['details']
|
|
|
if (e) {
|
|
|
for (let key in wzbg_list.value) {
|
|
|
if (
|
|
|
wzbg_list.value.hasOwnProperty(key) &&
|
|
|
wzbg_list.value[key].id === id
|
|
|
) {
|
|
|
itemWithId120 = wzbg_list.value[key];
|
|
|
break; // 找到后退出循环
|
|
|
}
|
|
|
}
|
|
|
// return
|
|
|
if(itemWithId120.hasOwnProperty("details")){
|
|
|
console.log(itemWithId120["details"], "itemWithId120");
|
|
|
return
|
|
|
}
|
|
|
uni.showLoading({
|
|
|
title: "加载中",
|
|
|
});
|
|
|
let obj = {
|
|
|
id,
|
|
|
};
|
|
|
const response = await $api("GetReportDetai", obj);
|
|
|
console.log(response);
|
|
|
$response(response, () => {
|
|
|
itemWithId120["details"] = response.data;
|
|
|
console.log(itemWithId120["details"], "itemWithId120");
|
|
|
// itemWithId120.isopen = itemWithId120.isopen
|
|
|
// ? !itemWithId120.isopen
|
|
|
// : true;
|
|
|
itemWithId120.isopen = true;
|
|
|
});
|
|
|
uni.hideLoading();
|
|
|
}
|
|
|
};
|
|
|
const getOpenClick = () => {
|
|
|
isopen.value = !isopen.value;
|
|
|
console.log(wzbg_list.value);
|
|
|
|
|
|
for (let key in wzbg_list.value) {
|
|
|
wzbg_list.value[key].isopen = !wzbg_list.value[key].isopen;
|
|
|
}
|
|
|
console.log(wzbg_list.value);
|
|
|
// 将列表中 open 修改，并且请求接口
|
|
|
};
|
|
|
|
|
|
const calculatePercentage = (value, start, end, maxNum) => {
|
|
|
if (value >= start && value <= end) {
|
|
|
const rangeLength = end - start;
|
|
|
const distanceFromStart = value - start;
|
|
|
const proportion = distanceFromStart / rangeLength;
|
|
|
const percentage = proportion * 50 + 25;
|
|
|
return percentage.toFixed(2);
|
|
|
}
|
|
|
if (value < start) {
|
|
|
const rangeLength = start;
|
|
|
const distanceFromStart = value;
|
|
|
const proportion = distanceFromStart / rangeLength;
|
|
|
const percentage = proportion * 25;
|
|
|
return percentage.toFixed(2);
|
|
|
}
|
|
|
if (value > end) {
|
|
|
const rangeLength = maxNum - end;
|
|
|
const distanceFromStart = value - end;
|
|
|
const proportion = distanceFromStart / rangeLength;
|
|
|
const percentage = proportion * 25 + 75;
|
|
|
return percentage.toFixed(2);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
onShow(() => {
|
|
|
if (!!config_ref.value) {
|
|
|
mountedAction();
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
<template>
|
|
|
<view>
|
|
|
<view v-if="!!$store.config">
|
|
|
<view :ref="configRef"></view>
|
|
|
</view>
|
|
|
<view class="box-border ma pt-20rpx pb-20rpx pl-10rpx pr-10rpx">
|
|
|
<view
|
|
|
class="mb-20rpx flex rounded-8rpx w-428rpx h-66rpx ma b-0 b-1 b-solid b-#239EA3"
|
|
|
>
|
|
|
<view
|
|
|
@click="getBtn(0)"
|
|
|
:class="tabIndex == 0 ? 'ckjg_active' : ''"
|
|
|
class="text-#239EA3 flex-1 text-#26rpx bg-#D9F3F2 flex flex-items-center flex-justify-center rounded-l-8rpx"
|
|
|
>
|
|
|
结论建议
|
|
|
</view>
|
|
|
<view
|
|
|
@click="getBtn(1)"
|
|
|
:class="tabIndex == 1 ? 'ckjg_active' : ''"
|
|
|
class="text-#239EA3 flex-1 flex flex-items-center flex-justify-center bg-#D9F3F2 rounded-r-8rpx"
|
|
|
>完整报告
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="tabIndex == 0">
|
|
|
<view
|
|
|
class="bg-#239EA3 position-relative h-390rpx ma mb-10rpx border-rd-5rpx"
|
|
|
>
|
|
|
<view
|
|
|
class="text-36rpx text-#fff position-absolute top-33rpx left-28rpx"
|
|
|
>
|
|
|
{{ bgjl_obj.name }}
|
|
|
</view>
|
|
|
<image
|
|
|
class="w-279rpx h-329rpx position-absolute bottom-0 left-80rpx"
|
|
|
src="@/static/assets/slices/avatar.png"
|
|
|
></image>
|
|
|
<view class="relative center h-full">
|
|
|
<view
|
|
|
class="absolute right-335rpx"
|
|
|
style="
|
|
|
width: 0;
|
|
|
height: 0;
|
|
|
border-top: 15rpx solid transparent;
|
|
|
border-right: 15rpx solid #fff;
|
|
|
border-bottom: 15rpx solid transparent;
|
|
|
"
|
|
|
>
|
|
|
</view>
|
|
|
<view
|
|
|
class="bg-#fff rounded-20rpx pb-27rpx pl-33rpx pr-33rpx position-absolute right-20rpx w-250rpx"
|
|
|
>
|
|
|
<view class="text-#239EA3 text-28rpx line-height-[2.8] font-500">
|
|
|
基本健康数据
|
|
|
</view>
|
|
|
<view
|
|
|
class="flex flex-justify-between text-24rpx line-height-[1.5]"
|
|
|
v-for="(item, index) in bgjl_obj.base_date"
|
|
|
:key="index"
|
|
|
>
|
|
|
<view class="text-#8A8A8A"> {{ item.name }} </view>
|
|
|
<view class="text-#101010"> {{ item.value }} </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view
|
|
|
class="flex flex-justify-evenly pb-20rpx pt-14rpx"
|
|
|
style="
|
|
|
background: linear-gradient(
|
|
|
-360deg,
|
|
|
#f3f3f3 0%,
|
|
|
#edf6f5 55%,
|
|
|
#bbdfe1 99%
|
|
|
);
|
|
|
"
|
|
|
>
|
|
|
<view
|
|
|
class="bg-#fff rounded-20rpx w-30% text-center pt-36rpx pb-36rpx"
|
|
|
>
|
|
|
<view class="text-26rpx font-500">
|
|
|
<span class="text-36rpx mr-10rpx">
|
|
|
{{ bgjl_obj ? bgjl_obj.items.all_count : 0 }}</span
|
|
|
>项
|
|
|
</view>
|
|
|
<view class="text-#8C8C8C text-22rpx"> 总指标 </view>
|
|
|
</view>
|
|
|
<view
|
|
|
class="bg-#fff rounded-20rpx w-30% text-center pt-36rpx pb-36rpx"
|
|
|
>
|
|
|
<view class="text-26rpx font-500">
|
|
|
<span
|
|
|
class="text-36rpx mr-10rpx"
|
|
|
:class="
|
|
|
bgjl_obj && bgjl_obj.items.ipt_error_count > 0
|
|
|
? 'color-red'
|
|
|
: ''
|
|
|
"
|
|
|
>
|
|
|
{{ bgjl_obj ? bgjl_obj.items.ipt_error_count : 0 }}</span
|
|
|
>项
|
|
|
</view>
|
|
|
<view class="text-#8C8C8C text-22rpx"> 重要异常结果 </view>
|
|
|
</view>
|
|
|
<view
|
|
|
class="bg-#fff rounded-20rpx w-30% text-center pt-36rpx pb-36rpx"
|
|
|
>
|
|
|
<view class="text-26rpx font-500">
|
|
|
<span
|
|
|
class="text-36rpx mr-10rpx"
|
|
|
:class="
|
|
|
bgjl_obj && bgjl_obj.items.error_count > 0 ? 'color-red' : ''
|
|
|
"
|
|
|
>{{ bgjl_obj ? bgjl_obj.items.error_count : 0 }}</span
|
|
|
>项
|
|
|
</view>
|
|
|
<view class="text-#8C8C8C text-22rpx"> 异常结果 </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
<view class="rounded-15rpx bg-#fff pt-22rpx pb-22rpx">
|
|
|
<view
|
|
|
class="w-154rpx h-60rpx rounded-r-30rpx text-center center text-#123531 text-25rpx font-500"
|
|
|
style="background: linear-gradient(90deg, #edf6f5 0%, #bbdfe1 99%)"
|
|
|
>
|
|
|
总检建议
|
|
|
</view>
|
|
|
<view class="pl-15rpx pr-25rpx pt-45rpx box-border">
|
|
|
<text class="text-#0B0B0B line-height-[2] text-26rpx">{{
|
|
|
bgjl_obj.content
|
|
|
}}</text>
|
|
|
|
|
|
<!-- <view class=" flex flex-justify-between line-height-[2]">
|
|
|
|
|
|
<view class="font-500 text-28rpx">【{{item}}】舒张压降低
|
|
|
</view>
|
|
|
<view class="">
|
|
|
<image class="w-25rpx h-25rpx mr-4rpx" src="@/static/assets/slices/wjx.png"></image>
|
|
|
<image class="w-25rpx h-25rpx" src="@/static/assets/slices/wjx.png"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="text-26rpx text-#0B0B0B pl-15rpx">
|
|
|
<view class="flex">
|
|
|
<view class="mr-5rpx"> (1) </view>
|
|
|
<view class="">
|
|
|
收缩压正常、舒张压降低为身低于60mm降低为身低于60mmHg 收缩压正常、舒张压降低为身低于60mmHg
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
</view> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="tabIndex == 1">
|
|
|
<view class="rounded-15rpx bg-#fff pt-22rpx pb-50rpx position-relative">
|
|
|
<view
|
|
|
class="w-154rpx h-60rpx mb-20rpx rounded-r-30rpx text-center line-height-[2.3] text-#123531 text-25rpx font-500"
|
|
|
style="background: linear-gradient(90deg, #edf6f5 0%, #bbdfe1 99%)"
|
|
|
>
|
|
|
全部检查
|
|
|
</view>
|
|
|
<view
|
|
|
class="position-absolute top-20rpx right-0rpx text-#6D6D6D text-26rpx"
|
|
|
>
|
|
|
<view
|
|
|
id="qcInline"
|
|
|
class="flex flex-items-center"
|
|
|
@click="getOpenClick"
|
|
|
>
|
|
|
<view class="position-absolute right-35px w-120rpx">
|
|
|
{{ isopen ? "收起全部" : "展开全部" }}
|
|
|
</view>
|
|
|
<uni-collapse-item id="qcInline-item" :open="isopen">
|
|
|
</uni-collapse-item>
|
|
|
</view>
|
|
|
<!-- 展开全部 -->
|
|
|
</view>
|
|
|
<view v-for="(item, index) in wzbg_list">
|
|
|
<uni-collapse
|
|
|
class="collapse-w"
|
|
|
@change="collapseClick"
|
|
|
v-model="currentIndex"
|
|
|
accordion
|
|
|
>
|
|
|
<view class="position-relative" :key="index">
|
|
|
<view
|
|
|
v-if="item && item.error_count > 0"
|
|
|
class="position-absolute line-height-[96rpx] right-40px text-#6D6D6D text-15px"
|
|
|
>
|
|
|
<span class="text-#E46B1A">{{ item.error_count }}</span>
|
|
|
项异常
|
|
|
</view>
|
|
|
<uni-collapse-item
|
|
|
:name="item.id"
|
|
|
:open="item.isopen"
|
|
|
thumb=""
|
|
|
:title="index"
|
|
|
>
|
|
|
<view
|
|
|
class="p-20rpx pl-30rpx pr-30rpx"
|
|
|
v-if="item && item.details"
|
|
|
>
|
|
|
<view
|
|
|
class="bg-#FBF0EE b-0 b-1 b-solid b-#EADEDB rounded-15rpx pb-10rpx"
|
|
|
:class="item.error_count == 0 ? 'greenClor' : ''"
|
|
|
>
|
|
|
<view
|
|
|
:class="item.error_count == 0 ? 'greenTextClor' : ''"
|
|
|
class="w-141rpx line-height-[2] text-center text-#fff bg-#F6725B rounded-lt-15rpx rounded-rb-15rpx text-22rpx"
|
|
|
>
|
|
|
初步意见
|
|
|
</view>
|
|
|
|
|
|
<template v-if="item.error_count > 0">
|
|
|
<view
|
|
|
class="text-#E33939 text-22rpx line-height-[2] pl-20rpx pr-20rpx"
|
|
|
v-for="(text, i) in item.details.error_items"
|
|
|
:key="i"
|
|
|
>
|
|
|
{{ text }}
|
|
|
</view>
|
|
|
</template>
|
|
|
<view
|
|
|
class="text-#239EA3 text-22rpx line-height-[2] pl-20rpx pr-20rpx"
|
|
|
v-else
|
|
|
>
|
|
|
<!-- {{item.details.error_items.length}} -->
|
|
|
<text
|
|
|
v-if="
|
|
|
!item.details.suojian?.length && !item.details.error_items?.length
|
|
|
"
|
|
|
>
|
|
|
未见明显异常</text
|
|
|
>
|
|
|
<template v-else>
|
|
|
<text
|
|
|
v-for="(text, i) in item.details.suojian"
|
|
|
:key="i"
|
|
|
>
|
|
|
{{ text }}</text
|
|
|
>
|
|
|
</template>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- <view v-if="1 < 0" class="flex flex-justify-around m-20rpx">
|
|
|
<view>
|
|
|
<view class="text-36rpx font-500"> 162.0 </view>
|
|
|
<view class="text-20rpx"> 身高（cm） </view>
|
|
|
</view>
|
|
|
<view>
|
|
|
<view class="text-40rpx font-500"> 58.8 </view>
|
|
|
<view class="text-20rpx"> 体重（Kg） </view>
|
|
|
</view>
|
|
|
</view> -->
|
|
|
<view class="p-10rpx pt-20rpx pb-20rpx">
|
|
|
<view v-for="(obj, k) in item.details.list" :key="k">
|
|
|
<view class="font-500 text-24rpx line-height-[2]">
|
|
|
{{ obj["基础项目名称"] }}
|
|
|
<span class="text-#737373 text-18rpx"
|
|
|
>( {{ obj["结果值单位"] }})</span
|
|
|
>
|
|
|
</view>
|
|
|
|
|
|
<view class="pt-80rpx pb-30rpx">
|
|
|
<view class="h-4rpx bg-#E2E2E2 rounded-2rpx relative">
|
|
|
<view
|
|
|
class="bg-#239EA3 h-4rpx w-50% rounded-2rpx ma flex text-24rpx text-#7B7B7B flex-justify-between"
|
|
|
>
|
|
|
<!-- {{obj['结果值范围']}} -->
|
|
|
<text>{{ obj["结果值范围"][0] }}</text>
|
|
|
<text>正常</text>
|
|
|
<text>{{ obj["结果值范围"][1] }}</text>
|
|
|
</view>
|
|
|
<view
|
|
|
v-if="
|
|
|
obj['结果值'] < obj['结果值范围'][0] ||
|
|
|
obj['结果值'] > obj['结果值范围'][1]
|
|
|
"
|
|
|
class="bg-#F8C9C7 h-4rpx w-25% rounded-2rpx ma absolute bottom-0"
|
|
|
:class="{
|
|
|
'left-0': obj['结果值'] < obj['结果值范围'][0],
|
|
|
'right-0': obj['结果值'] > obj['结果值范围'][1],
|
|
|
}"
|
|
|
></view>
|
|
|
<view
|
|
|
class="center flex-col absolute"
|
|
|
:style="{
|
|
|
left:
|
|
|
calculatePercentage(
|
|
|
obj['结果值'],
|
|
|
obj['结果值范围'][0],
|
|
|
obj['结果值范围'][1],
|
|
|
obj['最大范围'][1]
|
|
|
) + '%',
|
|
|
}"
|
|
|
>
|
|
|
<view
|
|
|
class="text-34rpx absolute top--50rpx"
|
|
|
:class="{
|
|
|
'text-#239EA3':
|
|
|
obj['结果值'] >= obj['结果值范围'][0] &&
|
|
|
obj['结果值'] <= obj['结果值范围'][1],
|
|
|
'text-#F34932':
|
|
|
obj['结果值'] < obj['结果值范围'][0] ||
|
|
|
obj['结果值'] > obj['结果值范围'][1],
|
|
|
}"
|
|
|
>
|
|
|
<text>{{ obj["结果值"] }}</text>
|
|
|
<uni-icons
|
|
|
v-if="obj['结果值'] < obj['结果值范围'][0]"
|
|
|
type="arrow-down"
|
|
|
:size="16"
|
|
|
color="#F34932"
|
|
|
></uni-icons>
|
|
|
<uni-icons
|
|
|
v-if="obj['结果值'] > obj['结果值范围'][1]"
|
|
|
type="arrow-up"
|
|
|
:size="16"
|
|
|
color="#F34932"
|
|
|
></uni-icons>
|
|
|
</view>
|
|
|
<view
|
|
|
class="w-8rpx h-8rpx rounded-50% bg-#fff b-4rpx b-solid absolute -top-8rpx"
|
|
|
:class="{
|
|
|
'b-#1F8F94':
|
|
|
obj['结果值'] >= obj['结果值范围'][0] &&
|
|
|
obj['结果值'] <= obj['结果值范围'][1],
|
|
|
'b-#F34932':
|
|
|
obj['结果值'] < obj['结果值范围'][0] ||
|
|
|
obj['结果值'] > obj['结果值范围'][1],
|
|
|
}"
|
|
|
>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class=""> </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</uni-collapse-item>
|
|
|
</view>
|
|
|
</uni-collapse>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<style scoped>
|
|
|
/* uni-collapse-item__title.uni-collapse-item-border */
|
|
|
::v-deep
|
|
|
#qcInline
|
|
|
#qcInline-item
|
|
|
.uni-collapse-item__title.uni-collapse-item-border {
|
|
|
border: none !important;
|
|
|
}
|
|
|
|
|
|
::v-deep
|
|
|
#qcInline
|
|
|
#qcInline-item
|
|
|
.uni-collapse-item__wrap
|
|
|
.uni-collapse-item__wrap-content.open {
|
|
|
border: none !important;
|
|
|
}
|
|
|
|
|
|
::v-deep .collapse-w .uni-collapse-item__title-box {
|
|
|
width: 560rpx;
|
|
|
}
|
|
|
|
|
|
.ckjg_active {
|
|
|
background: #239ea3;
|
|
|
color: #fff;
|
|
|
}
|
|
|
|
|
|
.color-red {
|
|
|
color: #e46b1a;
|
|
|
}
|
|
|
|
|
|
.greenTextClor {
|
|
|
background-color: #239ea3;
|
|
|
}
|
|
|
|
|
|
.greenClor {
|
|
|
background-color: #e8f6f5;
|
|
|
border: 2px solid #dce9e8;
|
|
|
}
|
|
|
</style>
|