<template>
    <div class="newDoctorAdvice">
            <van-sticky>
                <div class="newDoctorAdviceTitle">
                    <span @click="backAction" style="color:#323233;font-size: .875rem;"><i class="iconfont icon-zuojiantou jiantou" style="color:#323233;"></i>返回</span>
                    <span style="font-weight:bold;">医嘱模板</span>
                    <span @click="submitAction" style="color:#323233;font-size: .875rem;">保存</span>
                </div>
                <div class="adviceTitle">
                    <div>开始时间：<span class="timeSpan" @click="selectStartTimeAction">{{ start_time_str }}</span></div>
                    <div>开嘱医生: {{ $store.getters.user.user.user_name }}</div>
                </div>
            </van-sticky>
            <div>
                <div style="flex:1;display:flex;">
                    <van-sidebar class="adviceSidebar" v-model="activeKey" >
                        <van-sidebar-item v-for="(item,index) in items" :key="index" :dot="dot[index].dot.indexOf(1) > -1" :title="item.name" />
                    </van-sidebar>
                    <van-checkbox-group v-model="adviceResult" class="adviceCheckBox">
                        <div v-for="(item,index) in items" :key="index" v-if='index == activeKey'>
                            <div v-for="(advice,i) in item.DoctorAdviceTemplate" :key="i" class="adviceOne">
                                <van-checkbox :name="advice.id" v-if="advice.parent_id == 0">
                                    <span>{{ advice.advice_name }}</span>
                                    <span>{{ advice.advice_desc }}{{ advice.drug_spec_unit }}</span>
                                    <span v-if="advice.prescribing_number">
                                    {{ advice.prescribing_number }}
                                    {{ advice.prescribing_number_unit }}
                                    </span>
                                    <span v-if="advice.single_dose"
                                    >单次用量{{ advice.single_dose
                                    }}{{ advice.single_dose_unit }}</span
                                    >
                                    <span>{{ advice.delivery_way }}</span>
                                    <span>{{ advice.execution_frequency }}</span>
                                </van-checkbox>
                                <div class="subAdvice" v-else>
                                    <span>{{ advice.advice_name }}</span>
                                    <span>{{ advice.advice_desc }}{{ advice.drug_spec_unit }}</span>
                                    <span v-if="advice.prescribing_number">
                                        {{ advice.prescribing_number }}
                                        {{ advice.prescribing_number_unit }}
                                    </span>
                                    <span v-if="advice.single_dose">
                                        单次用量{{ advice.single_dose }}{{ advice.single_dose_unit }}
                                    </span>
                                </div>
                            </div>
                        </div>
                    </van-checkbox-group>
                </div>
                <mt-datetime-picker
                ref="start_time_picker"
                type="datetime"
                @confirm="didSelectStartTime"
                v-model="start_time"
                class="startTimePicker datetimePicker"
                ></mt-datetime-picker>
            </div>

    </div>
</template>

<script>
import {parseTime} from '@/utils'
import {Toast} from 'vant'
export default {
  name: 'SelectAdviceTemplate',
  props: {
    templates: {
      type: Array,
      default: () => {
        return []
      }
    },
    predialysis: {
      type: Object
    },
    schedulePatient: {
      type: Object
    }
  },
  data () {
    return {
      fold_template_ids: [],
      selecting_advice_ids: [],
      activeKey: 0,
      items: [],
      adviceResult: [],
      start_time: new Date(),
      start_time_str: '',
      record_date_str: ''

    }
  },
  computed: {
    dot: function () {
      this.items.map(item => {
        item.dot = []
        item.DoctorAdviceTemplate.map(it => {
          if (this.adviceResult.indexOf(it.id) > -1) {
            item.dot.push(1)
          } else {
            item.dot.push(2)
          }
        })
      })
      return this.items
    }
  },
  created () {
    this.items = this.templates
    this.items.sort(this.compare('sort'))
    console.log("模版民初=====================",this.items)

    this.record_date_str = parseTime(new Date(), '{y}-{m}-{d}')
    if (this.$store.getters.user.org.id == 10101) {
      if (this.predialysis.created_time > 0) {
        this.start_time_str = parseTime(new Date(this.predialysis.created_time * 1000), '{y}-{m}-{d} {h}:{i}') + ':00'
        this.start_time = new Date(this.predialysis.created_time * 1000)
      } else {
        this.start_time_str = parseTime(this.start_time, '{y}-{m}-{d} {h}:{i}') + ':00'
      }
    } else if (this.$store.getters.user.org.id == 9671 || this.$store.getters.user.org.id == 9675 || this.$store.getters.user.org.id == 10340 ) {
      var date = new Date()
      var year = date.getFullYear() // 获取完整的年份(4位)
      var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 // 获取当前月份(0-11,0代表1月)
      var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() // 获取当前日(1-31)

      if (this.schedulePatient.schedule_type == 1) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '07:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '07:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 2) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '9:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '9:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 3) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '18:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '18:00' + ':00'
      }

    }else if (this.$store.getters.user.org.id == 9829) {
      var date = new Date()
      var year = date.getFullYear() // 获取完整的年份(4位)
      var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 // 获取当前月份(0-11,0代表1月)
      var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() // 获取当前日(1-31)

      if (this.schedulePatient.schedule_type == 1) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '06:30' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '06:30' + ':00'
      } else if (this.schedulePatient.schedule_type == 2) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '11:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '11:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 3) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '15:30' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '15:30' + ':00'
      }
      
    }else if (this.$store.getters.user.org.id == 10383) {
      var date = new Date()
      var year = date.getFullYear() // 获取完整的年份(4位)
      var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 // 获取当前月份(0-11,0代表1月)
      var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() // 获取当前日(1-31)

      if (this.schedulePatient.schedule_type == 1) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '07:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '07:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 2) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '11:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '11:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 3) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '15:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '15:00' + ':00'
      }
      
    }else if (this.$store.getters.user.org.id == 10580) {
      var date = new Date()
      var year = date.getFullYear() // 获取完整的年份(4位)
      var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 // 获取当前月份(0-11,0代表1月)
      var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() // 获取当前日(1-31)

      if (this.schedulePatient.schedule_type == 1) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '07:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '07:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 2) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '10:30' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '10:30' + ':00'
      } else if (this.schedulePatient.schedule_type == 3) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '17:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '17:00' + ':00'
      }
      
    }else if (this.$store.getters.user.org.id == 10234) {
      var date = new Date()
      var year = date.getFullYear() // 获取完整的年份(4位)
      var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1).toString() : date.getMonth() + 1 // 获取当前月份(0-11,0代表1月)
      var day = date.getDate() < 10 ? '0' + date.getDate().toString() : date.getDate() // 获取当前日(1-31)

      if (this.schedulePatient.schedule_type == 1) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '07:30' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '07:30' + ':00'
      } else if (this.schedulePatient.schedule_type == 2) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '12:00' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '12:00' + ':00'
      } else if (this.schedulePatient.schedule_type == 3) {
        this.start_time_str = year + '-' + month + '-' + day + ' ' + '15:30' + ':00'
        this.start_time = year + '-' + month + '-' + day + ' ' + '15:30' + ':00'
      }
      
    }else if (this.$store.getters.user.org.id == 10587) {
      this.start_time_str = parseTime(this.start_time, '{y}-{m}-{d} {h}:{i}') + ':00'
    } else {
      this.start_time_str = parseTime(this.start_time, '{y}-{m}-{d} {h}:{i}') + ':00'
    }
  },
  methods: {
    compare (property) {
        return function (a, b) {
          var value1 = a[property]
          var value2 = b[property]
          return value1-value2
        }
    },
    backAction: function () {
      this.$emit('back')
    },
    submitAction: function () {
      if (this.adviceResult.length == 0) {
        Toast.fail('请选择医嘱')
        return
      }
      var advices = []
      this.items.map(item => {
        item.DoctorAdviceTemplate.map(it => {
          if (this.adviceResult.indexOf(it.id) > -1 || this.adviceResult.indexOf(it.parent_id) > -1) {
            advices.push(it)
          }
        })
      })
      this.$emit('finish', advices, this.start_time_str)
      this.adviceResult = []
    },

    didSelectStartTime: function (time) {
      this.start_time_str = parseTime(time, '{y}-{m}-{d} {h}:{i}') + ':00'
    },
    selectStartTimeAction: function () {
      this.$refs.start_time_picker.open()
    }
  }
}
</script>

<style lang="scss" scoped>
.newDoctorAdvice{
    height: 100%;
    display: flex;
    flex-direction: column;
    >:last-child{
        flex: 1;
        overflow-y: auto;
        display: flex;
    }
    .inputCell{
        padding: 0 .875rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: .625rem;
        >p{
            width: 5rem;
            display: inline-table;
        }
        >div{
            flex: 1;
        }
        .inline-input{
            width: 70%;
        }
        .inline-input1{
            width: 70%;
            border: 1px solid #e5e5e5;
            border-radius: .25rem;
            padding: 0 15px;
        }
    }
    .commonInput{
        height: 2.5rem;
        border: 1px solid #DCDFE6;
        border-radius: .25rem;
        width: 25%;
        font-size: 1rem;
        padding: 0 .3125rem;
    }
}
.newDoctorAdviceTitle{
    height: 3.125rem;
    display: flex;
    justify-content: space-between;
    padding: 0 .875rem;
    align-items: center;
    font-size: 1rem;
    background: #fff;
}
.adviceTitle{
    display: flex;
    padding: .5rem .875rem;
    font-size: .875rem;
    justify-content: space-between;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    >div:first-child{
        display: flex;
        align-items: center;
    }
    >div:last-child{
        display: flex;
        align-items: center;
    }
}
.timeSpan{
    padding: .3125rem;
    border: 1px solid #e5e5e5;
    border-radius: .25rem;
}
.listBoxPopup{
    width: 60%;
    height: 50%;
    overflow-y: auto;
}
.listBox{
    >div{
        padding: 1rem .625rem;
        border-bottom: 1px solid #e5e5e5;
        text-align: center;
    }
}
.adviceSidebar{
    width: 6.25rem;
}
.adviceCheckBox{
    flex: 1;
    .van-checkbox{
        padding: .625rem;
        font-size: .875rem;
    }
    .adviceOne{
        border-bottom: 1px solid #e5e5e5;
    }
    .subAdvice{
        padding:  .3125rem .625rem .3125rem 2.5rem;
        font-size: .75rem;
    }
}
</style>

<style lang="scss">
.newDoctorAdvice{
    .v-modal{
        z-index: 4009 !important;
    }
    .startTimePicker{
        z-index: 4100 !important;
    }
    .datetimePicker{
        .picker-item{
            font-size: .875rem !important;
            height: 44px;
            line-height: 44px;

        }
        .mint-datetime-action{
            font-size: .9375rem !important;
        }

    }
}
.el-autocomplete-suggestion{
    z-index: 4011 !important;
}
.inputCell{
    .el-input{
        font-size: 1rem !important;
    }
}
.van-sidebar-item--select::before{
    background-color: #409eff;
}
.van-info--dot{
    background-color: #409eff;
}
.van-sidebar-item--select:before {
    position: absolute;
    top: 50%;
    left: 0;
    width: .25rem;
    height: 1.875rem!important;
    background-color: #1989fa;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    content: "";
}
.van-sidebar-item--select, .van-sidebar-item--select:active{
    color: #409eff;
    background: #f7f8fa;
}
.el-form-item__label, .el-radio, .van-checkbox__label{
    color: #323233 !important;
}

</style>
