feat: 裁剪组裁剪跟随选择组移动

This commit is contained in:
bighuixiang
2025-07-14 01:00:23 +08:00
parent 96e13cb22a
commit 24e9ba8ae5
80 changed files with 2052 additions and 4292 deletions

View File

@@ -16,9 +16,7 @@ onMounted(() => {
platform.value = {
isMac: keyboardManager.platform === "mac",
isIOS: keyboardManager.platform === "ios",
isIPad:
keyboardManager.platform === "ios" &&
/iPad/.test(window.navigator.userAgent),
isIPad: keyboardManager.platform === "ios" && /iPad/.test(window.navigator.userAgent),
isTouchDevice: keyboardManager.isTouchDevice,
isWindows: keyboardManager.platform === "windows",
isAndroid: keyboardManager.platform === "android",
@@ -58,10 +56,10 @@ function convertShortcuts(managerShortcuts) {
increaseBrushSize: "增加笔触大小",
decreaseBrushSize: "减小笔触大小",
toggleTempTool: "临时切换工具",
newLayer: "新建图层",
groupLayers: "组合图层",
ungroupLayers: "取消组合",
mergeLayers: "合并图层",
// newLayer: "新建图层",
// groupLayers: "组合图层",
// ungroupLayers: "取消组合",
// mergeLayers: "合并图层",
};
// 工具ID到显示名称的映射
@@ -69,11 +67,11 @@ function convertShortcuts(managerShortcuts) {
select: "选择模式",
draw: "绘画模式",
eraser: "橡皮擦模式",
eyedropper: "吸色工具",
// eyedropper: "吸色工具",
pan: "移动画布",
lasso: "套索工具",
area_custom: "自由选区工具",
wave: "波浪工具",
// area_custom: "自由选区工具",
// wave: "波浪工具",
liquify: "液化工具",
};
@@ -82,11 +80,7 @@ function convertShortcuts(managerShortcuts) {
let actionDisplay = actionDisplayMap[shortcut.action] || shortcut.action;
// 特殊处理工具选择
if (
shortcut.action === "selectTool" &&
shortcut.param &&
toolDisplayMap[shortcut.param]
) {
if (shortcut.action === "selectTool" && shortcut.param && toolDisplayMap[shortcut.param]) {
actionDisplay = toolDisplayMap[shortcut.param];
}
@@ -144,12 +138,12 @@ function generateDefaultShortcuts() {
mac: "Delete 或 ⌫",
touch: "长按选中元素后点击删除",
},
{
action: "全选",
windows: "Ctrl+A",
mac: "⌘+A",
touch: "无",
},
// {
// action: "全选",
// windows: "Ctrl+A",
// mac: "⌘+A",
// touch: "无",
// },
{
action: "复制",
windows: "Ctrl+C",
@@ -198,12 +192,12 @@ function generateDefaultShortcuts() {
mac: "E",
touch: "点击橡皮擦工具",
},
{
action: "吸色工具",
windows: "I",
mac: "I",
touch: "点击吸色工具",
},
// {
// action: "吸色工具",
// windows: "I",
// mac: "I",
// touch: "点击吸色工具",
// },
{
action: "增加笔触大小",
windows: "]",
@@ -251,39 +245,24 @@ function getShortcutForCurrentPlatform(shortcut) {
// 按分类获取快捷键
function getShortcutsByCategory(category) {
const categoryMap = {
basic: [
"撤销",
"重做",
"全选",
"复制",
"粘贴",
"剪切",
"删除选中元素",
"上传图片",
],
// basic: ["撤销", "重做", "全选", "复制", "粘贴", "剪切", "删除选中元素", "上传图片"],
basic: ["撤销", "重做", "复制", "粘贴", "剪切", "删除选中元素", "上传图片"],
view: ["缩放画布", "移动画布"],
tools: [
"绘画模式",
"选择模式",
"橡皮擦模式",
"吸色工具",
// "吸色工具",
"套索工具",
"自由选区工具",
"波浪工具",
// "自由选区工具",
// "波浪工具",
"液化工具",
],
brush: [
"增加笔触大小",
"减小笔触大小",
"增加材质图片大小",
"减小材质图片大小",
],
layer: ["新建图层", "组合图层", "取消组合", "合并图层"],
brush: ["增加笔触大小", "减小笔触大小", "增加材质图片大小", "减小材质图片大小"],
// layer: ["新建图层", "组合图层", "取消组合", "合并图层"],
};
return shortcuts.value.filter((s) =>
categoryMap[category]?.includes(s.action)
);
return shortcuts.value.filter((s) => categoryMap[category]?.includes(s.action));
}
</script>
@@ -313,10 +292,7 @@ function getShortcutsByCategory(category) {
</tr>
</thead>
<tbody>
<tr
v-for="item in getShortcutsByCategory('basic')"
:key="item.action"
>
<tr v-for="item in getShortcutsByCategory('basic')" :key="item.action">
<td>{{ item.action }}</td>
<td>{{ getShortcutForCurrentPlatform(item) }}</td>
</tr>
@@ -334,10 +310,7 @@ function getShortcutsByCategory(category) {
</tr>
</thead>
<tbody>
<tr
v-for="item in getShortcutsByCategory('view')"
:key="item.action"
>
<tr v-for="item in getShortcutsByCategory('view')" :key="item.action">
<td>{{ item.action }}</td>
<td>{{ getShortcutForCurrentPlatform(item) }}</td>
</tr>
@@ -355,10 +328,7 @@ function getShortcutsByCategory(category) {
</tr>
</thead>
<tbody>
<tr
v-for="item in getShortcutsByCategory('tools')"
:key="item.action"
>
<tr v-for="item in getShortcutsByCategory('tools')" :key="item.action">
<td>{{ item.action }}</td>
<td>{{ getShortcutForCurrentPlatform(item) }}</td>
</tr>
@@ -376,10 +346,7 @@ function getShortcutsByCategory(category) {
</tr>
</thead>
<tbody>
<tr
v-for="item in getShortcutsByCategory('brush')"
:key="item.action"
>
<tr v-for="item in getShortcutsByCategory('brush')" :key="item.action">
<td>{{ item.action }}</td>
<td>{{ getShortcutForCurrentPlatform(item) }}</td>
</tr>
@@ -387,7 +354,7 @@ function getShortcutsByCategory(category) {
</table>
</div>
<div class="shortcuts-category">
<!-- <div class="shortcuts-category">
<h3>图层操作</h3>
<table class="shortcuts-table">
<thead>
@@ -397,16 +364,13 @@ function getShortcutsByCategory(category) {
</tr>
</thead>
<tbody>
<tr
v-for="item in getShortcutsByCategory('layer')"
:key="item.action"
>
<tr v-for="item in getShortcutsByCategory('layer')" :key="item.action">
<td>{{ item.action }}</td>
<td>{{ getShortcutForCurrentPlatform(item) }}</td>
</tr>
</tbody>
</table>
</div>
</div> -->
<div class="touch-tips" v-if="platform.isTouchDevice">
<h3>触控设备提示</h3>