xt_pad/src/pages/main/dialog/modify_order/ModifyAdviceGroup.vue

<template>
  <div v-if="visibility" v-loading="loading">
    <div class="Dialog" style="width: 16.8rem;" v-show="sub_dialog_key == 0">
      <div class="DialogTit">
        <div class="back" @click="backAction">
          <span class="iconfont">&#xe720;</span>返回
        </div>
        <h1 class="name">修改医嘱</h1>
        <span class="success" @click="backAction">完成</span>
      </div>
      <div class="DialogContent choose">
        <div class="content clearfix">
          <div class="yzNav" style="width:90%;">
            <span @click="newAdviceAction">新增医嘱</span>
            <span @click="modifyAction" :class="{ forbid: current_advice_index < 0 }">修改医嘱</span>
          </div>
          <div style="overflow: hidden;">
            <div class="cell" style="margin-top: 0;">
              <label>医嘱类型</label>
              <el-input ref="advice_type" value="临时" disabled></el-input>
            </div>
            <div class="cell" style="margin-top: 0;">
              <label>开嘱时间</label>
              <el-input readonly :value="record_date_str"></el-input>
            </div>
            <div class="cell" style="margin-top: 0;">
              <label>开始时间</label>
              <el-input :value="start_time_str" readonly @focus="selectStartTimeAction"></el-input>
            </div>
            <div class="cell" style="margin-top: 0;">
              <label>开嘱医生</label>
              <span>{{ $store.getters.user.user.user_name }}</span>

            </div>
          </div>
          <table class="table">
            <tr @click="cancelSelectAdvice">
              <th width="30%">医嘱内容</th>
              <th width="20%">药品规格</th>
              <th width="10%">开药数量</th>
              <th width="10%">单次用量</th>
              <th width="15%">给药途径</th>
              <th width="15%">执行频率</th>
            </tr>
            <tr v-for="(advice, index) in advices" :key="index" :class="{ 'row-class-active': index == current_advice_index }" @click="selectAdviceAction(index, advice)">
              <td :class="{ 'advice_name': advice.parent_id == 0, 'subdrug_name': advice.parent_id > 0 }">{{ advice.advice_name }}</td>
              <td>{{ advice.advice_desc }}{{advice.drug_spec_unit}}</td>
              <td>{{ advice.prescribing_number }}{{ advice.prescribing_number_unit }}</td>
              <td>{{ advice.single_dose }} {{ advice.single_dose_unit }}</td>
              <td>{{ advice.parent_id == 0 ? advice.delivery_way : "" }}</td>
              <td>{{ advice.parent_id == 0 ? advice.execution_frequency : "" }}</td>
            </tr>
          </table>
        </div>
      </div>
    </div>

    <modify-advice-form
      ref="modify_advice_form"
      @back="sub_dialog_key = 0"
      @did-modify="didModifyAdvice"
      :delivery_way_options="delivery_way_options"
      :execution_frequency_options="execution_frequency_options"
      :single_dose_unit_options="single_dose_unit_options"
      :prescribing_number_unit_options="prescribing_number_unit_options"
      :drug_spec_unit_options="drug_spec_unit_options"
    ></modify-advice-form>

    <mt-datetime-picker
      ref="start_time_picker"
      type="datetime"
      @confirm="didSelectStartTime"
      v-model="start_time"
    ></mt-datetime-picker>

    <add-new-order-dialog
      v-show="sub_dialog_key == 2"
      @back-action="sub_dialog_key = 0"
      :patient_id="patient_id"
      :group_no="group_no"
      :drug_spec_unit_options="drug_spec_unit_options"
      :delivery_way_options="delivery_way_options"
      :execution_frequency_options="execution_frequency_options"
      :single_dose_unit_options="single_dose_unit_options"
      :prescribing_number_unit_options="prescribing_number_unit_options"
      :advice_templates="advice_templates"
      @did-create-advices="didCreateAdvices"
    ></add-new-order-dialog>
  </div>
</template>

<script>
import ModifyAdviceForm from "./modify_order_form";
import { parseTime } from "@/utils";
import {
  EditDoctorAdvice,
  modifyAdviceGroupStartTime,
} from "@/api/advice";
import { Toast } from 'vant';
import AddNewOrderDialog from "../new_order/AddNewOrders";

export default {
  name: "ModifyAdviceGroup",
  components: {
    ModifyAdviceForm,
    AddNewOrderDialog,
  },
  props: {
    patient_id: {
      type: Number,
      default: 0
    },
    advice_templates: {
      type: Array,
      default: function() {
        return [];
      }
    },
    drug_spec_unit_options: {
      type: Array,
      default: function() {
        return [];
      }
    },
    delivery_way_options: {
      type: Array,
      default: function() {
        return [];
      }
    },
    execution_frequency_options: {
      type: Array,
      default: function() {
        return [];
      }
    },
    single_dose_unit_options: {
      type: Array,
      default: function() {
        return [];
      }
    },
    prescribing_number_unit_options: {
      type: Array,
      default: function() {
        return [];
      }
    },
    advice_templates: {
      type: Array,
      default: function() {
        return [];
      }
    },
  },
  data() {
    return {
      visibility: false,
      loading: false,
      sub_dialog_key: 0,

      record_date: new Date(),
      start_time: new Date(),
      // start_time_str: "",

      group_no: 0,
      advices: [],

      current_advice_index: -1,
      current_advice: null,
    };
  },
  computed: {
    start_time_str: function() {
      if (this.start_time != null) {
        return parseTime(this.start_time, "{y}-{m}-{d} {h}:{i}") + ":00";
      }
      return ""
    },
    record_date_str: function() {
      if (this.record_date != null) {
        return parseTime(this.record_date, "{y}-{m}-{d} {h}:{i}");
      }
      return ""
    }
  },
  methods: {
    show: function(group_no, advices) {
      this.visibility = true;
      this.sub_dialog_key = 0;
      this.group_no = group_no
      this.advices = advices
      if (this.advices.length > 0) {
        this.start_time = new Date(this.advices[0].start_time * 1000)
        this.record_date = new Date(this.advices[0].created_time * 1000)
      }
    },
    backAction: function() {
      this.visibility = false;
      this.sub_dialog_key = 0;
      this.group_no = 0
      this.advices = []
      this.start_time = new Date()
      this.record_date = new Date()
      this.$emit("back");
    },
    selectStartTimeAction: function() {
      this.$refs.start_time_picker.open();
    },
    selectAdviceAction: function(index, advice) {
      this.current_advice_index = index
      this.current_advice = advice
    },
    cancelSelectAdvice: function() {
      this.current_advice_index = -1
      this.current_advice = null
    },
    modifyAction: function() {
      if (this.current_advice_index < 0) {
        return
      }
      this.sub_dialog_key = 1
      this.$refs.modify_advice_form.showWithModify({
          id: this.current_advice.id,
          parent_id: this.current_advice.parent_id,
          title: this.current_advice.advice_name,
          advice_desc: this.current_advice.advice_desc,
          drug_spec: this.current_advice.drug_spec,
          drug_spec_unit: this.current_advice.drug_spec_unit,
          delivery_way: this.current_advice.delivery_way,
          execution_frequency: this.current_advice.execution_frequency,
          single_dose: this.current_advice.single_dose,
          single_dose_unit: this.current_advice.single_dose_unit,
          prescribing_number: this.current_advice.prescribing_number,
          prescribing_number_unit: this.current_advice.prescribing_number_unit
        })
    },
    newAdviceAction: function() {
      this.cancelSelectAdvice()
      this.sub_dialog_key = 2
    },

    didSelectStartTime: function(time) {
      // Toast.loading({ forbidClick: true, duration: 0 });
      console.log(this.start_time)
      this.loading = true
      modifyAdviceGroupStartTime(this.group_no, parseTime(this.start_time, "{y}-{m}-{d} {h}:{i}") + ":00").then(rs => {
        if (rs.data.state == 1) {
          var new_start_time = rs.data.data.start_time
          for (let index = 0; index < this.advices.length; index++) {
            const advice = this.advices[index];
            advice.start_time = new_start_time
          }
          this.start_time = new Date(new_start_time * 1000)

        } else {
          Toast.fail(rs.data.msg)
        }
        this.loading = false

      }).catch(err => {
        Toast.fail(err)
        this.loading = false
      })
    },
    didModifyAdvice: function(advice) {
      this.loading = true
      EditDoctorAdvice(advice.id, {
        advice_name: advice.title,
        advice_desc: advice.advice_desc,
        remark:advice.remark,
        drug_spec_unit:advice.drug_spec_unit,
        delivery_way: advice.delivery_way,
        execution_frequency: advice.execution_frequency,
        single_dose: String(advice.single_dose),
        single_dose_unit: advice.single_dose_unit,
        prescribing_number: String(advice.prescribing_number),
        prescribing_number_unit: advice.prescribing_number_unit,
        drug_spec_unit:advice.drug_spec_unit
      }).then(rs => {
        if (rs.data.state == 1) {
          var resp_advice = rs.data.data.advice

          this.current_advice
          this.current_advice.advice_name = resp_advice.advice_name
          this.current_advice.advice_desc = resp_advice.advice_desc
          this.current_advice.drug_spec_unit = resp_advice.drug_spec_unit
          this.current_advice.remark = resp_advice.remark
          this.current_advice.delivery_way = resp_advice.delivery_way,
          this.current_advice.execution_frequency = resp_advice.execution_frequency,
          this.current_advice.single_dose = resp_advice.single_dose,
          this.current_advice.single_dose_unit = resp_advice.single_dose_unit,
          this.current_advice.prescribing_number = resp_advice.prescribing_number,
          this.current_advice.prescribing_number_unit = resp_advice.prescribing_number_unit
          this.sub_dialog_key = 0
          this.$refs.modify_advice_form.dismiss()

        } else {
          Toast.fail(rs.data.msg)
        }
        this.loading = false

      }).catch(err => {
        Toast.fail(err)
        this.loading = false
      })
    },
    didCreateAdvices: function(advices) {
      this.advices.push(...advices)
      this.sub_dialog_key = 0
    }
  }
};
</script>

<style style="stylesheet/scss" lang="scss" scoped>
.table {
  width: 100%;
  margin-top: 0.2rem;
  tr {
    th {
      background: $main-color;
      color: #fff;
      height: 0.88rem;
      line-height: 0.88rem;
    }
    td {
      line-height: 0.4rem;
    }

    .advice_name {
      text-align: left;
      padding-left: 10px;
      padding-right: 10px;
    }
    .subdrug_name {
      text-align: left;
      padding-left: 30px;
      padding-right: 10px;
    }
  }
}
.content {
  .cell {
    float: left;
    width: 3.5rem;
    margin: 0.35rem 0.3rem 0 0.4rem;
    label {
      display: block;
      height: 0.6rem;
      line-height: 0.6rem;
      color: $pgh-color;
      font-size: 0.32rem;
    }
    select {
      width: 100%;
      padding: 0.2rem 0;
      border: 1px $border-color solid;
      border-radius: 2px;
      padding-left: 5px;
    }

    .inputBox {
      border: 1px $border-color solid;
      border-radius: 2px;
      padding: 0.18rem 0;
      padding-left: 5px;
    }

    .textarea {
      width: 100%;
      height: 1.22rem;
      border: 1px $border-color solid;
      border-radius: 2px;
      padding-left: 5px;
    }
  }

  .doctor-name {
    line-height: 0.7rem;
    font-size: 0.35rem;
    margin-left: 0.4rem;
  }

  .row-class-active > td {
    background: #badcff;
    // color: #fff;
  }
}
</style>