diff --git a/src/assets/icons/CCopy.svg b/src/assets/icons/CCopy.svg new file mode 100644 index 00000000..0c3cad55 --- /dev/null +++ b/src/assets/icons/CCopy.svg @@ -0,0 +1,2 @@ + + diff --git a/src/assets/icons/CDownload.svg b/src/assets/icons/CDownload.svg new file mode 100644 index 00000000..5e2793ba --- /dev/null +++ b/src/assets/icons/CDownload.svg @@ -0,0 +1,2 @@ + + diff --git a/src/assets/images/product/geneated_dress.png b/src/assets/images/product/geneated_dress.png new file mode 100644 index 00000000..cbbdfa01 Binary files /dev/null and b/src/assets/images/product/geneated_dress.png differ diff --git a/src/assets/images/product/generated_model.png b/src/assets/images/product/generated_model.png new file mode 100644 index 00000000..15c3d176 Binary files /dev/null and b/src/assets/images/product/generated_model.png differ diff --git a/src/assets/images/product/generated_sketch.png b/src/assets/images/product/generated_sketch.png new file mode 100644 index 00000000..37c8d36d Binary files /dev/null and b/src/assets/images/product/generated_sketch.png differ diff --git a/src/assets/images/product/original_dress.png b/src/assets/images/product/original_dress.png new file mode 100644 index 00000000..2ad7f2e5 Binary files /dev/null and b/src/assets/images/product/original_dress.png differ diff --git a/src/assets/images/product/original_model.png b/src/assets/images/product/original_model.png new file mode 100644 index 00000000..c61590d9 Binary files /dev/null and b/src/assets/images/product/original_model.png differ diff --git a/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js b/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js index b38a3954..98eb683a 100644 --- a/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js +++ b/src/component/Canvas/CanvasEditor/commands/FillGroupLayerBackgroundCommand.js @@ -18,6 +18,7 @@ export class FillGroupLayerBackgroundCommand extends Command { this.canvas = options.canvas; this.layers = options.layers; this.canvasManager = options.canvasManager; + this.layerManager = options.layerManager; this.layerId = options.layerId; this.fillColor = options.fillColor; this.oldFill = null; @@ -211,6 +212,7 @@ export class FillGroupLayerBackgroundCommand extends Command { this.group.set({ id: layerObjects[0]?.id || generateId("group-"), layerId: this.layer?.id, + layerName: this.layer?.name, }); // this.group.setCoords(); // this.group.setObjectsCoords(); @@ -225,7 +227,7 @@ export class FillGroupLayerBackgroundCommand extends Command { this.group.clipPath = clipPath; } layer.fabricObjects = [ - this.group.toObject(["id", "layerId"]) || this.group, + this.group.toObject(["id", "layerId", "layerName"]) || this.group, ]; // removeCanvasObjectByObject(this.canvas, layerObjects?.[0]); insertObjectAtZIndex(this.canvas, this.group, insertIndex, false, true); diff --git a/src/component/Canvas/CanvasEditor/commands/LayerCommands.js b/src/component/Canvas/CanvasEditor/commands/LayerCommands.js index 0380638e..692b16ea 100644 --- a/src/component/Canvas/CanvasEditor/commands/LayerCommands.js +++ b/src/component/Canvas/CanvasEditor/commands/LayerCommands.js @@ -2595,7 +2595,7 @@ export class CreateImageLayerCommand extends Command { // 生成图层名称 const fileName = - this.layerName || `${new Date().toLocaleString()}`; + this.layerName || `${new Date().toLocaleTimeString()}`; this.fabricImage.set({ id: this.imageId, diff --git a/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js b/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js index 7088029a..917a0b6d 100644 --- a/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js +++ b/src/component/Canvas/CanvasEditor/commands/RasterizeLayerCommand.js @@ -15,6 +15,8 @@ import { import { createRasterizedImage } from "../utils/rasterizedImage"; import { message } from "ant-design-vue"; import { restoreFabricObject } from "../utils/objectHelper"; +import i18n from "@/lang/index.ts"; +const { t } = i18n.global; /** * 组合图层命令 @@ -338,7 +340,7 @@ export class RasterizeLayerCommand extends Command { // 创建新的组合图层 this.rasterizedLayer = createLayer({ id: this.rasterizedLayerId, - name: `${this.layer.name} (组合)`, + name: `${this.layer.name} (${t('Canvas.group')})`, type: LayerType.BITMAP, visible: this.layer.visible, locked: this.layer.locked, diff --git a/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue b/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue index 081bf615..9e77c0e2 100644 --- a/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/LiquifyPanel.vue @@ -1667,6 +1667,7 @@ function stopPressTimer() { display: flex; align-items: center; justify-content: center; + height: 22px; > i{ font-size: 1.4rem; diff --git a/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue b/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue index d02015c8..8aee5d88 100644 --- a/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/SelectMenuPanel.vue @@ -52,7 +52,7 @@ @@ -267,12 +267,7 @@ arrs.forEach((v) => { activeObjects.value.forEach((item) => { if (item.id === v.id) { - keys.forEach((k) => { - item[k] = - typeof v[k] === "number" - ? Number(v[k].toFixed(3)) - : v[k]; - }); + keys.forEach((key) => (item[key] = v[key])); } }); activeObjects.value = [...activeObjects.value]; diff --git a/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue b/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue index 2c2d0232..2f1403b3 100644 --- a/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/SelectionPanel.vue @@ -531,10 +531,13 @@ function confirmColorPicker() { width: 100%; text-align: center; cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + height: 22px; > i{ font-size: 1.4rem; - display: block; transform: rotate(270deg); } } diff --git a/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue b/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue index 20f786dd..09637373 100644 --- a/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue +++ b/src/component/Canvas/CanvasEditor/components/TextEditorPanel.vue @@ -715,7 +715,10 @@ export default { width: 100%; text-align: center; cursor: pointer; - + display: flex; + align-items: center; + justify-content: center; + height: 22px; > i{ font-size: 1.4rem; display: block; diff --git a/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue b/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue index 8b0596b7..8e0361c4 100644 --- a/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue +++ b/src/component/Canvas/CanvasEditor/components/ToolsSidebar.vue @@ -395,9 +395,15 @@ const handleToolClick = (tool) => { height: 100%; padding-top: .5rem; padding-bottom: 4rem; + position: relative; /* overflow-y: auto; */ /* overflow-x: hidden; */ } +.fillColor-input{ + position: absolute; + top: 0; + right: 0; +} .tools-list{ display: flex; flex-direction: column; diff --git a/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js b/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js index c5959354..96ee3e97 100644 --- a/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js +++ b/src/component/Canvas/CanvasEditor/managers/BackgroundFillManager.js @@ -2,11 +2,12 @@ import { FillGroupLayerBackgroundCommand } from "../commands/FillGroupLayerBackg import { FillLayerBackgroundCommand } from "../commands/FillLayerBackgroundCommand"; export class BackgroundFillManager { - constructor({ canvas, layers, commandManager, canvasManager }) { + constructor({ canvas, layers, commandManager, canvasManager, layerManager }) { this.canvas = canvas; this.layers = layers; this.commandManager = commandManager; this.canvasManager = canvasManager; + this.layerManager = layerManager; } /** @@ -28,6 +29,7 @@ export class BackgroundFillManager { layerId, fillColor, canvasManager: this.canvasManager, + layerManager: this.layerManager, // 是否实时更新 isRetimeUpdate: !undoable, }); diff --git a/src/component/Canvas/CanvasEditor/managers/LayerManager.js b/src/component/Canvas/CanvasEditor/managers/LayerManager.js index e70a6b70..9e524e91 100644 --- a/src/component/Canvas/CanvasEditor/managers/LayerManager.js +++ b/src/component/Canvas/CanvasEditor/managers/LayerManager.js @@ -109,6 +109,7 @@ export class LayerManager { layers: this.layers, commandManager: this.commandManager, canvasManager: this.canvasManager, + layerManager: this, }); // 编辑器模式：draw(绘画)、select(选择)、pan(拖拽) diff --git a/src/component/home/tools/toProduct/Prompt.vue b/src/component/home/tools/toProduct/Prompt.vue new file mode 100644 index 00000000..15e20576 --- /dev/null +++ b/src/component/home/tools/toProduct/Prompt.vue @@ -0,0 +1,261 @@ + + + + + diff --git a/src/component/home/tools/toProduct/index.vue b/src/component/home/tools/toProduct/index.vue index bf393218..84b6abb2 100644 --- a/src/component/home/tools/toProduct/index.vue +++ b/src/component/home/tools/toProduct/index.vue @@ -150,7 +150,7 @@ />
-
Prompt
+
{{ $t('ProductImg.Prompt') }}
@@ -171,30 +171,8 @@
- Prompt Assist + {{ $t('ProductImg.PromptAssit') }}
-
@@ -342,8 +320,8 @@ }" :isProductimg="true" > +
-