<template>
  <div class="popup-content">
    <h2 class="title">
      <span class="line"></span>
      <p>{{ title }}</p>
      <span class="line"></span>
    </h2>
    <div class="content">
      <div class="cell">
        <label>透后称重(kg)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.weight_after"
          autofocus
        />
      </div>
      <div class="cell">
        <label>体重减少(kg)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.weight_loss"
          autofocus
        />
      </div>
      <div class="cell">
        <label>体温(℃)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.temperature"
          autofocus
        />
      </div>

      <div class="cell">
        <label>收缩压(mmHg)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.systolic_blood_pressure"
        />
      </div>
      <div class="cell">
        <label>舒张压(mmHg)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.diastolic_blood_pressure"
        />
      </div>
      <div class="cell">
        <label>脉搏(次/分)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.pulse_frequency"
        />
      </div>
      <div class="cell">
        <label>呼吸频率(次/分)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.breathing_rate"
        />
      </div>
      <div class="cell">
        <label>实际超滤量(L)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.actual_ultrafiltration"
        />
      </div>
      <div class="cell">
        <label>实际置换量(L)</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.actual_displacement"
        />
      </div>
      <div class="cell">
        <label>实际治疗时长</label>
        <div style="display: inline-block">
          <input
            type="text"
            class="inputBox"
            style="width: 50px"
            v-model="assessmentAfterDislysis.actual_treatment_hour"
          />
          <label style="display: inline-block">h</label>
          <input
            type="text"
            class="inputBox"
            style="width: 50px"
            v-model="assessmentAfterDislysis.actual_treatment_minute"
          />
          <label style="display: inline-block">min</label>
        </div>
      </div>

      <div class="cell">
        <label>凝血</label>
        <el-select
          multiple
          collapse-tags
          v-model="assessmentAfterDislysis.cruor"
          placeholder="请选择"
        >
          <el-option
            v-for="item in nxList"
            :key="item.id"
            :label="item.name"
            :value="item.name"
          ></el-option>
        </el-select>
      </div>
      <div class="cell">
        <label>透后症状</label>
        <el-select
          multiple
          collapse-tags
          v-model="assessmentAfterDislysis.symptom_after_dialysis"
          placeholder="请选择"
        >
          <el-option
            v-for="item in txzrList"
            :key="item.id"
            :label="item.name"
            :value="item.name"
          ></el-option>
        </el-select>
      </div>
      <div class="cell">
        <label>透析中入量</label>
        <input
          type="text"
          class="inputBox"
          v-model="assessmentAfterDislysis.dialysis_intakes"
        />
      </div>

      <div class="cell">
        <label>导管</label>
        <el-select
          multiple
          collapse-tags
          v-model="assessmentAfterDislysis.catheter"
          placeholder="请选择"
        >
          <el-option
            v-for="item in dgList"
            :key="item.id"
            :label="item.name"
            :value="item.name"
          ></el-option>
        </el-select>
      </div>
      <div class="cell">
        <label>并发症</label>
        <el-select
          multiple
          collapse-tags
          v-model="assessmentAfterDislysis.complication"
          placeholder="请选择"
        >
          <el-option
            v-for="item in bfzList"
            :key="item.id"
            :label="item.name"
            :value="item.name"
          ></el-option>
        </el-select>
      </div>

      <div class="cell width">
        <label>备注</label>
        <textarea
          type="text"
          class="textarea"
          v-model="assessmentAfterDislysis.remark"
        >
        </textarea>
      </div>

      <div class="cell width center">
        <button @click="commitInfo">提交</button>
      </div>
    </div>
  </div>
</template>

<script>
import { commitAssessmentAfterDislysis } from "@/api/dialysis";
import { Toast } from "vant";

export default {
  name: "AfterThoroughly",
  data() {
    return {
      assessmentAfterDislysis: {
        weight_after: "",
        weight_loss: "",
        temperature: "",
        pulse_frequency: "",
        breathing_rate: "",
        systolic_blood_pressure: "",
        diastolic_blood_pressure: "",
        actual_ultrafiltration: "",
        actual_displacement: "",
        cruor: "",
        symptom_after_dialysis: "",
        dialysis_intakes: "",
        internal_fistula: "",
        catheter: "",
        complication: "",
        actual_treatment_hour: "",
        remark: "",
        actual_treatment_minute: "",

        cruor_str: "",
        catheter_str: "",
        complication_str: "",
        symptom_after_dialysis_str: ""
      },
      title: "透后评估 ",
      record_date: "",
      patient: {
        id: 0
      }
    };
  },
  props: {
    record: {
      type: Object
    },
    patient_prop: {
      type: Object
    }
  },
  created() {
    this.nxList = this.$store.getters.cruor;
    this.txzrList = this.$store.getters.last_dialysis_after;
    this.dgList = this.$store.getters.catheter;
    this.bfzList = this.$store.getters.complication;

    var date = this.$route.query && this.$route.query.date;
    date *= 1000;
    var newDate = new Date(date);

    var y = newDate.getFullYear();
    var m = newDate.getMonth() + 1;
    var d = newDate.getDate();
    if (isNaN(y) || isNaN(m) || isNaN(d)) {
      newDate = new Date();
      y = newDate.getFullYear();
      m = newDate.getMonth() + 1;
      d = newDate.getDate();
    }
    this.record_date =
      y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d);
    this.patient.id = this.patient_prop.id;

    if (this.record != null && typeof this.record.id != "") {
      for (const key in this.assessmentAfterDislysis) {
        this.assessmentAfterDislysis[key] = this.record[key];
      }
    }
  },
  methods: {
    commitInfo: function() {
      let ParamsQuery = this.assessmentAfterDislysis;
      this.assessmentAfterDislysis.cruor_str = this.assessmentAfterDislysis.cruor.join(
        ","
      );
      this.assessmentAfterDislysis.catheter_str = this.assessmentAfterDislysis.catheter.join(
        ","
      );
      this.assessmentAfterDislysis.complication_str = this.assessmentAfterDislysis.complication.join(
        ","
      );
      this.assessmentAfterDislysis.symptom_after_dialysis_str = this.assessmentAfterDislysis.symptom_after_dialysis.join(
        ","
      );
      ParamsQuery["patient"] = this.patient_prop.id;
      ParamsQuery["record_date"] = this.record_date;

      commitAssessmentAfterDislysis(ParamsQuery).then(response => {
        if (response.data.state == 0) {
          Toast.fail(response.data.msg);

          return false;
        } else {
          Toast.success("提交成功");
          this.$emit(
            "assessmentAfterDislysis",
            response.data.data.assessmentAfterDislysis
          );
          // console.log(response.data.data.assessmentAfterDislysis);
          for (const key in response.data.data.assessmentAfterDislysis) {
            this.record[key] = response.data.data.assessmentAfterDislysis[key];
          }
        }
      });
    }
  }
};
</script>

<style style="stylesheet/scss" lang="scss" scoped></style>
