<template>
  <div>
    <go-back :title="title"></go-back>
    <div class="tabMenu" title="标题导航栏">
      <ul>
        <li v-for="(item,i) in ['病历','今日']" :key="i" :class="index == i? 'active':'' " @click="ClickTab(i)" >{{item}}</li>
      </ul>
      <!-- <div class="SelectDate">
        <span>选择日期</span>
        <span class="iconfont">&#xe60c;</span>
      </div> -->
    </div>
    <div>

      <div v-show="index==0" title="病历">
        <patient-info ref="patient_detail" title="病历组件"></patient-info>
      </div>
       <!--<div v-show="index==0" title="病历">
        <case-history title="病历组件"></case-history>
      </div>
      <div v-show="index==1" title="透析"></div> -->

      <div v-show="index==1" title="今日">
        <details-menu 
        ref="detail_menu" 
        class="clearfix" 
        :patient="patient"
        :schedual="schedual"
        :prescription="prescription"
        :solution="solution"
        :receiver_treatment_access="receiver_treatment_access"
        :predialysis_evaluation="predialysis_evaluation"
        :doctor_advices="doctor_advices"
        :double_check="double_check"
        :assessment_after_dislysis="assessment_after_dislysis"
        :treatment_summary="treatment_summary"
        :monitor_records="monitor_records"
        :dialysis_order="dialysis_order"
        :admin_users="admin_users"
        :devices="devices"
        v-on:did_add_monitor="didAddMonitor" @create_medical_order="createMedicalOrder" @delete_medical_order="delMedicalOrder" @execution_medical_order="executionMedicalOrder" @edit_pre_dialysis="editPreDialysis"></details-menu>
        
        <details-info ref="patient_info" class="clearfix"></details-info>
        <dialysis-prescription ref="prescription" title="透析处方 " :prescription="prescription" :solution="solution"></dialysis-prescription>
        <!-- <past-data title="往期数据"></past-data> -->
        <accepts-assessment ref="accepts_assessment" title="接诊评估 " :record="receiver_treatment_access"></accepts-assessment>
        <stat-order ref="stat_order" class="clearfix" title="临时医嘱"></stat-order>
        <assessment-before ref="assessment_before" title="透前评估 "></assessment-before>
        <dialysis-computer ref="dialysis_computer" title="透析上机 " :record="dialysis_order"></dialysis-computer>
        <double-check ref="double_check" title="双人查对 " :record="double_check"></double-check>
        <dialysis-monitoring ref="monitoring" title="透析监测"></dialysis-monitoring>
        <dialysis-off ref="dialysis_off" title="透析下机 " :record="dialysis_order"></dialysis-off>
        <assessment-after ref="assessment_after" title="透后评估 " :record="assessment_after_dislysis"></assessment-after>
        <treatment-of ref="treatment_of" title="治疗小结" :record="treatment_summary"></treatment-of>
        <!-- <operation-staff title="操作人员 "></operation-staff> -->
      </div>

      <!-- <div v-show="index==3" title="前次"></div> -->
    </div>
  </div>
</template>

<script>
// import DetailsHead from "./detailsHead";
import DetailsMenu from "./detailsMenu";
import DetailsInfo from "./detailsInfo";
import DialysisPrescription from "./dialysisPrescription";
import AcceptsAssessment from "./acceptsAssessment";
import AssessmentBefore from "./assessmentBefore";
import DialysisComputer from "./dialysisComputer";
import DoubleCheck from "./doubleCheck";
import DialysisOff from "./dialysisOff";
import AssessmentAfter from "./assessmentAfter";
import TreatmentOf from "./treatmentOf";
import OperationStaff from "./operationStaff";
import PastData from "./pastData";
import StatOrder from "./statOrder";
import DialysisMonitoring from "./dialysisMonitoring";
// import CaseHistory from "./caseHistory";
import PatientInfo from "./patientInfo";
import GoBack from "./goBack";
import {getDialysisRecord,dialysisGlobalConfig} from "@/api/dialysis"
import {parseTime} from "@/utils"
import { version } from 'vant';

export default {
  name: "Details",
  data() {
    return {
      index: 1,
      patient_id: 0,
      date: 0,
      title: "透析记录",

      patient : {}, // 患者信息
      schedual : {}, // 患者排班信息
      prescription : {}, // 透析处方
      solution : {}, // 透析方案
      receiver_treatment_access : {}, // 接诊评估
      predialysis_evaluation : {}, // 透前评估
      doctor_advices : [], // 临时医嘱
      double_check : {}, // 双人核对
      assessment_after_dislysis : {}, // 透后评估
      treatment_summary : {}, // 治疗小结
      monitor_records : [], // 透析监测
      dialysis_order : {}, // 透析记录
      admin_users: [], //系统用户列表
      devices: [],//设备
    };
  },
  components: {
    // DetailsHead,
    DetailsMenu,
    DetailsInfo,
    DialysisPrescription,
    AcceptsAssessment,
    AssessmentBefore,
    DialysisComputer,
    DoubleCheck,
    DialysisOff,
    AssessmentAfter,
    TreatmentOf,
    OperationStaff,
    PastData,
    StatOrder,
    DialysisMonitoring,
    // CaseHistory,
    PatientInfo,
    GoBack
  },
  created() {
    var patient_id = this.$route.query.patient_id
    var date = this.$route.query.date
    this.patient_id = patient_id
    this.date = date
    this.requestDialysisRecord()
  },
  methods: {
    ClickTab: function(tabIndex) {
      this.index = tabIndex;
    },
    requestDialysisRecord() {
      var dateStr = parseTime(this.date, "{y}-{m}-{d}")
      var params = {
        patient_id: this.patient_id,
        date: dateStr,
      }
      getDialysisRecord(params).then(rs => {
        var resp = rs.data
        if (resp.state == 1) {
          console.log(resp.data)
          var patient = resp.data.patient // 患者信息
          var schedual = resp.data.schedual // 患者排班信息
          var prescription = resp.data.prescription // 透析处方
          var solution = resp.data.solution // 透析方案
          var receiver_treatment_access = resp.data.receiver_treatment_access // 接诊评估
          var predialysis_evaluation = resp.data.predialysis_evaluation // 透前评估
          var doctor_advices = resp.data.doctor_advices // 临时医嘱
          var double_check = resp.data.double_check // 双人核对
          var assessment_after_dislysis = resp.data.assessment_after_dislysis // 透后评估
          var treatment_summary = resp.data.treatment_summary // 治疗小结
          var monitor_records = resp.data.monitor_records // 透析监测
          var dialysis_order = resp.data.dialysis_order // 透析记录

          this.patient = patient
          this.schedual = schedual == null ? {} : schedual
          this.prescription = prescription == null ? {id: ""} : prescription
          this.solution = solution == null ? {id: ""} : solution
          this.receiver_treatment_access = receiver_treatment_access == null ? {id: ""} : receiver_treatment_access
          this.predialysis_evaluation = predialysis_evaluation == null ? {} : predialysis_evaluation
          this.doctor_advices = doctor_advices == null ? {} : doctor_advices
          this.double_check = double_check == null ? {id: ""} : double_check
          this.assessment_after_dislysis = assessment_after_dislysis == null ? {id: ""} : assessment_after_dislysis
          this.treatment_summary = treatment_summary == null ? {id: ""} : treatment_summary
          this.monitor_records = monitor_records == null ? {} : monitor_records
          this.dialysis_order = dialysis_order == null ? {id: ""} : dialysis_order

          this.$refs.patient_info.setPatientInfo(this.patient, this.schedual.device_number.number)
          
          this.$refs.patient_detail.setPatientInfo(this.patient, this.schedual.device_number.number)
          // this.$refs.prescription.setPrescription(prescription, solution)
          // this.$refs.accepts_assessment.setRecord(this.receiver_treatment_access)
          this.$refs.stat_order.setAdvices(this.doctor_advices)
          this.$refs.assessment_before.setRecord(this.predialysis_evaluation)
          // this.$refs.dialysis_computer.setOrder(this.dialysis_order)
          // this.$refs.double_check.setRecord(this.double_check)
          this.$refs.monitoring.setRecords(this.monitor_records)
          // this.$refs.dialysis_off.setOrder(this.dialysis_order)
          // this.$refs.assessment_after.setRecord(this.assessment_after_dislysis)
          // this.$refs.treatment_of.setRecord(this.treatment_summary)

          // this.$refs.detail_menu.setData(resp.data)

          this.title = patient.name

        } else {
          this.$toast({
            message: resp.msg
          })
        }
      })

      dialysisGlobalConfig().then(rs=>{
        var res = rs.data;
        if (res.state==1) {
          console.log(res)
          // this.$refs.detail_menu.setGlobalConfig(res.data)
          this.admin_users = res.data.admin_users
          this.devices = res.data.devices
        }
      })
    },
    didAddMonitor: function(monitor) {
      console.log("1111111")
      console.log(monitor)
      this.$refs.monitoring.addRecords([monitor])
    },
    createMedicalOrder(row) {
      this.$refs.stat_order.createMedicalOrder(row)
    },
    delMedicalOrder(row){
      this.$refs.stat_order.delMedicalOrder(row)
    },
    executionMedicalOrder(row) {
      this.$refs.stat_order.executionMedicalOrder(row);
    },
    editPreDialysis(row) {
      this.$refs.assessment_before.setRecord(row)
    }
  }
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.tabMenu {
  background: $main-color;
  padding: 0.2rem 0 0.2rem 0;
  position: relative;
  .SelectDate {
    position: absolute;
    right: 0.28rem;
    top: 0.2rem;
    font-size: 0.28rem;
    color: #fff;
  }
  ul {
    width: 50%;
    margin: 0 auto;
    @include box-sizing;
    @include display-flex;
    @include text-align;
    li {
      font-size: 0.3rem;
      color: $text-color;
      @include flex;
      float: left;
      padding: 0 0 0.13rem 0;
      &.active {
        font-weight: 700;
        position: relative;
        &:after {
          width: 0.5rem;
          height: 0.06rem;
          background: $white-bg;
          content: "";
          display: block;
          text-align: center;
          position: absolute;
          left: 50%;
          bottom: 0;
          border-radius: 10px;
          transform: translate(-50%, 50%);
        }
      }
    }
  }
}
</style>

