elizebeth/src/xt_pages/outpatientCharges/components/registerDialog.vue

<template>
  <el-dialog width="854px" class="registerDialog" :title="titles" :visible.sync="visibility"
             :close-on-click-modal="isClose"
             :close-on-press-escape="isClose">

    <el-form :model="form" :rules="rules" ref="formValue" label-width="100px">
      <el-form-item label="患者姓名：" prop="name" :validate-event="is_Name">
        <el-autocomplete
          class="checkSearch"
          popper-class="my-autocomplete"
          v-model="form.name"
          :fetch-suggestions="querySearchAsync"
          :trigger-on-focus="false"
          placeholder="请输入病人名字"
          @select="handleSelect"
          style="width:160px;"
        >
          <i class="el-icon-search el-input__icon" slot="suffix"></i>
          <template slot-scope="{ item }">
            <div class="name">{{ item.name }}</div>
          </template>
        </el-autocomplete>
      </el-form-item>

      <el-form-item label="性别：" prop="gender" :validate-event="is_Name">
        <el-select v-model="form.gender" placeholder="请选择" style="width:100%;">
          <el-option
            v-for="item in sex"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>


      </el-form-item>

      <el-form-item label="年龄：" prop="age" :validate-event="is_Name">
        <el-input v-model="form.age"></el-input>
      </el-form-item>


      <el-form-item label="出生日期：" prop="birthday" :validate-event="is_Name">
        <el-date-picker v-model="form.birthday" type="date" format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd" placeholder="选择日期" style="width:100%;"></el-date-picker>
      </el-form-item>

      <el-form-item label="手机号码：" prop="phone">
        <el-input v-model="form.phone"></el-input>
      </el-form-item>


      <el-form-item label="医疗类别：">
        <el-select v-model="form.medical_care" placeholder="请选择" style="width:100%;">
          <el-option
            v-for="(item,index) in getDictionaryDataConfig('system','social_type')"
            :key="index"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="证件类型：" prop="certificates" :validate-event="is_Name">
        <el-select v-model="form.certificates" placeholder="请选择" style="width:100%;">
          <el-option
            v-for="item in certificates"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="证件号码：" prop="id_card" :validate-event="is_Name">
        <el-input v-model="form.id_card"></el-input>
      </el-form-item>

      <el-form-item label="处方类型：" prop="p_type" :validate-event="is_Name">
        <el-select style="margin-right:5px;width:100px;" v-model="form.p_type" placeholder=""
                   >
          <el-option
            v-for="(item,index) in registers"
            :key="index"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="大病类别：" prop="sick_type" :validate-event="is_Name">
        <el-select style="margin-right:5px;width:100px;" v-model="form.sick_type" placeholder="">
          <el-option
            v-for="(item,index) in sick"
            :key="index"
            :label="item.class_name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="诊断：" prop="diagnosis" :validate-event="is_Name">
        <el-select style="margin-right:5px;width:100px;" v-model="form.diagnosis" placeholder="">
          <el-option
            v-for="(item,index) in diagnoses"
            :key="index"
            :label="item.class_name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="结算类型：">
        <el-select v-model="form.settlement_value" placeholder="请选择" style="width:100%;">
          <el-option
            v-for="item in settlement"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="社保类型：">
        <el-select v-model="form.social_type" placeholder="请选择" style="width:100%;">
          <el-option
            v-for="item in medicalCare"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="读卡类型：" prop="id_card_type" :validate-event="is_Name">
        <el-select v-model="form.id_card_type" placeholder="请选择">
          <el-option
            v-for="item in IDCardTypes"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>


      <el-form-item class="specialFormItem" label="医保卡号：">
        <div style="display:flex;">
          <el-input v-model="form.medical_insurance_card"></el-input>
          <el-button style="margin-left:10px;" type="primary" @click="reading">读卡</el-button>

        </div>
      </el-form-item>

      <el-form-item label="挂号类型：" prop="register" :validate-event="is_Name">
        <el-select v-model="form.register" placeholder="请选择" style="width:100%;">
          <el-option
            v-for="item in register"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="挂号费：">
        <el-input v-model.number="form.registration_fee"></el-input>
      </el-form-item>
      <el-form-item label="诊疗费：">
        <el-input v-model.number="form.medical_expenses"></el-input>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
    <el-button @click="cancel('formValue')">取 消</el-button>
    <el-button type="primary" @click="confirm('formValue')">挂 号</el-button>
  </span>
  </el-dialog>

</template>

<script>
  import {uParseTime} from "@/utils/tools";
  import axios from 'axios'
  import {PostSearch} from '@/api/patient'

  import {getDictionaryDataConfig} from '@/utils/data'

  export default {

    name: 'registerDialog',

    data() {

      return {
        registers: [
          {value: 11, label: "普通门诊"},
          {value: 12, label: '门诊挂号'},
          {value: 13, label: "急诊"},
          {value: 14, label: "门诊特殊病"},
          {value: 15, label: "门诊统筹"},
          {value: 16, label: "门诊慢性病"},
          {value: 21, label: "普通住院"},

        ],
        form: {
          id: '',
          settlement_value: '',
          medical_insurance_card: '',
          name: '',
          gender: '',
          certificates: 1,
          p_type:'',
          sick_type:'',
          diagnosis:'',
          medical_care: '',
          birthday: '',
          age: '',
          id_card: '',
          register: '',
          doctor: '',
          id_card_type: 1,
          department: '',
          registration_fee: '',
          medical_expenses: '',
          cost: '',
          phone: '',
          social_type: '',
        }, IDCardTypes: [{
          value: 1,
          label: '社保卡'
        }, {
          value: 2,
          label: "身份证"
        }, {
          value: 3,
          label: "电子凭证"
        },],
        settlement: [
          {value: 1, label: '医保'},
          {value: 2, label: '自费'},
          {value: 3, label: '公费'},
          {value: 4, label: '农保'},
          {value: 5, label: '会员'},
          {value: 6, label: '职工'},
          {value: 7, label: '合同'}
        ],
        sex: [{
          value: 1,
          label: '男'
        }, {
          value: 2,
          label: '女'
        }],
        certificates: [{
          value: 1,
          label: '内地身份证'
        }, {
          value: 2,
          label: "社保卡"
        }, {
          value: 3,
          label: "护照"
        }, {
          value: 4,
          label: "军官证"
        }, {
          value: 5,
          label: "台胞证"
        }, {
          value: 6,
          label: "港澳地区身份证"
        }],
        medicalCare: [{
          value: 1,
          label: '职工基本医疗保险'
        }, {
          value: 2,
          label: "公务员医疗补助"
        }, {
          value: 3,
          label: "大额医疗费用补助"
        }, {
          value: 4,
          label: "离休人员医疗"
        }, {
          value: 5,
          label: "城乡居民基本医疗保险"
        }, {
          value: 6,
          label: "城乡居民大病医疗保险"
        },
          {
            value: 7,
            label: "生育保险"
          }],
        register: [{
          value: 1,
          label: '普通'
        }, {
          value: 2,
          label: "主治"
        }, {
          value: 3,
          label: "主任"
        }, {
          value: 4,
          label: "免收诊金"
        }, {
          value: 5,
          label: "专家"
        }],
        rules: {
          name: [{required: true, message: "患者姓名不能为空", trigger: 'blur'}],
          gender: [{required: true, message: "患者性别不能为空", trigger: 'blur'}],
          id_card: [{required: true, message: '证件号码不能为空', trigger: 'blur'}],
          register: [{required: true, message: '请选择挂号类型', trigger: 'blur'}],
          doctor: [{required: true, message: '请选择医生', trigger: 'blur'}],
          department: [{required: true, message: '请填写科室', trigger: 'blur'}],
          age: [{required: true, message: "患者年龄不能为空", trigger: 'blur'}],
          birthday: [{required: true, message: "患者出生日期不能为空", trigger: 'blur'}],
          certificates: [{required: true, message: "证件类型不能为空", trigger: 'change'}],
          id_card_type: [{required: true, message: "读卡类型不能为空", trigger: 'change'}],

          p_type: [{required: true, message: "处方类型不能为空", trigger: 'change'}],
          sick_type: [{required: true, message: "大病类别不能为空", trigger: 'change'}],
          diagnosis: [{required: true, message: "诊断不能为空", trigger: 'change'}],

        },

        visibility: false,
        labelPosition: 'right',
        isClose: false,

        resetForm: {
          settlement_value: '',
          medical_insurance_card: '',
          name: '',
          gender: '',
          certificates: '',
          id_card_type: '',
          medical_care: '',
          birthday: '',
          age: '',
          id_card: '',
          register: '',
          doctor: '',
          department: '',
          registration_fee: '',
          medical_expenses: '',
          cost: '',
          phone: '',
          social_type: '',
        },

      }
    },
    props: {

      titles: {
        type: String,
        default: ''
      },
      formValue: {
        type: Object
      },
      type: {
        type: Number,
        default: 1

      },
      isCreated: {
        type: Number,
        default: 1

      },
      sick: Array,
      diagnoses: Array,
    },
    methods: {
      handleSelect(val) {
        this.form.id = val.id
        this.form.name = val.name
        this.form.gender = val.gender
        this.form.age = val.age
        this.form.birthday = uParseTime(val.birthday, '{y}-{m}-{d}')
        this.form.phone = val.phone
        this.form.id_card = val.id_card_no
      },
      querySearchAsync(keyword, cb) {
        let key = ''
        if (keyword != undefined) {
          key = keyword
        }
        let searchArray = []
        PostSearch(key).then(response => {
          if (response.data.state == 1) {
            searchArray = response.data.data.patient
            cb(searchArray)
          } else {
            cb([])
          }
        })
      },
      reading(medicalInsuranceCard) {
        var that = this
        if (this.form.id_card_type.length == 0 || this.form.id_card_type == 0) {
          this.$message.error("请先选择读卡类型")
          return
        }
        let params = {
          'id_card_type': this.form.id_card_type,
        }
        axios.get('http://127.0.0.1:9532/api/sscard', {
          params: params
        })
          .then(function (response) {
            if (response.data.state == 0) {
              that.$message.error(response.data.msg)
              return false
            } else {
              var patient = response.data.data.patient

              if (that.form.id_card_type == 1) {
                this.form.id = patient.id
                that.form.name = patient.name
                that.form.sex = patient.gender
                that.form.age = patient.age
                that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
                that.form.phone = patient.phone
                that.form.idCard = patient.id_card_no
                that.form.medicalInsuranceCard = response.data.data.number

              } else if (that.form.id_card_type == 2) {
                this.form.id = patient.id
                that.form.name = patient.name
                that.form.sex = patient.gender
                that.form.age = patient.age
                that.form.birthday = uParseTime(patient.birthday, '{y}-{m}-{d}')
                that.form.phone = patient.phone
                that.form.idCard = patient.id_card_no
              }
              that.$message({message: '读卡成功', type: 'success'})
            }
          })
          .catch(function (error) {

          });


      },
      getDictionaryDataConfig(module, filed_name) {
        return getDictionaryDataConfig(module, filed_name)
      },
      show: function () {
        // this.form.name = patientInfo.name
        // this.form.gender = patientInfo.gender
        // this.form.age = patientInfo.age
        // this.form.birthday = patientInfo.birthday
        // this.form.phone = patientInfo.phone
        // this.form.birthday = patientInfo.birthday
        // this.form.id_card = patientInfo.id_card_no
        // this.form.social_type = patientInfo.health_care_type
        // this.form.id_card_type = 1
        // if( this.form.social_type == 0){
        //   this.form.social_type = ""
        //
        // }
        this.visibility = true

      }, hide: function () {
        this.visibility = false
      }, cancel: function (formName) {
        this.$emit('cancel', this.getValue())
        this.$refs['formValue'].resetFields()
      },
      confirm: function (formName) {
        this.$refs['formValue'].validate((valid) => {
          if (valid) {
            let value = {}
            value = this.getValue()
            this.$emit('confirm', value)
            this.form = Object.assign({}, this.resetForm)
          }
        })
      },
      getValue: function () {
        let form = {}
        form = this.form
        return form
      }
    }

  }
</script>

<style lang="scss" scoped>
  .registerDialog {

  .el-form {
    display: flex;
    flex-wrap: wrap;
  }

  .el-form-item {
    width: 50%;
  }

  }
</style>