<template>
  <div class="main-contain new-main-contain">
    <div class="position">
      <bread-crumb :crumbs='crumbs'></bread-crumb>
    </div>
    <div class="app-container" style="display:flex;flex: 1;padding: 20px 20px 0px 20px;">
      <div class="mainLeft">
        <div class="mainCell" style="justify-content: space-between;">
          <p>未就诊：<span>{{cal_one}}</span>人</p>
          <p>已就诊：<span>{{cal_two}}</span>人</p>
        </div>
        <div class="mainCell">
          <el-radio-group v-model="radio" @change="change">
            <el-radio :label="1">未就诊</el-radio>
            <el-radio :label="2">已就诊</el-radio>
            <el-radio :label="0">全部</el-radio>
          </el-radio-group>
        </div>
        <div class="mainCell" style="margin-bottom:10px;">
          <el-input size="small" placeholder="请输入姓名或就诊号" @input="searchAction" @keyup.enter.native='searchAction' v-model="search_input" class="filter-item"/>
          <el-button size="small" style="margin-left:10px;" class="filter-item" type="primary" @click="searchAction">
            搜索
          </el-button>
        </div>
        <div>
          <el-table :data="patientTableData" :height="tableHeight" @row-click='choosePatient' border style="width: 100%;"
                    :row-style="{ color: '#303133' }"
                    :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}"
                    highlight-current-row
                    ref="tab"
          >
            <el-table-column prop="name" label="姓名" width='89'>
              <template slot-scope="scope">{{scope.row.patients?scope.row.patients.name:''}}</template>
            </el-table-column>
            <el-table-column prop="name" label="就诊号" width="110">
              <template slot-scope="scope">{{ scope.row.his_patient ?scope.row.his_patient.number:''}}</template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <div class="mainRight">
        <div class="mainHeader">
          <el-radio-group class="titleBox" v-model="titleType" @change="changeTab">
            <el-radio-button label="电子处方"></el-radio-button>
            <el-radio-button label="电子病历"></el-radio-button>
          </el-radio-group>
          <div class="mainCell fixedCell" style="float:right" v-if="titleType == '电子处方'">
            <el-button size="small" ref="button_one"   @click="open(1)" type="primary" style="margin-left:10px;">保存</el-button>
            <el-popover
              placement="bottom"
              width="200"
              trigger="click">
              <el-button size="small" ref="button_two"   @click="open(2)" type="primary">处方单</el-button>
              <el-button size="small" ref="button_six"   @click="open(6)" type="primary">治疗单</el-button>
              <el-button slot="reference" style="margin:0 10px;" type="primary" size="small">打印</el-button>
            </el-popover>
            <el-button size="small" ref="button_three" @click="open(4)" type="primary">选择模板</el-button>
            <el-button size="small" ref="button_four"  @click="open(5)" type="primary">存模板</el-button>
          </div>
          <div class="mainCell fixedCell" style="float:right" v-if="titleType == '电子病历'">
            <el-button size="small" @click="opentwo(1)" type="primary" style="margin-left:10px;">保存</el-button>
            <el-button size="small" @click="opentwo(2)" type="primary">打印</el-button>
            <el-button size="small" @click="opentwo(3)" type="primary">病历调用</el-button>
            <el-button size="small" @click="opentwo(4)" type="primary">存模板</el-button>
          </div>
        </div>
        <!--<desk-prescription ref="prescriptions"   :prescriptions="prescriptions" :patientInfo="patientInfo" :hisPatientInfo="hisPatientInfo"-->
        <!--v-if="titleType == '处方'" style="flex:1;"></desk-prescription>-->
        <desk-prescription  :diagnoses="diagnoses" :other_sick="other_sick" :record_date="record_date"
                           ref="prescriptions" :prescriptions="prescriptions" :patientInfo="patientInfo"
                           :hisPatientInfo="hisPatientInfo"
                           v-show="titleType == '电子处方'" style="flex:1;"></desk-prescription>
        <desk-record :record_date="record_date" :case_history="case_history" :patientInfo="patientInfo"
                     :hisPatientInfo="hisPatientInfo"   v-show="titleType == '电子病历'" :detalid="detalid" ref="child"></desk-record>

         <medicalRecord ref='medicalRecord' @func="getMsgFormSon" ></medicalRecord>
         <saveRecordTemplate ref='saveRecordTemplate'></saveRecordTemplate>
      </div>

    </div>
  </div>
</template>

<script>
  import BreadCrumb from '@/xt_pages/components/bread-crumb'
  import deskPrescription from './components/deskPrescription'
  import deskRecord from './components/deskRecord'
  import { getPatientInfo, getSchedulePatientList,createCaseHistory } from '@/api/his/his'
  import { getDictionaryDataConfig } from '@/utils/data'
  import medicalRecord from './components/medicalRecord'
  import saveRecordTemplate from './components/saveRecordTemplate'
  import { uParseTime } from '@/utils/tools'
  export default {
    components: {
      BreadCrumb,
      deskPrescription,
      deskRecord,
      medicalRecord,
      saveRecordTemplate
    },
    data() {
      return {
        tableHeight:'',
        fullHeight: document.documentElement.clientHeight,
        prescriptions: [
          {
            name: '处方1',
            advice: [],
            project: []
          }
        ],
        search_input: '',
        cal_one: 0,
        cal_two: 0,
        radio: 1,
        record_date: '',
        crumbs: [
          { path: false, name: '门诊医生站' },
          { path: false, name: '医生工作台' }
        ],
        titleType: '电子处方',
        patientTableData: [{}],
        patientTableDataTwo:[{}],
        patientInfo: {},
        hisPatientInfo: {},
        case_history: {},
        patient_id: 0,
        diagnoses: [],
        other_sick: [],
        info:{},
        templatedetail:{},
        detalid:0,
      }
    },
    methods: {
      getDictionaryDataConfig(module, filed_name) {
        console.log(getDictionaryDataConfig(module, filed_name))
        return getDictionaryDataConfig(module, filed_name)

      },
      changeTab(val) {

      },
      searchAction() {
        if(this.search_input.length == 0){
          this.patientTableData = this.patientTableDataTwo
        }else{
          let arr = []
          for (let i = 0; i < this.patientTableData.length; i++){
            if(this.patientTableData[i].patients.name.indexOf(this.search_input) != -1 || this.patientTableData[i].his_patient.number.indexOf(this.search_input) != -1){
              arr = arr.concat(this.patientTableData[i])
            }
          }
            this.patientTableData = arr

        }


      },
      change(val) {
        this.getList()

      },
      getList() {
        let params = {
          'record_date': this.record_date,
          'type': this.radio
        }
        getSchedulePatientList(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {
            this.patientTableData = response.data.data.list
            this.patientTableDataTwo = response.data.data.list

            console.log('222', this.patientTableData)
            // this.$refs.tab.setCurrentRow(this.patientTableData[0])
            let cal_one = 0
            let cal_two = 0
            for (let i = 0; i < response.data.data.list.length; i++) {
              if (response.data.data.list[i].prescription == null || response.data.data.list[i].prescription.length == 0) {
                cal_one = cal_one + 1
              }
              if (response.data.data.list[i].prescription != null && response.data.data.list[i].prescription.length > 0) {
                cal_two = cal_two + 1
              }
            }
            this.$refs.tab.setCurrentRow(this.patientTableData[0])
            console.log(this.patientTableData[0])
            this.choosePatient(this.patientTableData[0])
            this.cal_one = cal_one
            this.cal_two = cal_two
          }
        })
      },
      choosePatient(val) {
        let params = {
          'record_date': this.record_date,
          'patient_id': val.patients.id
        }
        getPatientInfo(params).then(response => {
          if (response.data.state == 0) {
            this.$message.error(response.data.msg)
            return false
          } else {

            this.prescriptions = []
            this.patientInfo = response.data.data.xt_info
            this.hisPatientInfo = response.data.data.his_info
            this.case_history = response.data.data.case_history

            this.info = response.data.data.info



            this.patientInfo.birth = uParseTime(this.patientInfo.birthday, '{y}-{m}-{d}')
            if (this.case_history.temperature <= 0) {
              this.case_history.temperature = ''
            }
            if (this.case_history.blood_sugar <= 0) {
              this.case_history.blood_sugar = ''
            }
            if (this.case_history.pulse <= 0) {
              this.case_history.pulse = ''
            }
            if (this.case_history.sbp <= 0) {
              this.case_history.sbp = ''
            }
            if (this.case_history.dbp <= 0) {
              this.case_history.dbp = ''
            }
            if (this.case_history.height <= 0) {
              this.case_history.height = ''
            }
            if (this.case_history.blood_fat <= 0) {
              this.case_history.blood_fat = ''
            }
            if (this.case_history.sick_type <= 0) {
              this.case_history.sick_type = ''
            }
            this.case_history.sick_date = uParseTime(this.case_history.sick_date, '{y}-{m}-{d}')
            if (this.case_history.is_infect == 1) {
              this.case_history.is_infect = true
            } else {
              this.case_history.is_infect = false
            }
            if (response.data.data.prescription.length > 0) {
              for (let i = 0; i < response.data.data.prescription.length; i++) {
                var prescription = response.data.data.prescription[i]
                let tempAdvice = []
                let tempProject = []

                for (let b = 0; b < prescription.advices.length; b++) {
                  let obj = {
                    advice_id: prescription.advices[b].id,
                    drug_name: prescription.advices[b].advice_name,
                    single_dose: prescription.advices[b].single_dose,
                    delivery_way: prescription.advices[b].delivery_way,
                    execution_frequency: prescription.advices[b].execution_frequency,
                    retail_price: prescription.advices[b].price.toString(),
                    remark: prescription.advices[b].remark,
                    prescribing_number:prescription.advices[b].prescribing_number.toString(),
                    single_dose_unit:prescription.advices[b].single_dose_unit,
                    prescribing_number_unit:prescription.advices[b].prescribing_number_unit,
                    min_unit:prescription.advices[b].single_dose_unit,
                    medical_insurance_number:prescription.advices[b].med_list_codg,
                    id:prescription.advices[b].drug_id
                  }
                  tempAdvice.push(obj)
                }


                for (let b = 0; b < prescription.project.length; b++) {
                  console.log(prescription.project[b])
                  console.log(prescription.project[b].project)
                  let obj = {
                    id: prescription.project[b].id,
                    project_id: prescription.project[b].project.id,
                    project_name: prescription.project[b].project.project_name,
                    statistical_classification: prescription.project[b].project.statistical_classification,
                    single_dose: prescription.project[b].single_dose,
                    delivery_way: prescription.project[b].delivery_way,
                    execution_frequency: prescription.project[b].execution_frequency,
                    number_days: prescription.project[b].day,
                    total:prescription.project[b].count.toString(),
                    price:prescription.project[b].price,
                    remark:prescription.project[b].remark,
                    medical_code:prescription.project[b].project.medical_code,
                  }
                  tempProject.push(obj)
                }



                let index = i + 1
                let obj = {
                  id: prescription.id,
                  name: '处方' + index,
                  advices: tempAdvice,
                  project: tempProject,
                  order_status:prescription.order_status
                }
                this.prescriptions.push(obj)
              }
            } else {
              let obj = {
                id:0,
                name: '处方' + 1,
                advices: [],
                project: [],
                orderStatus:0,
              }
              this.prescriptions.push(obj)
            }
            console.log(this.prescriptions)

            this.$refs.prescriptions.setData(this.prescriptions,this.info)
          }
        })
      },
      open(index) {
        if (index == 1) {
          this.$refs.prescriptions.open(1)
        } else if (index == 2) {
          this.$router.push("/outpatientDoctorStation/print?record="+this.record_date)
        } else if (index == 3) {
          this.$refs.prescriptions.open(3)
        } else if (index == 4) {
          this.$refs.prescriptions.open(4)
        }else if(index == 6){
          this.$router.push("/outpatientDoctorStation/treatPrint?record="+this.record_date)
          
        }
        
      },

      opentwo(index) {
        console.log("index",index)
        if (index == 1) {
          if(this.patientInfo.id == undefined){
            this.$message.error("请先选择病人")
            return
          }
          this.$refs.child.createCaseHistory()
        } else if (index == 2) {
          this.$router.push('/outpatientDoctorStation/recordPrint?record='+this.record_date)
        } else if (index == 3) {
          this.$refs.medicalRecord.show()
        } else if (index == 4) {
          this.$refs.saveRecordTemplate.show(this.case_history)
        }

      },
      // changePatient(val){
      //   console.log("患者val",val)
      //   this.hisPatientInfo = val.hisPatientInfo
      //   console.log("333333",this.hisPatientInfo)
      // }

      getMsgFormSon(id){
        console.log("id----------",id)
        this.detalid = id
      },
      //  getTemplateDetail(id){
      //     getTemplateDetail(id).then(response=>{
      //         if(response.data.state == 1){
      //           var templatedetail =  response.data.data.templateDetail
      //           console.log("templatedetail",templatedetail)
      //           templatedetail =


      //         }
      //     })
      //   },
    },
    created() {
      var nowDate = new Date()
      var nowYear = nowDate.getFullYear()
      var nowMonth = nowDate.getMonth() + 1
      var nowDay = nowDate.getDate()
      this.record_date =
        nowYear +
        '-' +
        (nowMonth < 10 ? '0' + nowMonth : nowMonth) +
        '-' +
        (nowDay < 10 ? '0' + nowDay : nowDay)
      this.getList()

      this.diagnoses = this.getDictionaryDataConfig('system', 'diagnose')
      this.other_sick = this.getDictionaryDataConfig('system', 'other_sick_history')

      console.log('1222232434234',document.documentElement.clientHeight)
      let tableHeight = document.body.clientHeight - 263
      this.tableHeight = tableHeight

    },
    mounted(){
      const that = this
      window.onresize = () => {
        return (() => {
          window.fullHeight = document.documentElement.clientHeight
          that.fullHeight = window.fullHeight
        })()
      }
    },
    watch: {
      fullHeight (val) {
        if(!this.timer) {
          this.fullHeight = val
          let tableHeight = val - 263
          this.tableHeight = tableHeight
          this.timer = true
          let that = this
          setTimeout(function (){
            that.timer = false
          },400)
        }
      }
    }
  }
</script>

<style lang="scss" scoped>
  .new-main-contain {
    height: 100%;
    display: flex;
    flex-direction: column;
  }

  .app-container {
    height: 100%;
  }

  .mainCell {
    height: 36px;
    display: flex;
    align-items: center;
  }

  .mainLeft {
    width: 200px;
    height: 100%;
    display: flex;
    flex-direction: column;

  .el-radio {
    margin-right: 5px;
  }

  }
  .mainRight {
    margin-left: 20px;
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;

  .cellSpan {
    min-width: 80px;
    display: inline-block;
    margin-right: 10px;
  }

  }
  .mainCenter {
    display: flex;
    flex: 1;
  }

  .centerLeft {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;

  .el-form-item {
    width: 32%;
    margin-right: 1%;
    float: left;
  }

  .el-form-item__label {
    text-align: left;
  }

  }
  .backColor {
    background: #f6f8f9;
    height: 5px;
    margin-bottom: 5px;
  }

  .tabsBox {
    position: relative;
    height: 76%;
    overflow-y: auto;
    margin-bottom: 60px;

  .el-tabs__item {
    padding: 0 10px;
  }

  }
  .preTabs {
    height: 100%;
  }

  .costBox {
    width: 100%;
    height: 60px;
    background: #fff;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
  }

  .addTab {
    position: absolute;
    right: 0;
    top: 14px;
    z-index: 20;
  }

  .centerRight {
    width: 300px;
    margin-left: 5px;
    display: flex;
    flex-direction: column;
    position: relative;
  }

  .rightTab {
    height: 40px;
    width: 100%;
    border: 1px solid #d2d2d2;
    box-sizing: border-box;

  p {
    width: 50%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #eee;
    float: left;
  }

  > p:last-child {
    border-left: 1px solid #d2d2d2;
    float: right;
  }

  .activeP {
    background: #409EFF;
    color: #fff;
  }

  }
  .comfirmBox {
    width: 100%;
    height: 60px;
    background: #fff;
    position: absolute;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .mainHeader{
    width:100%;
    background: #fff;
    position: fixed;
    z-index: 100;
    height: 36px;
  }
  .titleBox{
    position: fixed;
    z-index: 99;
    background: #fff;
  }
  .fixedCell{
    position: fixed;
    z-index: 99;
    right: 30px;
    background: #fff;
  }
</style>

<style lang="scss">
  .centerLeft {

  .el-form-item__label {
    text-align: left;
  }

  }
  .tabsBox {

  .el-tabs__item {
    padding: 0 10px;
  }

  .el-tabs--bottom .el-tabs--left > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--bottom .el-tabs--right > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--bottom.el-tabs--border-card > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--bottom.el-tabs--card > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--top .el-tabs--left > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--top .el-tabs--right > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--top.el-tabs--border-card > .el-tabs__header .el-tabs__item:nth-child(2), .el-tabs--top.el-tabs--card > .el-tabs__header .el-tabs__item:nth-child(2) {
    padding: 0 10px;
  }

  .el-tabs--bottom .el-tabs--left > .el-tabs__header .el-tabs__item:last-child, .el-tabs--bottom .el-tabs--right > .el-tabs__header .el-tabs__item:last-child, .el-tabs--bottom.el-tabs--border-card > .el-tabs__header .el-tabs__item:last-child, .el-tabs--bottom.el-tabs--card > .el-tabs__header .el-tabs__item:last-child, .el-tabs--top .el-tabs--left > .el-tabs__header .el-tabs__item:last-child, .el-tabs--top .el-tabs--right > .el-tabs__header .el-tabs__item:last-child, .el-tabs--top.el-tabs--border-card > .el-tabs__header .el-tabs__item:last-child, .el-tabs--top.el-tabs--card > .el-tabs__header .el-tabs__item:last-child {
    padding: 0 10px;
  }

  .el-tabs--card > .el-tabs__header .el-tabs__item.is-active.is-closable {
    padding: 0 10px;
  }

  }
  .centerRight {

  .el-tabs__nav-scroll {
    display: flex;
  }

  .el-tabs__nav {
    margin: 0 auto;
  }

  .el-table th .cell, .el-table td .cell {
    padding: 0 2px;
  }

  }
  .preTabs {

  .el-tabs__content {

  }

  }
  .rightTabs {
    height: 100%;


  .el-tabs__content {

  }

  }
</style>
