@coopenomics/desktop 2.2.10 → 2025.4.29

package/src/widgets/Cooperative/Documents/ListOfDocuments/ui/ListOfDocumentsWidget.vue

@@ -1,156 +1,113 @@
 <template lang="pug">
-
 div.row.justify-center
   div.col-12
-    q-table(
-      ref="tableRef"
-      flat
-      :rows="documents"
-      :columns="columns"
-      :table-colspan="9"
-      :pagination="pagination"
-      virtual-scroll
-      :virtual-scroll-item-size="48"
-      :rows-per-page-options="[10]"
-      :loading='onLoading'
-      :no-data-label="'документы не найдены'"
-    ).full-height
+    DocumentsTable(
+      :documents="documentStore.documents"
+      :loading="documentStore.loading"
+      @toggle-expand="toggleExpand"
+      @load="loadMoreDocuments"
+    )
       template(#top v-if="showFilter")
-        q-btn-toggle(
-          size="sm"
-          v-model="documentType"
-          spread
-          toggle-color="teal"
-          color="white"
-          text-color="black"
-          :options="[{label: 'Все входящие', value: 'newsubmitted'}, {label: 'Только утверждённые', value: 'newresolved'}]"
-        ).full-width
-
-      template(#header="props")
-
-        q-tr(:props="props")
-          q-th(auto-width)
-
-          q-th(
-            v-for="col in props.cols"
-            :key="col.name"
-            :props="props"
-          ) {{ col.label }}
-
-      template(#body="props")
-        q-tr(:key="`m_${props.row?.statement?.action?.global_sequence}`" :props="props")
-          q-td(auto-width)
-            q-btn(v-if="!expand" size="sm" color="primary" round dense :icon="expanded.get(props.row?.statement?.action?.global_sequence) ? 'remove' : 'add'" @click="toggleExpand(props.row?.statement?.action?.global_sequence)")
-
-          q-td {{ props.row.statement?.action?.data?.document.hash.substring(0, 10) }}
-
-          q-td {{ props.row.statement?.document?.full_title }}
-
-        q-tr(v-if="expanded.get(props.row?.statement?.action?.global_sequence) || expand" :key="`e_${props.row?.statement?.action?.global_sequence}`" :props="props" class="q-virtual-scroll--with-prev")
-          q-td(colspan="100%")
-            ComplexDocument(:documents="props.row")
-
-
+        div.full-width
+          q-btn-toggle.full-width(
+            size="sm"
+            :model-value="typeForToggle"
+            @update:model-value="onTypeChange"
+            spread
+            toggle-color="teal"
+            color="white"
+            text-color="black"
+            :options="[{label: 'Все входящие', value: 'newsubmitted'}, {label: 'Только утверждённые', value: 'newresolved'}]"
+          )
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, computed, reactive, watch } from 'vue'
-import { Notify } from 'quasar'
-import { sendGET } from 'src/shared/api';
-import { ComplexDocument } from 'src/shared/ui/ComplexDocument';
-import type { IComplexDocument, IGetDocuments } from '@coopenomics/controller';
-
-const documents = ref<IComplexDocument[]>([])
-const onLoading = ref(false)
+import { onMounted, ref, onBeforeUnmount } from 'vue'
+import { DocumentModel } from 'src/entities/Document'
+import { DocumentsTable } from '../ui'
+import { FailAlert } from 'src/shared/api'
+import type { DocumentType } from 'src/entities/Document/model/types'
 
 const props = defineProps({
+  username: {
+    type: String,
+    required: true
+  },
   filter: {
     type: Object,
-    required: true,
-    validator: (value: any) => {
-      // Проверка на наличие поля 'receiver' и типа string
-      return typeof value.receiver === 'string'
-    }
-  },
-  expand: {
-    type: Boolean,
     required: false,
-    default: false
+    default: () => ({})
   },
   showFilter: {
     type: Boolean,
     required: false,
     default: false,
   },
-  documentType: {
-    type: String,
+  initialDocumentType: {
+    type: String as () => DocumentType,
     required: false,
+    default: 'newsubmitted',
   }
 })
 
-const receiver = computed(() => props.filter.receiver)
-const documentType = ref(props.documentType || 'newsubmitted')
-
-const loadDocuments = async () => {
-  try {
-    onLoading.value = true
+const emit = defineEmits(['toggle-expand'])
 
-    const data: IGetDocuments = {
-      filter: {
-        receiver: receiver.value,
-        ...props.filter
-      },
-      type: documentType.value as 'newresolved' | 'newsubmitted'
-    }
+// Получаем store документов
+const documentStore = DocumentModel.useDocumentStore()
 
-    documents.value = (await sendGET('/v1/documents/get-documents', {
-      ...data
-    })).results as IComplexDocument[]
+// Переменная для отслеживания типа в интерфейсе
+const typeForToggle = ref<DocumentType>(props.initialDocumentType)
 
-    onLoading.value = false
-  } catch (e: any) {
-    onLoading.value = false
-    console.log(e)
-    Notify.create({
-      message: e.message,
-      type: 'negative',
-    })
+// Обработчик изменения типа документов
+async function onTypeChange(newType: DocumentType) {
+  if (newType === 'newresolved' || newType === 'newsubmitted') {
+    typeForToggle.value = newType
+    try {
+      await documentStore.changeDocumentType(newType, props.username, props.filter)
+    } catch (e) {
+      FailAlert(e)
+    }
   }
 }
 
-onMounted(() => {
-  loadDocuments()
-})
-
-watch(documentType, (newValue, oldValue) => {
-  if (newValue != oldValue) {
-    documents.value = []
-    loadDocuments()
-  }
-})
-
-// const getHumanActionName = (action) => {
-//   if (action == 'joincoop') {
-//     return 'Заявление на вступление'
-//   }
-// }
+// Функция для загрузки следующей страницы документов
+async function loadMoreDocuments() {
+  try {
+    // Проверяем, не загружаются ли уже документы
+    if (documentStore.loading) {
+      return
+    }
 
-const columns = [
-  { name: 'id', align: 'left', label: 'id', field: 'id', sortable: true },
+    const nextPage = documentStore.pagination.currentPage + 1
 
-  { name: 'action', align: 'left', label: 'Документ', field: 'action', sortable: true },
-  // { name: 'timestamp', align: 'left', label: 'Дата', field: 'timestamp', sortable: true },
-  // { name: 'username', align: 'left', label: 'Аккаунт', field: 'username', sortable: true },
-] as any
+    if (nextPage <= documentStore.pagination.totalPages)
+      await documentStore.changePage(nextPage, props.username, props.filter)
 
-const expanded = reactive(new Map()) // Используем Map для отслеживания состояния развертывания каждой записи
+  } catch (e) {
+    FailAlert(e)
+  }
+}
 
-// Функция для переключения состояния развертывания
-const toggleExpand = (id: any) => {
-  expanded.set(id, !expanded.get(id))
+// Функция для переключения состояния раскрытия
+function toggleExpand(document: any) {
+  emit('toggle-expand', document)
 }
 
+// Периодическое обновление данных
+let interval: number | null = null
 
-const tableRef = ref(null)
-const pagination = ref({ rowsPerPage: 10 })
+// Загрузка документов при монтировании
+onMounted(() => {
+  // Начальная загрузка документов
+  documentStore.resetDocuments()
+  documentStore.changeDocumentType(typeForToggle.value, props.username, props.filter)
+    .catch(e => FailAlert(e))
+})
+
+// Очистка таймера при размонтировании компонента
+onBeforeUnmount(() => {
+  if (interval !== null) {
+    window.clearInterval(interval)
+  }
+})
 </script>

package/src/widgets/Cooperative/Documents/ListOfDocuments/ui/index.ts

@@ -1 +1,3 @@
-export {default as ListOfDocumentsWidget} from './ListOfDocumentsWidget.vue'
+export { default as DocumentCard } from './DocumentCard.vue'
+export { default as ListOfDocumentsWidget } from './ListOfDocumentsWidget.vue'
+export { default as DocumentsTable } from './DocumentsTable.vue'

package/src/widgets/Cooperative/Orders/ListOfOrders/ui/ListOfOrdersWidget.vue

@@ -1,131 +1,156 @@
 <template lang="pug">
   div.row.justify-center
     div.col-12
-      q-table(
-        v-if="orders && orders.results"
-        ref="tableRef"
-        class="my-sticky-dynamic"
-        flat
-        :rows="orders.results"
-        row-key="id"
-        :columns="columns"
-        :table-colspan="9"
-        :loading="onLoading"
-        :no-data-label="'ордера не найдены'"
-        virtual-scroll
-        @virtual-scroll="onScroll"
-        :virtual-scroll-item-size="48"
-        :virtual-scroll-sticky-size-start="48"
-        :rows-per-page-options="[0]"
-        :pagination="pagination"
-      )
-        template(#header="props")
-          q-tr(:props="props")
-            q-th(auto-width)
-            q-th(
-              v-for="col in props.cols"
-              :key="col.name"
-              :props="props"
-              @click="onSort(col)"
-            ) {{ col.label }}
-
-        template(#body="props")
-          q-tr(:key="`m_${props.row.order_num}`" :props="props")
-            q-td(auto-width)
-              q-btn(size="sm" color="primary" round dense :icon="expanded.get(props.row.order_num) ? 'remove' : 'add'" @click="toggleExpand(props.row.order_num)")
-            q-td {{props.row.order_num}}
-            q-td {{ props.row.quantity }}
-            q-td
-              q-badge(v-if="props.row.type ==='registration'") регистрационный
-              q-badge(v-if="props.row.type ==='deposit'") паевый
-
-            q-td {{getNameFromUserData(props.row.user?.private_data)}}
-
-            q-td
-              q-badge(v-if="props.row.status ==='completed'" color="teal") обработан
-              q-badge(v-if="props.row.status ==='pending'" color="orange") ожидание оплаты
-              q-badge(v-if="props.row.status ==='failed'" color="red") ошибка
-              q-badge(v-if="props.row.status ==='paid'" color="orange") оплачен
-              q-badge(v-if="props.row.status ==='refunded'" color="grey") отменён
-              q-badge(v-if="props.row.status ==='expired'" color="grey") истёк
-            q-td
-              q-btn-dropdown(size="sm" label="действия" color="primary" v-model="dropdowns[props.row.order_num]")
-                q-list(dense)
-                  SetOrderPaidStatusButton(:id="props.row.id" @close="closeDropdown(props.row.order_num)")
-                  SetOrderRefundedStatusButton(:id="props.row.id" @close="closeDropdown(props.row.order_num)")
-                  //- SetOrderCompletedStatusButton(:id="props.row.id" @close="closeDropdown(props.row.order_num)")
-
-          q-tr(v-if="expanded.get(props.row.order_num)" :key="`e_${props.row.order_num}`" :props="props" class="q-virtual-scroll--with-prev")
-            q-td(colspan="100%")
-              div(v-if="props.row.status=='failed'")
-                p Причина ошибки: {{props.row.message}}
-
+      div.scroll-area(style="height: 90vh; overflow-y: auto;")
+        q-table(
+          v-if="payments && payments.items"
+          ref="tableRef"
+          flat
+          :grid="isMobile"
+          :rows="payments.items"
+          row-key="id"
+          :columns="columns"
+          :table-colspan="9"
+          :loading="onLoading"
+          :no-data-label="'платежи не найдены'"
+          virtual-scroll
+          @virtual-scroll="onScroll"
+          :virtual-scroll-target="'.scroll-area'"
+          :virtual-scroll-item-size="48"
+          :virtual-scroll-sticky-size-start="48"
+          :rows-per-page-options="[0]"
+          :pagination="pagination"
+          class="q-mb-md"
+        )
+          template(#item="props")
+            OrderCard(
+              :order="props.row"
+              :expanded="expanded.get(props.row.id)"
+              :hideActions="hideActions"
+              @toggle-expand="toggleExpand(props.row.id)"
+            )
+
+          template(#header="props")
+            q-tr(:props="props")
+              q-th(auto-width)
+              q-th(
+                v-for="col in props.cols"
+                :key="col.name"
+                :props="props"
+                @click="onSort(col)"
+              ) {{ col.label }}
+
+          template(#body="props")
+            q-tr(:key="`m_${props.row.id}`" :props="props")
+              q-td(auto-width)
+                q-btn(
+                  size="sm"
+                  color="primary"
+                  round
+                  dense
+                  :icon="expanded.get(props.row.id) ? 'remove' : 'add'"
+                  @click="toggleExpand(props.row.id)"
+                )
+              q-td {{props.row.id}}
+              q-td {{ props.row.amount }} {{props.row.symbol}}
+              q-td
+                q-badge(v-if="props.row.details.data.includes('registration')") регистрационный
+                q-badge(v-else) паевой
+
+              q-td(style="max-width: 150px; word-wrap: break-word; white-space: normal;") {{props.row.username}}
+
+
+              q-td
+                q-badge(v-if="props.row.status ==='COMPLETED'" color="teal") обработан
+                q-badge(v-if="props.row.status ==='PENDING'" color="orange") ожидание оплаты
+                q-badge(v-if="props.row.status ==='FAILED'" color="red") ошибка
+                q-badge(v-if="props.row.status ==='PAID'" color="orange") оплачен
+                q-badge(v-if="props.row.status ==='REFUNDED'" color="grey") отменён
+                q-badge(v-if="props.row.status ==='EXPIRED'" color="grey") истёк
+              q-td
+                SetOrderPaidStatusButton(
+                  v-if="!hideActions && ['EXPIRED', 'PENDING', 'FAILED'].includes(props.row.status)"
+                  :id="props.row.id"
+                )
+                span(v-else-if="!hideActions").text-grey нет доступных действий
+
+            q-tr(v-if="expanded.get(props.row.id)" :key="`e_${props.row.id}`" :props="props" class="q-virtual-scroll--with-prev")
+              q-td(colspan="100%")
+                div(v-if="props.row.status=='FAILED'")
+                  span Причина ошибки: {{props.row.message ?? 'нет дополнительной информации'}}
+                div(v-else)
+                  span нет дополнительной информации
 </template>
 <script setup lang="ts">
   import { onMounted, ref, computed, reactive, nextTick } from 'vue'
   import { Notify } from 'quasar'
-  import { getNameFromUserData } from 'src/shared/lib/utils/getNameFromUserData';
-  // import { formatToHumanDate } from 'src/shared/lib/utils/dates/formatToHumanDate';
-  import { useOrderStore } from 'src/entities/Order';
-  import { SetOrderPaidStatusButton } from 'src/features/Order/SetStatus/ui/SetOrderPaidStatusButton';
-  import { SetOrderRefundedStatusButton } from 'src/features/Order/SetStatus/ui/SetOrderRefundedStatusButton';
-  // import { SetOrderCompletedStatusButton } from 'src/features/Cooperative/Orders/SetStatus/ui/SetOrderCompletedStatusButton';
-
-  const orderStore = useOrderStore()
-  const orders = computed(() => orderStore.orders)
-  console.log('orders: ', orders.value)
+  import { usePaymentStore } from 'src/entities/Payment/model';
+  import { SetOrderPaidStatusButton } from 'src/features/Payment/SetStatus/ui/SetOrderPaidStatusButton';
+  import OrderCard from './OrderCard.vue';
+  import { useWindowSize } from 'src/shared/hooks';
+
+  const paymentStore = usePaymentStore()
+  const payments = computed(() => paymentStore.payments)
   const onLoading = ref(false)
   const nextPage = ref(1)
   const lastPage = ref(1);
-
-  const dropdowns = reactive({})
+  const { isMobile } = useWindowSize()
 
   const sortState = reactive({
     sortBy: '',
     sortDir: ''
   })
 
-  const sortedQuery = computed(() => {
-    if (sortState.sortBy && sortState.sortDir)
-      return `${sortState.sortBy}:${sortState.sortDir}`
-    else return ''
-  })
-
   const onSort = (col) => {
-
     if (!col.sortable) return
 
-  // Меняем направление сортировки, если кликнули на тот же столбец
-  if (sortState.sortBy === col.name) {
-    sortState.sortDir = sortState.sortDir === 'asc' ? 'desc' : 'asc'
-  } else {
-    // Если сортируем новый столбец, сбрасываем на 'asc'
-    sortState.sortBy = col.name
-    sortState.sortDir = 'asc'
-  }
-  orderStore.clear()
-  nextPage.value = 1
-  lastPage.value = 1
-  loadOrders(1) // Перезагружаем с новыми параметрами сортировки
-}
-
-  const closeDropdown = (id: string) => {
-    dropdowns[id] = false // Закрываем дропдаун для конкретной строки
+    // Меняем направление сортировки, если кликнули на тот же столбец
+    if (sortState.sortBy === col.name) {
+      sortState.sortDir = sortState.sortDir === 'asc' ? 'desc' : 'asc'
+    } else {
+      // Если сортируем новый столбец, сбрасываем на 'asc'
+      sortState.sortBy = col.name
+      sortState.sortDir = 'asc'
+    }
+    paymentStore.clear()
+    nextPage.value = 1
+    lastPage.value = 1
+    loadPayments(1) // Перезагружаем с новыми параметрами сортировки
   }
 
   const props = defineProps({
-    receiver: {
+    username: {
       type: String,
       required: false,
       default: null
     },
+    hideActions: {
+      type: Boolean,
+      default: false
+    }
   })
 
-  const loadOrders = async (page = 1) => {
+  const loadPayments = async (page = 1) => {
     try {
       onLoading.value = true
-      await orderStore.loadCoopOrders({username: props.receiver, page, limit: 25, sortBy: sortedQuery.value})
-      lastPage.value = orderStore.orders?.totalPages || 1
+
+      // Данные для фильтрации
+      const data = props.username ? { username: props.username } : undefined;
+
+      // Опции пагинации и сортировки
+      const options = {
+        page,
+        limit: 25,
+        sortBy: sortState.sortBy || undefined,
+        sortOrder: sortState.sortDir ? sortState.sortDir.toUpperCase() as 'ASC' | 'DESC' : 'ASC'
+      };
+
+      await paymentStore.loadPayments(data, options);
+
+      if (payments.value) {
+        lastPage.value = payments.value.totalPages || 1
+      }
+
       onLoading.value = false
     } catch (e: any) {
       onLoading.value = false
@@ -139,16 +164,15 @@
 
   // Функция обработки виртуального скролла
   const onScroll = ({ to, ref }) => {
-    if(orders.value) {
-
-      const lastIndex = orders.value.results.length - 1
+    if(payments.value) {
+      const lastIndex = payments.value.items.length - 1
 
       if (onLoading.value !== true && nextPage.value < lastPage.value && to === lastIndex) {
         onLoading.value = true
 
         setTimeout(() => {
           nextPage.value++
-          loadOrders(nextPage.value) // Загружаем следующую страницу
+          loadPayments(nextPage.value) // Загружаем следующую страницу
 
           nextTick(() => {
             ref.refresh() // Обновляем виртуальный скролл после загрузки
@@ -160,17 +184,18 @@
   }
 
   onMounted(() => {
-    orderStore.clear()
-    loadOrders()
+    paymentStore.clear()
+    loadPayments()
   })
 
 
-  const columns = [
-    { name: 'order_num', align: 'left', label: '№', field: 'order_num', sortable: true },
-    { name: 'quantity', align: 'left', label: 'Сумма', field: '', sortable: false },
-    { name: 'type', align: 'left', label: 'Тип платежа', field: 'type', sortable: true },
-    { name: 'name', align: 'left', label: 'От кого', field: '', sortable: false },
-    { name: 'status', align: 'left', label: 'Статус', field: '', sortable: true },
+  const columns: any[] = [
+    { name: 'id', align: 'left', label: '№', field: 'id', sortable: true },
+    { name: 'amount', align: 'left', label: 'Сумма', field: 'amount', sortable: true },
+    { name: 'type', align: 'left', label: 'Тип платежа', field: '', sortable: false },
+    { name: 'username', align: 'left', label: 'От кого', field: 'username', sortable: true },
+    { name: 'status', align: 'left', label: 'Статус', field: 'status', sortable: true },
+    { name: 'actions', align: 'left', label: '', field: '', sortable: false, hide: props.hideActions },
   ] as any
 
   const expanded = reactive(new Map()) // Используем Map для отслеживания состояния развертывания каждой записи
@@ -184,24 +209,6 @@
   const pagination = ref({ rowsPerPage: 0 })
   </script>
 
-<style lang="sass">
-.my-sticky-dynamic
-  /* height or max-height is important */
-  height: 100vh
-
-  /* this will be the loading indicator */
-  thead tr:last-child th
-    /* height of all previous header rows */
-    top: 48px
-  thead tr:first-child th
-    top: 0
-
-  /* prevent scrolling behind sticky top row on focus */
-  tbody
-    /* height of all previous header rows */
-    scroll-margin-top: 48px
-
-</style>
 <style>
 .q-list--dense > .q-item, .q-item--dense {
   padding: 0px !important;

package/src/widgets/Cooperative/Orders/ListOfOrders/ui/OrderCard.vue

@@ -0,0 +1,74 @@
+<template lang="pug">
+div.q-pa-xs.col-xs-12.col-sm-12.col-md-12.q-mt-md
+  q-card(bordered flat)
+    q-card-section.q-py-xs
+      div.text-subtitle2 № {{ order.order_num }}
+      div.text-caption Сумма: {{ order.quantity }}
+
+    q-separator
+
+    q-card-section.q-py-xs
+      div.row.items-center
+        div.col-6 Тип платежа:
+        div.col-6.text-right
+          q-badge(v-if="order.type ==='registration'") регистрационный
+          q-badge(v-if="order.type ==='deposit'") паевой
+
+      div.row.items-center.q-mt-sm
+        div.col-6 От кого:
+        div.col-6.text-right {{ getNameFromUserData(order.user?.private_data) }}
+
+      div.row.items-center.q-mt-sm
+        div.col-6 Статус:
+        div.col-6.text-right
+          q-badge(v-if="order.status ==='completed'" color="teal") обработан
+          q-badge(v-if="order.status ==='pending'" color="orange") ожидание оплаты
+          q-badge(v-if="order.status ==='failed'" color="red") ошибка
+          q-badge(v-if="order.status ==='paid'" color="orange") оплачен
+          q-badge(v-if="order.status ==='refunded'" color="grey") отменён
+          q-badge(v-if="order.status ==='expired'" color="grey") истёк
+
+    q-card-actions(align="right")
+      q-btn(
+        v-if="order.message"
+        size="sm"
+        flat
+        icon="expand_more"
+        @click="$emit('toggle-expand')"
+      )
+        | {{ expanded ? 'Скрыть' : 'Подробнее' }}
+
+      q-btn-dropdown(v-if="!hideActions" size="sm" label="действия" color="primary")
+        q-list(dense)
+          SetOrderPaidStatusButton(:id="order.id" @close="$emit('close-dropdown')")
+          SetOrderRefundedStatusButton(:id="order.id" @close="$emit('close-dropdown')")
+
+    q-slide-transition
+      div(v-show="expanded && order.message")
+        q-separator
+        q-card-section
+          p Причина ошибки: {{order.message}}
+</template>
+
+<script setup lang="ts">
+import { getNameFromUserData } from 'src/shared/lib/utils/getNameFromUserData';
+import { SetOrderPaidStatusButton } from 'src/features/Payment/SetStatus/ui/SetOrderPaidStatusButton';
+import { SetOrderRefundedStatusButton } from 'src/features/Payment/SetStatus/ui/SetOrderRefundedStatusButton';
+
+defineProps({
+  order: {
+    type: Object,
+    required: true
+  },
+  expanded: {
+    type: Boolean,
+    default: false
+  },
+  hideActions: {
+    type: Boolean,
+    default: false
+  }
+})
+
+defineEmits(['toggle-expand', 'close-dropdown'])
+</script>

package/src/widgets/Cooperative/Orders/ListOfOrders/ui/index.ts

@@ -1 +1,2 @@
-export {default as ListOfOrdersWidget} from './ListOfOrdersWidget.vue'
+export { default as OrderCard } from './OrderCard.vue'
+export { default as ListOfOrdersWidget } from './ListOfOrdersWidget.vue'