<template>

  <div class="newDialysisRecord">
    <div>
      <div class="toolBox">
        <div class="toolOne" @click="typeShow = true">
          <div style="display: flex;align-items: center;">
            {{ type }}
            <van-icon name="arrow-down" />
          </div>
        </div>
        <div class="toolOne" @click="startShow = true">
          <div style="display: flex;align-items: center;">
            {{ startTime }}
            <van-icon name="arrow-down" />
          </div>
        </div>
        <div class="toolOne" @click="endShow = true">
          <div style="display: flex;align-items: center;">
            {{ endTime }}
            <van-icon name="arrow-down" />
          </div>
        </div>
      </div>

      <div class="adviceBox" v-if="dialysisRecord.length > 0">
        <van-list
          v-model="loading"
          :finished="finished"
          finished-text="没有更多了"
          @load="onLoad"
        >
          <div class="adviceMain" >
            <div
              class="adviceOne"
              v-for="(item, index) in dialysisRecord"
              :key="index"
            >
              <div class="adviceTitle">
                <p>{{ getTime(item.dialysis_date) }}</p>
              </div>
              <div class="orderContent"  @click="toToday(item.dialysis_date)">
                <p>
                  班次：
                  <span v-if="item.schedule_type === 1">上午</span>
                  <span v-if="item.schedule_type === 2">下午</span>
                  <span v-if="item.schedule_type === 3">晚上</span>
                </p>
                <p>分区： {{ item.partition_name }}</p>
                <p>机号：{{ item.device.number }}</p>
                <p>
                  透析模式：
                  <span v-if="item.prescription.mode_id === 1">HD</span>
                  <span v-if="item.prescription.mode_id === 2">HDF</span>
                  <span v-if="item.prescription.mode_id === 3">HD+HP</span>
                  <span v-if="item.prescription.mode_id === 4">HP</span>
                  <span v-if="item.prescription.mode_id === 5">HF</span>
                  <span v-if="item.prescription.mode_id === 6">SCUF</span>
                  <span v-if="item.prescription.mode_id === 7">IUF</span>
                  <span v-if="item.prescription.mode_id === 8">HFHD</span>
                  <span v-if="item.prescription.mode_id === 9">HFHD+HP</span>
                  <span v-if="item.prescription.mode_id === 10">PHF</span>
                  <span v-if="item.prescription.mode_id === 11">HFR</span>
                  <span v-if="item.prescription.mode_id === 12">HDF+HP</span>
                  <span v-if="item.prescription.mode_id === 13">CRRT</span>
                  <span v-if="item.prescription.mode_id === 14">腹水回输</span>
                  <span v-if="item.prescription.mode_id === 20">UF</span>
                  <span v-if="item.prescription.mode_id === 21">HD+</span>
                  <span v-if="item.prescription.mode_id === 22">血浆胆红素吸附+HDF</span>
                  <span v-if="item.prescription.mode_id === 23">血浆胆红素吸附</span>
                  <span v-if="item.prescription.mode_id === 24">I-HDF</span>
                   <span v-if="item.prescription.mode_id === 25">HD高通</span>
                  <span v-if="item.prescription.mode_id === 26">CVVH</span>
                   <span v-if="item.prescription.mode_id === 27">CVVHD</span>
                    <span v-if="item.prescription.mode_id === 28">CVVHDF</span>
                    <span v-if="item.prescription.mode_id === 29">PE</span>
                </p>
                <p>
                  透析时长：{{ item.prescription.dialysis_duration_hour }}h{{item.prescription.dialysis_duration_minute}}min
                </p>
                <p v-if="org_id == 10340">
                  实际透析时长：{{item.assessment_after_dislysis.actual_treatment_hour}}h<span v-if="item.assessment_after_dislysis.actual_treatment_minute">{{item.assessment_after_dislysis.actual_treatment_minute}}min</span>
                </p>
                <p>干体重(kg)：{{ item.predialysis_evaluation.dry_weight }}</p>
                <p>
                  透前称重(kg)：{{ item.predialysis_evaluation.weight_before }}
                </p>
                <p>
                  透后称重(kg)：{{ item.assessment_after_dislysis.weight_after }}
                </p>
                <p>
                  透前血压(mmHg)：{{
                    item.predialysis_evaluation.systolic_blood_pressure
                  }}/
                  {{ item.predialysis_evaluation.diastolic_blood_pressure }}
                </p>
                <p>
                  透后血压(mmHg)：
                  <!-- {{ item.assessment_after_dislysis.systolic_blood_pressure }}/
                  {{ item.assessment_after_dislysis.diastolic_blood_pressure }} -->
                 <span v-if="item.monitoring_record.length>0"> {{item.monitoring_record[item.monitoring_record.length-1].systolic_blood_pressure?item.monitoring_record[item.monitoring_record.length-1].systolic_blood_pressure:''}}</span>/
                  <span v-if="item.monitoring_record.length>0">{{item.monitoring_record[item.monitoring_record.length-1].diastolic_blood_pressure?item.monitoring_record[item.monitoring_record.length-1].diastolic_blood_pressure:''}}</span>
                </p>
                <p>
                  抗凝剂：
                  <span v-if="item.prescription.anticoagulant == 1">无肝素</span>
                  <span v-if="item.prescription.anticoagulant == 2"
                    >普通肝素</span
                  >
                  <span v-if="item.prescription.anticoagulant == 3"
                    >低分子肝素</span
                  >
                  <span v-if="item.prescription.anticoagulant == 4"
                    >阿加曲班</span
                  >
                  <span v-if="item.prescription.anticoagulant == 5"
                    >枸橼酸钠</span
                  >
                  <span v-if="item.prescription.anticoagulant == 6"
                    >低分子肝素钙</span
                  >
                    <span v-if="item.prescription.anticoagulant == 7"
                    >低分子肝素钠</span
                  >
                  <span v-if="item.prescription.anticoagulant == 8"
                    >依诺肝素</span
                  >
                  <span v-if="item.prescription.anticoagulant == 9"
                    >达肝素</span
                  >
                   <span v-if="item.prescription.anticoagulant == 10"
                    >体外抗凝</span
                  >
                 <span v-if="item.prescription.anticoagulant == 11"
                    >那屈肝素</span
                  >
                  <span v-if="item.prescription.anticoagulant == 12"
                    >无抗凝剂</span
                  >
                   <span v-if="item.prescription.anticoagulant == 13"
                    >那屈肝素钙</span
                  >
                  <span v-if="item.prescription.anticoagulant == 14"
                    >肝素钙注射液</span
                  >
                  <span v-if="item.prescription.anticoagulant == 15"
                    >甲磺酸萘莫司他</span
                  >
                  <span v-if="item.prescription.anticoagulant == 16"
                    >低分子量肝素钙</span
                  >
                  <span v-if="item.prescription.anticoagulant == 17"
                    >肝素钠</span
                  >
                  <span v-if="item.prescription.anticoagulant == 18"
                    >贝米肝素钠注射液</span
                  >
                  <span v-if="item.prescription.anticoagulant == 19"
                    >低分子量肝素钠</span
                  >
                </p>
                <p>
                  首剂：
                  <span>{{ item.prescription.anticoagulant_shouji }}</span>
                 <span v-if="item.prescription.anticoagulant == 1">mg</span>
                  <span v-if="item.prescription.anticoagulant == 2">iu</span>
                  <span v-if="item.prescription.anticoagulant == 3">iu</span>
                  <span v-if="item.prescription.anticoagulant == 4">mg</span>
                  <span v-if="item.prescription.anticoagulant == 5">mg</span>
                  <span v-if="item.prescription.anticoagulant == 6">iu</span>
                  <span v-if="item.prescription.anticoagulant == 7">iu</span>
                  <span v-if="item.prescription.anticoagulant == 8">iu</span>
                  <span v-if="item.prescription.anticoagulant == 9">iu</span>
                  <span v-if="item.prescription.anticoagulant == 10 || item.prescription.anticoagulant == 15">mg</span>
                </p>
                <p>
                  维持：
                  <span>{{ item.prescription.anticoagulant_weichi }}</span>
                  <span v-if="item.prescription.anticoagulant == 1">mg/h</span>
                  <span v-if="item.prescription.anticoagulant == 2">iu/h</span>
                  <span v-if="item.prescription.anticoagulant == 3">iu/h</span>
                  <span v-if="item.prescription.anticoagulant == 4">mg/h</span>
                  <span v-if="item.prescription.anticoagulant == 5">ml/h</span>
                  <span v-if="item.prescription.anticoagulant == 6">iu/h</span>
                  <span v-if="item.prescription.anticoagulant == 7">iu/h</span>
                  <span v-if="item.prescription.anticoagulant == 8">iu/h</span>
                  <span v-if="item.prescription.anticoagulant == 9">iu/h</span>
                  <span v-if="item.prescription.anticoagulant == 10 || item.prescription.anticoagulant == 15">mg/h</span>
                </p>
                <p>
                  总量：
                  <span>{{ item.prescription.anticoagulant_zongliang }}</span>
                  <span v-if="item.prescription.anticoagulant == 1">mg</span>
                  <span v-if="item.prescription.anticoagulant == 2">iu</span>
                  <span v-if="item.prescription.anticoagulant == 3">iu</span>
                  <span v-if="item.prescription.anticoagulant == 4">mg</span>
                  <span v-if="item.prescription.anticoagulant == 5">mg</span>
                  <span v-if="item.prescription.anticoagulant == 6">iu</span>
                  <span v-if="item.prescription.anticoagulant == 7">iu</span>
                  <span v-if="item.prescription.anticoagulant == 8">iu</span>
                  <span v-if="item.prescription.anticoagulant == 9">iu</span>
                  <span v-if="item.prescription.anticoagulant == 10 || item.prescription.anticoagulant == 15">mg</span>
                </p>
                <p>
                 透析器/灌流器:
                 <span>{{item.prescription.dialyzer_perfusion_apparatus}}</span>
                 <span>{{item.prescription.dialysis_dialyszers}} / {{item.prescription.dialysis_irrigation}}</span>
                </p>
                <p>
                  目标超滤量:
                  <span v-if="templateid !=9 && templateid!=17 && templateid!=20 &&templateid!=21 && templateid !=22 && templateid!=23 && templateid!=24 && templateid!=26 && templateid!=27 && templateid!=28 && templateid!=29 && templateid!=30 && templateid!=32 && org_id != 9555 && org_id != 10340 && templateid!=40 && org_id != 10445 && org_id!=10138 && org_id!=10278">{{item.prescription.target_ultrafiltration}}L</span>
                  <span v-if="templateid == 9 || templateid == 17 || templateid ==20 || templateid == 21 || templateid == 22 || templateid == 23 || templateid == 24 || templateid == 26 || templateid == 27 || templateid == 28 || templateid == 29 || templateid == 30 || templateid == 32 || templateid ==40  || org_id == 9555 || org_id == 10340 || org_id == 10445 || org_id==10138 || org_id ==10278">{{item.prescription.target_ultrafiltration}}ml</span>
                </p>
                <p v-if="org_id == 10340">
                  实际超滤量: {{item.assessment_after_dislysis.actual_ultrafiltration}}ml
                </p>
                <p>治疗护士：{{ getNurse(item.start_nurse) }}</p>
                <p>治疗医生：{{ getNurse(item.prescription.creater) }}</p>
                <div class="all" @click="toToday(item.dialysis_date)">
                  全部
                </div>
              </div>
            </div>
          </div>
        </van-list>
      </div>

      <div class="noimgBox" v-else>
        <img src="../../../assets/images/none.png" alt />
      </div>
    </div>

    <!-- 弹出层 -->
    <div>
      <van-popup
        class='newPopup'
        get-container="#app"
        v-model="typeShow"
        position="bottom"
        :style="{ height: '40%' }"
      >
        <van-picker
          show-toolbar
          :columns="columns"
          @cancel="onCancel"
          @confirm="onConfirm"
        />
      </van-popup>
      <van-popup
        class='newPopup'
        get-container="#app"
        v-model="startShow"
        position="bottom"
        :style="{ height: '40%' }"
      >
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="getstartTime"
          @cancel="startShow = false"
        />
      </van-popup>
      <van-popup v-model="endShow" class='newPopup' get-container="#app" position="bottom" :style="{ height: '40%' }">
        <van-datetime-picker
          v-model="currentDate"
          type="date"
          :min-date="minDate"
          :max-date="maxDate"
          @confirm="getstartTime2"
          @cancel="endShow = false"
        />
      </van-popup>
      <van-action-sheet
        class='newPopup'
        get-container="#app"
        v-model="newShow"
        :actions="actions"
        cancel-text="取消"
        @cancel="onCancel"
        @select="toDelete"
      />
    </div>
  </div>
</template>

<script>
import { getNewPatientId,getPatientDetail, getDialysisRecord } from "@/api/patient/patient";
import { uParseTime } from "@/utils/tools";
import Vue from "vue";
import { Dialog } from "vant";
const moment = require("moment");
export default {
  props: {
    active: Number
  },
  inject: ['reload'],
  data() {
    return {
      newShow: false,
      typeShow: false,
      startShow: false,
      endShow: false,
      type: "全部",
      types: 0,
      loading: false,
      finished: false,
      columns: [
        "全部",
        "HD",
        "HDF",
        "HD+HP",
        "HP",
        "HF",
        "SCUF",
        "IUF",
        "HFHD",
        "HFHD+HP",
        "PHF",
        "HFR",
        "HDF+HP",
        "CRRT",
        "腹水回输"
      ],
      startTime: "请选择",
      endTime: "请选择",
      minDate: new Date(1970, 0, 1),
      maxDate: new Date(2025, 10, 1),
      currentDate: new Date(),
      actions: [{ name: "删除" }],
      showOne: true,
      showTwo: false,
      limit: 10,
      page: 1,
      dialysisRecord: [],
      doctor: [],
      patient_name: "",
      index: 0,
      id: 0,
      patient_id: 0,
      patientid:0,
      date:0,
      patient_name:"",
      templateid:0,
      org_id:0

    };
  },
  methods: {
    onCancel() {
      this.typeShow = false;
    },
    onConfirm(value) {
      if (value === "全部") {
        this.types = 0;
      }
      if (value === "HD") {
        this.types = 1;
      }
      if (value === "HDF") {
        this.types = 2;
      }
      if (value === "HD+HP") {
        this.types = 3;
      }
      if (value === "HP") {
        this.types = 4;
      }
      if (value === "HF") {
        this.types = 5;
      }
      if (value === "SCUF") {
        this.types = 6;
      }
      if (value === "IUF") {
        this.types = 7;
      }
      if (value === "HFHD") {
        this.types = 8;
      }
      if (value === "HFHD+HP") {
        this.types = 9;
      }
      if (value === "PHF") {
        this.types = 10;
      }
      if (value === "HFR") {
        this.types = 11;
      }

      if (value === "HDF+HP") {
        this.types = 12;
      }
      if (value === "CRRT") {
        this.types = 13;
      }
      if (value === "腹水回输") {
        this.types = 14;
      }
      if (value === "HD+") {
        this.types = 21;
      }
      if (value === "PE") {
        this.types = 29;
      }
      this.page = 1;
      this.dialysisRecord = [];
      this.getDialysisRecord(this.patient_id,this.limit, this.page,this.startTime,this.endTime, this.types);
      this.typeShow = false;
      this.type = value
    },
    getstartTime(value) {
      this.page = 1;
      let year = value.getFullYear();
      let month = value.getMonth() + 1;
      let day = value.getDate();
      if (month >= 1 && month <= 9) {
        month = `0${month}`;
      }
      if (day >= 1 && day <= 9) {
        day = `0${day}`;
      }
      this.startTime = `${year}-${month}-${day}`;
      this.dialysisRecord = [];
      this.getDialysisRecord(this.patient_id, this.limit,this.page,this.startTime,this.endTime,this.types
      );
      this.startShow = false;
    },
    getstartTime2(value) {
      this.page = 1;
      let year = value.getFullYear();
      let month = value.getMonth() + 1;
      let day = value.getDate();
      if (month >= 1 && month <= 9) {
        month = `0${month}`;
      }
      if (day >= 1 && day <= 9) {
        day = `0${day}`;
      }

      this.endTime = `${year}-${month}-${day}`;
      this.dialysisRecord = [];
      this.getDialysisRecord(
        this.patient_id,
        this.limit,
        this.page,
        this.startTime,
        this.endTime,
        this.types
      );
      this.endShow = false;
    },
    // getPatientDetail(patientid) {
    //   getPatientDetail(patientid).then(response => {
    //     if (response.data.state === 1) {
    //       var patientDetail = response.data.data.patientDetail;
    //       this.patient_name = patientDetail.name;
    //       if (patientDetail.blood_patients == 0) {
    //         this.showOne = false;
    //         this.showTwo = true;
    //       }
    //       if (patientDetail.blood_patients == 1) {
    //         this.showOne = true;
    //         this.showTwo = false;
    //       }
    //       this.patientName = patientDetail.name;
    //     }
    //   });
    // },
    getDialysisRecord(id) {
      getDialysisRecord(id,this.limit,this.page,this.startTime,this.endTime,this.types).then(response => {
        if (response.data.state === 1) {
          var dialysisrecord = response.data.data.dialysisrecord;
          console.log("透析记录",dialysisrecord)
          let arr = this.dialysisRecord;
          arr.push(...dialysisrecord);
          this.dialysisRecord = arr;
          var total = response.data.data.total;
          this.total =total
          var doctor = response.data.data.doctor;
          this.doctor = doctor;
          this.loading = false

        }
      });
    },
    onLoad() {
       this.page++;
       if (this.page <= Math.ceil(this.total / 10)) {
          this.getDialysisRecord(this.patient_id);
        } else {
          this.loading = false;
          this.finished = true;
        }
    },
    getTime(time) {
      // return uParseTime(time, "{y}-{m}-{d} {h}:{i}:{s}");
      return uParseTime(time, "{y}-{m}-{d}");
    },
    getNurse(id) {
      for (let i = 0; i < this.doctor.length; i++) {
        if (this.doctor[i].admin_user_id === id) {
          return this.doctor[i].user_name;
        }
      }
    },
    toDialysisRecordDetail(id, date) {
      this.$router.push(
        "/details?patient_id=" +
          id +
          "&date=" +
          date +
          "&patient_name=" +
          this.patient_name
      );
    },
    Delete(id, index) {
      this.id = id;
      this.index = index;
      this.newShow = true;
    },
    toDelete(value) {
      if ((value.name = "删除")) {
        this.DeleteDialysisRecord(this.id, this.index);
      }
    },
    DeleteDialysisRecord(id, index) {
      Dialog.confirm({
        title: "删除提示!",
        message: "确认删除该条信息吗?,删除后将无法恢复!"
      }).then(() => {
        DeleteDialysisRecord(id).then(response => {
          if (response.data.state === 1) {
            var msg = response.data.data.msg;
            // console.log("msg", msg);
            this.dialysisRecord.splice(index, 1);
            this.newShow = false;
          }
        });
      });
    },
    getNewPatientId(id){
      getNewPatientId(id).then(response=>{
         if(response.data.state == 1){
          var patient =  response.data.data.patient
          console.log("患者信息",patient)
           this.patient_id = patient.id;
           this.getDialysisRecord(patient.id);
          //  this.getPatientDetail(patient.id);

         }
      })
    },
    toToday(date){
      console.log('date',date)
      this.reload()
      this.$router.replace(
        '/details?patient_id=' + this.patientid + '&date=' + date + '&patient_name=' + this.patient_name + '&active1=' + 0
      )
    },
    // getLastTime(dialysis_date){
    //   console.log("dialysis_date-------",dialysis_date)

    //   var arr = []
    //   for(let i=0;i<this.dialysisRecord.length;i++){
    //     if(this.dialysisRecord[i].dialysis_date < dialysis_date){
    //        arr.push(this.dialysisRecord[i])
    //     }
    //   }
    //   var newList = arr.sort(this.compareList('dialysis_date'))
    //   console.log("newList--------",newList)
    //   if(newList!=null && newList.length >0){
    //      newList[i].
    //   }
    //   // return newList[1].dialysis_date
    // },
    compareList: function (k) {
      return function (a, b) {
        var M = a[k]
        var N = b[k]
        // return M - N // 从低向高排
        return N - M;   // 从高向低排
      }
    }
  },
  created() {
    var patientid = this.$route.query.patient_id;
    console.log("并嗯ID",patientid)
    this.getNewPatientId(patientid)
    this.patientid = patientid
    this.patient_name = this.$route.query.patient_name
    var templateid = this.$store.getters.user.template_info.template_id
    this.templateid = templateid
    this.org_id = this.$store.getters.user.template_info.org_id
  }
};
</script>

<style lang="scss" scoped>
.newDialysisRecord {
  height: 100%;
  overflow-y: auto;
  background: #fff;
  padding-top:2.75rem;
  .toolBox {
    display: flex;
    height: 3.125rem;
    justify-content: space-around;
    align-items: center;
    .toolOne {
      width: 6.25rem;
      height: 1.875rem;
      background: rgba(246, 246, 246, 1);
      border-radius: 5px;
      text-align: center;
      font-size: 0.8125rem;
      color: #8d8d8d;
      display: flex;
      align-items: center;
      justify-content: space-around;
    }
  }
  .adviceBox {
    padding: 0 1.125rem;
    margin-bottom: 3.125rem;
  }
  .adviceOne {
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.1);
    padding-bottom: 0.625rem;
  }
  .adviceTitle {
    padding-top: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    p {
      color: #000000;
      font-weight: bold;
      font-size: 0.9375rem;
    }
    .ellipsis {
      font-size: 1.25rem;
      color: #cccccc;
    }
  }
  .orderContent {
    font-size: 0.875rem;
    color: rgba(49, 50, 52, 1);
    margin-top: 0.625rem;
    display: flex;
    flex-wrap: wrap;
    p {
      line-height: 1.5rem;
      width: 50%;
    }
  }
  .doctorBox {
    font-size: 0.75rem;
    color: rgba(152, 152, 152, 1);
    line-height: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.625rem;
  }
  .all {
    font-size: 0.8125rem;
    color: #5b98ff;
    margin-top: 0.625rem;
  }
  .noimgBox {
    margin-top: 40%;
    img {
      width: 9.375rem;
      height: 9.375rem;
      margin: 0 auto;
      display: block;
    }
  }
  // .add {
  //   position: fixed;
  //   bottom: 0;
  //   left: 0;
  //   width: 100%;
  //   height: 2.75rem;
  //   background: rgba(255, 255, 255, 1);
  //   box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
  //   display: flex;
  //   align-items: center;
  //   justify-content: space-around;
  //   font-size: 0.9375rem;
  //   color: #979798;
  //   .addIcon {
  //     color: #5b98ff;
  //     font-size: 1.25rem;
  //     margin-right: 0.25rem;
  //   }
  // }
  .van-popup {
    border-radius: 0;
    transform: translate3d(0, 0, 0);
    top: initial;
  }
}
::-webkit-scrollbar {
  width: 0;
}
</style>

<style style="stylesheet/scss" lang="scss" scoped>
// .choice {
//   border-bottom: 1px #e5e5e5 solid;
//   ul {
//     @include display-flex;
//     @include align-items-center;
//     @include text-align;
//     @include justify-content-between;
//     width: 98%;
//     margin: 0 auto;
//     font-size: 0.4rem;
//     color: $pgh-color;
//     @media only screen and (min-width: 768px) {
//       width: 80%;
//     }
//     li {
//       @include display-flex;
//       @include align-items-center;
//       @include text-align;
//       padding: 0.3rem 0;
//       .iconfont {
//         margin: 0 0.1rem;
//         // @media only screen and (max-width: 812px) {
//         //   font-size: 12px !important;
//         // }
//       }
//       .line {
//         background: #a8b3ba;
//         width: 0.2rem;
//         height: 1px;
//         margin: 0 0.2rem;
//         display: inline-block;
//       }
//     }
//   }
// }
// .RecordTable {
//   padding-top: 0;
//   background: #fff;
//   min-height: calc(100vh - 180px);
// }
// .popover-demo-content {
//   max-height: 400px;
//   overflow-y: scroll;
// }
// .newRecordTable {
//   @media only screen and (max-width: 414px) {
//     width: 1200px;
//   }
//   @media only screen and (min-width: 415px) and (max-width: 767px) {
//     width: 1600px;
//   }
// }
</style>
// <style lang="scss">
// .el-table td {
//   padding: 0;
// }
// .el-table th {
//   padding: 6px 0;
// }
// </style>
