---
title: Patient Medical History
product: PDF Generator
description: Download a printable patient medical history form in PDF. Generate editable or prefilled healthcare history forms using SurveyJS PDF Generator.
framework: Vue 3
source: https://surveyjs.io/pdf-generator/examples/pdf-healthcare-patient-medical-history-form-template/vue3js
index: https://surveyjs.io/pdf-generator/examples/overview.md
---

# Patient Medical History (Vue 3)

## Files

### `public/index.html`

```html
<div style="display: flex;">
    <div id="app" style="flex: 1 1 0%; height: 100%; min-width: 0;"></div>
    <div id="pdf-preview" style="flex: 0.7 0.7 0%; display: none">
        <embed id="pdf-preview-frame" type="application/pdf" style="width:100%; height:100%;" />
    </div>
</div>
```

### `src/App.vue`

```html
<template>
    <SurveyComponent :model="survey" />
</template>
<script setup lang="ts">
    import { Model } from "survey-core";
    import { SurveyComponent } from "survey-vue3-ui";
    import "survey-core/survey-core.min.css";
    import { SurveyPDF } from "survey-pdf";
    import "./index.css";
    import { json } from "./json";

    function createSurveyPdfModel (surveyModel) {
        const surveyPDF = new SurveyPDF(json);
        if (surveyModel) {
            surveyPDF.data = surveyModel.data;
            surveyPDF.locale = surveyModel.locale;
            
            
        }
        surveyPDF.questionsOnPageMode = "standard";
        return surveyPDF;
    }
    function saveSurveyToPdf (filename, surveyModel) {
        const pdfDoc = createSurveyPdfModel(surveyModel);
        if (!pdfDoc) return;
    
        pdfDoc.save(filename);
    }
    
    const previewDiv = document.getElementById("pdf-preview");
    const previewEmbed = document.getElementById("pdf-preview-frame");
    let pdfBlobUrl;
    
    function showPdfPreview(surveyModel) {
        if (!previewDiv || !previewEmbed) return;
    
        const pdfDoc = createSurveyPdfModel(surveyModel);
        if (!pdfDoc) return;
    
        pdfDoc.raw("blob").then((blob) => {
            if (pdfBlobUrl) {
                URL.revokeObjectURL(pdfBlobUrl);
            }
            pdfBlobUrl = URL.createObjectURL(blob);
            previewEmbed.setAttribute("src", pdfBlobUrl);
            previewDiv.style.display = "block";
        });
    }
    
    function previewPdf(surveyModel) {
        if (!previewDiv) return;
    
        if (previewDiv.style.display !== "none") {
            previewDiv.style.display = "none";
            return;
        }
    
        showPdfPreview(surveyModel);
    }
    
    const survey = new Model(json);
    survey.showCompleteButton = false;
    survey.navigationButtonsLocation = "topBottom";
    survey.addNavigationItem({
        id: "survey_save_as_file",
        title: "Download PDF",
        action: () => {
            saveSurveyToPdf("surveyResult.pdf", survey);
        }
    });
    survey.addNavigationItem({
        id: "survey_pdf_preview",
        title: "Preview PDF",
        visible: window.navigator.pdfViewerEnabled,
        action: () => {
            previewPdf(survey);
        }
    });
</script>
```

### `src/index.css`

```css
/* You can add your custom CSS here. */
```

### `src/json.ts`

```ts
export const json = {
  "title": "Patient Past Medical, Social & Family History",
  "pages": [
    {
      "name": "introduction",
      "elements": [
        {
          "type": "panel",
          "name": "patientName",
          "questionTitleLocation": "bottom",
          "title": "Patient Name",
          "elements": [
            {
              "type": "text",
              "name": "patientLastName",
              "title": "(Last)"
            },
            {
              "type": "text",
              "name": "patientFirstName",
              "startWithNewLine": false,
              "title": "(First)"
            },
            {
              "type": "text",
              "name": "patientMiddleName",
              "title": "(M.I)"
            }
          ]
        },
        {
          "type": "panel",
          "name": "panel2",
          "questionTitleLocation": "left",
          "title": "Social Security & Birth Date",
          "elements": [
            {
              "type": "text",
              "name": "socialsecurity",
              "title": "Social Security #:"
            },
            {
              "type": "text",
              "name": "birthDate",
              "startWithNewLine": false,
              "title": "Date of birth:",
              "inputType": "date"
            },
            {
              "type": "radiogroup",
              "name": "sex",
              "title": "Sex:",
              "choices": [
                {
                  "value": "male",
                  "text": "Male"
                },
                {
                  "value": "female",
                  "text": "Female"
                }
              ],
              "colCount": 0
            }
          ]
        },
        {
          "type": "panel",
          "name": "panel1",
          "title": "Form completed by",
          "elements": [
            {
              "type": "radiogroup",
              "name": "completedBy",
              "title": "Who completed this form:",
              "choices": [
                {
                  "value": "patient",
                  "text": "Patient"
                },
                {
                  "value": "spouse",
                  "text": "Spouse"
                }
              ],
              "showOtherItem": true,
              "otherText": "Other (specify)",
              "colCount": 0
            },
            {
              "type": "text",
              "name": "completedByOtherName",
              "startWithNewLine": false,
              "title": "Name (if other than patient):"
            }
          ]
        }
      ]
    },
    {
      "name": "medicalHistory",
      "title": "Past Medical History",
      "elements": [
        {
          "type": "radiogroup",
          "name": "everhospitalized",
          "title": "Have you ever been hospitalized?",
          "choices": [
            {
              "value": "no",
              "text": "No"
            },
            {
              "value": "yes",
              "text": "Yes"
            }
          ],
          "colCount": 0
        },
        {
          "type": "radiogroup",
          "name": "injuriesbrokenbones",
          "title": "Have you had any serious injuries and/or broken bones?",
          "showCommentArea": true,
          "commentText": "If yes, describe the injuries:",
          "choices": [
            {
              "value": "no",
              "text": "No"
            },
            {
              "value": "yes",
              "text": "Yes"
            }
          ],
          "colCount": 0
        },
        {
          "type": "radiogroup",
          "name": "bloodtransfusion",
          "title": "Have you ever received a blood transfusion?",
          "showCommentArea": true,
          "commentText": "If yes, when?",
          "choices": [
            {
              "value": "no",
              "text": "No"
            },
            {
              "value": "yes",
              "text": "Yes"
            },
            {
              "value": "unknown",
              "text": "Unknown"
            }
          ],
          "colCount": 0
        },
        {
          "type": "radiogroup",
          "name": "outsideUSACanada",
          "title": "Have you ever traveled or lived outside the United States or Canada?",
          "showCommentArea": true,
          "commentText": "If yes, where and when?",
          "choices": [
            {
              "value": "no",
              "text": "No"
            },
            {
              "value": "yes",
              "text": "Yes"
            }
          ],
          "colCount": 0
        },
        {
          "type": "matrixdropdown",
          "name": "immunizations",
          "title": "Have you received the following IMMUNIZATIONS?  If yes, indicate the approximate year it was last given:",
          "titleLocation": "top",
          "columns": [
            {
              "name": "answer",
              "title": "Please select",
              "cellType": "radiogroup",
              "choices": [
                {
                  "value": "no",
                  "text": "No"
                },
                {
                  "value": "yes",
                  "text": "Yes"
                },
                {
                  "value": "unknown",
                  "text": "Unknown"
                }
              ],
              "allowClear": true
            },
            {
              "name": "year",
              "title": "Year of last immunization",
              "cellType": "text"
            }
          ],
          "rows": [
            "Pneumococcal (for pneumonia)",
            "Hepatitis A",
            "Hepatitis B",
            "Tetanus/Diphtheria within last 10 years",
            "Influenza (flu)",
            "Measles",
            "Mumps",
            "Rubella",
            "Polio"
          ]
        },
        {
          "type": "matrixdropdown",
          "name": "problems1",
          "title": "Have you ever had any of the following?",
          "titleLocation": "top",
          "columns": [
            {
              "name": "description1",
              "title": "Describe the problem, if applicable",
              "cellType": "comment",
              "rows": 2
            }
          ],
          "rows": [
            "Abnormal chest x-ray",
            "Anesthesia complications",
            "Anxiety, depression or mental illness",
            "Blood problems (abnormal bleeding, anemia, high or low white count)",
            "Diabetes",
            "Growth removed from the colon or rectum (polyp or tumor)",
            "High blood pressure",
            "High cholesterol or triglycerides",
            "Sexually transmitted disease",
            "Stroke or TIA",
            "Treatment for alcohol and/or drug abuse",
            "Tuberculosis or positive tuberculin skin test",
            "Cosmetic or plastic surgery"
          ]
        },
        {
          "type": "matrixdropdown",
          "name": "problems2",
          "title": "Indicate whether you have ever had a medical problem and/or surgery related to each of the following",
          "titleLocation": "top",
          "columns": [
            {
              "name": "type",
              "title": "Type",
              "cellType": "checkbox",
              "choices": [
                {
                  "value": "medical",
                  "text": "Medical problem"
                },
                {
                  "value": "surgery",
                  "text": "Surgery"
                }
              ]
            },
            {
              "name": "year",
              "title": "Year(s) of surgery",
              "cellType": "text"
            },
            {
              "name": "describe",
              "title": "Describe, if applicable",
              "cellType": "comment",
              "rows": 2
            }
          ],
          "rows": [
            "Eyes (cataracts, glaucoma)",
            "Ears, nose, sinuses, or tonsils",
            "Thyroid or parathyroid glands",
            "Heart valves or abnormal heart rhythm",
            "Coronary (heart) arteries (angina)",
            "Arteries (aorta, arteries to head, arms, legs) ",
            "Veins or blood clots in the veins",
            "Lungs",
            "Esophagus or stomach (ulcer)",
            "Bowel (small & large intestine)",
            "Appendix",
            "Liver or gallbladder (including hepatitis)",
            "Hernia",
            "Kidneys or bladder",
            "Bones, joints or muscles",
            "Back, neck or spine",
            "Brain",
            "Skin",
            "Breasts",
            "Females: uterus, tubes, ovaries",
            "Males: prostate, penis, testes, vasectomy",
            "Other (describe)"
          ]
        }
      ]
    },
    {
      "name": "socialHistory",
      "questionTitleLocation": "left",
      "title": "Social History",
      "elements": [
        {
          "type": "panel",
          "name": "education",
          "title": "Education",
          "elements": [
            {
              "type": "text",
              "name": "schoolYearsCompleted",
              "title": "How many years of school have you completed?",
              "inputType": "number",
              "max": 12,
              "min": 0
            }
          ]
        },
        {
          "type": "panel",
          "name": "occupations",
          "title": "Occupations",
          "elements": [
            {
              "type": "radiogroup",
              "name": "employmentStatus",
              "title": "Your current employment status:",
              "choices": [
                "Retired",
                "Unemployed",
                "Homemaker",
                "Employed"
              ],
              "colCount": 0
            },
            {
              "type": "text",
              "name": "currentOcupation",
              "title": "Current Ocupation(s):",
              "description": "Leave blank if you are unemployed.",
              "descriptionLocation": "underInput"
            },
            {
              "type": "comment",
              "name": "previousOccupations",
              "title": "Previous Occupations/Jobs:"
            }
          ]
        },
        {
          "type": "panel",
          "name": "disability",
          "title": "Disability",
          "elements": [
            {
              "type": "radiogroup",
              "name": "disabled",
              "title": "Are you disabled?",
              "choices": [
                "No",
                "Yes"
              ],
              "colCount": 0
            },
            {
              "type": "comment",
              "name": "disableInfo",
              "title": "Disability details",
              "description": "Provide any relevant information regarding your disability, including type, duration, or support needs (if applicable).",
              "descriptionLocation": "underInput"
            }
          ]
        },
        {
          "type": "panel",
          "name": "abuse",
          "title": "Abuse",
          "elements": [
            {
              "type": "radiogroup",
              "name": "abused",
              "title": "Have you even been physically, sexually, or emotionally abused?",
              "choices": [
                "No",
                "Yes"
              ],
              "colCount": 0
            },
            {
              "type": "comment",
              "name": "abusedInfo",
              "title": "Abuse details",
              "description": "Describe your experience of physical, sexual, or emotional abuse (if applicable).",
              "descriptionLocation": "underInput"
            },
            {
              "type": "matrixdropdown",
              "name": "subsctancesUsing",
              "title": "Have you used any of the following substances?",
              "titleLocation": "top",
              "columns": [
                {
                  "name": "current",
                  "title": "Currently?",
                  "cellType": "radiogroup",
                  "width": "200px",
                  "choices": [
                    "No",
                    "Yes"
                  ],
                  "allowClear": true
                },
                {
                  "name": "previous",
                  "title": "Previously?",
                  "cellType": "radiogroup",
                  "width": "200px",
                  "choices": [
                    "No",
                    "Yes"
                  ],
                  "allowClear": true
                },
                {
                  "name": "amount",
                  "title": "Type/Amount/Frequency",
                  "cellType": "text",
                  "width": "200px"
                },
                {
                  "name": "long",
                  "title": "How long? (in years)",
                  "cellType": "text",
                  "width": "200px"
                },
                {
                  "name": "stopped",
                  "title": "When stopped? (year)",
                  "cellType": "text",
                  "width": "200px"
                }
              ],
              "rows": [
                "Caffeine: coffee, tea, soda",
                "Tobacco",
                "Alcohol: beer, wine, liquor",
                "Recreational/Street drugs"
              ],
              "rowTitleWidth": "200px"
            }
          ]
        },
        {
          "type": "panel",
          "name": "maritalStatus",
          "title": "Marital Status",
          "elements": [
            {
              "type": "radiogroup",
              "name": "currentlyMarried",
              "title": "Are you currently married?",
              "choices": [
                "No",
                "Yes"
              ],
              "colCount": 0
            },
            {
              "type": "text",
              "name": "currentMarriageYear",
              "startWithNewLine": false,
              "title": "If yes, in what year did this marriage occure?"
            },
            {
              "type": "paneldynamic",
              "name": "previousMarriages",
              "title": "List all previous marriages",
              "templateElements": [
                {
                  "type": "text",
                  "name": "previousMarriageYear",
                  "title": "Year married:"
                },
                {
                  "type": "text",
                  "name": "previousMarriageDuration",
                  "startWithNewLine": false,
                  "title": "Duration (in years):"
                }
              ],
              "panelCount": 4,
              "addPanelText": "Add marriage"
            },
            {
              "type": "panel",
              "name": "currentSpouse",
              "title": "Current Spouse Information",
              "elements": [
                {
                  "type": "radiogroup",
                  "name": "currentSpouseStatus",
                  "title": "Current Status",
                  "choices": [
                    "Not applicable",
                    "Alive",
                    "Deceased"
                  ],
                  "colCount": 0
                },
                {
                  "type": "text",
                  "name": "currentSpouseAge",
                  "startWithNewLine": false,
                  "title": "Age",
                  "description": "Enter the age of your spouse. Complete this field only if your spouse is alive.",
                  "descriptionLocation": "underInput"
                },
                {
                  "type": "comment",
                  "name": "currentSpouseHelthProblems",
                  "title": "Health problems or cause of death:",
                  "description": "Enter details about your spouse's health problems or cause of death if your spouse is deceased.",
                  "descriptionLocation": "underInput",
                  "rows": 2
                },
                {
                  "type": "radiogroup",
                  "name": "currentSpouseEmploymentStatus",
                  "title": "Current employment status:",
                  "description": "Provide information about your spouse's occupation or employment, applicable if the spouse is alive.",
                  "descriptionLocation": "underInput",
                  "choices": [
                    "Retired",
                    "Unemployed",
                    "Homemaker",
                    "Employed"
                  ],
                  "colCount": 0
                }
              ]
            },
            {
              "type": "text",
              "name": "currentSpouseOccupation",
              "title": "Current occupation(s):",
              "description": "Provide details about your spouse's job(s) or work activities, applicable only if employed.",
              "descriptionLocation": "underInput"
            }
          ]
        }
      ]
    },
    {
      "name": "familyHistory",
      "questionTitleLocation": "left",
      "title": "Family History",
      "elements": [
        {
          "type": "radiogroup",
          "name": "adopted",
          "title": "Are you adopted?",
          "description": "Select 'Yes' if you were adopted, 'No' if you were raised by your biological parents.",
          "descriptionLocation": "underInput",
          "choices": [
            "Yes",
            "No"
          ],
          "colCount": 0
        },
        {
          "type": "html",
          "name": "adoptedInfo",
          "html": "If known, complete the following information about your <b>blood relatives</b> (include children). Exclude adoptive parents, siblings, and adopted children."
        },
        {
          "type": "paneldynamic",
          "name": "bloodRelativesInfo",
          "title": "Blood Relatives Information",
          "description": "For each blood relative, provide details on their relationship to you, status, age, cause of death if applicable, and health conditions. Use the 'Add Family Member' button to add multiple relatives.",
          "templateElements": [
            {
              "type": "radiogroup",
              "name": "relativeType",
              "title": "Blood relative",
              "choices": [
                "Father",
                "Mother",
                "Brother",
                "Sister",
                "Son",
                "Daughter"
              ],
              "colCount": 2
            },
            {
              "type": "radiogroup",
              "name": "relativeStatus",
              "title": "Current status",
              "choices": [
                "Alive",
                "Deceased",
                "Unknown"
              ],
              "colCount": 0
            },
            {
              "type": "text",
              "name": "relativeAge",
              "title": "Current age",
              "description": "Leave blank if the relative is deceased or their status is unknown.",
              "descriptionLocation": "underInput"
            },
            {
              "type": "text",
              "name": "relativeAgeOfDeath",
              "startWithNewLine": false,
              "title": "Age at death",
              "description": "Leave blank if the relative is alive or their status is unknown.",
              "descriptionLocation": "underInput"
            },
            {
              "type": "comment",
              "name": "relativeCauseOfDeathDescription",
              "title": "Cause of death",
              "description": "Leave blank if the relative is alive or the cause of death is unknown",
              "descriptionLocation": "underInput",
              "rows": 2
            },
            {
              "type": "matrixdynamic",
              "name": "relativeCondition",
              "title": "Health Conditions",
              "titleLocation": "top",
              "description": "List any known illnesses or conditions of this relative. Provide details such as severity, age of onset, treatments, or any other relevant information.",
              "columns": [
                {
                  "name": "condition",
                  "title": "Illness / Condition",
                  "cellType": "text"
                },
                {
                  "name": "description",
                  "title": "Description",
                  "cellType": "comment",
                  "rows": 2
                }
              ],
              "rowCount": 4
            }
          ],
          "panelCount": 3,
          "templateTitle": "Blood relative #{panelIndex}",
          "panelsState": "firstExpanded"
        },
        {
          "type": "comment",
          "name": "relativesAdditionalInfo",
          "title": "Other information about your family",
          "description": "Provide any additional details about your family's health history that you think may be important.",
          "descriptionLocation": "underInput"
        }
      ]
    },
    {
      "name": "healthcareProvider",
      "title": "Healthcare Provider Information",
      "elements": [
        {
          "type": "radiogroup",
          "name": "primaryCareProvider",
          "title": "Do you have a Primary Care Provider?",
          "choices": ["No", "Yes"]
        },
        {
          "type": "panel",
          "name": "primaryCareProviderInfo",
          "title": "Primary Care Provider",
          "elements": [
            {
              "type": "text",
              "name": "primaryCareProviderName",
              "title": "Name"
            },
            {
              "type": "text",
              "name": "primaryCareProviderPhone",
              "title": "Phone",
              "startWithNewLine": false
            },
            {
              "type": "comment",
              "name": "primaryCareProviderAddress",
              "title": "Address"
            },
            {
              "type": "radiogroup",
              "name": "primaryCareProviderSent",
              "title": "Send a summary of your visit to this provider?",
              "choices": ["No", "Yes"]
            }
          ]
        },
        {
          "type": "radiogroup",
          "name": "primaryCareProviderRecommend",
          "title": "Did a non-Vanderbilt physician or healthcare provider recommend or arrange this visit?",
          "choices": ["No", "Yes"]
        },
        {
          "type": "panel",
          "name": "primaryCareProviderRecommendInfo",
          "title": "Recommendation Details",
          "elements": [
            {
              "type": "radiogroup",
              "name": "primaryCareProviderWhoSent",
              "title": "Who referred you?",
              "choices": [
                {
                  "value": "primary",
                  "text": "Your Primary Care Provider (listed above)"
                },
                {
                  "value": "other",
                  "text": "Another physician or healthcare provider"
                }
              ]
            },
            {
              "type": "panel",
              "name": "primaryCareProviderOtherInfo",
              "title": "Other Referring Provider",
              "elements": [
                {
                  "type": "text",
                  "name": "primaryCareProviderOtherName",
                  "title": "Name"
                },
                {
                  "type": "text",
                  "name": "primaryCareProviderOtherPhone",
                  "title": "Phone",
                  "startWithNewLine": false
                },
                {
                  "type": "comment",
                  "name": "primaryCareProviderOtherAddress",
                  "title": "Address"
                },
                {
                  "type": "radiogroup",
                  "name": "primaryCareProviderOtherSent",
                  "title": "Send a summary of your visit to this provider?",
                  "choices": ["No", "Yes"]
                }
              ]
            }
          ]
        }
      ]
    },
    {
      "name": "medications",
      "title": "Medications",
      "elements": [
        {
          "type": "panel",
          "name": "currentUsingMedication",
          "title": "Medications Currently Taken",
          "elements": [
            {
              "type": "radiogroup",
              "name": "currentMedication",
              "title": "Are you currently taking any prescription or non-prescription medications, vitamins, supplements, or herbal remedies?",
              "choices": ["No", "Yes"]
            },
            {
              "type": "matrixdynamic",
              "name": "currentMedicationList",
              "title": "List Current Medications",
              "rowCount": 5,
              "columns": [
                { "name": "name", "title": "Medication Name", "cellType": "text" },
                { "name": "dose", "title": "Dose", "cellType": "text" },
                { "name": "often", "title": "How Often Taken", "cellType": "text" }
              ]
            }
          ]
        },
        {
          "type": "panel",
          "name": "pnl-recentlyUsedMedication",
          "title": "Recently Used Medications",
          "elements": [
            {
              "type": "radiogroup",
              "name": "recentlyUsedMedication",
              "title": "Have you recently used other medications?",
              "choices": ["No", "Yes"]
            },
            {
              "type": "matrixdynamic",
              "name": "recentlyUsedMedicationList",
              "title": "List Recently Used Medications",
              "rowCount": 5,
              "columns": [
                { "name": "name", "title": "Medication Name", "cellType": "text" },
                { "name": "dose", "title": "Dose", "cellType": "text" },
                { "name": "often", "title": "How Often Taken", "cellType": "text" }
              ]
            }
          ]
        },
        {
          "type": "radiogroup",
          "name": "aspirinContainingProducts",
          "title": "Have you taken aspirin-containing products in the last two weeks?",
          "choices": ["No", "Yes"]
        },
        {
          "type": "radiogroup",
          "name": "steroidDrugs",
          "title": "Have you taken steroid or cortisone-type drugs within the last year?",
          "choices": ["No", "Yes"]
        }
      ]
    },
    {
      "name": "allergies",
      "title": "Allergies",
      "elements": [
        {
          "type": "panel",
          "name": "allergiesMedication",
          "title": "Medication Allergies",
          "elements": [
            {
              "type": "radiogroup",
              "name": "hasAllergiesMedication",
              "title": "Have you had allergic reactions to medications?",
              "choices": ["No", "Yes"]
            },
            {
              "type": "matrixdynamic",
              "name": "allergiesMedicationList",
              "title": "List Medications and Reactions",
              "rowCount": 5,
              "columns": [
                { "name": "name", "title": "Medication Name", "cellType": "text" },
                { "name": "description", "title": "Reaction", "cellType": "comment", "rows": 2 }
              ]
            }
          ]
        },
        {
          "type": "panel",
          "name": "foodAllergiesInfo",
          "title": "Food Allergies",
          "elements": [
            {
              "type": "radiogroup",
              "name": "hasFoodAllergies",
              "title": "Do you have food allergies?",
              "choices": ["No", "Yes"]
            },
            {
              "type": "comment",
              "name": "foodAllergiesDescription",
              "title": "Describe Food Allergies"
            }
          ]
        }
      ]
    },
    {
      "name": "selfCare",
      "title": "Self-Care / Home Environment Assessment",
      "elements": [
        {
          "type": "matrix",
          "name": "performingActivities",
          "title": "Do you have difficulty performing these activities by yourself?",
          "columns": ["No", "Yes"],
          "rows": [
            "Eating",
            "Bathing",
            "Dressing",
            "Walking",
            "Using Toilet",
            "Housekeeping"
          ],
          "eachRowRequired": true
        },
        {
          "type": "radiogroup",
          "name": "specialDietary",
          "title": "Do you have any special dietary needs?",
          "choices": ["No", "Yes"]
        },
        {
          "type": "comment",
          "name": "specialDietaryDescription",
          "title": "Describe your special dietary needs"
        },
        {
          "type": "radiogroup",
          "name": "livingArrangement",
          "title": "Current living arrangement",
          "choices": ["House", "Apartment", "Nursing Home"],
          "showOtherItem": true
        },
        {
          "type": "radiogroup",
          "name": "liveWithWhom",
          "title": "Do you live",
          "choices": ["Alone", "With Spouse/Family", "With others"]
        },
        {
          "type": "comment",
          "name": "liveWithWhomDescription",
          "title": "Describe the people you live with"
        },
        {
          "type": "comment",
          "name": "peopleProvidedAssistence",
          "title": "List family or friends who could assist with homecare if needed"
        }
      ]
    },
    {
      "name": "educationalNeeds",
      "title": "Educational Needs",
      "elements": [
        {
          "type": "checkbox",
          "name": "interestedInTopics",
          "title": "Topics you would like more information about",
          "choices": [
            "How to stop smoking",
            "Exercise",
            "Stress",
            "Safe sexual practices",
            "Safety (seat belts, smoke detectors, firearms)",
            "Nutrition",
            "Weight control",
            "Violent or abusive behavior",
            "Living wills",
            "Diabetes",
            "Cancer screening"
          ],
          "showOtherItem": true,
          "colCount": 2
        }
      ]
    }
  ],
  "questionErrorLocation": "bottom",
  "questionsOnPageMode": "singlePage",
  "headerView": "advanced"
};
```

### `src/main.ts`

```ts
import { createApp } from "vue";
import App from "./App.vue";

const app = createApp(App);
app.mount("#app");
```

### `src/shims-vue.d.ts`

```ts
/* eslint-disable */
declare module "*.vue" {
    import type { DefineComponent } from "vue"
    const component: DefineComponent<{}, {}, any>
    export default component
}
```

### `src/theme.ts`

```ts
export const themeJson = {};
```

### `.eslintrc.js`

```js
module.exports = {
    root: true,
    env: {
        node: true
    },
    extends: [
        "plugin:vue/vue3-essential",
        "eslint:recommended",
        "@vue/typescript/recommended",
        "@vue/prettier",
        "@vue/prettier/@typescript-eslint"
    ],
    parserOptions: {
        ecmaVersion: 2020
    },
    rules: {
        "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
        "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off"
    },
    overrides: [
        {
            files: [
                "**/__tests__/*.{j,t}s?(x)",
                "**/tests/unit/**/*.spec.{j,t}s?(x)"
            ],
            env: {
                jest: true
            }
        }
    ]
};
```

### `babel.config.js`

```js
module.exports = {
  presets: ["@vue/cli-plugin-babel/preset"]
};
```

### `package.json`

```json
{
  "name": "surveyjs-library-vue3",
  "version": "0.1.0",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "tslib": "2.6.1",
    "vue": "^3.4.1",
    "survey-core": "latest",
    "survey-pdf": "latest",
    "survey-vue3-ui": "latest",
    "vue-router": "^4.0.0-0",
    "vuex": "^4.0.0-0"
  },
  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^2.33.0",
    "@typescript-eslint/parser": "^2.33.0",
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-pwa": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-prettier": "^6.0.0",
    "@vue/eslint-config-typescript": "^5.0.2",
    "@vue/test-utils": "^2.0.0-0",
    "eslint": "^6.7.2",
    "eslint-plugin-prettier": "^3.1.3",
    "eslint-plugin-vue": "^7.0.0-0",
    "node-sass": "^4.12.0",
    "prettier": "^1.19.1",
    "sass-loader": "^8.0.2",
    "typescript": "~3.9.3"
  }
}
```

### `tsconfig.json`

```json
{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env",
      "jest"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}
```

## Other Frameworks

- [Angular](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-patient-medical-history-form-template/angular.md)
- [React](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-patient-medical-history-form-template/reactjs.md)
- [jQuery](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-patient-medical-history-form-template/jquery.md)
- [Vanilla JS](https://surveyjs.io/pdf-generator/examples/pdf-healthcare-patient-medical-history-form-template/vanillajs.md)