@coopenomics/desktop 2025.7.3 → 2025.11.8-alpha-2

package/src/shared/ui/UserDataForm/CreateOrganizationDataForm/CreateOrganizationDataForm.vue

@@ -0,0 +1,306 @@
+<template lang="pug">
+.q-gutter-sm.q-mt-md(v-if="data")
+  slot(name="top")
+
+  q-input(
+    ref='firstInput'
+    :autofocus="!$slots.top"
+    v-model='data.short_name',
+    standout='bg-teal text-white',
+    label='Краткое наименование организации',
+    placeholder='ПК "Ромашка"',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.full_name',
+    standout='bg-teal text-white',
+    label='Полное наименование организации',
+    placeholder='Потребительский Кооператив "Ромашка"',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-select(
+    v-model='data.type',
+    label='Выберите тип организации',
+    standout='bg-teal text-white',
+    :options='[ { label: "Потребительский Кооператив", value: Zeus.OrganizationType.COOP }, { label: "Производственный Кооператив", value: Zeus.OrganizationType.PRODCOOP }, { label: "ООО", value: Zeus.OrganizationType.OOO }, ]',
+    emit-value,
+    map-options
+    :readonly="readonly"
+  ).q-mb-md
+
+  q-input(
+    v-model='data.represented_by.last_name',
+    standout='bg-teal text-white',
+    label='Фамилия представителя',
+    :rules='[(val) => notEmpty(val), (val) => validatePersonalName(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.represented_by.first_name',
+    standout='bg-teal text-white',
+    label='Имя представителя',
+    :rules='[(val) => notEmpty(val), (val) => validatePersonalName(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.represented_by.middle_name',
+    standout='bg-teal text-white',
+    label='Отчество представителя',
+    :rules='[(val) => validatePersonalName(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.represented_by.based_on',
+    standout='bg-teal text-white',
+    label='Представитель действует на основании',
+    placeholder='решения общего собрания №... от ... г',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.represented_by.position',
+    standout='bg-teal text-white',
+    label='Должность представителя',
+    placeholder="Председатель совета",
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.phone',
+    standout='bg-teal text-white',
+    label='Номер телефона представителя',
+    mask='+7 (###) ###-##-##',
+    fill-mask,
+    :rules='[(val) => notEmpty(val), (val) => notEmptyPhone(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-select(
+    v-model='data.country',
+    standout='bg-teal text-white',
+    map-options,
+    emit-value,
+    option-label='label',
+    option-value='value',
+    label='Страна',
+    :options='[{ label: "Россия", value: "Russia" }]',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.city',
+    standout='bg-teal text-white',
+    label='Город',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.full_address',
+    standout='bg-teal text-white',
+    label='Юридический адрес регистрации',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.fact_address',
+    standout='bg-teal text-white',
+    label='Фактический адрес',
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+    template(v-slot:append)
+      q-btn(
+        dense,
+        size='sm',
+        color='teal',
+        @click='data.fact_address = data.full_address'
+        :disable="readonly"
+      ) совпадает
+
+  q-input(
+    v-model='data.details.inn',
+    standout='bg-teal text-white',
+    mask='############',
+    label='ИНН организации (10 или 12 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 10 || val.length === 12 || "ИНН должен содержать 10 или 12 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.details.ogrn',
+    standout='bg-teal text-white',
+    mask='###############',
+    label='ОГРН организации (13 или 15 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 13 || val.length === 15 || "ОГРН должен содержать 13 или 15 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.details.kpp',
+    standout='bg-teal text-white',
+    mask='#########',
+    label='КПП организации (9 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 9 || "КПП должен содержать 9 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.bank_account.bank_name',
+    standout='bg-teal text-white',
+    label='Наименование банка',
+    placeholder="ПАО Сбербанк"
+    :rules='[(val) => notEmpty(val)]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.bank_account.details.corr',
+    standout='bg-teal text-white',
+    mask='####################',
+    label='Корреспондентский счет (20 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 20 || "Корреспондентский счет должен содержать 20 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+  q-input(
+    v-model='data.bank_account.details.bik',
+    standout='bg-teal text-white',
+    mask='#########',
+    label='БИК (9 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 9 || "БИК должен содержать 9 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.bank_account.details.kpp',
+    standout='bg-teal text-white',
+    mask='#########',
+    label='КПП банка (9 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 9 || "КПП должен содержать 9 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-input(
+    v-model='data.bank_account.account_number',
+    standout='bg-teal text-white',
+    mask='####################',
+    label='Номер счета (20 цифр)',
+    :rules='[(val) => notEmpty(val), (val) => val.length === 20 || "Номер счета должен содержать 20 цифр"]',
+    autocomplete='off'
+    :readonly="readonly"
+  )
+
+  q-select(
+    v-model='data.bank_account.currency',
+    label='Валюта счёта',
+    standout='bg-teal text-white',
+    :options='[{ label: "RUB", value: "RUB" }]',
+    emit-value,
+    :rules='[(val) => notEmpty(val)]',
+    map-options
+    :readonly="readonly"
+  )
+</template>
+
+<script setup lang="ts">
+import {
+  validatePersonalName,
+  notEmpty,
+  notEmptyPhone,
+} from 'src/shared/lib/utils';
+
+import { ref, onMounted, nextTick, watch } from 'vue';
+import { Zeus } from '@coopenomics/sdk';
+
+// Типы на основе CreateOrganizationDataInputDTO из бэкенда
+export type ICreateOrganizationData = Omit<Zeus.ModelTypes['CreateOrganizationDataInput'], 'email'> & {
+  email?: string;
+};
+
+const props = defineProps<{
+  data?: ICreateOrganizationData;
+  readonly?: boolean;
+}>();
+
+const emit = defineEmits<{
+  'update:data': [data: ICreateOrganizationData];
+}>();
+
+// Создаем локальный реактивный объект с данными
+const data = ref<ICreateOrganizationData>(props.data || {
+  short_name: '',
+  full_name: '',
+  type: Zeus.OrganizationType.COOP,
+  represented_by: {
+    last_name: '',
+    first_name: '',
+    middle_name: '',
+    based_on: '',
+    position: '',
+  },
+  phone: '',
+  email: '',
+  country: 'Russia',
+  city: '',
+  full_address: '',
+  fact_address: '',
+  details: {
+    inn: '',
+    ogrn: '',
+    kpp: '',
+  },
+  bank_account: {
+    bank_name: '',
+    details: {
+      corr: '',
+      bik: '',
+      kpp: '',
+    },
+    account_number: '',
+    currency: 'RUB',
+  },
+});
+
+const firstInput = ref<any>();
+
+// Синхронизируем изменения props с локальными данными
+watch(() => props.data, (newData) => {
+  if (newData) {
+    data.value = newData;
+  }
+}, { deep: true, immediate: true });
+
+// Синхронизируем изменения локальных данных с родителем
+watch(data, (newData) => {
+  emit('update:data', newData);
+}, { deep: true });
+
+onMounted(async () => {
+  await nextTick();
+  firstInput.value?.$el?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+});
+</script>

package/src/shared/ui/UserDataForm/CreateOrganizationDataForm/index.ts

@@ -0,0 +1,2 @@
+export { default as CreateOrganizationDataForm } from './CreateOrganizationDataForm.vue';
+export type { ICreateOrganizationData } from './CreateOrganizationDataForm.vue';

package/src/shared/ui/UserDataForm/EntrepreneurDataForm/EntrepreneurDataForm.vue

@@ -1,15 +1,14 @@
 <template lang="pug">
-div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
-  q-input(v-model="userData.entrepreneur_data.last_name" standout="bg-teal text-white" hint="Иванов" label="Фамилия" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
-  q-input(v-model="userData.entrepreneur_data.first_name" standout="bg-teal text-white" hint="Иван" label="Имя" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
-  q-input(v-model="userData.entrepreneur_data.middle_name" standout="bg-teal text-white" hint="Иванович" label="Отчество" :rules="[val => validatePersonalName(val)]" autocomplete="off")
+div(v-if="userData.entrepreneur_data").q-gutter-sm.q-mt-md
+  q-input(ref="firstInput" autofocus v-model="userData.entrepreneur_data.last_name" standout="bg-teal text-white" label="Фамилия" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
+  q-input(v-model="userData.entrepreneur_data.first_name" standout="bg-teal text-white" label="Имя" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
+  q-input(v-model="userData.entrepreneur_data.middle_name" standout="bg-teal text-white" label="Отчество" :rules="[val => validatePersonalName(val)]" autocomplete="off")
 
   q-input(
     standout="bg-teal text-white"
     v-model="userData.entrepreneur_data.birthdate"
     mask="date"
-    label="Дата рождения"
-    hint="Формат: год/месяц/день"
+    label="Дата рождения (год/месяц/день)"
     :rules="['date', val => notEmpty(val)]"
     autocomplete="off"
   )
@@ -20,19 +19,18 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
             .row.items-center.justify-end
               q-btn(v-close-popup label="Close" color="primary" flat)
 
-  q-input(v-model="userData.entrepreneur_data.phone" standout="bg-teal text-white" mask="+7 (###) ###-##-##" fill-mask label="Номер телефона" hint="+7 (###) ###-##-##" :rules="[val => notEmpty(val), val => notEmptyPhone(val)]" autocomplete="off")
+  q-input(v-model="userData.entrepreneur_data.phone" standout="bg-teal text-white" mask="+7 (###) ###-##-##" fill-mask label="Номер телефона" :rules="[val => notEmpty(val), val => notEmptyPhone(val)]" autocomplete="off")
 
   q-select(v-model="userData.entrepreneur_data.country" standout="bg-teal text-white" map-options emit-value option-label="label" option-value="value" label="Страна" :options="[{ label: 'Россия', value: 'Russia' }]" :rules="[val => notEmpty(val)]" autocomplete="off")
 
-  q-input(v-model="userData.entrepreneur_data.city" standout="bg-teal text-white" label="Город" hint="Москва" :rules="[val => notEmpty(val)]" autocomplete="off")
-  q-input(v-model="userData.entrepreneur_data.full_address" standout="bg-teal text-white" label="Адрес регистрации (как в паспорте)" hint="г. Москва, ул. Арбат, д.12" :rules="[val => notEmpty(val)]" autocomplete="off")
+  q-input(v-model="userData.entrepreneur_data.city" standout="bg-teal text-white" label="Город" :rules="[val => notEmpty(val)]" autocomplete="off")
+  q-input(v-model="userData.entrepreneur_data.full_address" standout="bg-teal text-white" label="Адрес регистрации (как в паспорте)" :rules="[val => notEmpty(val)]" autocomplete="off")
 
   q-input(
     v-model="userData.entrepreneur_data.details.inn"
     standout="bg-teal text-white"
     mask="############"
-    label="ИНН предпринимателя"
-    hint="10 или 12 цифр"
+    label="ИНН предпринимателя (10 или 12 цифр)"
     :rules="[val => notEmpty(val), val => (val.length === 10 || val.length === 12) || 'ИНН должен содержать 10 или 12 цифр']"
     autocomplete="off"
   )
@@ -40,8 +38,7 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
     v-model="userData.entrepreneur_data.details.ogrn"
     standout="bg-teal text-white"
     mask="###############"
-    label="ОГРНИП"
-    hint="13 или 15 цифр"
+    label="ОГРНИП (13 или 15 цифр)"
     :rules="[val => notEmpty(val), val => (val.length === 13 || val.length === 15) || 'ОГРНИП должен содержать 13 или 15 цифр']"
     autocomplete="off"
   )
@@ -50,7 +47,6 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
     v-model="userData.entrepreneur_data.bank_account.bank_name"
     standout="bg-teal text-white"
     label="Наименование банка"
-    hint="ПАО Сбербанк"
     :rules="[val => notEmpty(val)]"
     autocomplete="off"
   )
@@ -59,8 +55,7 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
     v-model="userData.entrepreneur_data.bank_account.details.corr"
     standout="bg-teal text-white"
     mask="####################"
-    label="Корреспондентский счёт"
-    hint="20 цифр"
+    label="Корреспондентский счёт (20 цифр)"
     :rules="[val => notEmpty(val), val => val.length === 20 || 'Корреспондентский счёт должен содержать 20 цифр']"
     autocomplete="off"
   )
@@ -69,8 +64,7 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
     v-model="userData.entrepreneur_data.bank_account.details.bik"
     standout="bg-teal text-white"
     mask="#########"
-    label="БИК"
-    hint="9 цифр"
+    label="БИК (9 цифр)"
     :rules="[val => notEmpty(val), val => val.length === 9 || 'БИК должен содержать 9 цифр']"
   )
 
@@ -78,8 +72,7 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
     v-model="userData.entrepreneur_data.bank_account.details.kpp"
     standout="bg-teal text-white"
     mask="#########"
-    label="КПП (банка)"
-    hint="9 цифр"
+    label="КПП (банка) (9 цифр)"
     :rules="[val => notEmpty(val), val => val.length === 9 || 'КПП должен содержать 9 цифр']"
     autocomplete="off"
   )
@@ -96,8 +89,7 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
     v-model="userData.entrepreneur_data.bank_account.account_number"
     standout="bg-teal text-white"
     mask="####################"
-    label="Номер счёта"
-    hint="20 цифр"
+    label="Номер счёта (20 цифр)"
     :rules="[val => notEmpty(val), val => val.length === 20 || 'Номер счёта должен содержать 20 цифр']"
     autocomplete="off"
   )
@@ -106,10 +98,16 @@ div(v-if="userData.entrepreneur_data").q-gutter-md.q-mt-md
 import { validatePersonalName, notEmpty, notEmptyPhone } from 'src/shared/lib/utils';
 
 import type { IUserData } from 'src/shared/lib/types/user/IUserData';
-import { ref } from 'vue';
+import { ref, onMounted, nextTick } from 'vue';
 
 const props = defineProps<{ userData: IUserData }>();
 
-const userData = ref<IUserData>(props.userData)
+const userData = ref<IUserData>(props.userData);
+const firstInput = ref<any>();
+
+onMounted(async () => {
+  await nextTick();
+  firstInput.value?.$el?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+});
 
 </script>

package/src/shared/ui/UserDataForm/IndividualDataForm/IndividualDataForm.vue

@@ -1,18 +1,17 @@
 <template lang="pug">
-div(v-if="userData.individual_data").q-gutter-md.q-mt-md
+div(v-if="userData.individual_data").q-gutter-sm.q-mt-md
   slot(name="top")
-  q-input(v-model="userData.individual_data.last_name" standout="bg-teal text-white" hint="Иванов" label="Фамилия" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
-  q-input(v-model="userData.individual_data.first_name" standout="bg-teal text-white" hint="Иван" label="Имя" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
-  q-input(v-model="userData.individual_data.middle_name" standout="bg-teal text-white" hint="Иванович" label="Отчество" :rules="[val => validatePersonalName(val)]" autocomplete="off")
+  q-input(ref="firstInput" :autofocus="!slots.top" v-model="userData.individual_data.last_name" standout="bg-teal text-white" label="Фамилия" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
+  q-input(v-model="userData.individual_data.first_name" standout="bg-teal text-white" label="Имя" :rules="[val => notEmpty(val), val => validatePersonalName(val)]" autocomplete="off")
+  q-input(v-model="userData.individual_data.middle_name" standout="bg-teal text-white" label="Отчество" :rules="[val => validatePersonalName(val)]" autocomplete="off")
 
-  q-input(v-model="userData.individual_data.full_address" standout="bg-teal text-white" hint="г. Москва, ул. Арбат, д.12" label="Адрес регистрации (как в паспорте)" :rules="[val => notEmpty(val)]" autocomplete="off")
+  q-input(v-model="userData.individual_data.full_address" standout="bg-teal text-white" label="Адрес регистрации (как в паспорте)" :rules="[val => notEmpty(val)]" autocomplete="off")
 
   q-input(
     standout="bg-teal text-white"
     v-model="userData.individual_data.birthdate"
     mask="date"
-    label="Дата рождения"
-    hint="Формат: год/месяц/день"
+    label="Дата рождения (год/месяц/день)"
     :rules="['date', val => notEmpty(val)]"
     autocomplete="off"
   )
@@ -23,18 +22,26 @@ div(v-if="userData.individual_data").q-gutter-md.q-mt-md
             .row.items-center.justify-end
               q-btn(v-close-popup label="Close" color="primary" flat)
 
-  q-input(v-model="userData.individual_data.phone" standout="bg-teal text-white" mask="+7 (###) ###-##-##" fill-mask label="Номер телефона" hint="+7 (###) ###-##-##" :rules="[val => notEmpty(val), val => notEmptyPhone(val)]" autocomplete="off")
+  q-input(v-model="userData.individual_data.phone" standout="bg-teal text-white" mask="+7 (###) ###-##-##" fill-mask label="Номер телефона" :rules="[val => notEmpty(val), val => notEmptyPhone(val)]" autocomplete="off")
 
 </template>
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, onMounted, nextTick, useSlots } from 'vue'
 import { validatePersonalName, notEmpty, notEmptyPhone } from 'src/shared/lib/utils';
 
 import type { IUserData } from 'src/shared/lib/types/user/IUserData';
 
 const props = defineProps<{ userData: IUserData }>();
+const slots = useSlots();
 
-const userData = ref<IUserData>(props.userData)
+const userData = ref<IUserData>(props.userData);
+const firstInput = ref<any>();
+
+onMounted(async () => {
+  await nextTick();
+  console.log(firstInput.value)
+  firstInput.value?.$el?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+});
 
 
 </script>