diff --git a/dist.7z b/dist.7z index 471bee9f..866b68e7 100644 Binary files a/dist.7z and b/dist.7z differ diff --git a/src/component/Administrator/affiliate/affiliateAudit/affiliateAudit.vue b/src/component/Administrator/affiliate/affiliateAudit/affiliateAudit.vue index 04f5394b..c1d9d698 100644 --- a/src/component/Administrator/affiliate/affiliateAudit/affiliateAudit.vue +++ b/src/component/Administrator/affiliate/affiliateAudit/affiliateAudit.vue @@ -69,7 +69,7 @@
Edit
- {{ text }} HDK + {{ text }} HKD
@@ -109,20 +109,26 @@ export default defineComponent({ key: "username", }, { - title: 'Create Time', - align: "center", - width: 200, - dataIndex: "createTime", - key: "createTime", - sorter: true, - },{ title: 'State', align: "center", ellipsis: true, width: 100, dataIndex: "status", key: "status", - + },{ + title: 'Commission Percent', + align: "center", + ellipsis: true, + width: 100, + dataIndex: "commissionPercent", + key: "commissionPercent", + customRender: (record: any) => { + if(record.text){ + return record.text+'%' + }else{ + return '-' + } + }, },{ title: 'Total income', align: "center", @@ -154,6 +160,13 @@ export default defineComponent({ width: 250, dataIndex: "link", key: "link", + },{ + title: 'Create Time', + align: "center", + width: 200, + dataIndex: "createTime", + key: "createTime", + sorter: true, },{ title: 'Updata Time', align: "center", diff --git a/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.css b/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.css index 97a58719..3bfac5b2 100644 --- a/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.css +++ b/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.css @@ -10,7 +10,7 @@ z-index: 6; overflow-y: auto; height: 100%; - max-height: 85vh; + max-height: 70vh; -webkit-overflow-scrolling: touch; } .layers-header { diff --git a/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.less b/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.less index 2229c0b1..a74a29bf 100644 --- a/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.less +++ b/src/component/Canvas/CanvasEditor/components/LayersPanel/layersPanel.less @@ -12,8 +12,8 @@ user-select: none; z-index: 6; overflow-y: auto; - height: 100%; - max-height: 85vh; + width: 100%; + // max-height: 70vh; -webkit-overflow-scrolling: touch; } @@ -586,7 +586,7 @@ // 响应式设计 @media (max-width: 768px) { .layers-panel-inner { - max-height: 70vh; + // max-height: 70vh; } .layer-item { diff --git a/src/component/Canvas/CanvasEditor/components/css/layersPanel.css b/src/component/Canvas/CanvasEditor/components/css/layersPanel.css new file mode 100644 index 00000000..6c97b6db --- /dev/null +++ b/src/component/Canvas/CanvasEditor/components/css/layersPanel.css @@ -0,0 +1,656 @@ +.text-ellipsis { + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; +} +.layers-panel-inner { + display: flex; + flex-direction: column; + user-select: none; + z-index: 6; + overflow-y: auto; + width: 100%; + -webkit-overflow-scrolling: touch; +} +.layers-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 1.5rem; + border-bottom: 1px solid #e0e0e0; +} +.layers-header h3 { + margin: 0; + font-size: 1.6rem; + font-weight: 500; + color: #333; +} +.layer-actions-group { + display: flex; + gap: 0.8rem; +} +.layer-actions-group .normal-actions, +.layer-actions-group .multi-select-actions { + display: flex; + gap: 0.8rem; +} +.action-btn { + width: 3.2rem; + height: 3.2rem; + background: none; + border: 1px solid #d9d9d9; + border-radius: 0.4rem; + display: flex; + align-items: center; + justify-content: center; + color: #666; + cursor: pointer; + transition: all 0.2s ease; +} +.action-btn:hover { + background-color: #f0f0f0; + border-color: #40a9ff; + color: #40a9ff; +} +.action-btn:active { + background-color: #e6f7ff; + border-color: #1890ff; + color: #1890ff; +} +.action-btn[disabled] { + opacity: 0.5; + cursor: not-allowed; + background-color: #f5f5f5; + color: #bfbfbf; + border-color: #e6e6e6; +} +.action-btn[disabled]:hover { + background-color: #f5f5f5; + color: #bfbfbf; + border-color: #e6e6e6; +} +.group-btn { + background-color: #e6f7ff; + border-color: #91d5ff; + color: #1890ff; +} +.group-btn:hover { + background-color: #bae7ff; + border-color: #69c0ff; +} +.group-btn.disabled { + background-color: #f0f5ff; + border-color: #d9ecff; + color: #bfbfbf; +} +.ungroup-btn { + background-color: #fff2e8; + border-color: #ffbb96; + color: #fa8c16; +} +.ungroup-btn:hover { + background-color: #ffd8bf; + border-color: #ff9c6e; + color: #fa8c16; +} +.ungroup-btn.disabled { + background-color: #f0f5ff; + border-color: #d9ecff; + color: #bfbfbf; +} +.delete-selected-btn { + background-color: #fff2f0; + border-color: #ffccc7; + color: #ff4d4f; +} +.delete-selected-btn:hover { + background-color: #ffebe6; + border-color: #ff7875; + color: #ff4d4f; +} +.clear-selection-btn { + background-color: #f6f6f6; + border-color: #d9d9d9; + color: #595959; +} +.clear-selection-btn:hover { + background-color: #e6e6e6; + border-color: #bfbfbf; + color: #595959; +} +.multi-select-info { + padding: 1rem 0.6rem; + background-color: rgba(238, 238, 238, 0.4); + border-bottom: 1px solid #91d5ff; + color: #333; + font-size: 1.3rem; + line-height: 1.4; +} +.multi-select-info small { + display: block; + margin-top: 0.4rem; + color: #666; + font-size: 1.1rem; +} +.layers-list { + position: relative; + flex: 1; + overflow-y: auto; +} +.layer-item { + position: relative; + width: 100%; + display: flex; + flex-direction: column; + padding: 1rem 0; + cursor: pointer; + transition: all 0.2s ease; + border: 1px solid transparent; + border-left: 0; + border-right: 0; + border: none; + border-bottom: 1px solid #f5f2f2; + padding-left: 3rem; + padding-right: 1rem; + color: #333; +} +.layer-item.group-layer { + background-color: rgba(240, 248, 255, 0.3); + border-color: #e6f7ff; +} +.layer-item:hover { + background-color: #f0f0f0; + border-color: #e0e0e0; +} +.layer-item.active { + background-color: #e6f7ff; + border-color: #91d5ff; +} +.layer-item.selected { + background-color: #bae7ff; + border-color: #91d5ff; +} +.layer-item.editing { + background-color: #fff7e6; + border-color: #ffd666; +} +.layer-item.disabled { + opacity: 0.6; + cursor: not-allowed; +} +.layer-item.disabled:hover { + background-color: transparent; +} +.layer-header { + display: flex; + align-items: center; + width: 100%; + gap: 0.6rem; +} +.layer-review { + width: 3.2rem; + height: 3.2rem; + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; + flex: none; + background: repeating-conic-gradient(#f5f5f5 0% 25%, #ffffff 0% 50%) 50% / 1rem 1rem; + border: 1px solid #e0e0e0; +} +.layer-thumbnail { + width: 100%; + height: 100%; + object-fit: contain; +} +.layer-type-icon { + font-size: 1.4rem; +} +.visibility-btn { + width: 2.2rem; + height: 2.2rem; + cursor: pointer; + flex: none; + color: #333; + display: flex; + align-items: center; + justify-content: center; +} +.visibility-btn.hidden { + color: #999; +} +.layer-name-container { + flex: 1; + margin: 0 0.6rem; + overflow: hidden; +} +.layer-name-container .layer-name-wrapper { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; +} +.layer-name { + color: #333; + font-size: 1.4rem; + text-align: left; + display: block; + width: 100%; +} +.layer-name-input { + width: 100%; + padding: 0.2rem 0.4rem; + border: 1px solid #1890ff; + border-radius: 0.3rem; + font-size: 1.4rem; + color: #333; + background-color: #fff; + outline: none; + box-sizing: border-box; +} +.layer-name-input:focus { + border-color: #40a9ff; + box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2); +} +.layer-status { + display: flex; + align-items: center; + gap: 0.4rem; +} +.status-icon { + font-size: 1.2rem; +} +.status-icon.locked { + color: #1890ff; +} +.status-icon.group { + color: #fa8c16; +} +.status-icon.disabled { + color: #ccc; + cursor: not-allowed; +} +.layer-actions { + display: flex; + gap: 0.6rem; +} +.delete-btn { + font-size: 1.6rem; + cursor: pointer; + width: 2.2rem; + height: 2.2rem; + display: flex; + align-items: center; + justify-content: center; +} +.delete-btn:hover { + color: #ff4d4f; +} +.delete-btn.disabled { + color: #ccc; + cursor: not-allowed; +} +.layer-drag-handle { + position: absolute; + top: 0; + left: 0; + width: 2rem; + height: 100%; + cursor: move; + flex: none; + display: flex; + align-items: center; + justify-content: center; + color: #999; + margin-right: 0.4rem; + background: #eee; + box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); +} +.layer-drag-handle:hover { + color: #333; +} +.layer-checkbox { + width: 1.8rem; + height: 1.8rem; + margin-right: 0; + cursor: pointer; + flex: none; + display: flex; + align-items: center; +} +.child-layer { + padding: 0.8rem 2rem 0.8rem 3.2rem; + background-color: rgba(240, 240, 240, 0.3); + border-left: 2px solid #e0e0e0; +} +.child-layer:hover { + background-color: rgba(224, 224, 224, 0.5); +} +.child-layer.active { + background-color: rgba(230, 247, 255, 0.5); + border-left: 2px solid #1890ff; +} +.child-layer.editing { + background-color: rgba(255, 247, 230, 0.5); + border-left: 2px solid #ffd666; +} +.child-layer .layer-actions { + position: static; + display: flex; + gap: 0.4rem; +} +.child-layer .layer-actions button { + width: 2rem; + height: 2rem; + border: none; + background: none; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + color: #999; + border-radius: 2px; + transition: all 0.2s; +} +.child-layer .layer-actions button:hover { + background-color: #f0f0f0; + color: #333; +} +.layer-indent { + width: 2rem; + flex: none; +} +.layer-info { + flex: 1; + margin: 0 0.8rem; +} +.layer-info .layer-name { + font-size: 1.3rem; + color: #333; + margin-bottom: 0.2rem; +} +.layer-info .layer-status { + display: flex; + align-items: center; + gap: 0.4rem; +} +.layer-info .layer-type { + font-size: 11px; + color: #999; +} +.child-drag-handle { + width: 1.6rem; + height: 1.6rem; + cursor: move; + flex: none; + display: flex; + align-items: center; + justify-content: center; + color: #999; + margin-right: 0.4rem; +} +.child-drag-handle:hover { + color: #333; +} +.fixed-layers { + border-top: 1px solid #e0e0e0; + background-color: rgba(238, 238, 238, 0.4); +} +.fixed-layers .layer-drag-handle { + cursor: default; +} +.fixed-layer { + background-color: #fafafa; +} +.fixed-layer-indicator { + width: 2rem; + height: 2rem; + display: flex; + align-items: center; + justify-content: center; + color: #1890ff; + margin-right: 0.4rem; +} +.background-indicator, +.fixed-indicator { + display: flex; + align-items: center; + justify-content: center; + margin-left: 0.4rem; +} +.background-icon, +.fixed-icon { + font-size: 1.4rem; + color: #999; +} +.sortable-layers { + width: 100%; +} +.ghost { + opacity: 0.5; + background-color: #f0f0f0; + border: 2px dashed #1890ff; +} +.chosen { + background-color: #e6f7ff; + border: 1px solid #1890ff; +} +.drag { + opacity: 0.8; + transform: rotate(5deg); + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); +} +.child-layers .ghost { + opacity: 0.4; + background-color: #fff7e6; + border: 1px dashed #faad14; +} +.child-layers .chosen { + background-color: #fff7e6; + border: 1px solid #faad14; +} +.child-layers .drag { + opacity: 0.7; + transform: rotate(3deg); + box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15); +} +@media (max-width: 768px) { + .layer-item { + padding: 1.2rem; + padding-left: 3.5rem; + } + .layer-header { + min-height: 4rem; + } + .layer-drag-handle, + .visibility-btn { + width: 2.4rem; + } + .layer-review { + width: 3.6rem; + height: 3.6rem; + } + .action-btn { + width: 3.6rem; + height: 3.6rem; + } + .multi-select-info small { + font-size: 1.1rem; + } +} +@media (min-width: 768px) and (max-width: 1024px) { + .layer-item { + padding: 10px; + padding-left: 30px; + } + .layer-drag-handle:hover, + .visibility-btn:hover { + background-color: rgba(0, 0, 0, 0.04); + border-radius: 4px; + } +} +@media (hover: none) and (pointer: coarse) { + .layer-item { + padding-left: 30px; + } + .layer-item:hover { + background-color: transparent; + } + .layer-item:active { + background-color: #f0f0f0; + } + .action-btn:hover { + background-color: transparent; + border-color: #d9d9d9; + color: #666; + } + .action-btn:active { + background-color: #e6f7ff; + border-color: #1890ff; + color: #1890ff; + } +} +.group-expand-icon { + display: flex; + align-items: center; + justify-content: center; + width: 16px; + height: 16px; + cursor: pointer; + border-radius: 2px; + transition: all 0.2s ease; + margin-right: 4px; + color: #333; +} +.group-expand-icon .svg-icon { + transition: transform 0.2s ease; +} +.group-layer .layer-type-icon { + font-size: 14px; +} +.child-layers { + position: relative; +} +.child-layers::before { + content: ''; + position: absolute; + left: 8px; + top: 0; + bottom: 0; + width: 1px; + background-color: #e0e0e0; +} +.layer-indent { + width: 16px; + position: relative; +} +.layer-indent::after { + content: ''; + position: absolute; + left: 8px; + top: 50%; + width: 8px; + height: 1px; + background-color: #e0e0e0; +} +.child-layers-expand-enter-active, +.child-layers-expand-leave-active { + transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + overflow: hidden; +} +.child-layers-expand-enter-from { + height: 0; + opacity: 0; + padding-top: 0; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; +} +.child-layers-expand-leave-to { + height: 0; + opacity: 0; + padding-top: 0; + padding-bottom: 0; + margin-top: 0; + margin-bottom: 0; +} +.group-expand-icon { + display: flex; + align-items: center; + justify-content: center; + width: 16px; + height: 16px; + cursor: pointer; + border-radius: 2px; + transition: all 0.2s ease; + margin-right: 4px; +} +.group-expand-icon:hover { + background-color: rgba(0, 0, 0, 0.1); + transform: scale(1.1); +} +.group-expand-icon:active { + transform: scale(0.95); +} +.group-expand-icon .svg-icon { + transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); +} +.child-layers { + position: relative; + background: linear-gradient(135deg, rgba(240, 248, 255, 0.1) 0%, rgba(240, 248, 255, 0.05) 100%); +} +.child-layers::before { + content: ''; + position: absolute; + left: 8px; + top: 0; + bottom: 0; + width: 1px; + background: linear-gradient(to bottom, #e0e0e0 0%, rgba(224, 224, 224, 0.3) 100%); +} +.child-layers .layer-item { + animation: slideInRight 0.2s ease-out; + animation-fill-mode: both; +} +.child-layers .layer-item:nth-child(1) { + animation-delay: 0.05s; +} +.child-layers .layer-item:nth-child(2) { + animation-delay: 0.1s; +} +.child-layers .layer-item:nth-child(3) { + animation-delay: 0.15s; +} +.child-layers .layer-item:nth-child(4) { + animation-delay: 0.2s; +} +.child-layers .layer-item:nth-child(5) { + animation-delay: 0.25s; +} +@keyframes slideInRight { + from { + opacity: 0; + transform: translateX(-10px); + } + to { + opacity: 1; + transform: translateX(0); + } +} +@media (hover: none) and (pointer: coarse) { + .child-layers-expand-enter-active, + .child-layers-expand-leave-active { + transition: all 0.25s ease; + } + .group-expand-icon:hover { + transform: none; + background-color: transparent; + } + .group-expand-icon:active { + transform: scale(0.9); + background-color: rgba(0, 0, 0, 0.1); + } + .child-layers .layer-item { + animation-duration: 0.15s; + } +} diff --git a/src/component/Canvas/CanvasEditor/index.vue b/src/component/Canvas/CanvasEditor/index.vue index d46799e6..6ab169bb 100644 --- a/src/component/Canvas/CanvasEditor/index.vue +++ b/src/component/Canvas/CanvasEditor/index.vue @@ -20,11 +20,10 @@ import { SelectionManager } from "./managers/selection/SelectionManager"; import { RedGreenModeManager } from "./managers/RedGreenModeManager"; import texturePresetManager from "./managers/brushes/TexturePresetManager"; import { BrushStore } from "./store/BrushStore"; -import cuowuImg from '@/assets/images/homePage/cuowu.svg' +import cuowuImg from "@/assets/images/homePage/cuowu.svg"; import { Https } from "@/tool/https"; -import SelectImages from '@/component/common/SelectImages.vue' -import { UrlToFile } from '@/tool/util' - +import SelectImages from "@/component/common/SelectImages.vue"; +import { UrlToFile } from "@/tool/util"; // import { MinimapManager } from "./managers/minimap/MinimapManager"; @@ -105,14 +104,16 @@ const props = defineProps({ type: Boolean, default: false, // 是否显示固定图层 }, - isGeneral: { // 从generalMiniCanvas来的 + isGeneral: { + // 从generalMiniCanvas来的 type: Boolean, - default:false + default: false, }, - isEdit: { // 从design点击喜欢过的图片,再点击顶部的编辑图标 + isEdit: { + // 从design点击喜欢过的图片,再点击顶部的编辑图标 type: Boolean, - default: false - } + default: false, + }, }); // 引用和状态 @@ -269,7 +270,7 @@ onMounted(async () => { layerManager, activeTool, // 响应式引用，存储当前选中的工具 brushSize: brushSize.value, // 可选，初始画笔大小 - t, // 国际化函数 + t, // 国际化函数 }); // 初始化文本编辑功能 @@ -416,10 +417,9 @@ onMounted(async () => { canvasManagerLoaded.value = true; - // 添加删除按钮 - // if(!fabric.Object.prototype.controls.deleteControl)addRemoveBtn(removeLayer) - addRemoveBtn(removeLayer) - + // 添加删除按钮 + // if(!fabric.Object.prototype.controls.deleteControl)addRemoveBtn(removeLayer) + addRemoveBtn(removeLayer); // 触发组件初始化事件 nextTick(() => { @@ -468,15 +468,15 @@ onMounted(async () => { // 使用window的resize事件代替ResizeObserver // 只有当窗口大小变化时才更新画布尺寸 // window.addEventListener("resize", handleWindowResize); - if(props.config.initZoom) { - const width = canvasManager.width; - const height = canvasManager.height; - const cwidth = props.config.width; - const cheight = props.config.height; - let zoom = Math.min(1,width/cwidth,height/cheight); - if(zoom < 1) zoom -= 0.05; - setZoom(zoom); // 设置画布缩放 - } + if (props.config.initZoom) { + const width = canvasManager.width; + const height = canvasManager.height; + const cwidth = props.config.width; + const cheight = props.config.height; + let zoom = Math.min(1, width / cwidth, height / cheight); + if (zoom < 1) zoom -= 0.05; + setZoom(zoom); // 设置画布缩放 + } }); watchEffect(() => { @@ -518,7 +518,7 @@ onBeforeUnmount(() => { liquifyManager = null; selectionManager = null; redGreenModeManager = null; -// fabric.Object.prototype.controls.deleteControl = undefined; + // fabric.Object.prototype.controls.deleteControl = undefined; // 移除window resize事件监听 // window.removeEventListener("resize", handleWindowResize); @@ -541,18 +541,17 @@ function handleWindowResize() { function resetZoom() { canvasManager.resetZoom(); } - function setZoom(zoom) { - setTimeout(()=>{ - if (!canvasManager) return; - const newZoom = Math.max(zoom, 0.1); // 减少10%，最小0.1倍 - // 使用画布中心作为缩放点 - const centerPoint = { - x: canvasManager.canvas.width / 2, - y: canvasManager.canvas.height / 2, - }; - canvasManager.animateZoom(centerPoint, newZoom); - }) + setTimeout(() => { + if (!canvasManager) return; + const newZoom = Math.max(zoom, 0.1); + // 使用画布中心作为缩放点 + const centerPoint = { + x: canvasManager.canvas.width / 2, + y: canvasManager.canvas.height / 2, + }; + canvasManager.animateZoom(centerPoint, newZoom); + }); } function zoomIn() { @@ -645,35 +644,36 @@ function moveLayerDown(layerId) { layerManager.moveLayer(layerId, "down"); } -function addRemoveBtn(fun){//添加删除按钮 - const deleteIcon = cuowuImg - // 创建删除图片元素 - let deleteImg = document.createElement('img') - deleteImg.src = deleteIcon - function renderIcon(icon) { - return function (ctx, left, top, styleOverride, fabricObject) { - var size = this.cornerSize; - ctx.save(); - ctx.translate(left, top); - ctx.rotate(fabric.util.degreesToRadians(fabricObject.angle)); - ctx.drawImage(icon, -size/3, -size/3, size/1.5, size/1.5); - ctx.restore(); - } - } - fabric.Object.prototype.controls.deleteControl = new fabric.Control({ - x: 0.5, - y: -0.5, - offsetY: -16, - offsetX: 16, - cursorStyle: 'pointer', - mouseUpHandler:deleteFun, - render: renderIcon(deleteImg), - cornerSize: 24 - }) +function addRemoveBtn(fun) { + //添加删除按钮 + const deleteIcon = cuowuImg; + // 创建删除图片元素 + let deleteImg = document.createElement("img"); + deleteImg.src = deleteIcon; + function renderIcon(icon) { + return function (ctx, left, top, styleOverride, fabricObject) { + var size = this.cornerSize; + ctx.save(); + ctx.translate(left, top); + ctx.rotate(fabric.util.degreesToRadians(fabricObject.angle)); + ctx.drawImage(icon, -size / 3, -size / 3, size / 1.5, size / 1.5); + ctx.restore(); + }; + } + fabric.Object.prototype.controls.deleteControl = new fabric.Control({ + x: 0.5, + y: -0.5, + offsetY: -16, + offsetX: 16, + cursorStyle: "pointer", + mouseUpHandler: deleteFun, + render: renderIcon(deleteImg), + cornerSize: 24, + }); } -function deleteFun(){ - removeLayer(layerManager.activeLayerId.value) +function deleteFun() { + removeLayer(layerManager.activeLayerId.value); } function removeLayer(layerId) { @@ -748,14 +748,14 @@ function handleImageUpload(event) { const selectImages = ref(null); const handleImageSelect = (data) => { - UrlToFile(data.url,data.name).then((file)=>{ - handleImageUpload({ target: { files: [file] } }) - }) -} + UrlToFile(data.url, data.name).then((file) => { + handleImageUpload({ target: { files: [file] } }); + }); +}; function triggerLibrary() { // console.log('CanvasEditor', '打开收藏') - if (props.isGeneral || props.isEdit) { - selectImages.value.init() + if (props.isGeneral || props.isEdit) { + selectImages.value.init(); } else { emit("trigger-library"); } @@ -858,14 +858,14 @@ const changeCanvas = async (command) => { ...command, // 传递完整的命令数据 }; emit("changeCanvas", commandData); - if(command.canUndo || command.canRedo){ - setTimeout(async ()=>{ - const imageData = await canvasManager.exportImage({ - restoreOpacityInRedGreen: true, // 恢复红绿图模式下的透明度 - isCropByBg:true, - }); - emit("trigger-red-green-mouseup", imageData); - },100) + if (command.canUndo || command.canRedo) { + setTimeout(async () => { + const imageData = await canvasManager.exportImage({ + restoreOpacityInRedGreen: true, // 恢复红绿图模式下的透明度 + isCropByBg: true, + }); + emit("trigger-red-green-mouseup", imageData); + }, 100); } }; @@ -939,7 +939,7 @@ defineExpose({ layerId = "", // 导出具体图层ID layerIdArray = [], // 导出多个图层ID数组 expPicType = "png", // 导出图片类型 JPG 或 PNG ,SVG - isEnhanceImg, // 是否是增强图片 + isEnhanceImg, // 是否是增强图片 } = {}) => { return canvasManager.exportImage({ isContainBg, @@ -948,7 +948,7 @@ defineExpose({ layerId, layerIdArray, expPicType, - isEnhanceImg, + isEnhanceImg, }); }, /** @@ -1103,12 +1103,15 @@ defineExpose({ @undo-redo-status-changed="changeCanvas" @trigger-library="triggerLibrary" > - @@ -1246,7 +1249,8 @@ defineExpose({ flex-direction: column; /* height: 100vh; */ background-color: #ffffff; - font-family: pingfang_medium, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + font-family: pingfang_medium, -apple-system, BlinkMacSystemFont, "Segoe UI", + sans-serif; position: absolute; left: 0; right: 0; @@ -1472,7 +1476,9 @@ button:hover { transition: width 0.3s ease; background: #fff; width: 35rem; - max-height: 85vh; + max-height: 90%; + display: flex; + overflow: hidden; box-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.1); /* 添加阴影效果 */ backdrop-filter: blur(2px); /* 添加模糊效果 */ -webkit-backdrop-filter: blur(2px); diff --git a/src/component/home/design/index.vue b/src/component/home/design/index.vue index f4b073d0..e011db01 100644 --- a/src/component/home/design/index.vue +++ b/src/component/home/design/index.vue @@ -169,11 +169,11 @@ )"> - @@ -250,10 +250,10 @@ )"> - +
@@ -1098,8 +1098,11 @@ export default defineComponent({ generateCourseItem.oldSort = generateCourseItem.sort generateCourseItem.sort = list[index]?.childList.length + 1 if(data.status == 'add'){ - if(str == 'noBatch')upDataSort(generateCourseItem,index,str) - list[index]?.childList.push(generateCourseItem) + if(list[index]?.childList.filter((item:any)=>(item.id == generateCourseItem?.id)).length == 0){ + if(str == 'noBatch')upDataSort(generateCourseItem,index,str) + // list[index]?.childList.push(generateCourseItem) + list[index]?.childList.push(generateCourseItem) + } } }else{ let index = list.findIndex((item:any)=>(item.userLikeSortId == generateCourseItem.parentId)) @@ -1108,8 +1111,10 @@ export default defineComponent({ list[index].childList = [] } if(data.status == 'add'){ - if(str == 'noBatch')upDataSort(generateCourseItem,index,str) - list[index]?.childList.push(generateCourseItem) + if(list[index]?.childList.filter((item:any)=>(item.id == generateCourseItem?.id)).length == 0){ + if(str == 'noBatch')upDataSort(generateCourseItem,index,str) + list[index]?.childList.push(generateCourseItem) + } }else{ upDataSuccess(generateCourseItem) // let childIndex = list[index].childList.findIndex((item:any)=>(item.id == generateCourseItem?.oldId || generateCourseItem?.id)) diff --git a/src/component/home/design/tools.vue b/src/component/home/design/tools.vue index 8bc116ed..09764d2e 100644 --- a/src/component/home/design/tools.vue +++ b/src/component/home/design/tools.vue @@ -257,7 +257,7 @@ export default defineComponent({ {value:'disposeMoodboard',name:'Entirety Moodboard',nameCn:'整体情绪版'}, {value:'moodboardFiles',name:'Moodboard',nameCn:'情绪版'}, {value:'printboardFiles',name:'Printboard',nameCn:'印花板'}, - {value:'sketchboardFiles',name:'Sketchboard',nameCn:'整体情绪版'}, + {value:'sketchboardFiles',name:'Sketchboard',nameCn:'线稿版'}, ] allCollectionStr.forEach((itemStr:any)=>{ let list = [] as any