add show element name

back/inventory/views.py

@@ -221,3 +221,23 @@ class ElementViewSet(viewsets.ModelViewSet):
         except Exception as e:
             logger.error(e)
             return Response(status=status.HTTP_500_INTERNAL_SERVER_ERROR)
+
+    @action(detail=False, methods=["get"], url_path=r"external/id/(?P<cat_id>[^/.]+)")
+    def get_remote_element_by_id(self, request, pk=None, cat_id=None):
+        try:
+            params = {
+                "$format": "json",
+                "$select": ",".join(["Description", "Ref_Key", "Parent_Key"]),
+            }
+            remote_url = (
+                f"https://1c.svs-tech.pro/UNF/odata/standard.odata/Catalog_Номенклатура(guid'{cat_id}')?"
+                + "&".join([f"{p}={params[p]}" for p in params])
+            )
+            data = requests.get(
+                remote_url, headers={"Authorization": settings.ODATA_AUTH}
+            )
+            parsed_data = data.json()
+            return Response(parsed_data)
+        except Exception as e:
+            logger.error(e)
+            return Response(status=status.HTTP_500_INTERNAL_SERVER_ERROR)

front/assets/main.scss

@@ -25,6 +25,7 @@
 
     .header {
         @apply col-span-12 flex gap-2 p-2.5;
+
         .logo {
             @apply text-primary text-2xl
         }
@@ -37,4 +38,16 @@
     .content {
         @apply col-span-10
     }
+
+    dl {
+        // @apply grid grid-cols-4;
+        dt {
+            // @apply col-span-1
+        }
+        dd {
+            @apply mb-2
+            
+        }
+
+    }
 }

front/components/edit.vue

@@ -36,6 +36,21 @@ const external_data = reactive<ExternalDataType>({
     categories: [],
     element: [],
 })
+
+const external_elements = reactive<any>({})
+const loadOneElement = async (id: string) => {
+    const data = await $fetch<ApiTypeExternal>(`${apiBase}/element/external/id/${id}`)
+    external_elements[id] = data.Description
+
+}
+const getExternalElementName = (id: string) => {
+    if (!external_elements[id]) {
+        loadOneElement(id)
+        return id
+    }
+    return external_elements[id]
+}
+
 const elements = ref(props.elements)
 const validate = (state: any): FormError[] => {
     const errors = []
@@ -168,12 +183,12 @@ onMounted(async () => {
             <h2>{{ external_data.partner?.find(el => el["Ref_Key"] == state.partner)?.Description }}</h2>
             <dl v-if="elements?.length">
                 <template v-for="item in elements">
-                    <dt>
-                        {{ item.external_id }}
-                    </dt>
-                    <dt>
-                        {{ item.element_id }}
-                    </dt>
+                    <dt>Название</dt>
+                    <dd>{{ getExternalElementName(item.external_id) }}</dd>
+                    <dt>ID</dt>
+                    <dd>{{ item.element_id }}</dd>
+                    <dt>Дополнительные сведения</dt>
+                    <dd>{{ item.additional_data }}</dd>
                 </template>
             </dl>
         </div>