Добавил шаг с услугами

src/pages/clients/components/FormsAgreementCreate/AgreementPerson.vue

@@ -1,9 +1,101 @@
 <template lang="pug">
-  .text GHBDTN
+  .flex-col
+    .flex-col
+      .font-semibold.text-smm ФИО пациента 
+      base-input(
+        :width-input="200",
+        v-model:value="patient.full_name"
+      )
+    .flex
+      .flex-col
+        .font-semibold.text-smm Документ, удостоверяющий личность
+        base-custom-select.select.text-sm(
+          placeholder="Тип документа",
+          v-model="patient.doc_type",
+          :items="patentIdentityDocumentTypes",            
+        )
+      .flex-col
+        .font-semibold.text-smm Серия и номер
+        base-input(
+          v-model:value="patient.seriesAndNumber", 
+          disabled,                  
+        )
+    .flex
+      .flex-col
+        .font-semibold.text-smm Телефон
+        base-custom-select.select.text-sm(
+          v-model="patient.phone",
+          :items="patentIdentityDocumentTypes",            
+        )
+      .flex-col
+        .font-semibold.text-smm Адрес
+        base-custom-select.select.text-sm(
+          v-model="patient.phone",
+          :items="patentIdentityDocumentTypes"    
+        )
+    .flex-col
+      .font-semibold.text-smm ФИО Заказчика 
+      base-input(
+        :width-input="200",
+        v-model:value="patient.full_name"
+      )
+    .flex
+      .flex-col
+        .font-semibold.text-smm Документ, удостоверяющий личность
+        base-custom-select.select.text-sm(
+          placeholder="Тип документа",
+          v-model="patient.doc_type",
+          :items="patentIdentityDocumentTypes",            
+        )
+      .flex-col
+        .font-semibold.text-smm Серия и номер
+        base-input(
+          v-model:value="patient.seriesAndNumber", 
+          disabled,                  
+        )
+    .flex
+      .flex-col
+        .font-semibold.text-smm Телефон
+        base-custom-select.select.text-sm(
+          v-model="patient.phone",
+          :items="patentIdentityDocumentTypes",            
+        )
+      .flex-col
+        .font-semibold.text-smm Адрес
+        base-custom-select.select.text-sm(
+          v-model="patient.phone",
+          :items="patentIdentityDocumentTypes" )
 </template>
 
 <script>
+import BaseInput from "@/components/base/BaseInput";
+import BaseCustomSelect from "@/components/base/BaseCustomSelect.vue";
 export default {
   name: "AgreementPerson",
+  components: {
+    BaseInput,
+    BaseCustomSelect,
+  },
+  data() {
+    return {
+      patient: {
+        full_name: "",
+        doc_type: "",
+        seriesAndNumber: "2354 125423",
+        phone: {},
+      },
+    };
+  },
+  computed: {
+    patentIdentityDocumentTypes() {
+      return [
+        { id: "Паспорт", label: "Паспорт" },
+        {
+          id: "Водительское удостоверение",
+          label: "Водительское удостоверение",
+        },
+      ];
+    },
+  },
 };
 </script>