<template>
  <el-dialog v-model="dialog" title="输血信息" @closed="emit('close')">
    <el-form ref="patientBldInfoFrom" :model="patientBldInfo" :rules="rules" label-width="100px" size="small">
      <el-form-item label="输血品种" prop="bldCat">
        <xc-select v-model="patientBldInfo" :data="bldCatList" :name="['bldCat', 'bldCatName']" remote @method="remoteBldCat" />
      </el-form-item>
      <el-form-item label="输血量" prop="bldAmt">
        <el-input-number v-model="patientBldInfo.bldAmt" :min="0.1" :precision="1"></el-input-number>
      </el-form-item>
      <el-form-item label="输血单位" prop="bldUnit">
        <el-select v-model="patientBldInfo.bldUnit">
          <el-option label="U" value="U"></el-option>
          <el-option label="ml" value="ml"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="saveData">保存</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<script name="ShuXueXinXi" setup>
import { getBldCat } from '@/api/public-api'
import XcSelect from '@/components/xiao-chan/select/XcSelect.vue'
import { unref } from 'vue'
import { addOrModifyBloodTransfusionVolume } from '@/api/medical-insurance/si-setl-upload'

const props = defineProps({
  data: {
    type: Object,
    default: {
      id: -1,
    },
  },
})
const emit = defineEmits(['close', 'addData'])
const dialog = ref(true)
let patientBldInfoFrom = $ref(null)
let bldCatList = $ref([])

let patientBldInfo = $ref({
  id: -1,
  patNo: '',
  times: 0,
  bldCat: '',
  bldCatName: '',
  bldAmt: 0,
  bldUnit: '',
})

const remoteBldCat = (val) => {
  getBldCat(val).then((res) => {
    bldCatList = res
  })
}

const saveData = async () => {
  const form = unref(patientBldInfoFrom)
  if (!form) return
  try {
    await form.validate()
    addOrModifyBloodTransfusionVolume(patientBldInfo).then((res) => {
      if (patientBldInfo.id === -1) {
        emit('addData', patientBldInfo)
      } else {
        emit('close')
      }
    })
  } catch (e) {
    console.error(e)
  }
}

const rules = ref({
  bldCat: [{ required: true, message: '该项不能为空', trigger: 'blur' }],
  bldAmt: [{ required: true, message: '该项不能为空', trigger: 'blur' }],
  bldUnit: [{ required: true, message: '该项不能为空', trigger: 'blur' }],
})

onMounted(() => {
  patientBldInfo = props.data
  if (props.data.id !== -1) {
    remoteBldCat(props.data.bldCatName)
  }
})
</script>

<style scoped></style>
