xiangan_pc/src/page-subspecialty/views/modules/nurseManagement/reservation/schedule/addPatientOrder.vue

<template>
  <el-dialog top="30px" class="number-manage" append-to-body :visible.sync="visible" width="40%" :title="title" :before-close="closeDialog">
    <el-form ref="addPatientForm" :rules="dataRule" size="small" :model="form" label-width="90px">
      <el-form-item required label="选择患者:" prop="patientId">
        <el-input v-model="form.patientId" :readonly="isEdit" suffix-icon="el-icon-search" placeholder="请输入登记号" @change="searchPatient" />
      </el-form-item>
      <div v-if="patientInfo" class="patientDetail">
        <div style="font-size: 16px;font-weight: bold">患者信息</div>
        <div class="detailItem">
          <div>登记号：{{ patientInfo.patientId }}</div>
          <div>电话：{{ patientInfo.patientPhone }}</div>
        </div>
        <div class="detailItem">
          <div>姓名：{{ patientInfo.patientName }}</div>
          <div>性别：{{ patientInfo.patientSex }}</div>
          <div>生日：{{ $moment(patientInfo.patientBirthday).format('YYYY-MM-DD') }}</div>
          <div v-if="patientInfo.patientAge">年龄：{{ patientInfo.patientAge }}</div>
          <div>来源：{{ patientInfo.source }}</div>
        </div>
      </div>
      <el-form-item label="负责医生:">
        <el-col :span="12">
          <el-select v-model="form.doctorId" placeholder="请选择" @change="selectDoctor">
            <el-option
              v-for="item in doctorList"
              :key="item.employeeId"
              :label="item.realName"
              :value="item.employeeId"
            />
          </el-select>
        </el-col>
        <el-col :span="12" style="display: flex;align-items: center">
          已开医嘱:
          <div class="radioItem" @click="form.yzOpen='Y'">
            <input :disabled="isEdit" :checked="form.yzOpen==='Y'" type="radio">是
          </div>
          <div class="radioItem" @click="form.yzOpen='N'">
            <input :disabled="isEdit" :checked="form.yzOpen==='N'" type="radio">否
          </div>
        </el-col>
      </el-form-item>
      <el-form-item label="备注:">
        <el-input v-model="form.remark" :readonly="isEdit" autosize type="textarea" />
      </el-form-item>
      <div style="display: flex;padding:0 0 20px 20px">
        <el-col :span="10" style="display: flex;align-items: center">
          眼别:
          <div class="radioItem" @click="form.eyeType='OD'">
            <input :disabled="isEdit" :checked="form.eyeType==='OD'" type="radio">OD
          </div>
          <div class="radioItem" @click="form.eyeType='OS'">
            <input :disabled="isEdit" :checked="form.eyeType==='OS'" type="radio">OS
          </div>
          <div class="radioItem" @click="form.eyeType='OU'">
            <input :disabled="isEdit" :checked="form.eyeType==='OU'" type="radio">OU
          </div>
        </el-col>
        <el-col :span="7" style="display: flex;align-items: center">
          散瞳:
          <div class="radioItem" @click="form.pupilDilate='Y'">
            <input :disabled="isEdit" :checked="form.pupilDilate==='Y'" type="radio">是
          </div>
          <div class="radioItem" @click="form.pupilDilate='N'">
            <input :disabled="isEdit" :checked="form.pupilDilate==='N'" type="radio">否
          </div>
        </el-col>
        <el-col :span="7" style="display: flex;align-items: center">
          缩瞳:
          <div class="radioItem" @click="form.pupilShrink='Y'">
            <input :disabled="isEdit" :checked="form.pupilShrink==='Y'" type="radio">是
          </div>
          <div class="radioItem" @click="form.pupilShrink='N'">
            <input :disabled="isEdit" :checked="form.pupilShrink==='N'" type="radio">否
          </div>
        </el-col>
      </div>
      <el-form-item label="预约时间:" required>
        <el-col :span="11">
          <el-form-item prop="date1">
            <el-date-picker v-model="form.date1" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" style="width: 100%;" />
          </el-form-item>
        </el-col>
        <el-col class="line" style="text-align: center" :span="2">-</el-col>
        <el-col :span="11">
          <el-form-item prop="date2">
            <el-time-picker
              v-model="form.date2"
              value-format="HH:mm:ss"
              placeholder="选择时间"
              style="width: 100%;"
            />
          </el-form-item>
        </el-col>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="goFormList">表单</el-button>
      <el-button size="small" @click="closeDialog">取 消</el-button>
      <el-button type="primary" size="small" @click="handleSave">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>

export default {
  name: 'AddPatientOrder',
  props: {
    title: {
      type: String,
      default: '新增预约'
    },
    patientDetail: {
      type: Object
    },
    project: {
      type: Object
    },
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      visible: false,
      patientInfo: null,
      form: {
        patientId: '',
        doctorName: '',
        yzOpen: '',
        remark: '',
        doctorId: '',
        eyeType: '',
        pupilDilate: '',
        pupilShrink: '',
        date1: '',
        date2: ''
      },
      doctorList: []
    }
  },
  computed: {
    dataRule() {
      return {
        patientId: [
          { required: true, message: '请选择患者' }
        ],
        date1: [
          { required: true, message: '请选择日期' }
        ],
        date2: [
          { required: true, message: '请选择时间' }
        ]
      }
    }
  },
  created() {
    this.getDoctorList()
    if (this.patientDetail) {
      this.form.patientId = this.patientDetail.patientId
      this.form.doctorId = this.patientDetail.doctorId
      this.form.doctorName = this.patientDetail.doctorName
      this.form.eyeType = this.patientDetail.eyeType
      this.form.pupilDilate = this.patientDetail.pupilDilate
      this.form.pupilShrink = this.patientDetail.pupilShrink
      this.form.remark = this.patientDetail.remark
      this.form.yzOpen = this.patientDetail.yzOpen
      if (this.patientDetail.appointDate) {
        this.form.date1 = this.patientDetail.appointDate.split(' ')[0]
        this.form.date2 = this.patientDetail.appointDate.split(' ')[1]
      }
      this.patientInfo = this.patientDetail
    }
  },
  methods: {
    init() {
      this.visible = true
    },
    // 查询患者
    searchPatient(val) {
      this.$http.get('/appoint/getPatientInfo', { params: { patientId: val }}).then((data) => {
        if (data.data.data.list.length) {
          this.patientInfo = data.data.data.list[0]
        }
      })
    },
    // 获取医生列表
    getDoctorList() {
      this.$http.get('/sys/user', { params: { position: '门诊医师' }}).then(data => {
        this.doctorList = data.data.data
      }).catch(err => {
        this.$message.error(err.msg)
      })
    },
    // 选择医生
    selectDoctor(val) {
      const curDoctor = this.doctorList.find(item => item.employeeId === val)
      this.form.doctorName = curDoctor.realName
    },
    // 确认提交
    handleSave() {
      if (!this.isEdit) {
        console.log('asdfasdf')
        this.$refs.addPatientForm.validate((valid) => {
          if (!valid) {
            return false
          }
          const params = {
            appointDate: `${this.form.date1} ${this.form.date2}`,
            patientName: this.patientInfo.patientName,
            jzNumber: this.patientInfo.jzNumber,
            appointSource: this.patientInfo.source,
            itemId: this.project.itemId,
            itemName: this.project.itemName,
            ...this.form
          }
          this.$http.post('/appoint/saveAppointInfo', params).then(res => {
            if (res.data.code !== 0) {
              return this.$message.error(res.data.msg)
            }
            this.$message.success('添加成功')
            this.$emit('updateAppoint')
            this.visible = false
          })
        })
      } else {
        const params = {
          appointDate: `${this.form.date1} ${this.form.date2}`,
          doctorId: this.form.doctorId,
          doctorName: this.form.doctorName,
          patientId: this.form.patientId,
          patientName: this.patientDetail.patientName,
          id: this.patientDetail.id,
          itemId: this.patientDetail.itemId
        }
        this.$http.post('/appoint/updateAppointInfo', params).then(() => {
          this.$message.success('修改成功')
          this.$emit('updateAppoint')
          this.visible = false
        })
      }
    },
    // 关闭弹框
    closeDialog() {
      this.$emit('closeDialog')
    },
    goFormList() {
      if (this.patientInfo) {
        this.$router.push({
          path: '/360view',
          query: {
            onlyRead: false,
            isSearch: '2',
            patientId: this.patientInfo.patientId
          }
        })
      } else {
        this.$message.info('请选择患者')
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.radioItem{
  user-select: none;
  cursor: pointer;
  margin:0 8px;
  display: flex;
}
input{
  -webkit-appearance: checkbox !important;
  margin-right: 5px !important;
}
::v-deep .el-form-item__label{
  font-size: 14px;
}
::v-deep .el-form-item{
  margin-bottom: 16px;
}
::v-deep .el-radio{
  margin-right: 8px;
}
.patientDetail{
  border: 1px solid #6EB1FF;
  border-radius:  8px;
  background: #E8F5FF;
  padding: 16px;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.88);
  margin-bottom: 22px;
}
.detailItem{
  display:flex;
  margin: 8px 0;
  div{
    margin-right: 20px;
  }
}
</style>