elizebeth/src/xt_pages/dialysis/details/NavIgation.vue

<template>
  <div>
    <div class="grid">
      <div class="list">
        <ul>
          <li @click="showPrescription">
            <img src="@/assets/record/1.png" />
            <p>透析处方</p>
          </li>
          <li @click="showAccepts">
            <img src="@/assets/record/2.png" />
            <p>接诊评估</p>
          </li>
          <li @click="showAssessmentBefore">
            <img src="@/assets/record/3.png" />
            <p>透前评估</p>
          </li>
          <li @click="showDoctorAdviceDialog" class="newOrdersAdvice">
            <img src="@/assets/record/4.png" />
            <div>
              <p>临时医嘱</p>
              <span class="redpoint" v-if="getUnReadNum()">{{getUnReadNum()}}</span>
            </div>
          </li>
          <li @click="showDoubleCheck">
            <img src="@/assets/record/5.png" />
            <p>双人核对</p>
          </li>
        </ul>
      </div>
      <div class="list">
        <ul>
          <li @click="showComputerDialog">
            <img src="@/assets/record/6.png" />
            <p>透析上机</p>
          </li>
          <li @click="showMonitorDialog">
            <img src="@/assets/record/7.png" />
            <p>透析监测</p>
          </li>
          <li @click="showFinishDialog">
            <img src="@/assets/record/8.png" />
            <p>透析下机</p>
          </li>
          <li @click="showAssessmentAfterDialog">
            <img src="@/assets/record/9.png" />
            <p>透后评估</p>
          </li>
          <li @click="showrTeatmentSummary">
            <img src="@/assets/record/10.png" />
            <p>治疗小结</p>
          </li>
        </ul>
      </div>
    </div>

    <div class="middleLine"></div>

    <dialysis-prescription-dialog
      title="透析处方"
      ref="prescription"
      :patient="patient"
      :prescription="prescription"
      :solution="solution"
      @advice="adviceFunc"
      :niprocart_info="niprocart_info"
      :jms_info="jms_info"
      :fistula_needle_set_info="fistula_needle_set_info"
      :fistula_needle_set_16_info="fistula_needle_set_16_info"
      :hemoperfusion_info="hemoperfusion_info"
      :dialyser_sterilised_info="dialyser_sterilised_info"
      :filtryzer_info="filtryzer_info"
      :dialyzers_info="dialyzers_info"
      :injector_info="injector_info"
      :bloodlines_info="bloodlines_info"
      :tubingHemodialysis_info="tubingHemodialysis_info"
      :safe_package_info="safe_package_info"
      :aliquid_info="aliquid_info"
      :config="config"
      :admin_users="admin_users"
      :targetAdvices="longAdvices"
      :waitUploadAdvices="waitUploadAdvices"
      :is_open="is_open"
      :predialysis="predialysis_evaluation"
      :last_predialysis="last_predialysis_evaluation"
      :record="assessment_after_dislysis"
      :last_record="last_assessment_after_dislysis"
      :last_prescription="last_dialysis_prescribe"
      :dry_weight="last_dryWeight_dislysis"
      :schedual="temp_schedual"
    ></dialysis-prescription-dialog>

    <double-check-dialog
      title="双人核对"
      ref="doubleCheck"
      :patient="patient"
      :double_check="double_check"
      :admin_users="admin_users"
    ></double-check-dialog>

    <accepts-treatment-dialog
      title="接诊评估"
      ref="accepts"
      :patient="patient"
      :receiver_treatment_access="receiver_treatment_access"
    ></accepts-treatment-dialog>

    <assessment-before-dislysis-dialog
      title="透前评估"
      ref="assessmentBefore"
      :patient="patient"
      :last_predialysis="last_predialysis_evaluation"
      :predialysis_evaluation="predialysis_evaluation"
      :admin_users="admin_users"
      :dry_weight="last_dryWeight_dislysis"
    ></assessment-before-dislysis-dialog>

    <treatment-summary-dialog
      title="治疗小结"
      ref="treatmentSummary"
      :patient="patient"
      :treatment_summary="treatment_summary"
    ></treatment-summary-dialog>

    <doctor-advice-dialog
      title="临时医嘱"
      ref="doctor_advice"
      :doctor_advices="doctor_advices"
      :patient="patient"
      :admin_users="admin_users"
      :dialysis_order="dialysis_order"
    ></doctor-advice-dialog>

    <computer-dialog
      title="透析上机"
      ref="computer_dialog"
      :dialysis_order="dialysis_order"
      :schedule="schedual"
      @monitor="add_monitor"
      :admins="admin_users"
      :device_numbers="device_numbers"
      :special_premission="special_premission"
    ></computer-dialog>

    <monitor-dialog
      title="透析监测"
      ref="monitor_dialog"
      :monitors="monitor_records"
      @monitor="add_monitor"
    ></monitor-dialog>

    <finish-dialog
      title="透析下机"
      ref="finish_dialog"
      :dialysis_order="dialysis_order"
      :schedule="schedual"
      :admins="admin_users"
      :prescription="prescription"
      @assessmentAfterDislysis="assessmentAfterDislysisFunc"
      :special_premission="special_premission"
    ></finish-dialog>

    <assessment-after-dislysis
      title="透后评估"
      ref="assessment_after_dislysis"
      :assessment_after_dislysis="assessment_after_dislysis"
      :patient="patient"
      :dialysis_order="dialysis_order"
    ></assessment-after-dislysis>
  </div>
</template>

<script>
import dialysisPrescriptionDialog from "./dialog/dialysisPrescriptionDialog";
import doubleCheckDialog from "./dialog/doubleCheckDialog";
import AssessmentAfterDislysis from "./dialog/AssessmentAfterDislysis";
import acceptsTreatmentDialog from "./dialog/acceptsTreatmentDialog";
import assessmentBeforeDislysisDialog from "./dialog/assessmentBeforeDislysisDialog";
import MonitorDialog from "./dialog/monitor_dialog";
import DoctorAdviceDialog from "./dialog/DoctorAdviceDialog";
import treatmentSummaryDialog from "./dialog/treatmentSummaryDialog";
import ComputerDialog from "./dialog/computer_dialog";
import FinishDialog from "./dialog/finish_dialog";

export default {
  name: "NavIgation",
  components: {
    dialysisPrescriptionDialog,
    doubleCheckDialog,
    AssessmentAfterDislysis,
    acceptsTreatmentDialog,
    assessmentBeforeDislysisDialog,
    treatmentSummaryDialog,
    MonitorDialog,
    DoctorAdviceDialog,
    ComputerDialog,
    FinishDialog
  },

  data() {
    return {
      temp_schedual: null
    };
  },
  mounted() {},

  props: {
    longAdvices: {
      // 临时医嘱
      type: Array,
      default: () => {
        return [];
      }
    },
    waitUploadAdvices: {
      // 临时医嘱
      type: Array,
      default: () => {
        return [];
      }
    },
    is_open: {
      // 临时医嘱
      type: Number,
      default: () => {
        return 0;
      }
    },
    patient: {
      // 患者信息
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    schedual: {
      // 患者排班信息
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    prescription: {
      // 透析处方
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    solution: {
      // 透析方案
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },  system_prescribe: {
      // 系统透析方案
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },

    receiver_treatment_access: {
      // 接诊评估
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    predialysis_evaluation: {
      // 透前评估
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    doctor_advices: {
      // 临时医嘱
      type: Array,
      default: () => {
        return [];
      }
    },
    double_check: {
      // 双人核对
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    assessment_after_dislysis: {
      // 透后评估
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    treatment_summary: {
      // 治疗小结
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    monitor_records: {
      // 透析监测
      type: Array,
      default: () => {
        return [];
      }
    },
    dialysis_order: {
      // 透析记录
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    admin_users: {
      // 系统用户列表
      type: Array,
      default: () => {
        return [];
      }
    },
    devices: {
      // 设备
      type: Array,
      default: () => {
        return [];
      }
    },
    device_numbers: {
      // 床位
      type: Array,
      default: () => {
        return [];
      }
    },

    niprocart_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    jms_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    fistula_needle_set_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    fistula_needle_set_16_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    hemoperfusion_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    dialyser_sterilised_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    filtryzer_info: {
      type: Array,
      default: () => {
        return [];
      }
    },

    dialyzers_info: {
      type: Array,
      default: () => {
        return [];
      }
    },
    injector_info: {
      type: Array,
      default: () => {
        return [];
      }
    },
    bloodlines_info: {
      type: Array,
      default: () => {
        return [];
      }
    },
    tubingHemodialysis_info: {
      type: Array,
      default: () => {
        return [];
      }
    },
    safe_package_info: {
      type: Array,
      default: () => {
        return [];
      }
    },
    aliquid_info: {
      type: Array,
      default: () => {
        return [];
      }
    },
    headNurses: {
      type: Array,
      default: () => {
        return [];
      }
    },

    config: {
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },

    admin_user_map: {
      // {user_id: admin_user object}
      type: Object,
      default: () => {
        return {};
      }
    },
    device_map: {
      // {device_id: device object}
      type: Object,
      default: () => {
        return {};
      }
    },
    device_number_map: {
      // {device_number_id: device_number object}
      type: Object,
      default: () => {
        return {};
      }
    },

    last_predialysis_evaluation: {
      //最后一条透前
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    last_monitor_record: {
      //最后一条监测记录
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    last_assessment_after_dislysis: {
      //最后一条透后记录 (除了今天录的)
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    last_dialysis_prescribe: {
      //最后一条透析处方(除了今天录的)
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    last_dryWeight_dislysis: {
      //最后一条干体重 (除了今天录的)
      type: Object,
      default: () => {
        return { id: 0 };
      }
    },
    special_premission: {
      type: Array,
      default: () => {
        return [];
      }
    }
  },
  methods: {
    getUnReadNum: function() {
      let doctorAdvice = [];
      for (let y = 0; y < this.doctor_advices.length; y++) {
        if (this.doctor_advices[y].execution_state == 2) {
          doctorAdvice.push(this.doctor_advices[y]);
        }
      }
      const sorted = this.groupBy(doctorAdvice, function(item) {
        return [item.groupno];
      });
      console.log(doctorAdvice);
      console.log(sorted.length);

      return sorted.length;
    },
    groupBy(array, f) {
      const groups = {};
      array.forEach(function(o) {
        const group = JSON.stringify(f(o));
        groups[group] = groups[group] || [];
        groups[group].push(o);
      });
      return Object.keys(groups).map(function(group) {
        return groups[group];
      });
    },
    setLastRecord: function(
      lastPredialysisEvaluation,
      lastMonitorRecord,
      lastAssessmentAfterDislysis,
      lastDialysisPrescribe,
      lastDryWeightDislysis,
      schedual,
      system_prescribe
    ) {

      this.$refs.assessmentBefore.setLastRecord(
        lastPredialysisEvaluation,
        lastDryWeightDislysis
      );
      this.$refs.prescription.setLastRecord(
        schedual,
        lastAssessmentAfterDislysis,
        lastPredialysisEvaluation,
        lastDialysisPrescribe,
        lastDryWeightDislysis,
        system_prescribe
      );

      // this.temp_schedual = schedual
    },

    add_monitor: function(monitor) {
      this.monitor_records.push(monitor);
      console.log(this.monitor_records);
      this.monitor_records.sort((a, b) => b.operate_time - a.operate_time);
      this.monitor_records.reverse();
      console.log(this.monitor_records);

      this.$refs.monitor_dialog.setRecords(this.monitor_records);
    },
    adviceFunc: function() {
      this.$emit("advice");
    },
    showMonitorDialog: function() {
      this.$refs.monitor_dialog.show();
    },
    showAssessmentAfterDialog: function() {
      this.$refs.assessment_after_dislysis.show(this.assessment_after_dislysis);
    },
    showDoctorAdviceDialog: function() {
      this.$refs.doctor_advice.show();
    },
    showComputerDialog: function() {
      this.$refs.computer_dialog.show(this.dialysis_order);
    },
    showFinishDialog: function() {
      this.$refs.finish_dialog.show(this.dialysis_order);
    },
    showPrescription: function() {
      this.$refs.prescription.show(this.prescription,this.schedual);
    },
    showAccepts: function() {
      this.$refs.accepts.show(this.receiver_treatment_access);
    },
    showAssessmentBefore: function() {
      this.$refs.assessmentBefore.show(this.predialysis_evaluation);
    },
    showDoubleCheck: function() {
      this.$refs.doubleCheck.show();
    },
    showrTeatmentSummary: function() {
      this.$refs.treatmentSummary.show(this.treatment_summary);
    },
    assessmentAfterDislysisFunc: function(val) {
      this.assessment_after_dislysis = val;
      this.$refs.assessment_after_dislysis.setRecords(
        this.assessment_after_dislysis
      );
      this.$emit("assessmentAfterDislysis", this.assessment_after_dislysis);
    }
  }
};
</script>
<style style="stylesheet/scss" lang="scss" scoped>
.grid {
  padding: 10px 0 20px 0;
  .list {
    ul {
      @include display-flex;
      @include align-items-center;
      @include text-align;
      @include justify-content-around;
      cursor: pointer;
      li {
        font-size: 12px;
        color: #5d6b7a;
        margin-top: 20px;

        p {
          height: 30px;
          line-height: 30px;
          color: #34495e;
          font-size: 14px;
        }
        img {
          width: 50px;
          height: 50px;
        }
      }
    }
  }
}
.txsj {
  text-align: center;
  margin-bottom: 20px;
}
.redpoint {
  display: inline-block;
  height: 26px;
  width: 26px;
  line-height: 26px;
  text-align: center;
  font-size: 16px;
  border-radius: 20px;
  color: #fff;
  background: #f56c6c;
  position: absolute;
  top: -6px;
  right: -8px;
  border: 1px solid #fff;
}
.newOrdersAdvice {
  position: relative;
}
</style>