partial update

back/tgbot/serializers.py

@@ -1,6 +1,6 @@
 from rest_framework import serializers
 
-from .models import TgItem
+from .models import TgItem, TmcField
 import logging
 
 logger = logging.getLogger("root")
@@ -14,5 +14,5 @@ class TgItemSerializer(serializers.ModelSerializer):
 
 class TmcFieldSerializer(serializers.ModelSerializer):
     class Meta:
-        model = TgItem
+        model = TmcField
         fields = "__all__"

back/tgbot/views.py

@@ -1,6 +1,7 @@
 from django.conf import settings
 from django.db import models
 import json
+import requests
 import time
 
 from telegram import Update
@@ -22,7 +23,7 @@ logger = logging.getLogger("root")
 class TgItemViewSet(viewsets.ModelViewSet):
     queryset = TgItem.objects.all().order_by("-updated_at")
     serializer_class = TgItemSerializer
-    http_method_names = ["post", "get"]
+    http_method_names = ["post", "get", "patch"]
 
     def retrieve(self, request, pk=None):
         item = TgItem.objects.get(id=pk)
@@ -32,6 +33,10 @@ class TgItemViewSet(viewsets.ModelViewSet):
         return super().retrieve(request, pk)
         # return Response(serializer.data)
         
+    def partial_update(self, request, *args, **kwargs):
+        # logger.info(request.data['location_id'])
+        return super().partial_update(request)
+
     @action(detail=False, methods=["post"], url_path=settings.TGBOT["WEBHOOK_URL"])
     def send_tg_data(self, request):
         TgBotUpdater.my_queue.put(
@@ -44,7 +49,10 @@ class TgItemViewSet(viewsets.ModelViewSet):
 class TmcFieldViewset(viewsets.ModelViewSet):
     queryset = TmcField.objects.all()
     serializer_class = TmcFieldSerializer
-    http_method_names = ["get"]
+    http_method_names = ["get", "patch"]
+    
+    def partial_update(self, request, *args, **kwargs):
+        return super().partial_update(request)
     
     @action(detail=False, methods=["get"], url_path=r"get_name/(?P<chat_id>[^/.]+)")
     def get_name(self, request, chat_id):

front/pages/table/[id].vue

@@ -8,8 +8,24 @@ const state = reactive({} as { name?: string, location?: { id: number, name: str
 const loadData = async () => {
     const items_data = await apiCall<any>(`tgbot/${route.params.id}/`)
     item.value = items_data
+    state.id = items_data.id
     state.name = items_data.name
     state.location = items_data.location.id
+    state.tmc = items_data.tmc.map(el => {
+        return {
+            name: el.tmc.name,
+            id: el.id,
+            fields: el.field.map(item => {
+                return {
+                    name: item.field.name,
+                    comment: item.field.comment,
+                    id: item.id,
+                    text: item.text,
+                    file_id: item.file_id
+                }
+            })
+        }
+    })
 }
 const loadTer = async () => {
     const terdeep_data = await apiCall<ApiPaged<{ id: number, name: string }>>(`tmc/terdeep/?size=1000`)
@@ -17,7 +33,7 @@ const loadTer = async () => {
 }
 const search = (q: string) => {
     if (q) {
-        return terdeep.value.filter((el:any) => el.name.toLowerCase().indexOf(q.toLowerCase()) !== -1).slice(0, 10)
+        return terdeep.value.filter((el: any) => el.name.toLowerCase().indexOf(q.toLowerCase()) !== -1).slice(0, 10)
     } else {
         return terdeep.value.slice(0, 10)
     }
@@ -26,27 +42,35 @@ onMounted(async () => {
     await loadData()
     loadTer()
 })
+const patchField = async (field) => {
+    await apiCall(`tgbot/items/${field.id}/`, 'PATCH', { text: field.text })
+}
+const patchItem = async () => {
+    await apiCall(`tgbot/${state.id}/`, 'PATCH', { name: state.name, location: state.location })
+}
 </script>
 <template>
     <UForm :state="state" v-if="item">
         <UFormGroup label="Название">
             <UInput v-model="state.name" />
         </UFormGroup>
+        <UButton @click="patchItem">Сохранить</UButton>
         <UFormGroup label="Локация">
             <USelectMenu v-model="state.location" :options="terdeep" :searchable="search" value-attribute="id"
                 option-attribute="name" />
         </UFormGroup>
-        <UFormGroup label="ТМЦ" v-if="item.tmc.length">
-            <div v-for="el in item.tmc">
-                <strong>{{ el.tmc.name }}</strong>
+        <UFormGroup label="ТМЦ" v-if="state.tmc">
+            <div v-for="el in state.tmc">
+                <strong>{{ el.name }}</strong>
                 <ul>
-                    <li v-for="i in el.field" class="grid grid-cols-3 gap-4">
-                        <span class="col-span-1">
-                            {{ i.field.name }}
-                            <UInput v-model="i.field.text" :placeholder="`Введите ${i.field.comment || 'с изображения'}`" />
+                    <li v-for="field in el.fields" class="grid grid-cols-3 gap-4">
+                        <span class="col-span-1 flex flex-col gap-2 items-start">
+                            {{ field.name }}
+                            <UInput v-model="field.text" :placeholder="`Введите ${field.comment || 'с изображения'}`" />
+                            <UButton @click="patchField(field)">Сохранить</UButton>
                         </span>
                         <span class="col-span-2">
-                            <GetImage :file_id="i.file_id" type="img" />
+                            <GetImage :file_id="field.file_id" type="img" />
                         </span>
                     </li>
                 </ul>

front/utils/apiCall.ts

@@ -1,7 +1,7 @@
 import { apiBase } from '~/helpers';
 
-export default async function<T> (path: string) {
+export default async function <T>(path: string, method = 'GET', body = null) {
     const headers = new Headers();
     headers.append("Content-Type", "application/json");
-    return await $fetch<T>(`${apiBase}/${path}`, { headers })
+    return await $fetch<T>(`${apiBase}/${path}`, { method, headers, body })
 }