浏览代码

feat(marketingEdit): 优化图片生成与画布渲染逻辑

- 将图片导出格式从 PNG 更改为 JPEG,并设置倍数为 2 以提升清晰度
- 更新商品数据结构,修正款号并新增蓝色配色及设计理念描述
- 调整画布激活状态样式,使用阴影替代内边框高亮效果
- 移除重复的“新增画布”按钮,确保界面元素唯一性
- 修改文件保存逻辑,统一导出图片格式为 JPG 格式
panqiuyao 6 天之前
父节点
当前提交
39cbb70551

+ 2 - 2
electron/controller/utils.js

@@ -338,14 +338,14 @@ class UtilsController extends Controller {
           if (skuCode) {
             fileNameParts.push(skuCode);
           }
-          const fileName = fileNameParts.join('_') + '.png';
+          const fileName = fileNameParts.join('_') + '.jpg';
           const targetPath = path.join(styleDir, fileName);
           saveDataUrlToFile(img.dataUrl, targetPath);
         });
 
         // 合成长图
         if (bundle.combined && bundle.combined.dataUrl) {
-          const combinedPath = path.join(styleDir, 'all_canvases.png');
+          const combinedPath = path.join(styleDir, 'all_canvases.jpg');
           saveDataUrlToFile(bundle.combined.dataUrl, combinedPath);
         }
       });

+ 4 - 2
frontend/src/views/components/marketingEdit/generateImagesRender.js

@@ -177,7 +177,8 @@ export async function renderImagesByPlans(plans, canvasList, skus) {
           try {
             fcanvas.renderAll()
             const dataUrl = fcanvas.toDataURL({
-              format: 'png',
+              format: 'jpeg',
+              multiplier:2,
               enableRetinaScaling: true,
             })
 
@@ -279,7 +280,8 @@ export async function generateAllStyleImageBundles(canvasList, goodsList) {
 
         canvas.renderAll()
         const dataUrl = canvas.toDataURL({
-          format: 'png',
+          format: 'jpeg',
+          multiplier:2,
           enableRetinaScaling: true,
         })
         const result = { dataUrl, width: maxWidth, height: totalHeight }

+ 13 - 1
frontend/src/views/components/marketingEdit/goods1.json

@@ -1,6 +1,6 @@
 {
   "A59638": {
-    "款号": "A596381",
+    "款号": "A59638",
     "货号资料": [
       {
         "货号": "A596381",
@@ -13,6 +13,18 @@
           "内里": "C:\\Users\\Administrator\\Desktop\\img\\A596381\\5.png"
         },
         "设计理念": "通过轻质材料(如EVA泡沫)和柔性底纹设计,减轻鞋身重量,同时保持鞋底的弯折性,适合通勤或休闲活动"
+      },
+      {
+        "货号": "A596382",
+        "颜色": "蓝色",
+        "pics": {
+          "俯视": "C:\\Users\\Administrator\\Desktop\\img\\A596382\\1.png",
+          "侧视": "C:\\Users\\Administrator\\Desktop\\img\\A596382\\2.png",
+          "后跟": "C:\\Users\\Administrator\\Desktop\\img\\A596382\\3.png",
+          "鞋底": "C:\\Users\\Administrator\\Desktop\\img\\A596382\\4.png",
+          "内里": "C:\\Users\\Administrator\\Desktop\\img\\A596382\\5.png"
+        },
+        "设计理念": "通过轻质材料(如EVA泡沫)和柔性底纹设计,减轻鞋身重量,同时保持鞋底的弯折性,适合通勤或休闲活动"
       }
     ]
   }

+ 1 - 1
frontend/src/views/components/marketingEdit/index.vue

@@ -633,7 +633,7 @@ export default {
 
 .canvas-stack_body.active {
   background: #f6fbff;
-  box-shadow: inset 0 0 0 2px $primary1;
+  box-shadow: 0 0 10px rgb(0 0 0 / 20%);
 }
 
 .canvas-stack_body canvas {

+ 1 - 1
frontend/src/views/components/marketingEdit/tpl/header.js

@@ -45,8 +45,8 @@ export  default function tpl(){
                         </el-dropdown-menu>
                       </template>
                   </el-dropdown>
-            <el-button @click="addCanvas"  class="mar-left-10">新增画布</el-button>
             <el-button class="mar-left-10"  v-if="!isEmpty"  @click="handleAdjustCanvas">调整画布</el-button>
+            <el-button @click="addCanvas"  class="mar-left-10">新增画布</el-button>
             <el-button type="primary" @click="handleSave">保存</el-button>
             <el-button type="primary" @click="createImg">生成图片</el-button>
            </div>