add pagination

back/api/settings.py

@@ -95,8 +95,8 @@ WSGI_APPLICATION = "api.wsgi.application"
 
 # Rest Framework
 REST_FRAMEWORK = {
-    "DEFAULT_PAGINATION_CLASS": "rest_framework.pagination.PageNumberPagination",
+    "DEFAULT_PAGINATION_CLASS": "tgbot.pagination.CustomPagination",
-    "PAGE_SIZE": 10,
+    "PAGE_SIZE": 5,
 }
 
 

back/tgbot/pagination.py

@@ -0,0 +1,10 @@
+from rest_framework import pagination
+from rest_framework.response import Response
+
+class CustomPagination(pagination.PageNumberPagination):
+    def get_paginated_response(self, data):
+        return Response({
+            'count': self.page.paginator.count,
+            'per_page': self.page.paginator.per_page, 
+            'results': data
+        })

back/tgbot/tgbot.py

@@ -127,6 +127,12 @@ class TgBot:
                 "У вас нет доступных для редактирования инвентаризаций"
             )
 
+    async def format_text(self, user, inv=None, tmc=None):
+        text = (
+                    f"Специалист {user.full_name}, ID {user.id}\n"
+                    f"Введите название объекта"
+                ),
+
     async def get_inv(self, update: Update, context: CallbackContext):
         query = update.callback_query
         await update.effective_message.edit_reply_markup(InlineKeyboardMarkup([]))

back/tgbot/views.py

@@ -19,7 +19,7 @@ logger = logging.getLogger("root")
 
 
 class TgItemViewSet(viewsets.ModelViewSet):
-    queryset = TgItem.objects.all()
+    queryset = TgItem.objects.all().order_by('-updated_at')
     serializer_class = TgItemSerializer
     http_method_names = ["post", "get"]
 

front/pages/table/index.vue

@@ -1,9 +1,16 @@
 <script setup lang="ts">
 const items = ref()
-onMounted(async () => {
+const page = ref(1)
-    const items_data = await apiCall<ApiPaged<TgItem>>(`tgbot/`)
+const pagination = ref({ total: 10, pageCount: 10 })
+
+const loadData = async () => {
+    const items_data = await apiCall<ApiPaged<TgItem>>(`tgbot/?page=${page.value}`)
     items.value = items_data.results
-})
+    pagination.value.total = items_data.count
+    pagination.value.pageCount = items_data.per_page
+}
+onMounted(loadData)
+watch(page, loadData)
 const columns = [
     {
         key: 'name',
@@ -47,6 +54,7 @@ const columns = [
                 </template>
             </template>
         </UTable>
+        <UPagination v-model="page" v-bind="pagination" />
     </div>
 </template>
 

front/types/index.d.ts

@@ -44,6 +44,7 @@ declare global {
 
     type ApiPaged<T> = {
         count: number;
+        per_page: number
         next?: any;
         previous?: any;
         results: T[]