<template>
    <div class="doctorAdvices">
      <div>
        <table class="table doctorTable">
              <tr @click="cancelAdviceSelect">
                <th width="50">开嘱医生</th>
                <th width="60">开始时间</th>
                <th width="60">医嘱内容</th>
                <th width="60">执行时间</th>
                <th width="50">执行护士</th>
              </tr>

              <tr @click="cancelAdviceSelect">
                <th width="50">开嘱医生</th>
                <th width="60">开始时间</th>
                <th width="60">医嘱内容</th>
                <th width="60">执行时间</th>
                <th width="50">执行护士</th>
              </tr>
              <!-- <template v-for="(group, group_index) in advice_groups">
                <tr
                  v-for="(advice, advice_index) in group.advices"
                  :key="'No' + advice.id + advice_index + group_index"
                  :class="{ 'row-class-active': current_group_index == group_index && current_advice_index < 0 }"
                >
                  <td
                    v-if="advice_index == 0"
                    :rowspan="group.advices.length"
                    @click="selectGroupAdviceAction(group_index, -1, null,group)"
                  >
                    <span v-if="advice.parent_id==0">{{getXuserName(advice.advice_doctor)}}</span>
                    <span v-else></span>
                  </td>

                  <td
                    v-if="advice_index == 0"
                    :rowspan="group.advices.length"
                    @click="selectGroupAdviceAction(group_index, -1, null,group)"
                  >
                    <span>{{uParseTime(advice.start_time, '{m}-{d} {h}:{i}')}}</span>
                  </td>

                  <td
                    :class="{ 'advice_content': advice.parent_id == 0, 'subadvice_content': advice.parent_id > 0, 'td-active':current_group_index == group_index  && advice.is_selected == 1 }"
                    @click="selectAdviceAction(group_index, advice_index, advice)"
                  >
                    <div class="txt">
                      <span>{{advice.advice_name }}</span>
                      <span v-if="advice.advice_desc">({{ advice.advice_desc }}{{advice.drug_spec_unit}})</span>
                      <span v-if="advice.prescribing_number">&nbsp;&nbsp;{{advice.prescribing_number}}{{advice.prescribing_number_unit}}</span>
                      <span v-if="advice.single_dose && template_id == 6">{{advice.single_dose}}{{advice.single_dose_unit}}</span>
                      <span v-if="advice.single_dose && template_id != 6">单次用量{{advice.single_dose}}{{advice.single_dose_unit}}</span>

                      <span v-if="advice.parent_id == 0">{{advice.delivery_way}}</span>
                      <span v-if="advice.parent_id == 0 && org_id!=10599">{{advice.execution_frequency}}</span>
                      <span
                        v-if="advice.parent_id == 0 && advice.remark.length > 0"
                      >({{advice.remark}})</span>
                    </div>
                  </td>

                  <td
                    :class="{'td-active':current_group_index == group_index  && advice.is_selected == 1}"
                    @click="selectAdviceAction(group_index,advice_index, advice)"
                  >{{uParseTime(advice.execution_time, '{m}-{d} {h}:{i}')}}
                  </td>

                  <td
                    :class="{'td-active':current_group_index == group_index  && advice.is_selected == 1}"
                    @click="selectAdviceAction(group_index,advice_index, advice)"

                  > {{getXuserName(advice.execution_staff)}}
                  </td>
                </tr>
              </template> -->
         </table>
      </div>
      <div>
            <div class="preserveBox">
                <div style="margin: 0 auto;">
                <span @click="modifySubdviceAction">修改子医嘱</span>
                <span @click="deleteSubAdviceAction">删除子医嘱</span>
                </div>
            </div>

            <div class="preserveBox">
              <div style="display: flex;justify-content: space-between;width: 100%;">
                  <span :class="{ forbid: is_has_create != true }" @click="showNew">新增</span>
                  <mu-date-input  type="dateTime" class="dateInput" label="执行" v-model="newExecTime" @focus="onFocusExecTime" @change="execTimeFunc" container="dialog" :clock-type="'24hr'" actions></mu-date-input>
                  <span :class="{ forbid: current_advice == null || current_advice.parent_id > 0 ||  currentAdvices.length != 1 || is_has_create != true || allForbidShow != true }" @click="openNewChild">添加子药</span>
                  <span  :class="{ forbid: current_group_index < 0 ||  currentAdvices.length != 1  || current_select_object== 2 || (is_has_modify != true && is_has_modify_other != true) || allForbidShow != true || modifyOrDelete != true }" @click="modifyAdviceAction">修改</span>
                  <span  :class="{ forbid: current_group_index < 0 || currentAdvices.length <= 0 || (is_has_del != true && is_has_del_other != true) || allForbidShow != true || modifyOrDelete != true , deleteColor : true }" @click="deleteAdviceAction">删除</span>
              </div>
            </div>
        </div>
    </div>
</template>

<script>
  export default {
     data(){
        return{
            org_id:0,
            advice_groups:[]
        }
     },
     created(){

     },
     methods:{
        cancelAdviceSelect(){

        },
        modifySubdviceAction(){

        },
        deleteSubAdviceAction(){

        },
        showNew(){

        },
        onFocusExecTime(){

        },
        newExecTime(){

        },
        currentAdvices(){

        }
     }
  }
</script>

<style lang="scss" scoped>
.doctorAdvices{
    font-size: .875rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    >:first-child{
        flex: 1;
        overflow-y: auto;
    }
    .adviceTitle{
        display: flex;
        justify-content: space-between;
    }
    .executionBox{
        font-size: .75rem;
        display: flex;
        color: #4bb467;
    }
    .preserveBox{
        height: 3.125rem;
        display: flex;
        justify-content: space-between;
        padding: 0 .625rem;
        align-items: center;
        font-size: 1rem;
        >div>span{
            height: 2.25rem;
            line-height: 2.25rem;
            padding: 0 .375rem;
            font-size: .875rem;
            border-radius: 5px;
            border: 1px solid #409eff;
            color: #409eff;
            display: inline-block;
        }
        // >div>span:last-child{
        //     color: #f56c6c;
        //     border: 1px solid #f56c6c;
        // }
        .forbid {
            color: #c6cdd2 !important;
            border: 1px solid #c6cdd2 !important;
        }
    }
    .actionSheet{
        top:initial;
        transform: translate3d(0, 0, 0);
        border-radius: 1.25rem 1.25rem 0 0;
    }
    .startTimePicker{
        z-index: 4010 !important;
    }
    .van-button--mini {
        height: 1.5rem;
        padding: 0 .25rem;
        font-size: .625rem;
    }
    .forbid{
        color: #c6cdd2;
    }
    .paddingLeft{
        padding-left: 1.6875rem;
    }
    .deleteColor{
        color: #f56c6c !important;
        border: 1px solid #f56c6c !important;
    }
    .doctorTable{
        font-size: .875rem !important;
        tr th{
            height: 2.25rem !important;
        }
        tr td{
            padding: .5rem 0;
        }
    }

}
.td-active {
  background: #badcff !important;
}
.row-class-active {
    td {
    background: #badcff;
    }
}
.table tr td .txt{
    padding: 0 10px;
    text-align: left;
}
.table tr .subadvice_content {
    padding-left: 20px !important;
}
@media only screen and (max-width: 415px){
    .table {
        width: 850px;
    }
}

</style>

<style lang="scss">
.doctorAdvices{
    .datetimePicker{
        z-index: 4010 !important;
        .picker-item{
            font-size: .875rem !important;
            height: 44px;
            line-height: 44px;

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

    }
    @media only screen and (min-width: 415px) and (max-width: 767px){
        .table {
            width: 700px;
        }
    }
    @media only screen and (max-width: 415px){
        .table[data-v-365ae4b7] {
            width: 500px;
        }
    }
    .dateInput .mu-text-field-input{
        height: 2.25rem;
        line-height: 2.25rem;
        padding: 0 0.375rem;
        font-size: .875rem;
        border-radius: 5px;
        border: 1px solid #409eff;
        color: #fff;
        display: inline-block;
        width: 2.625rem;
    }
    .dateInput2 .mu-text-field-input{
        height: 2.25rem;
        line-height: 2.25rem;
        padding: 0 0.375rem;
        font-size: .875rem;
        border-radius: 5px;
        border: 1px solid #409eff;
        color: #fff;
        display: inline-block;
        width: 4.375rem;
    }
    .mu-input{
        width: auto;
        margin-bottom: 0;
    }
    .mu-input.has-label .mu-input-label{
        top: 50%;
        transform: translateY(-50%);
        text-align: center;
        font-size: .875rem;
        color: #409eff;
        text-align: center;
        width: 100%;
    }
    .mu-input.has-label{
        padding: 0;
        min-height:auto;
    }

}
</style>