@coopenomics/desktop 2.2.10 → 2025.5.2

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

@@ -0,0 +1,162 @@
+<template lang="pug">
+div.scroll-area(style="height: 90vh; overflow-y: auto;")
+  q-table(
+    ref="tableRef"
+    flat
+    :grid="isMobile"
+    :rows="documents"
+    :columns="columns"
+    :table-colspan="9"
+    :loading='loading'
+    :no-data-label="'документы не найдены'"
+    :virtual-scroll="!!documents.length"
+    @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="{'my-sticky-dynamic': documents.length > 0}"
+    class="q-mb-md"
+  ).documents-table
+    template(#top v-if="$slots.top")
+      slot(name="top")
+    template(#item="props")
+      DocumentCard(
+        :document="props.row"
+        :expanded="!!expanded.get(props.row?.statement?.action?.global_sequence)"
+        @toggle-expand="toggleExpand(props.row?.statement?.action?.global_sequence)"
+      )
+
+    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?.id || props.row?.statement?.action?.global_sequence}`" :props="props")
+        q-td(auto-width)
+          q-btn(
+            size="sm"
+            color="primary"
+            round
+            dense
+            :icon="expanded.get(props.row?.id || props.row?.statement?.action?.global_sequence) ? 'remove' : 'add'"
+            @click="toggleExpand(props.row?.id || props.row?.statement?.action?.global_sequence)"
+          )
+
+        q-td {{ getDocumentHash(props.row).substring(0, 10) || '' }}
+        q-td {{ getDocumentTitle(props.row) }}
+        
+      q-tr(
+        v-if="expanded.get(props.row?.id || props.row?.statement?.action?.global_sequence)"
+        :key="`e_${props.row?.id || props.row?.statement?.action?.global_sequence}`"
+        :props="props"
+        class="q-virtual-scroll--with-prev"
+      )
+        q-td(colspan="100%")
+          ComplexDocument(:documents="props.row")
+
+</template>
+
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import { ComplexDocument } from 'src/shared/ui/ComplexDocument'
+import { DocumentCard } from './'
+import { useWindowSize } from 'src/shared/hooks'
+import type { IDocumentPackageAggregate } from 'src/entities/Document/model'
+
+// Props
+const props = defineProps<{
+  documents: IDocumentPackageAggregate[]
+  loading: boolean
+}>()
+
+// Emits - определяем события, которые компонент может эмитить
+const emit = defineEmits<{
+  (e: 'load'): void
+  (e: 'toggle-expand', id: string): void
+}>()
+
+// Локальное состояние
+const expanded = reactive(new Map<string, boolean>())
+const pagination = ref({
+  rowsPerPage: 0
+})
+const tableRef = ref(null)
+const { isMobile } = useWindowSize()
+
+// Функция обработки виртуального скролла
+const onScroll = ({ to }) => {
+
+  const lastIndex = props.documents.length - 1
+  // Если достигли последнего элемента в списке, эмитим событие load
+  if (to === lastIndex) {
+    emit('load')
+  }
+}
+
+// Получение заголовка документа из агрегата
+function getDocumentTitle(row: IDocumentPackageAggregate) {
+  // Используем документы из агрегатов
+  if (row.statement?.documentAggregate?.rawDocument?.full_title) {
+    return row.statement.documentAggregate.rawDocument.full_title
+  }
+
+  // Проверяем решения
+  if (row.decision?.documentAggregate?.rawDocument?.full_title) {
+    return row.decision.documentAggregate.rawDocument.full_title
+  }
+
+  // По умолчанию
+  return 'Документ без заголовка'
+}
+
+// Получение хеша документа из агрегата
+function getDocumentHash(row: IDocumentPackageAggregate) {
+  if (row.statement?.documentAggregate?.rawDocument?.hash) {
+    return row.statement.documentAggregate.rawDocument.hash
+  }
+
+  if (row.decision?.documentAggregate?.rawDocument?.hash) {
+    return row.decision.documentAggregate.rawDocument.hash
+  }
+
+  return 'нет хеша'
+}
+
+// Колонки таблицы
+const columns:any[] = [
+  {
+    name: 'hash',
+    align: 'left',
+    label: 'ID',
+    field: (row: any) => getDocumentHash(row).substring(0, 10) || '',
+    sortable: true
+  },
+  {
+    name: 'title',
+    align: 'left',
+    label: 'Документ',
+    field: (row: any) => getDocumentTitle(row),
+    sortable: true
+  },
+  
+]
+
+// Функция для переключения состояния развертывания
+const toggleExpand = (id: any) => {
+  if (!id) return
+  expanded.set(id, !expanded.get(id))
+  emit('toggle-expand', id)
+}
+</script>
+<style>
+.documents-table .q-table__top{
+  padding: 0px !important;
+}
+</style>

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'