CI: sync from GitHub

frontend/src/useStore.js

@@ -20,14 +20,22 @@ const postFile = async (url, file) => {
   return res.json();
 };
 
+const createInitialDetail = () => ({
+  previewUrl: null,
+  transform: { scale: 1, tx: 0, ty: 0 },
+  tile: { enabled: false },
+});
+
 const useStore = create((set, get) => ({
   // состояние
   model: "MT",
-  view: "front",
-  tile: false,
-  offsetX: 0,
-  offsetY: 0,
-  scale: 1,
+  active: "front",
+  details: {
+    front: createInitialDetail(),
+    sleeveL: createInitialDetail(),
+    back: createInitialDetail(),
+    sleeveR: createInitialDetail(),
+  },
   uploadedPath: null,
   busy: false,
   lastPreviewUrls: null,
@@ -35,11 +43,58 @@ const useStore = create((set, get) => ({
 
   // сеттеры
   setModel: (model) => set({ model }),
-  setView: (view) => set({ view }),
-  setTile: (tile) => set({ tile }),
-  setOffsetX: (offsetX) => set({ offsetX }),
-  setOffsetY: (offsetY) => set({ offsetY }),
-  setScale: (scale) => set({ scale }),
+  setActive: (active) => set({ active }),
+  setScale: (scale) =>
+    set((state) => ({
+      details: {
+        ...state.details,
+        [state.active]: {
+          ...state.details[state.active],
+          transform: {
+            ...state.details[state.active].transform,
+            scale,
+          },
+        },
+      },
+    })),
+  setTx: (tx) =>
+    set((state) => ({
+      details: {
+        ...state.details,
+        [state.active]: {
+          ...state.details[state.active],
+          transform: {
+            ...state.details[state.active].transform,
+            tx,
+          },
+        },
+      },
+    })),
+  setTy: (ty) =>
+    set((state) => ({
+      details: {
+        ...state.details,
+        [state.active]: {
+          ...state.details[state.active],
+          transform: {
+            ...state.details[state.active].transform,
+            ty,
+          },
+        },
+      },
+    })),
+  toggleTile: () =>
+    set((state) => ({
+      details: {
+        ...state.details,
+        [state.active]: {
+          ...state.details[state.active],
+          tile: {
+            enabled: !state.details[state.active].tile.enabled,
+          },
+        },
+      },
+    })),
 
   // 1) загрузка принта
   async upload(file) {
@@ -55,27 +110,42 @@ const useStore = create((set, get) => ({
 
   // 2) построение превью из текущих контролов
   async spread() {
-    const { model, view, tile, offsetX, offsetY, scale, uploadedPath } = get();
+    const { model, active, details, uploadedPath } = get();
+    const detail = details[active];
     if (!uploadedPath) throw new Error("Сначала загрузите принт");
 
     set({ busy: true });
     try {
       const payload = {
         model,
-        view,
+        view: active,
         details: {
           print_path: uploadedPath,
-          tile,
-          offset_x: offsetX,
-          offset_y: offsetY,
-          scale,
+          tile: detail.tile.enabled,
+          offset_x: detail.transform.tx,
+          offset_y: detail.transform.ty,
+          scale: detail.transform.scale,
         },
       };
       const data = await postJSON("/api/preview", payload);
       const urls =
         data.previews ||
-        (data.preview_url ? { [view]: data.preview_url } : null);
-      set({ lastPreviewUrls: urls });
+        (data.preview_url ? { [active]: data.preview_url } : null);
+      if (urls) {
+        set((state) => {
+          const updatedDetails = { ...state.details };
+          for (const [key, url] of Object.entries(urls)) {
+            if (!updatedDetails[key]) continue;
+            updatedDetails[key] = {
+              ...updatedDetails[key],
+              previewUrl: url,
+            };
+          }
+          return { details: updatedDetails, lastPreviewUrls: urls };
+        });
+      } else {
+        set({ lastPreviewUrls: urls });
+      }
       return data;
     } finally {
       set({ busy: false });
@@ -90,20 +160,21 @@ const useStore = create((set, get) => ({
 
   // 3) создание заказа
   async startOrder() {
-    const { model, view, tile, offsetX, offsetY, scale, uploadedPath } = get();
+    const { model, active, details, uploadedPath } = get();
+    const detail = details[active];
     if (!uploadedPath) throw new Error("Сначала загрузите принт");
 
     set({ busy: true });
     try {
       const payload = {
         model,
-        view,
+        view: active,
         details: {
           print_path: uploadedPath,
-          tile,
-          offset_x: offsetX,
-          offset_y: offsetY,
-          scale,
+          tile: detail.tile.enabled,
+          offset_x: detail.transform.tx,
+          offset_y: detail.transform.ty,
+          scale: detail.transform.scale,
         },
       };
       const data = await postJSON("/api/order", payload);