<style>
.card {
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 5px 6px 14px 4px rgba(0, 0, 0, 0.19);
  padding: 20px;
  background-image: linear-gradient(to bottom, rgba(106, 205, 187, 0.61), rgb(255, 255, 255), rgb(255, 255, 255), rgb(255, 255, 255));
}

.card .flex-row {
  //justify-content: space-between;
}

.card .content-c {
  font-size: 28rpx;
  color: #333;
}

.card .d-text {
  font-weight: normal;
}

.card u-gap {
  margin-top: 20px;
}
</style>
<template>
	<view>
		<view class="white p-32" v-if="info&&!loading">
			<view class="flex-row flex-ali-center" v-if="info">
				<u-image width="96rpx" height="96rpx" shape="circle" :src="getAvatar">
					<u-loading slot="loading"></u-loading>
				</u-image>
				<view class="flex-col flex-jus-sp m-l-32">
					<view class="flex-row flex-ali-center m-b-16">
						<!-- <d-text :text="info.patient.name" className="content-c fs-32"></d-text> -->
						<d-text :text="info.patient.name" className="tips-c m-l-2"></d-text>
					</view>
					<view class="flex-row flex-ali-center">
						<d-text :text="info.patient.sex==1?'男':'女'" className="tips-c m-l-2"></d-text>
						<!-- info.age+ -->
						<d-text :text="info.age" className="tips-c m-l-2"></d-text>
					</view>
        </view>
			</view>
		</view>
		<!--  -->
		<view class="m-t-2 white" v-if="!loading">
			<u-tabs :list="tabs" :is-scroll="false" :current="current" @change="current=$event;loading2=true;getList()"
				bar-width="20" inactive-color="#6C7380" active-color="#6ACDBB"></u-tabs>
			<view class="p-32" v-if="list[current].length>0&&!loading2">
				<block v-if="current==0">
					<view class="flex-col card" :class="{'m-b-32':(i+1)!=list[current].length}"
						v-for="(item,i) in list[current]" :key="i" @click="toNext(2, item.id, item.user_patient_id, item.status)">
						<view class="flex-row flex-ali-center">
							<d-text text="订单号："></d-text>
							<d-text :text="item.order_no" className="content-c"></d-text>
						</view>
						<view class="flex-row flex-ali-center m-t-24">
							<d-text text="科室："></d-text>
							<d-text :text="item.depart" className="content-c"></d-text>
						</view>
            <view class="flex-row flex-ali-center m-t-16">
              <d-text text="医生："></d-text>
              <d-text :text="item.doctor" className="content-c"></d-text>
            </view>
            <view class="flex-row flex-jus-sp flex-ali-centerc">
              <d-text text=" "></d-text>
              <u-tag :text="item.status_text" :type="item.status_type" />
            </view>
            <view class="flex-row flex-jus-sp flex-ali-center m-t-16">
              <d-text text=" " color="#6C7380">
              </d-text>
              <d-text :text="item.created_at"></d-text>
            </view>
<!--						<view class="flex-row flex-ali-center m-t-16">-->
<!--							<d-text text="主诉："></d-text>-->
<!--							<d-text :text="item.main_suit" className="content-c"></d-text>-->
<!--						</view>-->
<!--						<view class="flex-row flex-ali-center flex-jus-sp m-t08">-->
<!--							<d-text width="85rpx" text="诊断：" className=""></d-text>-->
<!--							<d-text :text="item.diagnose" className="flex-1 content-c" :lines="1">-->
<!--							</d-text>-->
<!--						</view>-->
<!--            <u-gap height="1" bg-color="#cacfd8" margin-top="20"></u-gap>-->
					</view>
				</block>
				<block v-if="current==1">
					<view class="flex-col card" :class="{'m-b-32':(i+1)!=list[current].length}" v-for="(item,i) in list[current]" :key="i"
            @click="toNext(5, item.id, 0)">
            <view class="flex-row flex-ali-center">
              <d-text text="编号："></d-text>
              <d-text style="font-size: 25rpx;" className="content-c" :text="item.prescription_no"></d-text>
            </view>
            <view class="flex-row flex-ali-center m-t-16">
              <d-text text="类别："></d-text>
              <d-text :text="item.p_category" className="content-c"></d-text>
            </view>
            <view class="flex-row flex-ali-center m-t-16">
              <d-text text="诊断："></d-text>
              <d-text :text="item.clinical_diagnose" className="content-c"></d-text>
            </view>
            <view class="m-t-16">
              <d-text text="药品："></d-text>
              <u-tag v-for="(value,key) in item.p_drugs" v-if="key < 5" :text="value.toString()" style="margin: 10rpx; display: inline-block" type="info" />
              <d-text v-if="item.drugs_count >= 5" style="margin: 10rpx; display: inline-block" :text="'等，共：' + item.drugs_count+' 个'"></d-text>
            </view>
            <view class="flex-row flex-jus-sp flex-ali-centerc m-t-16">
              <d-text text=" "></d-text>
              <u-tag v-if="item.cancel_remark !== ''" :text="item.cancel_remark" :type="item.cancel_remark === '主动取消订单'? 'error': 'info'" />
            </view>
						<view class="flex-row flex-jus-sp flex-ali-center m-t-16">
							<d-text text=" " color="#6C7380">
							</d-text>
							<d-text :text="item.created_at"></d-text>
						</view>
<!--            <u-gap height="1" bg-color="#cacfd8" margin-top="20"></u-gap>-->
					</view>
				</block>
			</view>
			<view class="flex-row flex-jus-center">
				<d-empty text="无记录" v-if="!loading2&&list[current].length==0"></d-empty>
			</view>
			<d-loading-page :loading="loading2"></d-loading-page>
		</view>
		<d-loading-page :loading="loading"></d-loading-page>
	</view>
</template>

<script>
	import {
		patientInfo,
    recordListByDoctor,
	} from '@/api/all.js'
  import {prescripRecordByDoctor} from "../../api/all";
	export default {
		data() {
			return {
				loading: false,
				loading2: true,
				info: '',
				tabs: [{
					name: '挂号记录'
				}, {
					name: '处方记录'
				}],
				list: {
					0: [],
					1: []
				},
				states: {
					3: {
						color: '#6ACDBB',
						label: '待使用'
					},
					6: {
						color: '#A7ABB0',
						label: '已失效'
					},
					4: {
						color: '#A7ABB0',
						label: '已使用'
					}
				},
				current: 0,
				id: -1
			}
		},
		computed: {
			getAvatar() {
				// this.info.patient.sex
        if (this.info.avatar != '') {
          return this.info.avatar
        }
				return require(`@/static/image/${1%2==0?'nv':'nan'}.png`)
			}
		},
		onLoad(op) {
			this.id = op['id'] || -1
			this.id > 0 && this.getList()
			this.id > 0 && this.patientInfo()
		},
		methods: {
			// getDrug(obj={}) {
			// 	let list = (obj.chinese.length>0?obj.chinese:obj.west)||[]
			// 	let drugs =[]
			// 	console.log(list);
			// 	for (let i = 0; i < list.length; i++) {
			// 		if (obj.chinese.length>0) {
			// 			for (let j = 0; j < JSON.parse(list[i].content).length; j++) {
			// 				drugs.push(JSON.parse(list[i].content)[j]['name'])
			// 			}
			// 		} else{
			// 			drugs.push(JSON.parse(list[i].content)['drug_name'])
			// 		}
			// 	}
			// 	return drugs.join()
			// },
			// getGroup(list) {
			// 	let groups = []
			// 	for (var i = 0; i < list.length; i++) {
			// 		groups.push(list[i].name)
			// 	}
			// 	return groups
			// },
			getMobile(v) {
				return v.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2")
			},
      // 跳转
      toNext(base_type, id, patient_id, status = 0) {
        if (base_type == 2 && id && patient_id) {
          switch (status) {
            case null:
              this.$toast('状态非法')
              return
            case 0:
              this.$toast('该订单还未支付')
              break
            case 4:
              return this.$toast('该订单已取消')
          }
          this.$go('../../subPackages/sub_workbench/workbench_infoPatient?id=' + patient_id + '&re_id=' + id)
        } else if (base_type == 5 && id) {
          this.$go('/subPackages/sub_my/prescriptionDetail?id=' + id)
        }
      },
			patientInfo() {
				patientInfo({
					up_id: this.id,
					store_id: uni.getStorageSync('store_id') || '11001',
				}).then(res => {
					if (res.errcode == 0) {
						this.info = res.data
						this.$nextTick(() => {
							this.loading = false
						})
					} else {
						this.$toast(res.msg);
						this.loading = false
					}
				})
			},
			async getList() {
				let res = {}
				this.current == 0 && (res = await recordListByDoctor({
					up_id: this.id,
					store_id: uni.getStorageSync('store_id') || '11001',
				}))
				this.current == 1 && (res = await prescripRecordByDoctor({
					up_id: this.id,
					store_id: uni.getStorageSync('store_id') || '11001',
				}))
				if (res.errcode == 0) {
					this.list[this.current] = res.data && res.data.list ? res.data.list : res.data || []
					this.$nextTick(() => {
						this.loading2 = false
					})
				} else {
					this.$toast(res.msg);
					this.loading2 = false
				}


				this.$nextTick(() => {
					this.loading2 = false
				})
			}
		}
	}
</script>
<style>
	page {
		background-color: #F9FAFB;
	}
</style>
<style lang="scss" scoped>
	.text {
		width: 122rpx;
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #A7ABB0;
		text-align-last: justify;
	}

	.text:after {
		content: '';
		width: 100%;
		display: inline-block;
	}
</style>