用ant design vue 写一个 表单包含字段：患者姓名，性别，身份证号，所在区域，家庭住址，过敏史，是否复诊

以下是一个简单的使用 ant design vue 写的表单，包含字段：患者姓名，性别，身份证号，所在区域，家庭住址，过敏史，是否复诊。

<template>
  <a-form :form="form">
    <a-form-item label="患者姓名" :colon="false">
      <a-input v-decorator="['name', { rules: [{ required: true, message: '请输入患者姓名' }] }]" />
    </a-form-item>
    <a-form-item label="性别" :colon="false">
      <a-radio-group v-decorator="['gender', { rules: [{ required: true, message: '请选择性别' }] }]">
        <a-radio value="male">男</a-radio>
        <a-radio value="female">女</a-radio>
      </a-radio-group>
    </a-form-item>
    <a-form-item label="身份证号" :colon="false">
      <a-input v-decorator="['idCard', { rules: [{ required: true, message: '请输入身份证号' }] }]" />
    </a-form-item>
    <a-form-item label="所在区域" :colon="false">
      <a-select v-decorator="['area', { rules: [{ required: true, message: '请选择所在区域' }] }]">
        <a-select-option value="beijing">北京</a-select-option>
        <a-select-option value="shanghai">上海</a-select-option>
        <a-select-option value="guangzhou">广州</a-select-option>
        <a-select-option value="shenzhen">深圳</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item label="家庭住址" :colon="false">
      <a-input v-decorator="['address', { rules: [{ required: true, message: '请输入家庭住址' }] }]" />
    </a-form-item>
    <a-form-item label="过敏史" :colon="false">
      <a-checkbox-group v-decorator="['allergy']">
        <a-checkbox value="peanuts">花生</a-checkbox>
        <a-checkbox value="seafood">海鲜</a-checkbox>
        <a-checkbox value="dust">灰尘</a-checkbox>
      </a-checkbox-group>
    </a-form-item>
    <a-form-item label="是否复诊" :colon="false">
      <a-switch v-decorator="['followUp']" />
    </a-form-item>
    <a-form-item>
      <a-button type="primary" @click="handleSubmit">提交</a-button>
    </a-form-item>
  </a-form>
</template>

<script>
import { FormModel, Input, Radio, Select, Checkbox, Switch, Button } from 'ant-design-vue'

export default {
  name: 'PatientForm',
  components: {
    'a-form': FormModel,
    'a-form-item': FormModel.Item,
    'a-input': Input,
    'a-radio-group': Radio.Group,
    'a-radio': Radio,
    'a-select': Select,
    'a-select-option': Select.Option,
    'a-checkbox-group': Checkbox.Group,
    'a-checkbox': Checkbox,
    'a-switch': Switch,
    'a-button': Button
  },
  data() {
    return {
      form: this.$form.createForm(this),
    }
  },
  methods: {
    handleSubmit() {
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log(values)
        }
      })
    }
  }
}
</script>

需要注意的是，上述代码中使用了 `v-decorator` 属性来绑定表单项的值和校验规则。对于每个表单项，我们都需要定义一个唯一的名称，并且为其设置必要的规则。

在 `handleSubmit` 方法中，我们使用 `validateFields` 方法来校验表单数据是否合法。如果校验通过，则可以将表单数据提交到服务器或进行其他操作。