<template>
    <nav-bar :navbar-data="navbarData" />
    <view :style="{marginTop: navHeight +'px', overflow: 'hidden'}">
		<view class="choose-patient" v-if="showSelectPatient">
		    <choose-patient
		        id="choose-patient"
		        :hisPatID="patID"
		        @selectedChange="upDateUserData($event, { tagId: 'choose-patient' })"
		        backUrl="../../../tabBar/order/order"
		    ></choose-patient>
		</view>
        <view class="prescription" :style="{height: 'calc(100vh - '+ height + 'px)', overflow: 'auto'}">
            <view class="medical" v-for="(item,index) in medicalData" :key="index">
                <text class="tit">{{item.hospDesc}}</text>
                <text class="tit2">{{item.locDesc}}</text>
                <view class="conter">
                    <text class="diagnosis">诊断</text>
                    <text> ： {{item.diag}}</text>
                </view>
                <view class="btm">
                    <text>医师:<text style="color:#333">{{item.doctorName}}</text> </text>
                    <text> 就诊日期:<text style="color:#333">{{item.prescDate}}</text></text>
                    <button class="btn btn-default border-blue" plain type="info" @tap="checkDetail(item.ID)">查看详情</button>
                </view>
            </view>
			<view class="no-data" v-if="medicalData && medicalData.length == 0" :style="{height: 'calc(100% - '+ navHeight +'px)'}">
				<van-icon name="orders-o" size="50px" color="#cccccc" />
			    <view class="txt">暂无记录</view>
			</view>
            <!-- <van-divider contentPosition="center">数据已全部加载</van-divider> -->
        </view>
    </view>
</template>

<script>
    import $http from "@/utils/https"
    import Util from "@/utils/utils"
    import httpConfig from '@/utils/httpConfig'
    import navBar from '@/components/navBar/index'
	import Loadmore from '@/components/loadmore/loadmore';
	import VanDivider from '@/components/divider/index';
	import VanIcon from '@/components/icon/index';
	import { getHospList, getAdmSelectData, checkHospitalDataAlready, switchHospital } from '@/utils/common';
    const app = getApp();
    export default {
        components: {
            'nav-bar': navBar,
			'loadmore': Loadmore,
            'van-divider': VanDivider,
			'van-icon': VanIcon,
        },
        data() {
            return {
                navHeight: app.globalData.height,
                spaceHeight: app.globalData.spaceHeight,
                navTitleHeight: app.globalData.navTitleHeight,
                statusBarHeight: app.globalData.statusBarHeight,
				
                navbarData: {
                    isGoHome: true,
                    isGoBack: true,
                    title: "诊疗记录"
                },
				
				medicalData: undefined,
				loadStatus: 'none',
				showSelectPatient: false,
				
				// 是否显示切换就诊人组件
				userData: {},
				
				checkHospitalCount: 10,
				patID: '',
				undefined: ''
            }
        },
		onLoad(options) {
		    if (options.hospCode) {
		        const { hospCode } = options;
		        uni.showLoading({
		            title: '加载中...'
		        });
		        checkHospitalDataAlready(this).then(() => {
		            // 判断医院列表数据是否存在
		            const allHospitalData = this.$cache.get('allHospitalData');
		            const filterHospitalData = allHospitalData.filter((item) => item.hospCode == hospCode);
		            // 切换医院
		            switchHospital(filterHospitalData[0], app);
		            const userData = this.$cache.get('userData');
		            // 显示就诊人切换组件
		            this.setData({
		                patID: userData.patID,
		                showSelectPatient: true
		            });
		            uni.hideLoading();
		        });
		    } else {
		        this.getMedicalDataList();
		        const userData = this.$cache.get('userData');
		        // 显示就诊人切换组件
		        this.setData({
		            patID: userData.hisPatID,
		            showSelectPatient: true
		        });
		    }
		},
        methods: {
			// 更新userData数据
			upDateUserData(e, _dataset) {
			    /* ---处理dataset begin--- */
			    this.handleDataset(e, _dataset);
			    /* ---处理dataset end--- */
			    let { userData } = this;
			    return new Promise((resolve) => {
			        let newUserData = this.$cache.get('userData');
			        if (!(userData && userData.hisPatID === newUserData.hisPatID)) {
			            this.setData(
			                {
			                    patID: newUserData.hisPatID,
			                    userData: newUserData
			                },
			                () => {
			                    this.getMedicalDataList();
			                }
			            );
			        }
			    });
			},
			
            checkDetail: function(id) {
                uni.navigateTo({
                    url: '/pages/mine/medical/medicalDetails/medicalDetails?id=' + id,
                })
            },

            //请求诊疗记录列表数据
            getMedicalDataList: function() {
                let userData = this.$cache.get('userData') || {};
                let data = {
                    params: [{
                        patID: userData.hisPatID,
                        hospCode: userData.hisHospID
                    }]
                }
                $http.post("urlS", this, {
                    code: "03100093",
                    data: data,
                    namespace: 'Y',
                    success: function(res) {
                        if (+res.errorCode === 0) {
                            this.setData({
                                medicalData: res.rows
                            });
                        } else {
                            this.setData({
                                medicalData: []
                            });
                        }
                    }
                });
            },
        }
    }
</script>

<style lang="scss">
	@use '@/static/_uni.scss' as uni;
    .prescription {
        padding: 0 30rpx;
    }

    .medical {
        height: 290rpx;
        background-color: #fff;
        margin: 30rpx 0rpx;
        padding: 30rpx;
        position: relative;
        border-radius: 17rpx;
    }

    .medical .tit {
        font-size: 32rpx;
        font-weight: 700;
        margin-right: 10rpx;
    }

    .medical .tit2 {
        color: #666;
        margin-left: 15rpx;
    }

    .medical .conter {
        margin-top: 35rpx;
        color: #999;
        text-overflow: -o-ellipsis-lastline;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        background-color: #FAFAFA;
        height: 87rpx;
        color: #333;
        padding: 22rpx 10rpx;
    }

    .medical .diagnosis {
        color: #666;
    }

    .medical .btm {
        margin-top: 28rpx;
        color: #999;
    }

    .medical .btm .btn {
		float: right;
        width: 147rpx;
        height: 50rpx;
        line-height: 45rpx;
        padding: 0rpx;
		font-size: 28rpx;
        border-radius: 50rpx;
		color: uni.$uni-color-primary;
    }

    .medical .triangle {
        width: 0;
        height: 0;
        border-right: 50rpx solid transparent;
        border-left: 50rpx solid transparent;
        border-top: 50rpx solid red;
    }

    .medical .error text {
        position: absolute;
        top: -3rpx;
        width: 60rpx;
        left: 18rpx;
        color: #fff;
        font-weight: 700;
    }
</style>