@coopenomics/desktop 2025.7.3 → 2025.11.8-alpha-2

package/extensions/capital/widgets/ComponentsListWidget/ComponentsListWidget.vue

@@ -0,0 +1,231 @@
+<template lang="pug">
+q-card(flat)
+  q-table(
+    :rows='components || []',
+    :columns='columns',
+    row-key='project_hash',
+    :loading='false',
+    :pagination='{ rowsPerPage: 0 }',
+    flat,
+    square,
+    hide-header,
+    hide-pagination,
+    no-data-label='Нет компонентов'
+  )
+    template(#body='props')
+      q-tr(
+        :props='props'
+      )
+        q-td
+          .row.items-center(style='padding: 12px; min-height: 48px')
+            // Кнопка раскрытия (55px)
+            .col-auto(style='width: 55px; flex-shrink: 0')
+              q-btn(
+                size='sm',
+                color='primary',
+                dense,
+                round,
+                :icon='expanded[props.row.project_hash] ? "expand_more" : "chevron_right"',
+                @click.stop='handleToggleComponent(props.row.project_hash)'
+              )
+
+            // ID с иконкой (100px + отступ 30px)
+            .col-auto(style='width: 100px; padding-left: 30px; flex-shrink: 0')
+              q-icon(name='extension', size='xs').q-mr-xs
+              span.list-item-title(
+                v-if='props.row.prefix'
+                @click.stop='handleOpenComponent(props.row.project_hash)'
+              ) {{ '#' + props.row.prefix }}
+
+            // Title со статусом (400px + отступ 30px)
+            .col(style='width: 400px; padding-left: 30px')
+              .list-item-title(
+                @click.stop='handleOpenComponent(props.row.project_hash)'
+                style='display: inline-block; vertical-align: top; word-wrap: break-word; white-space: normal'
+              )
+                q-icon(
+                  :name='getProjectStatusIcon(props.row.status)',
+                  :color='getProjectStatusDotColor(props.row.status)',
+                  size='xs'
+                ).q-mr-sm
+                span {{ props.row.title }}
+
+            // Actions - CreateIssueButton и кнопка перехода (140px, выравнивание по правому краю)
+            .col-auto.ml-auto(style='width: 140px')
+              .row.items-center.justify-end.q-gutter-xs
+                CreateIssueButton(
+                  @click.stop,
+                  :mini='true',
+                  :project-hash='props.row.project_hash'
+                )
+                q-btn(
+                  size='xs',
+                  flat,
+                  icon='arrow_forward',
+                  @click.stop='handleOpenComponent(props.row.project_hash)'
+                )
+                //- ProjectMenuWidget(:project='props.row', @click.stop)
+
+      // Слот для дополнительного контента компонента
+      q-tr.q-virtual-scroll--with-prev(
+        no-hover,
+        v-if='expanded[props.row.project_hash]',
+        :key='`e_${props.row.project_hash}`'
+      )
+        q-td(colspan='100%')
+          // Скелетон загрузки
+          div(v-if='loadingComponents[props.row.project_hash]', style='padding: 16px')
+            q-skeleton(height='24px', style='margin-bottom: 8px')
+            q-skeleton(height='24px', style='margin-bottom: 8px')
+            q-skeleton(height='24px', style='margin-bottom: 8px')
+            q-skeleton(height='24px')
+          // Реальный контент
+          slot(v-else, name='component-content', :component='props.row')
+</template>
+<script lang="ts" setup>
+import { ref, watch } from 'vue';
+import type { IProjectComponent } from 'app/extensions/capital/entities/Project/model';
+import {
+  getProjectStatusIcon,
+  getProjectStatusDotColor,
+} from 'app/extensions/capital/shared/lib/projectStatus';
+import { CreateIssueButton } from 'app/extensions/capital/features/Issue/CreateIssue';
+// import { ProjectMenuWidget } from 'app/extensions/capital/widgets/ProjectMenuWidget';
+
+const props = defineProps<{
+  components: IProjectComponent[] | undefined;
+  expanded: Record<string, boolean>;
+  expandAll?: boolean;
+}>();
+
+const emit = defineEmits<{
+  openComponent: [projectHash: string];
+  toggleComponent: [componentHash: string];
+}>();
+
+// Локальное состояние загрузки для каждого компонента
+const loadingComponents = ref<Record<string, boolean>>({});
+
+// Watcher для автоматического развертывания/сворачивания всех компонентов
+watch(() => props.expandAll, (newValue, oldValue) => {
+  if (props.components && newValue !== oldValue) {
+    if (newValue) {
+      // Небольшая задержка, чтобы компоненты успели загрузиться после разворота проектов
+      setTimeout(() => {
+        if (props.components) {
+          props.components.forEach((component) => {
+            if (!props.expanded[component.project_hash]) {
+              emit('toggleComponent', component.project_hash);
+            }
+          });
+        }
+      }, 200);
+    } else {
+      // Свернуть все компоненты
+      props.components.forEach((component) => {
+        if (props.expanded[component.project_hash]) {
+          emit('toggleComponent', component.project_hash);
+        }
+      });
+    }
+  }
+});
+
+// Watcher для применения expandAll после загрузки компонентов
+watch(() => props.components, (newComponents) => {
+  if (newComponents && props.expandAll) {
+    // Небольшая задержка для стабильности
+    setTimeout(() => {
+      if (props.components) {
+        props.components.forEach((component) => {
+          if (!props.expanded[component.project_hash]) {
+            emit('toggleComponent', component.project_hash);
+          }
+        });
+      }
+    }, 50);
+  }
+});
+
+const handleToggleComponent = (componentHash: string) => {
+  // Если компонент разворачивается (становится expanded), устанавливаем loading
+  if (!props.expanded[componentHash]) {
+    loadingComponents.value[componentHash] = true;
+    // Снимаем loading через 100мс, чтобы кнопка реагировала сразу
+    setTimeout(() => {
+      loadingComponents.value[componentHash] = false;
+    }, 100);
+  }
+  emit('toggleComponent', componentHash);
+};
+
+const handleOpenComponent = (componentHash: string) => {
+  emit('openComponent', componentHash);
+};
+
+// Определяем столбцы таблицы
+const columns = [
+  {
+    name: 'expand',
+    label: '',
+    align: 'center' as const,
+    field: '' as const,
+    sortable: false,
+  },
+  {
+    name: 'prefix',
+    label: 'Префикс',
+    align: 'left' as const,
+    field: 'prefix' as const,
+    sortable: true,
+  },
+  {
+    name: 'name',
+    label: 'Название',
+    align: 'left' as const,
+    field: 'title' as const,
+    sortable: true,
+  },
+  {
+    name: 'master',
+    label: '',
+    align: 'right' as const,
+    field: '' as const,
+    sortable: false,
+  },
+  {
+    name: 'actions',
+    label: '',
+    align: 'right' as const,
+    field: '' as const,
+    sortable: false,
+  },
+];
+</script>
+
+<style lang="scss" scoped>
+.q-table {
+  tr {
+    min-height: 48px;
+  }
+
+  .q-td {
+    padding: 0; // Убираем padding таблицы, так как теперь используем внутренний padding
+  }
+}
+
+.q-chip {
+  font-weight: 500;
+}
+
+// Импорт глобального стиля для подсветки
+:deep(.list-item-title) {
+  font-weight: 500;
+  cursor: pointer;
+  transition: color 0.2s ease;
+
+  &:hover {
+    color: var(--q-accent);
+  }
+}
+</style>

package/extensions/capital/widgets/ComponentsListWidget/index.ts

@@ -0,0 +1 @@
+export { default as ComponentsListWidget } from './ComponentsListWidget.vue';

package/extensions/capital/widgets/ContributorGamificationWidget/ContributorGamificationWidget.vue

@@ -0,0 +1,158 @@
+<template lang="pug">
+div.q-mt-md
+  div
+    .row.items-center.q-mb-md
+      q-icon(name='local_fire_department', size='32px', color='orange')
+      .text-h6.q-ml-sm Уровень {{ Number(contributorStore.self?.level) || 1 }}
+
+
+    // Прогресс энергии
+    .q-mb-sm
+
+      .energy-progress-container
+        q-linear-progress(
+          :value="currentEnergy / 100",
+          color="orange",
+          track-color="grey-3",
+          size="32px",
+          rounded
+        )
+        .energy-overlay.row.items-center.justify-center.full-width.q-px-sm
+          q-icon(
+            name="arrow_left",
+            color="red",
+            size="34px",
+            class="energy-arrow q-mr-xs"
+          )
+          .text-body2.text-dark Энергия: {{ currentEnergy.toFixed(12) }}%
+
+    // Сумма до следующего уровня
+    .text-body2.text-grey-7
+      | До следующего уровня: {{ nextLevelRequirement }} {{ info.symbols.root_govern_symbol }}
+</template>
+
+<script lang="ts" setup>
+import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { useContributorStore } from 'app/extensions/capital/entities/Contributor/model';
+import { useConfigStore } from 'app/extensions/capital/entities/Config/model';
+import { useSystemStore } from 'src/entities/System/model';
+
+const contributorStore = useContributorStore();
+const configStore = useConfigStore();
+const { info } = useSystemStore();
+
+// Таймер для обновления энергии каждую секунду
+let energyUpdateTimer: number | null = null;
+
+// Текущая энергия с учетом decay
+const currentEnergy = ref(0);
+
+// Функция расчета требований для уровня (из GAMIFICATION.md)
+const calculateLevelRequirement = (level: number): number => {
+  if (!configStore.state?.config) return 0;
+  const config = configStore.state.config;
+  return config.level_depth_base * Math.pow(config.level_growth_coefficient, level - 1);
+};
+
+// Функция расчета снижения энергии со временем (из GAMIFICATION.md)
+const calculateEnergyDecay = (lastUpdate: Date, currentTime: Date): number => {
+  if (!configStore.state?.config) return 0;
+  const config = configStore.state.config;
+
+  // Количество секунд с момента последнего обновления
+  const secondsPassed = (currentTime.getTime() - lastUpdate.getTime()) / 1000;
+
+  // Перевод в дни
+  const daysPassed = secondsPassed / 86400;
+
+  // Расчет decay (decay_rate_per_day хранится как процент, например 1.11)
+  const decayRate = config.energy_decay_rate_per_day / 100; // Преобразование из процентов в десятичную дробь
+  const decay = daysPassed * decayRate;
+
+  return decay; // Возвращаем абсолютное значение decay
+};
+
+// Обновление энергии в реальном времени
+const updateCurrentEnergy = () => {
+  if (!contributorStore.self || !configStore.state?.config) return;
+
+  const contributor = contributorStore.self;
+  const lastUpdate = new Date(contributor.last_energy_update); // last_energy_update приходит как ISO строка
+  const now = new Date();
+
+  const decay = calculateEnergyDecay(lastUpdate, now);
+  const baseEnergy = Number(contributor.energy) || 0;
+
+  const newEnergy = Math.max(0, baseEnergy - decay);
+
+  currentEnergy.value = newEnergy;
+};
+
+// Сумма для достижения следующего уровня (текущий уровень до 100%)
+const nextLevelRequirement = computed(() => {
+  if (!contributorStore.self || !configStore.state?.config) return '0';
+
+  const contributor = contributorStore.self;
+  const currentLevel = Number(contributor.level) || 1;
+
+  // Используем текущую энергию с учетом decay
+  const currentEnergyValue = currentEnergy.value;
+
+  // Сколько энергии нужно для достижения 100%
+  const energyNeeded = Math.max(0, 100 - currentEnergyValue);
+
+  // Требования для текущего уровня
+  const currentLevelRequirement = calculateLevelRequirement(currentLevel);
+
+  // Сумма для достижения 100% энергии на текущем уровне
+  const amountNeeded = (energyNeeded / 100) * currentLevelRequirement;
+
+  return amountNeeded.toFixed(12);
+});
+
+// Запуск таймера при монтировании
+onMounted(() => {
+  updateCurrentEnergy(); // Первичное обновление
+
+  // Обновление каждую секунду
+  energyUpdateTimer = setInterval(() => {
+    updateCurrentEnergy();
+  }, 1000);
+});
+
+// Очистка таймера при размонтировании
+onUnmounted(() => {
+  if (energyUpdateTimer) {
+    clearInterval(energyUpdateTimer);
+  }
+});
+</script>
+
+<style scoped>
+.energy-progress-container {
+  position: relative;
+}
+
+.energy-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  z-index: 1;
+}
+
+.energy-arrow {
+  animation: blink 1s ease-in-out infinite;
+}
+
+@keyframes blink {
+  0%, 50% {
+    opacity: 1;
+  }
+  51%, 100% {
+    opacity: 0;
+  }
+}
+</style>

package/extensions/capital/widgets/ContributorGamificationWidget/index.ts

@@ -0,0 +1 @@
+export { default as ContributorGamificationWidget } from './ContributorGamificationWidget.vue';

package/extensions/capital/widgets/ContributorInfoWidget/ContributorInfoWidget.vue

@@ -0,0 +1,132 @@
+<template lang="pug">
+q-card(v-if='contributorStore.self' flat)
+
+  .q-pa-lg
+    .row.items-center.q-mb-md
+      q-icon(name='person', size='32px', color='primary')
+      .text-h6.q-ml-sm {{ contributorStore.self?.display_name }}
+
+
+    // Информация о профиле
+    .q-mb-lg
+      // О себе
+      .q-mb-md
+        EditAboutInput(@about-updated="handleFieldUpdated")
+
+      // Параметры для исполнителя
+
+      .row.justify-around
+        .col-md-4.col-xs-12
+          EditHoursPerDayInput(@hours-updated="handleFieldUpdated")
+        .col-md-4.col-xs-12
+          EditRatePerHourInput(@rate-updated="handleFieldUpdated")
+
+      // Виджет уровня и энергии
+      ContributorGamificationWidget
+
+    .text-body2.text-grey-7.text-weight-bold.q-mb-lg.q-ml-md Взносы по ролям
+    // Общая сумма вкладов
+    .row.q-mb-md
+      .col-12
+        ColorCard(color='purple').text-center
+          .card-label Сумма взносов
+          .card-value {{ totalContributions }}
+
+    .row.q-gutter-md.justify-around
+        .col-6.col-sm-4.col-xs-12
+          ColorCard(color='green')
+            .card-label Инвестор
+            .card-value {{ formattedInvestor }}
+        .col-6.col-sm-4.col-xs-12
+          ColorCard(color='green')
+            .card-label Исполнитель
+            .card-value {{ formattedCreator }}
+        .col-6.col-sm-4.col-xs-12
+          ColorCard(color='green')
+            .card-label Автор
+            .card-value {{ formattedAuthor }}
+        .col-6.col-sm-4.col-xs-12
+          ColorCard(color='green')
+            .card-label Координатор
+            .card-value {{ formattedCoordinator }}
+        .col-6.col-sm-4.col-xs-12
+          ColorCard(color='green')
+            .card-label Пропертор
+            .card-value {{ formattedPropertor }}
+        .col-6.col-sm-4.col-xs-12
+          ColorCard(color='green')
+            .card-label Участник
+            .card-value {{ formattedContributor }}
+
+
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue';
+import { useContributorStore } from 'app/extensions/capital/entities/Contributor/model';
+import { useSystemStore } from 'src/entities/System/model';
+import { EditAboutInput, EditHoursPerDayInput, EditRatePerHourInput } from 'app/extensions/capital/features/Contributor/EditContributor';
+import { ContributorGamificationWidget } from 'app/extensions/capital/widgets/ContributorGamificationWidget';
+import { ColorCard } from 'src/shared/ui';
+import { formatAsset2Digits } from 'src/shared/lib/utils/formatAsset2Digits';
+import 'src/shared/ui/CardStyles';
+
+const contributorStore = useContributorStore();
+const { info } = useSystemStore();
+
+// Форматированные вклады по ролям
+const formattedInvestor = computed(() => {
+  const value = contributorStore.self?.contributed_as_investor || '0';
+  return formatAsset2Digits(`${value} ${info.symbols.root_govern_symbol}`);
+});
+
+const formattedCreator = computed(() => {
+  const value = contributorStore.self?.contributed_as_creator || '0';
+  return formatAsset2Digits(`${value} ${info.symbols.root_govern_symbol}`);
+});
+
+const formattedAuthor = computed(() => {
+  const value = contributorStore.self?.contributed_as_author || '0';
+  return formatAsset2Digits(`${value} ${info.symbols.root_govern_symbol}`);
+});
+
+const formattedCoordinator = computed(() => {
+  const value = contributorStore.self?.contributed_as_coordinator || '0';
+  return formatAsset2Digits(`${value} ${info.symbols.root_govern_symbol}`);
+});
+
+const formattedPropertor = computed(() => {
+  const value = contributorStore.self?.contributed_as_propertor || '0';
+  return formatAsset2Digits(`${value} ${info.symbols.root_govern_symbol}`);
+});
+
+const formattedContributor = computed(() => {
+  const value = contributorStore.self?.contributed_as_contributor || '0';
+  return formatAsset2Digits(`${value} ${info.symbols.root_govern_symbol}`);
+});
+
+// Сумма всех вкладов по ролям
+const totalContributions = computed(() => {
+  if (!contributorStore.self) return '0.00';
+
+  const contributions = [
+    contributorStore.self.contributed_as_investor || '0',
+    contributorStore.self.contributed_as_creator || '0',
+    contributorStore.self.contributed_as_author || '0',
+    contributorStore.self.contributed_as_coordinator || '0',
+    contributorStore.self.contributed_as_propertor || '0',
+    contributorStore.self.contributed_as_contributor || '0',
+  ];
+
+  const total = contributions.reduce((sum, contribution) => {
+    return sum + parseFloat(contribution);
+  }, 0);
+
+  return formatAsset2Digits(`${total} ${info.symbols.root_govern_symbol}`);
+});
+
+// Обработчик обновления любого поля профиля
+const handleFieldUpdated = () => {
+  // Поле профиля обновлено, данные перезагрузятся автоматически через poll в CapitalProfilePage
+};
+</script>

package/extensions/capital/widgets/ContributorInfoWidget/index.ts

@@ -0,0 +1 @@
+export { default as ContributorInfoWidget } from './ContributorInfoWidget.vue';

package/extensions/capital/widgets/ContributorsListWidget/ContributorsListWidget.vue

@@ -0,0 +1,148 @@
+<template lang="pug">
+q-card(flat)
+
+  q-table(
+    :rows='contributors',
+    :columns='columns',
+    row-key='contributor_hash',
+    :loading='loading',
+    :pagination='pagination',
+    @request='onRequest',
+    binary-state-sort,
+    flat,
+    square,
+    no-data-label='У кооператива нет участников'
+  )
+
+    template(#body='props')
+      q-tr(:props='props')
+        q-td {{ props.row.display_name || '-' }}
+        q-td
+          q-chip(
+            :color='getContributorStatusColor(props.row.status)',
+            text-color='white',
+            :label='getContributorStatusLabel(props.row.status)',
+            size='sm'
+          )
+        q-td.text-right {{ formatAsset2Digits(props.row.debt_amount) }}
+        q-td.text-right {{ formatAsset2Digits(props.row.contributed_as_investor) }}
+        q-td.text-right {{ formatAsset2Digits(props.row.contributed_as_creator) }}
+        q-td.text-right {{ formatAsset2Digits(props.row.contributed_as_author) }}
+        q-td.text-right {{ formatAsset2Digits(props.row.contributed_as_coordinator) }}
+        q-td.text-right {{ formatAsset2Digits(props.row.contributed_as_contributor) }}
+        q-td.text-right {{ formatAsset2Digits(props.row.contributed_as_propertor) }}
+</template>
+
+<script lang="ts" setup>
+import type { IContributor } from 'app/extensions/capital/entities/Contributor/model/types';
+import { formatAsset2Digits } from 'src/shared/lib/utils';
+import { getContributorStatusColor, getContributorStatusLabel } from 'app/extensions/capital/shared/lib/contributorStatus';
+interface Props {
+  contributors: IContributor[];
+  loading?: boolean;
+  pagination?: {
+    page: number;
+    rowsPerPage: number;
+    sortBy: string;
+    descending: boolean;
+  };
+}
+
+interface Emits {
+  (e: 'request', props: { pagination: any }): void;
+}
+
+withDefaults(defineProps<Props>(), {
+  contributors: () => [],
+  loading: false,
+  pagination: () => ({
+    page: 1,
+    rowsPerPage: 25,
+    sortBy: 'created_at',
+    descending: true,
+  }),
+});
+
+const emit = defineEmits<Emits>();
+
+// Определяем столбцы таблицы
+const columns = [
+  {
+    name: 'username',
+    label: 'Имя пользователя',
+    align: 'left' as const,
+    field: 'username' as const,
+    sortable: true,
+  },
+  {
+    name: 'status',
+    label: 'Статус',
+    align: 'center' as const,
+    field: 'status' as const,
+    sortable: true,
+  },
+  {
+    name: 'debt_amount',
+    label: 'Долг',
+    align: 'right' as const,
+    field: 'debt_amount' as const,
+    sortable: true,
+  },
+  {
+    name: 'investor',
+    label: 'Инвестор',
+    align: 'right' as const,
+    field: 'contributed_as_investor' as const,
+    sortable: true,
+  },
+  {
+    name: 'creator',
+    label: 'Исполнитель',
+    align: 'right' as const,
+    field: 'contributed_as_creator' as const,
+    sortable: true,
+  },
+  {
+    name: 'author',
+    label: 'Автор',
+    align: 'right' as const,
+    field: 'contributed_as_author' as const,
+    sortable: true,
+  },
+  {
+    name: 'coordinator',
+    label: 'Координатор',
+    align: 'right' as const,
+    field: 'contributed_as_coordinator' as const,
+    sortable: true,
+  },
+  {
+    name: 'contributor',
+    label: 'Участник',
+    align: 'right' as const,
+    field: 'contributed_as_contributor' as const,
+    sortable: true,
+  },
+
+  {
+    name: 'propertor',
+    label: 'Пропертор',
+    align: 'right' as const,
+    field: 'contributed_as_propertor' as const,
+    sortable: true,
+  },
+];
+
+
+
+// Обработчик запросов пагинации и сортировки
+const onRequest = (props: { pagination: any }) => {
+  emit('request', props);
+};
+</script>
+
+<style lang="scss" scoped>
+.q-chip {
+  font-weight: 500;
+}
+</style>

package/extensions/capital/widgets/ContributorsListWidget/index.ts

@@ -0,0 +1 @@
+export { default as ContributorsListWidget } from './ContributorsListWidget.vue';