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 medical_care"-->
                            <!--:key="index"-->
                            <!--:label="item.label"-->
                            <!--:value="item.value">-->
                    <!--</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=""-->
                <!--&gt;-->
                    <!--<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="挂号类型：" :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="form.registration_fee"></el-input>
            </el-form-item>
            <el-form-item label="诊疗费：">
                <el-input v-model="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 { jsGetAge, 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: '普通住院' }
        ],
        medical_care: [
          { value: 11, label: '普通门诊' },
          { value: 12, label: '家庭通道' },
          { value: 13, label: '门诊大病' },
          { value: 14, label: '重疾特药' },
          { value: 15, label: '门诊慢病' },
          { value: 16, label: '门诊特检' },
          { value: 17, label: '健康体检' },
          { value: 18, label: '预防接种' },
          { value: 19, label: '门诊输血' },
          { value: 91, label: '新冠肺炎门诊' }
        ],

        form: {
          id: '',
          settlement_value: 1,
          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: '合同' },
          {value: 8, 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' }],
          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.birthday = uParseTime(val.birthday, '{y}-{m}-{d}')
        this.form.phone = val.phone
        this.form.id_card = val.id_card_no
        var thisLen = this.form.id_card.length
        var birth = ''
        if (thisLen == 15) {
          birth = '19' + this.form.id_card.substr(6, 6)
        } else {
          birth = this.form.id_card.substr(6, 8)
        }
        var births =
          birth.substr(0, 4) +
          '-' +
          birth.substr(4, 2) +
          '-' +
          birth.substr(6, 2)
        this.form.age = jsGetAge(births, '-')
      },
      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() {
        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,
          'admin_user_id': this.$store.getters.xt_user.user.id,
          'certificates':this.form.certificates,
        }
        axios.get('http://127.0.0.1:9532/api/readcard', {
          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.visibility = true
        // this.form = Object.assign({}, this.resetForm)
        this.form.id = 0
        this.form.settlement_value = 1
        this.form.medical_insurance_card = ''
        this.form.name = ''
        this.form.gender = ''
        this.form.medical_care = ''
        this.form.birthda = ''
        this.form.age = ''
        this.form.id_card = ''
        this.form.register = ''
        this.form.doctor = ''
        this.form.department = ''
        this.form.registration_fee = ''
        this.form.medical_expenses = ''
        this.form.cost = ''
        this.form.phone = ''
        this.form.social_type = ''

        this.form.p_type = 14
        this.form.sick_type = this.sick[0].id
        this.form.diagnosis = this.diagnoses[0].id
        this.form.id_card_type = 2
        this.form.certificates = 1

        // 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
        // if( this.form.social_type == 0){
        //   this.form.social_type = ""
        // }

      },

      hide: function () {
        this.visibility = false
        this.$refs['formValue'].resetFields()
      }, 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)
          }
        })
      },
      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>