xiangan_pc/src/page-subspecialty/views/modules/optometryManagement/dioptric/HIS-add.vue

<template>
  <el-dialog
    class="HIS-dialog"
    :visible.sync="visible"
    width="60%"
    title="HIS查询"
  >
    <el-form ref="dataFormHis" :inline="true" :model="dataFormHis" class="demo-form-inline" :rules="dataRule" @keyup.enter.native="findHandle(2)">
      <el-form-item prop="patientId">
        <el-input v-model="dataFormHis.patientId" placeholder="请输入病历号" clearable @clear="findHandle(1)" />
      </el-form-item>
      <el-form-item prop="patientName">
        <el-input v-model="dataFormHis.patientName" placeholder="请输入姓名" clearable @clear="findHandle(1)" />
      </el-form-item>
      <el-form-item prop="patientIdNumber">
        <el-input v-model="dataFormHis.patientIdNumber" placeholder="请输入身份证号" clearable @clear="findHandle(1)" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="findHandle(2)">查询</el-button>
      </el-form-item>
    </el-form>
    <el-table v-loading="loading" :data="tableData">
      <template slot="empty">
        <span style="color: #969799;">{{ tableText }}</span>
      </template>
      <el-table-column property="patId" label="病历号" width="100" />
      <el-table-column property="patName" label="患者姓名" width="100" />
      <el-table-column property="patIdNumber" label="身份证号" />
      <el-table-column property="patPhone" label="联系电话" />
      <el-table-column property="patAddress" label="家庭地址" />
      <el-table-column label="操作" width="80">
        <template slot-scope="scope">
          <p class="introduce" @click="introduceHandle(scope.row)">引入</p>
        </template></el-table-column>
    </el-table>
  </el-dialog>
</template>

<script>
export default {
  props: {
    patientTypeList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      visible: false,
      dataFormHis: {
        patientId: '',
        patientName: '',
        patientIdNumber: ''
      },
      dataForm: {},
      tableData: [],
      tableText: '请查询所需数据',
      loading: false
    }
  },
  computed: {
    dataRule() {
      return {
        patientId: [
          { message: '请输入病历号', trigger: 'blur' }
        ],
        patientName: [
          { message: '请输入姓名', trigger: 'blur' }
        ],
        patientIdNumber: [
          { message: '请输入身份证号', trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    init() {
      this.visible = true
      this.$nextTick(() => {
        this.tableText = '请查询所需数据'
        this.$refs.dataFormHis.resetFields() // 重置表单
        this.tableData = []
        this.findHandle(1)
      })
    },
    // His查询按钮
    async findHandle(flag) {
      this.loading = true
      if (flag === 2 && !this.dataFormHis.patientId && !this.dataFormHis.patientName && !this.dataFormHis.patientIdNumber) {
        return this.$message.error('搜索内容不能为空')
      }
      const { data: res } = await this.$http.get('/pat/Manage/getHisPatientList', {
        params: this.dataFormHis
      })
      if (res.code === 0) {
        this.loading = false
        this.tableData = res.data
        if (res.data.length <= 0 && flag === 2) {
          this.tableText = '查询成功，未查询到相关数据'
        } else if (res.data.length <= 0 && flag === 1) {
          this.tableText = '请查询所需数据'
        }
      } else {
        this.loading = false
        this.tableText = res.msg
        this.$message.error(res.msg)
      }
    },
    // 点击引入按钮
    introduceHandle(scopwRow) {
      this.$parent.addOrUpdateHandle('', scopwRow, 'HIS引入')
    }
  }
}
</script>
<style lang="scss" scoped>
.HIS-dialog {
  .cycle-display {
    .el-form-item__content {
      display: flex;
    }
    .el-input-number {
      width: 100px;
      margin-right: 16px;
    }
  }
  .introduce {
    color: #1F78FF;
    cursor: pointer;
  }
}

</style>
<style lang="scss">
.HIS-dialog {
.el-form {
  display: flex;
}
  .el-dialog__header {
    margin-bottom:12px
  }
    .el-dialog__body {
        padding-right: 30px;
    }
    .formItemOne .el-form-item__content {
      display: flex;
    }

}
</style>