<template>
  <div class="newly-increased-wrap">
    <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" ></bread-crumb>
    <div class="component-content screenSet">
      <el-tabs v-model="activeName2" @tab-click="handleTabClick" class="tab-list">
        <el-tab-pane label="单个录入" name="first" class="single-input">
          <el-row class="save-and-add">
            <el-button type="primary" @click="saveEdit">保存并新增</el-button>
          </el-row>
          <edit-information
            ref="newForm"
            :patientInfoObj="patientInfo"
            :checkForm="checkForm"
            @addListenSave="addListenSave"
            :patientId="patientId">
          </edit-information>
        </el-tab-pane>
        <el-tab-pane label="二维码录入" name="second">
          <QRCodeImport v-if="activeName2 == 'second'"></QRCodeImport>
        </el-tab-pane>
        <el-tab-pane label="批量导入" name="third">
          <BatchImport v-if="activeName2 == 'third'"></BatchImport>
        </el-tab-pane>
    </el-tabs>
    </div>

  </div>
</template>

<script>
  import BreadCrumb from "@/components/breadcrumb.vue";
  import EditInformation from '../mypatients-manage/components/edit-information'
  import QRCodeImport from './components/qr-code-import';
  import BatchImport from './components/batch-import';
  import {
    savePatientInfo
  } from "@/utils/patients/patientsapi";

  export default {
    name: 'newPatient',
    data() {
      return {
        curmbFirst: "居民管理",
        curmbSecond: "新增居民",
        activeName2: 'first',
        patientInfo: {},
        checkForm: false,
        patientId: '',
      }
    },
    components: {
      BreadCrumb,
      EditInformation,
      QRCodeImport,
      BatchImport,
    },
    created() {
      let tabIndex = this.$route.query.tab;
      if((typeof tabIndex == 'undefined') || (tabIndex == '')){
        return;
      }
      tabIndex = parseInt(tabIndex);
      let numArr = [1, 2, 3];
      let tabList = ['first', 'second', 'third'];
      if( numArr.indexOf(tabIndex) > -1 ){
        this.activeName2 = tabList[tabIndex-1];
      }else{
        this.activeName2 = 'first';
      }
    },
    // 挂载到Dom完成时
    mounted() {
      // commonUtil.resizeHeight();
    },
    methods: {
      handleTabClick(tab, event) {
        // console.log(tab, event);
      },
      saveEdit() {
        this.checkForm = true;
      },
      addListenSave(val) {
        this.checkForm = false;
        if(val.status) {
          // this.patientInfo = val.patientInfoForm
          // console.log('填写内容',val.patientInfoForm);
          savePatientInfo({
            ...val.patientInfoForm,
            addType: 6
          }).then(data => {
            if(data.code == '000000'){
              this.$message.success('新增成功')
              setTimeout(() => {
                this.$refs.newForm.$refs.patientInfoForm.resetFields()
                this.$refs.newForm.diseaseIdList = [];
                this.$refs.newForm.labelIdList = [];
                this.$refs.newForm.addressList = [];
                // 清空已选的诊断列表
                this.$store.dispatch('patientsDiagnose/changeDiagnoseList', []);

                // this.$router.go(0);//体验不好
              },500)
            }else {
              this.$message.error(data.message);
            }
          })
          //  调用保存接口
        }else {
          this.$message.error('请正确填写信息');
        }
      },
    }
  }
</script>

<style lang="less">
  @import "../../../style/patient-manager/new-patient/new-patient-wrap.less";
</style>

<style lang="less">
  @import "../../../style/patient-manager/new-patient/new-patient.less";
</style>

