<template>
  <div class="page_doctorAdvice">
    <!-- <div class="box">
      <div class="info">
        <div class="photo">
          <img :src="patientForm.avatar" alt/>
        </div>
        <div class="infoRight">
          <div class="rightTop">
            <span class="name">{{patientForm.name}}</span>
            <span>{{patientForm.sex}}</span>&ensp;|
            <span>{{patientForm.age}}岁</span>
          </div>
          <div class="rightBottom">
            <p class="num">
              [透析号：
              <span>{{patientForm.dialysis_no}}</span>]
            </p>
            <div class="imgList">
              <img src="../../assets/images/b1.png" alt v-show="yiShow" />
              <img src="../../assets/images/b2.png" alt v-show="meiShow" />
              <img src="../../assets/images/b3.png" alt v-show="bingShow" />
              <img src="../../assets/images/b4.png" alt  v-show="aiShow"/>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="search">
      <el-input placeholder="输入医嘱内容" prefix-icon="el-icon-search" v-model="searchVal" v-on:input="watchNum"></el-input>
    </div>
    <div class="time">
      <van-cell @click="showPopup(1)">
        {{ startTime }}
        <van-icon name="arrow-down" />
      </van-cell>
      <van-popup v-model="show1" position="bottom" :style="{ height: '50%' }">
        <van-datetime-picker
          v-model="currentDate1"
          type="date"
          @cancel="show1=false"
          @confirm="chooseStartTime"
        />
      </van-popup>
      <div class="line">-</div>
      <van-cell @click="showPopup(2)">
        {{ endTime }}
        <van-icon name="arrow-down" />
      </van-cell>
      <van-popup v-model="show2" position="bottom" :style="{ height: '50%' }">
        <van-datetime-picker
          v-model="currentDate2"
          type="date"
          @cancel="show2=false"
          @confirm="chooseEndTime"
        />
      </van-popup>
    </div>
    <div class="statOrder">

      <div class="statOrderOne" v-for="(item,index) in this.doctorAdvice" :key="item.id">
        <van-swipe-cell>
          <van-cell :border="false">
               <template>
               <div class="custom-title">{{RecordTime(item.advice_date)}}</div>
            </template>
            <van-icon
              slot="right-icon"
              name="ellipsis"
              style="line-height: inherit;"
              @click="onClick(1)"
            />
          </van-cell>
          <template slot="right">
            <van-button square type="danger" text="删除" @click="deleteDoctorAdvice(item.id)"/>
          </template>
        </van-swipe-cell>
        <van-action-sheet v-model="show3" :actions="actions" cancel-text="取消"></van-action-sheet>
        <div class="msg">
            <span v-if="item.advice_type==1">长嘱</span>
            <span v-else-if="item.advice_type==3">临嘱</span>
            <span v-else></span>
          <div v-if="item.parent_id==0">
          <p>医嘱内容:{{item.advice_name}}&nbsp;药品规格:{{item.advice_desc}}{{item.drug_spec_unit}}</p>
          <p>开药数量:{{item.prescribing_number}}{{item.prescribing_number_unit}}&nbsp;单次用量: <span v-if="item.single_dose!=0">{{item.single_dose}}{{item.single_dose_unit}}</span></p>
           <p>频率:<span v-if="item.parent_id==0">{{item.execution_frequency}}</span>&nbsp;用法:<span v-if="item.parent_id==0">{{item.delivery_way}}</span></p>
           <p>执行时间:  <span  v-if="item.execution_state==1"> {{item.execution_time | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>&nbsp;终止时间: <span v-if="item.stop_state==1"> {{item.stop_time | parseTime('{y}-{m}-{d} {h}:{i}')}}</span></p>
           <p>执行护士:  <span v-if="item.parent_id==0">{{item.execution_staff}}</span></p>
           </div>
         <div v-if="item.parent_id!=0">
           <p>▲ {{item.advice_name}}</p>
         </div> 
      
          <div class="doctorAll">
            <div class="doctor">
              <span>开嘱医生:</span>
              <span>{{doctor_name}}</span>
              <span>开嘱时间:</span>
              <span>{{RecordTime(item.created_time)}}</span>
              <span>核对护士:</span>
              <span v-if="item.parent_id==0">{{item.checker}}</span>
              <span>校对时间:</span>
               <span v-if="item.check_state==1">{{item.created_time | parseTime('{y}-{m}-{d} {h}:{i}')}}</span>
            </div>
          </div>
        </div>
  
      </div>

    </div>
    <div class="add">
      <img src="../../assets/images/add2.png" alt />
    </div>-->
    <div class="doctorAdviceTitle">
      <i class="iconfont icon-zuojiantou jiantou"></i>
      <div class="patientName" @click="show = true">
        张三
        <van-icon name="arrow-down" />
      </div>
      <p>基本信息</p>
    </div>
    <van-tabs v-model="active" sticky>
      <van-sticky>
        <div class="wapBox" @click="show1 = true">
          <van-icon class="wap" name="wap-nav" />
        </div>
      </van-sticky>
      <van-tab v-for="(item, index) in title" :title="item" :key="index">
        <doctor-management v-if="active == 0"></doctor-management>
        <dry-weight v-if="active == 1"></dry-weight>
        <course-management v-if="active == 2"></course-management>
        <rescue-record v-if="active == 3"></rescue-record>
        <inspection v-if="active == 4"></inspection>
        <long-dialysis v-if="active == 5"></long-dialysis>
        <dialysis-record v-if="active == 6"></dialysis-record>
        <scheduling v-if="active == 7"></scheduling>
        <education v-if="active == 8"></education>
      </van-tab>
    </van-tabs>
    <van-popup v-model="show" position="top" :style="{ height: '100%' }">
      <div style="padding:10px;font-size:1.25rem;text-align:right" @click="show = false">
        <van-icon name="cross" />
      </div>
      <van-search v-model="value" placeholder="请输入搜索关键词" />
      <van-index-bar>
        <van-index-anchor index="A" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />

        <van-index-anchor index="B" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />

        <van-index-anchor index="C" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />

        <van-index-anchor index="D" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />

        <van-index-anchor index="E" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />

        <van-index-anchor index="F" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />

        <van-index-anchor index="G" />
        <van-cell title="文本" />
        <van-cell title="文本" />
        <van-cell title="文本" />
      </van-index-bar>
    </van-popup>

    <van-popup v-model="show1" position="top" :style="{ height: '40%' }">
      <div style="padding:10px;font-size:1.25rem;text-align:right" @click="show1 = false">
        <van-icon name="cross" />
      </div>
      <div class="titleBox">
        <div
          class="titleBoxOne"
          v-for="(item,index) in title"
          :key="index"
          @click="changeActive(index)"
        >{{item}}</div>
      </div>
    </van-popup>
  </div>
</template>

<script>
const moment = require("moment");
import DoctorManagement from "@/kpa_pages/doctorAdvice/components/DoctorManagement";
import DryWeight from "@/kpa_pages/doctorAdvice/components/DryWeight";
import CourseManagement from "@/kpa_pages/doctorAdvice/components/CourseManagement";
import RescueRecord from "@/kpa_pages/doctorAdvice/components/RescueRecord";
import Inspection from "@/kpa_pages/doctorAdvice/components/Inspection";
import LongDialysis from "@/kpa_pages/doctorAdvice/components/LongDialysis";
import DialysisRecord from "@/kpa_pages/doctorAdvice/components/DialysisRecord";
import Scheduling from "@/kpa_pages/doctorAdvice/components/Scheduling";
import Education from "@/kpa_pages/doctorAdvice/components/Education";
import {
  GetDoctroAdvice,
  toSeacherDoctorAdvice,
  deleteDoctorAdvice
} from "@/api/login/login";
import { uParseTime } from "@/utils/tools";
export default {
  components: {
    DoctorManagement,
    DryWeight,
    CourseManagement,
    RescueRecord,
    Inspection,
    LongDialysis,
    DialysisRecord,
    Scheduling,
    Education
  },
  data() {
    return {
      show: false,
      show1: false,
      active: 0,
      title: [
        "医嘱管理",
        "干体重",
        "病程管理",
        "抢救记录",
        "检验检查",
        "长期透析处方",
        "透析记录",
        "排班信息",
        "宣教信息"
      ],

      searchVal: "",
      startTime: moment(new Date()).format("YYYY-MM-DD"),
      endTime: moment(new Date()).format("YYYY-MM-DD"),
      show1: false,
      show2: false,
      currentDate1: new Date(),
      currentDate2: new Date(),
      show3: false,
      actions: [{ name: "编辑" }, { name: "删除" }],
      time: "2016-10-2",
      patientForm: {
        name: "",
        sex: "",
        age: "",
        dialysis_no: "",
        avatar: ""
      },
      doctorAdvice: [],
      yiShow: false,
      meiShow: false,
      bingShow: false,
      aiShow: false,
      doctor_name: ""
    };
  },
  methods: {
    changeActive(index) {
      console.log(index);
      this.active = index;
      this.show1 = false;
    },

    // sadas
    showPopup(index) {
      if (index === 1) {
        this.show1 = true;
      } else if (index === 2) {
        this.show2 = true;
      }
    },
    chooseStartTime(value) {
      this.startTime = moment(value).format("YYYY-MM-DD");
      console.log("starttime", this.startTime);
      var patientid = this.$route.query.patientid;
      var orgid = this.$route.query.orgid;
      this.GetDoctroAdvice(patientid, orgid, this.startTime);
      this.show1 = false;
    },
    chooseEndTime(value) {
      this.endTime = moment(value).format("YYYY-MM-DD");
      var patientid = this.$route.query.patientid;
      var orgid = this.$route.query.orgid;
      this.GetDoctroAdvice(patientid, orgid, this.endTime);
      this.show2 = false;
    },
    onClick(index) {
      if (index === 1) {
        this.show3 = true;
      } else if (index === 2) {
        this.show3 = true;
      }
    },
    RecordTime(time) {
      // return uParseTime(time, '{y}-{m}-{d} {h}:{i}:{s}')
      return uParseTime(time, "{y}-{m}-{d}");
    },
    GetDoctroAdvice(patientid, orgid) {
      GetDoctroAdvice(
        patientid,
        orgid,
        this.startTime,
        this.endTime,
        this.searchVal
      ).then(response => {
        if (response.data.state === 1) {
          var doctoradvice = response.data.data.doctoradvice;
          this.doctorAdvice = doctoradvice;
          var patients = response.data.data.patients;
          this.patientForm.name = patients.name;
          this.patientForm.age = patients.age;
          this.patientForm.avatar = patients.avatar;
          var diseases = response.data.data.diseases;
          console.log("diseases", diseases);
          for (let index = 0; index < diseases.length; index++) {
            if (diseases[index].disease_id === 2) {
              this.yiShow = true;
            }
            if (diseases[index].disease_id === 3) {
              this.bingShow = true;
            }
            if (diseases[index].disease_id === 4) {
              this.aiShow = true;
            }

            if (diseases[index].disease_id === 6) {
              this.meiShow = true;
            }
          }
          if (patients.gender === 1) {
            this.patientForm.sex = "男";
          }
          if (patients.gender === 2) {
            this.patientForm.sex = "女";
          }
          this.patientForm.dialysis_no = patients.dialysis_no;
          console.log("doctoradvice", doctoradvice);
          console.log("patients", patients);
          var role = response.data.data.role;
          console.log("role", role);
          this.doctor_name = role.user_name;
        }
      });
    },
    watchNum() {
      var patientid = this.$route.query.patientid;
      var orgid = this.$route.query.orgid;
      toSeacherDoctorAdvice(patientid, orgid, this.searchVal).then(response => {
        if (response.data.state === 1) {
          var doctorAdvice = response.data.data.doctoradvice;
          console.log("doctoradvice", doctorAdvice);
          this.doctorAdvice = doctoradvice;
        }
      });
    },
    deleteDoctorAdvice(id, index) {
      deleteDoctorAdvice(id, index).then(response => {
        if (response.data.state === 1) {
          var msg = response.data.data.msg;
          console.log("msg", msg);
          this.doctorAdvice.splice(index, 1);
        }
      });
    }
  },
  created() {
    // var patientid = this.$route.query.patientid
    // var orgid = this.$route.query.orgid
    // console.log('paitientid是什么', patientid)
    // console.log('orgid是什么', orgid)
    // this.GetDoctroAdvice(patientid, orgid)
  }
};
</script>

<style lang="scss" scoped>
.page_doctorAdvice {
  overflow: hidden;
  height: 100%;
  overflow-y: auto;
  .doctorAdviceTitle {
    height: 3.125rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0 1.125rem;
    background: #fff;
  }
  .patientName {
    display: flex;
    align-items: center;
  }
  .jiantou {
    font-size: 1.5rem;
    font-weight: 600;
    margin-right: 2rem;
  }
  .wapBox {
    position: absolute;
    z-index: 2;
    right: 0;
    top: 0;
    width: 2.625rem;
    text-align: center;
    background: rgba(255, 255, 255, 1);
    box-shadow: -2px 0px 12px 0px rgba(91, 91, 91, 0.16);
  }
  .wap {
    font-size: 1.875rem;
    line-height: 44px;
    color: #5b5b5b;
  }
  .titleBox {
    padding: 0 1.25rem 1.25rem;
    display: flex;
    flex-wrap: wrap;
    .titleBoxOne {
      padding: 0.375rem 0.625rem;
      background: #f6f6f6;
      border-radius: 0.375rem;
      margin: 0.625rem 0.375rem;
      font-size: 0.75rem;
    }
  }
}
::-webkit-scrollbar {
  width: 0;
}
</style>
<style lang="scss">
.page_doctorAdvice {
  .van-tabs__wrap {
    width: 90% !important;
  }
  .van-cell__value {
    display: flex;
    align-items: center;
  }
}
</style>
