web/src/components/registration/Edit.vue

<template>
  <div class="title" style="margin-top: 24px">
    <el-button type="primary">读卡</el-button>
  </div>
  <el-form
      :model="edit_data"
      label-width="auto"
      :rules="rules"
      ref="form"
  >
    <el-descriptions
        border
        direction="vertical"
        label-width="100"
        :column="4"
        style="margin-top: 20px"
    >
      <el-descriptions-item label="名称">
        <el-input v-model="edit_data.name" placeholder="请输入名称"></el-input>
      </el-descriptions-item>
      <el-descriptions-item label="性别">
        <el-input v-model="edit_data.gender" placeholder="请输入性别"></el-input>
      </el-descriptions-item>
      <el-descriptions-item label="年龄">
        <el-input v-model="edit_data.age" placeholder="请输入年龄"></el-input>
      </el-descriptions-item>
      <el-descriptions-item label="医生">
        <el-select
            v-model="edit_data.organizationDoctorId"
            placeholder="请选择医生"
        >
          <el-option
              v-for="item in props.doctorList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
          >
          </el-option>
        </el-select>
      </el-descriptions-item>
      <el-descriptions-item label="手机号">
        <el-input v-model="edit_data.phone" placeholder="手机号"></el-input>
      </el-descriptions-item>
      <el-descriptions-item label="就诊类型">
        <el-select v-model="edit_data.visitType" placeholder="就诊类型">
          <el-option label="初诊" :value="0"></el-option>
          <el-option label="复诊" :value="1"></el-option>
        </el-select>
      </el-descriptions-item>
      <el-descriptions-item label="备注">
        <el-input v-model="edit_data.memo" placeholder="备注"></el-input>
      </el-descriptions-item>
    </el-descriptions>
    <div class="content" style="margin-top: 24px">
      <CardDefault v-model="socialCard" @socialCardUpdate="socialCardUpdate"/>
    </div>
  </el-form>
  <div class="bottom_btn">
    <el-button type="primary" @click="save">保存</el-button>
    <el-button @click="close">取消</el-button>
    <el-button v-if="id" type="danger" @click="deleteDetail">删除</el-button>
  </div>
</template>
<script setup lang="ts">
import {onMounted, ref} from 'vue'
import {post} from '@/utils/request.ts'
import CardDefault from '@/components/registration/CardDefault.vue'
import {ElMessage} from "element-plus";

// 定义医生选项的接口
interface Doctor {
  id: string | number; // 医生ID
  name: string;        // 医生姓名
}

// 定义组件Props
const props = defineProps({
  doctorList: {
    type: Array as () => Doctor[], // 明确声明医生列表的类型
    default: () => []
  },
  id: {
    type: String,
    default: ''
  }
})
const edit_data = ref<any>({
  name: '',
  gender: '',
  spec: '',
  phone: '',
  organizationDoctorId: '',
  memo: ''
})
const rules = ref<any>({
  name: [
    {required: true, message: '请输入名称', trigger: 'blur'},
  ],
  code: [
    {required: true, message: '请输入编码', trigger: 'blur'},
  ],
  spec: [
    {required: true, message: '请输入规格', trigger: 'blur'},
  ],
})
const emit = defineEmits(['close'])
const close = () => {
  emit('close', false)
}
const id = props.id
const save = () => {
  let data = {
    ...edit_data.value,
    psnNo: socialCard.value.data?.baseinfo.psn_no,
    insutype: socialCard.value.data?.insuinfo[0].insutype
  }
  if (id) {
    post('registration/edit', {
      data: data, mdtrtCertNo: socialCard.value.mdtrtCertNo,
      mdtrtCertType: socialCard.value.mdtrtCertType
    }).then(() => {
      ElMessage.success('修改成功')
    })
  } else {
    console.log(socialCard.value)
    post('registration/add', {
      data: data, mdtrtCertNo: socialCard.value.mdtrtCertNo,
      mdtrtCertType: socialCard.value.mdtrtCertType
    }).then(() => {
      ElMessage.success('新建成功')
    })
  }
  close()
}
const deleteDetail = () => {
  post('registration/delete', {id}).then(() => {
    ElMessage.success('删除成功')
    close()
  })
}
const socialCardUpdate = () => {
  console.log('socialCardUpdate')
}
const socialCard: any = ref({
  data: null,
  payInfo: {},
  lastUse: null
})
onMounted(() => {
  if (id) {
    post('registration/getById', {id}).then((res: any) => {
      edit_data.value = res
    })
  }
})
</script>
<style scoped lang="scss">
.title {
  color: #000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 18px;
}

.bottom_btn {
  right: 0;
  position: absolute;
  bottom: 0;
}
</style>