<template>
 <div>
    <div class="Dialog" v-show="isShowDialog" >
        <div class="DialogTit">
            <span @click="close()" class="iconfont">&#xe6e9;</span>
            <h1 class="name">治疗小结</h1>
            <span @click="commitInfo" class="success">完成</span>
        </div>

        <div class="DialogContent choose " id="dialogTop">
          <el-form  :model="dialysisSummary" label-width="90px">
              <el-form-item label="透后宣教 : ">
                <!-- <el-select @change="dialysisAfterTeachSelectChange" v-model="dialysisSummary.text1" placeholder="请选择">
                  <el-option v-for="(s, index) in teach" :label="s.text" :value="s.value" :key="index"></el-option>
                </el-select> -->
              <el-input readonly v-model="dialysisSummary.propagandaAndEducationContentSelect" placeholder="请选择" @focus="showSubMenu('education')" ></el-input>
              </el-form-item>
              <el-form-item label-width="0"  >
                <el-input type="textarea" v-model="dialysisSummary.propagandaAndEducationContent" :rows="5"></el-input>

              </el-form-item>
              <el-form-item label="透析小结 : ">
                <!-- <el-select @change="dialysisSummarySelectChange"  v-model="dialysisSummary.text2"
                           placeholder="请选择">
                  <el-option v-for="(s, index) in summary" :label="s.text" :value="s.value"
                             :key="index"></el-option>
                </el-select> -->
                
              <el-input readonly v-model="dialysisSummary.summaryContentSelect" placeholder="请选择" @focus="showSubMenu('summary')" ></el-input>

              </el-form-item>

              <el-form-item label-width="0"  >
                <el-input @focus="lastInputFocus" @blur="lastInputBlur" type="textarea" v-model="dialysisSummary.summaryContent" :rows="5"></el-input>
              </el-form-item>
          </el-form>
          <!-- <div class="button">
              <button @click="commitInfo" class="submitButton">提交</button>
          </div> -->
        </div>
    </div>
    
    <check-box-sub-menu :visibility="visibility" v-on:menu-cancle="menuCancle" v-on:menu-comfirm="menuComfirm" :propsForm="propForm"></check-box-sub-menu>
  </div>
</template>

<script>
import { commitTreatmentSummary } from "@/api/dialysis";
import { Toast } from "vant";
import CheckBoxSubMenu from "./subMenu/checkBoxSubMenu";
import {getDataConfig} from '@/utils/data';

export default {
  name: "TreatmentDialog",
  data() {
    return {
      isShowDialog:true,
      
      visibility: false,
      propForm: {
        title: '',
        list: [],
        optionList: [],
        isMultiple: 2,
        result: [], //选中的值
        type: 1, //用来区分不同子菜单，方便对返回值进行赋值
        selectId: 0,
      },

      dialysisSummary: {
        text: "",
        propagandaAndEducationContent: "",
        propagandaAndEducationContentSelect:'',
        text2: "",
        summaryContent: "",
        summaryContentSelect: "",
        changeMedicalNurse: "",
        treatNurse: "",
        checkStaff: "",
        deboardNurse: "",
        treatDoctor: ""
      },
      summary: [],
      summaryObj: {},
      teach: [],
      teachObj:{},
      title: "治疗小结 ",
      record_date:"",
      patient: {
        id: 0
      }
    };
  },
  props: {
    record: {
      type: Object
    },
    patient_prop: {
      type: Object
    }
  },
  created() {
    // this.summary = this.$store.getters.summary;
    this.summary = getDataConfig('summary','summary');
    // console.log("this.summary",this.summary)
    // this.teach = this.$store.getters.teach;
    this.teach =  getDataConfig('education','education');

    if (this.teach.length>0) {
      var tlen = this.teach.length;
      for (let index = 0; index < tlen; index++) {
        this.teach[index].name = this.teach[index].text;
        this.teachObj[this.teach[index].id] = this.teach[index];
      }
    }
    if (this.summary.length>0) {
      var tlen = this.summary.length;
      for (let index = 0; index < tlen; index++) {
        this.summary[index].name = this.summary[index].text;
        this.summaryObj[this.summary[index].id] = this.summary[index];
      }
    }

    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 && this.record.id != '') {
      // for (const key in this.record) {
      //   this.dialysisSummary[key] = this.record[key];
      // }
      // if(this.record.mission != 'undefined'){
      //   this.dialysisSummary.propagandaAndEducationContent = this.record.mission
      // }
      // if(this.record.dialysis_summary != 'undefined'){
      //   this.dialysisSummary.summaryContent = this.record.dialysis_summary
      // }


    }
    console.log(this.dialysisSummary.propagandaAndEducationContent)
    console.log(this.dialysisSummary.summaryContent)
  },
  methods: {
    lastInputFocus: function(event) {
      var input = event.target;
      setTimeout(function() {
        input.style.marginBottom = "2rem";
        input.parentNode.scrollIntoView();
      }, 0);
    },
    lastInputBlur: function(event) {
      var input = event.target;
      setTimeout(function() {
        input.style.marginBottom = "";
      }, 0);
    },
    showSubMenu: function (val) {
      switch (val) {
        case 'education':
          this.propForm.type = 1
          this.isShowDialog = false
          this.propForm.title = '透后宣教'
          this.visibility = true
          this.propForm.list = []
          this.propForm.optionList = this.teach;
          this.propForm.isMultiple = 1;
          this.propForm.selectId = this.dialysisSummary.xjid;
          break;
        case 'summary':
          this.propForm.type = 2
          this.isShowDialog = false
          this.propForm.title = '透析小结'
          this.visibility = true
          this.propForm.list = []
          this.propForm.optionList = this.summary;
          this.propForm.isMultiple = 1;
          this.propForm.selectId = this.dialysisSummary.xxjid;
          break;
      }

    },
    menuCancle: function () {
        this.visibility = false
        this.isShowDialog = true
    }, 
    menuComfirm: function (val) {

      this.visibility = false
      this.isShowDialog = true
      switch (val.type) {
        case 1:
          if(val.selectId in this.teachObj) {
            var theValue = this.teachObj[val.selectId].value;
            this.dialysisAfterTeachSelectChange(theValue);
            this.dialysisSummary.xjid = val.selectId;
            this.dialysisSummary.propagandaAndEducationContentSelect = this.teachObj[val.selectId].name;
          }
          break
        case 2:
          if(val.selectId in this.summaryObj) {
            var theValue = this.summaryObj[val.selectId].value;
            this.dialysisSummarySelectChange(theValue);
            this.dialysisSummary.xxjid = val.selectId;
            this.dialysisSummary.summaryContentSelect = this.summaryObj[val.selectId].name;
          }
          break
      }

    }, 

    dialysisSummarySelectChange: function(values) {
      if(this.dialysisSummary.summaryContent == null){
        this.dialysisSummary.summaryContent == ""
      }

      if (this.dialysisSummary.summaryContent == "") {
        this.dialysisSummary.summaryContent = values;
      } else {
        if (this.dialysisSummary.summaryContent.indexOf(values) == -1) {
          if (
            this.dialysisSummary.summaryContent
              .charAt(this.dialysisSummary.summaryContent.length - 1)
              .indexOf("。") == -1
          ) {
            this.dialysisSummary.summaryContent =
              this.dialysisSummary.summaryContent + "," + values;
          } else {
            this.dialysisSummary.summaryContent =
              this.dialysisSummary.summaryContent + "," + values;
            this.dialysisSummary.summaryContent =
              this.dialysisSummary.summaryContent + values;
          }
        }
      }
    },
    dialysisAfterTeachSelectChange: function(values) {
      if(this.dialysisSummary.propagandaAndEducationContent == null){
        this.dialysisSummary.propagandaAndEducationContent == ""
      }
      if (this.dialysisSummary.propagandaAndEducationContent == "") {
        this.dialysisSummary.propagandaAndEducationContent = values;
      } else {
        if (this.dialysisSummary.propagandaAndEducationContent.indexOf(values) == -1) {
          if (
            this.dialysisSummary.propagandaAndEducationContent
              .charAt(
                this.dialysisSummary.propagandaAndEducationContent.length - 1
              )
              .indexOf("。") == -1
          ) {
            this.dialysisSummary.propagandaAndEducationContent =
              this.dialysisSummary.propagandaAndEducationContent + "," + values;
          } else {
            this.dialysisSummary.propagandaAndEducationContent =
              this.dialysisSummary.propagandaAndEducationContent + values;
          }
        }
      }
    },
    commitInfo: function() {
      Toast.loading({forbidClick: true, duration: 0})
      let ParamsQuery = this.dialysisSummary;
      ParamsQuery['patient'] = this.$route.query.patient_id
      ParamsQuery["record_date"] = this.record_date
      commitTreatmentSummary(ParamsQuery).then(response => {
        if (response.data.state == 0) {
          Toast.fail(response.data.msg);
          return false;
        } else {
          Toast.success("提交成功");

          this.$emit("did_update", response.data.data.summary);
          for (const key in response.data.data.summary) {
            this.record[key] = response.data.data.summary[key]
          }
        }
      });
    },
    close: function() {
      this.$emit("close");
    }, open:function(){
        this.isShowDialog = true;
        this.visibility = false;
        var dialogTop = document.querySelector('#dialogTop');
        if (dialogTop != null) {
          this.$nextTick(() => {
              dialogTop.scrollTop = 0;
          });
        }
      }
  },
  
  components: {
    CheckBoxSubMenu,
  },


};
</script>

<style style="stylesheet/scss" lang="scss" scoped>
.choose {
  padding: 0.6rem 0.6rem 0 0.6rem;
  .button {
    text-align: center;
    .submitButton {
      width: 3rem;
      height: 0.8rem;
      line-height: 0.8rem;
      background: $main-color;
      color: #fff;
      font-size: 0.3rem;
      text-align: center;
      border-radius: 6px;
    }
  }
}

</style>

