|
|
<script setup>
|
|
|
import DraggableButton from "@/pages/components/goHome.vue";
|
|
|
/**
|
|
|
* name:
|
|
|
* user:bgdb
|
|
|
* date:2024年9月26日 19:26:00
|
|
|
*/
|
|
|
import { ref } from "vue";
|
|
|
import { $api, $response } from "@/api";
|
|
|
import { onShow } from "@dcloudio/uni-app";
|
|
|
import { useStore } from "@/store";
|
|
|
const $store = useStore();
|
|
|
const dbList = ref([]);
|
|
|
let data = ref({});
|
|
|
const mountedAction = () => {
|
|
|
// uni.showLoading({
|
|
|
// title: "加载中",
|
|
|
// });
|
|
|
let obj = $store.getTjbgInfo();
|
|
|
if (obj.length) {
|
|
|
dbList.value = obj;
|
|
|
console.log($store.getTjbgInfo(), "体检报告");
|
|
|
}
|
|
|
};
|
|
|
const dbResList = ref([]);
|
|
|
|
|
|
let tabIndex = ref(0); // 标签索引
|
|
|
|
|
|
const getBtn = async (e) => {
|
|
|
tabIndex.value = e;
|
|
|
//切换时,请求切换接口更换dbResList内容
|
|
|
if (e == 0) {
|
|
|
dbResList.value = data.value?.report_type1_content;
|
|
|
} else {
|
|
|
dbResList.value = data.value?.report_type2_content;
|
|
|
}
|
|
|
};
|
|
|
const duibiclick = async () => {
|
|
|
// 报告对比按钮
|
|
|
|
|
|
if (dbList.value && dbList.value.length == 2) {
|
|
|
let obj = {
|
|
|
tj_numbers: [dbList.value[0]["体检号"], dbList.value[1]["体检号"]],
|
|
|
};
|
|
|
const response = await $api("ReportContrast", obj);
|
|
|
$response(response, () => {
|
|
|
data.value = response.data;
|
|
|
dbResList.value = data.value?.report_type1_content;
|
|
|
});
|
|
|
} else {
|
|
|
uni.$lu.toast("选择两份报告后在进行对比");
|
|
|
}
|
|
|
};
|
|
|
|
|
|
const delObj = (i) => {
|
|
|
dbList.value.splice(i, 1);
|
|
|
$store.setTjbgInfo(dbList.value);
|
|
|
};
|
|
|
const selectBg = () => {
|
|
|
// 选择报告按钮
|
|
|
uni.navigateTo({
|
|
|
url: `/pages/main/bgcx/bgdb/xzbg/xzbg`,
|
|
|
});
|
|
|
};
|
|
|
const config_ref = ref(null);
|
|
|
const configRef = (e) => {
|
|
|
if (!config_ref.value) {
|
|
|
config_ref.value = e;
|
|
|
mountedAction();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
onShow(() => {
|
|
|
if (!!config_ref.value) {
|
|
|
mountedAction();
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
<template>
|
|
|
<DraggableButton />
|
|
|
<view>
|
|
|
<view v-if="!!$store.config">
|
|
|
<view :ref="configRef"></view>
|
|
|
</view>
|
|
|
<view class="p-20rpx">
|
|
|
<view
|
|
|
class="bg-#EEA61E text-#CF911C bg-op-20 rounded-10rpx p-20rpx flex flex-items-center"
|
|
|
>
|
|
|
<image
|
|
|
class="w-26rpx h-26rpx mr-20rpx"
|
|
|
src="@/static/assets/slices/bgjdtb.png"
|
|
|
></image>
|
|
|
<span class="text-24rpx"
|
|
|
>由于手机上显示体检报告,最多选择两份报告对比!</span
|
|
|
>
|
|
|
</view>
|
|
|
<view class="bg-#fff rounded-15rpx p-20rpx mt-20rpx mb-20rpx pb-50rpx">
|
|
|
<!-- list -->
|
|
|
<view class="pb-30rpx">
|
|
|
<view v-for="(item, index) in dbList" :key="index">
|
|
|
<view
|
|
|
style="border-bottom: 1px solid #e6e9e9"
|
|
|
class="flex flex-justify-between text-#101010 text-30rpx pb-20rpx pt-20rpx"
|
|
|
>
|
|
|
<view class="line-clamp-1 flex-1">
|
|
|
{{ item["检前签到时间"]?.split("T").join(" ") }} 体检报告
|
|
|
</view>
|
|
|
<view
|
|
|
@click="delObj(index)"
|
|
|
class="w-48rpx h-48rpx rounded-15rpx flex flex-items-center flex-justify-center right-50rpx top-30px"
|
|
|
>
|
|
|
<uni-icons
|
|
|
type="trash-filled"
|
|
|
color="#E55224"
|
|
|
size="20"
|
|
|
></uni-icons>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view
|
|
|
v-if="dbList && dbList.length == 0"
|
|
|
@click="selectBg"
|
|
|
class="bg-#F0F0F0 rounded-10rpx w-477rpx h-242rpx ma flex flex-justify-center mt-20rpx mb-40rpx"
|
|
|
>
|
|
|
<image
|
|
|
class="w-91rpx h-101rpx mt-50rpx"
|
|
|
src="@/static/assets/slices/bgdbadd.png"
|
|
|
></image>
|
|
|
</view>
|
|
|
<view
|
|
|
@click="selectBg"
|
|
|
v-if="dbList && dbList.length == 1"
|
|
|
class="w-520rpx ma bg-#239EA3 rounded-40rpx text-#fff text-26rpx font-500 flex flex-justify-center line-height-[3]"
|
|
|
>
|
|
|
选择报告
|
|
|
</view>
|
|
|
<view
|
|
|
@click="duibiclick"
|
|
|
v-if="dbList.length != 1"
|
|
|
class="w-520rpx ma bg-#239EA3 rounded-40rpx text-#fff text-26rpx font-500 flex flex-justify-center line-height-[3]"
|
|
|
>
|
|
|
报告对比
|
|
|
</view>
|
|
|
</view>
|
|
|
<view
|
|
|
class="bg-#fff rounded-15rpx p-20rpx mt-20rpx mb-20rpx pb-50rpx"
|
|
|
v-if="dbResList && dbResList.length > 0"
|
|
|
>
|
|
|
<view
|
|
|
class="mt-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>
|
|
|
<uni-collapse id="collapse-bgdb">
|
|
|
<view
|
|
|
class="mt-35rpx"
|
|
|
v-for="(item, index) in dbResList"
|
|
|
:key="index"
|
|
|
>
|
|
|
<uni-collapse-item
|
|
|
:name="item.id"
|
|
|
:open="true"
|
|
|
:title="item.title"
|
|
|
thumb=""
|
|
|
>
|
|
|
<view class="p-20rpx py-0">
|
|
|
<!-- <view class="p-20rpx pl-30rpx pr-30rpx" v-if="item && item.details"> -->
|
|
|
|
|
|
<view class="flex text-#343434 text-center">
|
|
|
<view
|
|
|
style="border-bottom: 1px solid #d2d2d2"
|
|
|
class="line-height-[2.8] flex-1 mr-25rpx text-#343434 text-24rpx"
|
|
|
>
|
|
|
{{ item.r1.date?.split("T")[0] }}
|
|
|
</view>
|
|
|
<view
|
|
|
style="border-bottom: 1px solid #d2d2d2"
|
|
|
class="line-height-[2.8] flex-1 ml-25rpx text-#343434 text-24rpx"
|
|
|
>
|
|
|
{{ item.r2.date?.split("T")[0] }}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="center text-#343434 items-stretch">
|
|
|
<view class="flex-1 mr-20rpx pt-20rpx">
|
|
|
<view
|
|
|
v-show="tabIndex == 0"
|
|
|
class="whitespace-pre-wrap text-28rpx"
|
|
|
>
|
|
|
{{ item.r1?.content }}
|
|
|
</view>
|
|
|
<view v-show="tabIndex == 1" class="text-center">
|
|
|
<view class="text-32rpx">
|
|
|
<text class="text-#D01615 text-28rpx">{{
|
|
|
item.r2?.icoin
|
|
|
}}</text
|
|
|
>{{ item.r1?.content }}
|
|
|
</view>
|
|
|
<view class="text-#999999">
|
|
|
*正常范围:{{ item.r1?.desc }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="bg-#D2D2D2 w-1rpx mt-20rpx" />
|
|
|
<view class="flex-1 ml-20rpx pt-20rpx">
|
|
|
<view
|
|
|
v-show="tabIndex == 0"
|
|
|
class="whitespace-pre-wrap text-28rpx"
|
|
|
>
|
|
|
{{ item.r2?.content }}
|
|
|
</view>
|
|
|
<view v-show="tabIndex == 1" class="text-center">
|
|
|
<view class="text-32rpx">
|
|
|
<text class="text-#D01615 text-28rpx">{{
|
|
|
item.r2?.icoin
|
|
|
}}</text
|
|
|
>{{ item.r2?.content }}
|
|
|
</view>
|
|
|
<view class="text-#999999">
|
|
|
*正常范围:{{ item.r2?.desc }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</uni-collapse-item>
|
|
|
</view>
|
|
|
</uni-collapse>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
<style scoped lang="scss">
|
|
|
::v-deep .uni-collapse-item__title-wrap {
|
|
|
width: 80% !important;
|
|
|
}
|
|
|
::v-deep #collapse-bgdb .uni-collapse-item__title-box,
|
|
|
::v-deep .uni-collapse-item__title {
|
|
|
background: #239ea3 !important;
|
|
|
color: #fff !important;
|
|
|
.uni-icons {
|
|
|
color: #fff !important;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
::v-deep #collapse-bgdb .uni-collapse-item__title.uni-collapse-item-border {
|
|
|
border: none !important;
|
|
|
}
|
|
|
|
|
|
::v-deep
|
|
|
#collapse-bgdb
|
|
|
.uni-collapse-item__wrap
|
|
|
.uni-collapse-item__wrap-content.open {
|
|
|
border: none !important;
|
|
|
}
|
|
|
|
|
|
.ckjg_active {
|
|
|
background: #239ea3;
|
|
|
color: #fff;
|
|
|
}
|
|
|
</style>
|