<template>
  <div class="patient-container">
    <!-- <fast-patients-sidebar
      :id="patientID"
      v-on:patient="patientInfoClick()"
      v-on:inspection="inspectionClick()"
    ></fast-patients-sidebar> -->
    <!-- <fast-upload-detail v-if="isShow == 1"  :id="patientID"  :is-edit='true' :class='panelClass'></fast-upload-detail> -->
    <el-container>
      <div style="width:170px">
        <el-form :inline="true" :model="listQuery">
          <el-form-item label style="margin-bottom:0;">
            <el-input v-model.trim="searchVal" placeholder="姓名/透析号" style="width:70%"></el-input>
            <el-button type="primary" style="padding: 10px 6px;" @click="onSearch">搜索</el-button>
          </el-form-item>
        </el-form>
        <div style="width:170px">
          <div class="tableTitle">患者列表</div>
          <el-table :data="tableData" border style="width: 100%;" height="500">
            <el-table-column prop="date" label="日期" width="80"></el-table-column>
            <el-table-column prop="name" label="姓名" width="90"></el-table-column>
          </el-table>
        </div>
      </div>
      
      <div style="margin-left:20px;flex:1;" >
        <div class="cell clearfix">
          <div class="time">
            <ul class="newUl">
              <li
                :class="item.state == wayType ? 'active' : ''"
                @click="chooseWay(item.state)"
                v-for="item in way"
                :key="item.value"
              >{{ item.label }}</li>
            </ul>
          </div>
        </div>
        <one ref="one" v-if="wayType == 0" :patientID="patientID" :is-edit='true' style="margin-top:28px;" @></one>
        <two ref="two" v-if="wayType == 1" :id="patientID" :is-edit="true" style="margin-top:28px;"></two>
      </div>
    </el-container>
  </div>
</template>

<script>
  import FastUploadDetail from './FastUploadDetail'
  import { fetchAllList } from '@/api/patient'
  import FastPatientsSidebar from './FastPatientsSidebar'
  import FastUploadInspectitonDetail from './FastUploadInspectitonDetail'
  import One from './One'
  import Two from './Two'

  export default {
    name: 'FastPatientsDetail',
    components: {
      FastUploadInspectitonDetail,
      FastPatientsSidebar,
      FastUploadDetail,
      One,
      Two
    },
    data() {
      return {
        patientID: 0,
        panelClass: 'patient-app-container',
        patientInfo: {
          id: 0
        },
        isShow: 1,
        tableData: [
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          },
          {
              date: "2016",
              name: "王小虎"
          }
        ],
        searchVal:'',
        way: [
            { value: 0, label: "基本信息", state: 0 },
            { value: 1, label: "检验检查", state: 1 },
        ],
        wayType: 0,
      }
    },
    created() {
      const id = this.$route.query && this.$route.query.id
      this.patientID = parseInt(id)

      if (isNaN(this.patientID) || this.patientID <= 0) {
        this.getList(1)
      } else {
        this.getList(2)
      }
    },
    methods: {
      chooseWay(way) {
        this.wayType = way;
      },
      getList(type) {
        fetchAllList().then(response => {
          if (response.data.state == 1) {
            this.patientsList = response.data.data.patients
            if (type == 1) {
              this.patientID = this.patientsList[0].id

            } else {
              this.patientID = this.$route.query.id
            }
            this.$nextTick(() => {
              this.$refs.one.fetchPatient(this.patientID)

            })
          }
        })
      },
      patientInfoClick: function() {
        this.isShow = 1
        this.$nextTick(() => {
          this.$refs.one.fetchPatient(this.patientID)

        })

      },
      inspectionClick: function() {
        this.isShow = 2
        this.$nextTick(() => {
          var start_time = new Date(this.getQuarterStartDate().replace(/-/g, '/')).getTime() / 1000
          var end_time = new Date(this.getQuarterEndDate().replace(/-/g, '/')).getTime() / 1000
          this.$refs.two.GetInitInspections()
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,1,"1")
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,2,"2-4-20")
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,3,"21")
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,4,"2-4-15-24-25")
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,5,"15-23")
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,6,"14")
          this.$refs.two.GetUploadInspections(this.patientID,start_time,end_time,7,"22")
        })

      }, getQuarterStartDate: function() {
        var now = new Date() //当前日期
        var nowYear = now.getFullYear() //当前年
        nowYear += (nowYear < 2000) ? 1900 : 0

        var quarterStartDate = new Date(nowYear, this.getQuarterStartMonth(), 1)
        return this.formatDate(quarterStartDate)
      }, getQuarterEndDate: function() {
        var now = new Date() //当前日期
        var nowYear = now.getFullYear() //当前年
        nowYear += (nowYear < 2000) ? 1900 : 0
        var quarterEndMonth = this.getQuarterStartMonth() + 2
        var quarterStartDate = new Date(nowYear, quarterEndMonth, this.getMonthDays(quarterEndMonth))
        return this.formatDate(quarterStartDate)
      }, formatDate: function(date) {
        var myyear = date.getFullYear()
        var mymonth = date.getMonth() + 1
        var myweekday = date.getDate()

        if (mymonth < 10) {
          mymonth = '0' + mymonth
        }
        if (myweekday < 10) {
          myweekday = '0' + myweekday
        }
        return (myyear + '-' + mymonth + '-' + myweekday)
      }, getQuarterStartMonth: function() {
        var now = new Date() //当前日期
        var nowMonth = now.getMonth() //当前月

        var quarterStartMonth = 0
        if (nowMonth < 3) {
          quarterStartMonth = 0
        }
        if (2 < nowMonth && nowMonth < 6) {
          quarterStartMonth = 3
        }
        if (5 < nowMonth && nowMonth < 9) {
          quarterStartMonth = 6
        }
        if (nowMonth > 8) {
          quarterStartMonth = 9
        }
        return quarterStartMonth
      },  //获得某月的天数
      getMonthDays(myMonth) {
        var now = new Date() //当前日期
        var nowYear = now.getYear() //当前年
        nowYear += (nowYear < 2000) ? 1900 : 0
        var monthStartDate = new Date(nowYear, myMonth, 1)
        var monthEndDate = new Date(nowYear, myMonth + 1, 1)
        var days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24)
        return days
      }

    }
  }
</script>

<style lang="scss" scoped>
.tableTitle {
  font-size: 16px;
  color: #000;
  font-weight: bold;
  line-height: 40px;
}
.newUl{
  li{
    padding:10px 20px !important;
  }
}
</style>
