Skip to content

Commit f92af2e

Browse files
weilin9999weilin9999
committed
更新版本V0.0.47
更新版本V0.0.47
1 parent 8dca13b commit f92af2e

File tree

9 files changed

+216
-103
lines changed

9 files changed

+216
-103
lines changed

‎README.md‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,17 @@
2828

2929
# 版本更新介绍
3030

31-
> 最新更新：2025-04-24
31+
> 最新更新：2025-04-25
3232
33-
> 0.0.46 公测版本介绍 如果你要使用本插件请务必进我们的官方 QQ 群（1018231382）！
33+
> 0.0.47 公测版本介绍 如果你要使用本插件请务必进我们的官方 QQ 群（1018231382）！
34+
>
35+
> 1. 新增辅助功能，限制了窗口的移动范围防止超出可视范围，以及悬浮球也限制了移动范围
36+
>
37+
38+
<details>
39+
<summary>点击查看往期更多更新内容</summary>
40+
41+
> 0.0.46 公测版本介绍 2025-04-24
3442
>
3543
> 1. 修复了一些已知的BUG
3644
>
@@ -39,9 +47,6 @@
3947
> * 补全框现在可以跟着输入的位置移动了
4048
>
4149
42-
<details>
43-
<summary>点击查看往期更多更新内容</summary>
44-
4550
> 0.0.45 公测版本介绍 2025-04-22
4651
>
4752
> 1. 修复了一些已知的BUG

‎README_EN.md‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,17 @@ Due to limited personal time, the frequency of updating plug-ins will not be ver
2424

2525
# Version update introduction
2626

27-
> Last updated: 2025-04-24
27+
> Last updated: 2025-04-25
2828
29-
> 0.0.46 Public Beta Version Introduction: If you want to use this plugin, please be sure to join our official QQ group (1018231382)!
29+
> 0.0.47 Public Beta Version Introduction: If you want to use this plugin, please be sure to join our official QQ group (1018231382)!
30+
>
31+
> 1. New auxiliary functions have been added, which limit the movement range of the window to prevent it from exceeding the visible range, and the floating ball also restricts the movement range
32+
>
33+
34+
<details>
35+
<summary>Click here for more updates from the past</summary>
36+
37+
> 0.0.46 Public Beta Version 2025-04-24
3038
>
3139
> 1. Fixed some known bugs
3240
>
@@ -35,10 +43,6 @@ Due to limited personal time, the frequency of updating plug-ins will not be ver
3543
> * The completion box can now move along with the input position
3644
>
3745
38-
<details>
39-
<summary>Click here for more updates from the past</summary>
40-
41-
4246
> 0.0.45 Public Beta Version 2025-04-22
4347
>
4448
> 1. Fixed some known bugs

‎dist/javascript/main.entry.js‎

Lines changed: 30 additions & 30 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/javascript/main.entry.js.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/style.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎pyproject.toml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
[project]
22
name = "weilin-comfyui-tools"
33
description = "让你在 ComfyUI 中快捷的使用提示词工具 Quickly use the prompt word tool in ComfyUI"
4-
version = "0.0.46"
4+
version = "0.0.47"
55
license = {file = "LICENSE"}
66
dependencies = []
77

‎src/src/components/DraggableWindow.vue‎

Lines changed: 42 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -81,13 +81,30 @@ const handleScroll = () => {
8181
8282
// 在组件挂载时初始化位置和大小
8383
onMounted(() => {
84-
// 设置初始位置
85-
if (props.position) {
86-
currentPosition.value = { ...props.position }
84+
// 设置初始位置
85+
if (props.position) {
86+
const viewportWidth = window.innerWidth;
87+
const viewportHeight = window.innerHeight;
88+
89+
// 边界检测
90+
let x = props.position.x;
91+
let y = props.position.y;
92+
93+
// 确保左侧不超出边界
94+
x = Math.max(50, x);
95+
// 确保右侧不超出边界
96+
x = Math.min(x, viewportWidth - (props.size?.width || currentSize.value.width));
97+
// 确保顶部不超出边界
98+
y = Math.max(50, y);
99+
// 确保底部不超出边界
100+
y = Math.min(y, viewportHeight - (props.size?.height || currentSize.value.height));
101+
102+
currentPosition.value = { x, y };
87103
}
104+
88105
// 设置初始大小
89106
if (props.size) {
90-
currentSize.value = { ...props.size }
107+
currentSize.value = { ...props.size };
91108
}
92109
})
93110
@@ -107,12 +124,28 @@ const startDrag = (event) => {
107124
108125
const handleDrag = (event) => {
109126
if (isDragging.value) {
127+
const viewportWidth = window.innerWidth;
128+
const viewportHeight = window.innerHeight;
129+
130+
let newX = event.clientX - dragOffset.value.x;
131+
let newY = event.clientY - dragOffset.value.y;
132+
133+
// 确保左侧不超出边界
134+
newX = Math.max(50, newX);
135+
// 确保右侧不超出边界
136+
newX = Math.min(newX, viewportWidth - currentSize.value.width);
137+
// 确保顶部不超出边界
138+
newY = Math.max(50, newY);
139+
// 确保底部不超出边界
140+
newY = Math.min(newY, viewportHeight - currentSize.value.height);
141+
110142
const newPosition = {
111-
x: event.clientX - dragOffset.value.x,
112-
y: event.clientY - dragOffset.value.y
113-
}
114-
currentPosition.value = newPosition
115-
emit('update:position', newPosition)
143+
x: newX,
144+
y: newY
145+
};
146+
147+
currentPosition.value = newPosition;
148+
emit('update:position', newPosition);
116149
}
117150
}
118151

‎src/src/components/FloatingBall.vue‎

Lines changed: 120 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,28 @@
11
<template>
22
<!-- 悬浮球 -->
3-
<div class="weilin_prompt_ui_floating-ball" :style="ballStyle[i - 1]"
4-
@mouseenter="handleMouseEnter(i - 1)"
5-
@mouseleave="handleMouseLeave(i - 1)"
6-
@mousedown="startDrag($event, i - 1)"
7-
@mouseup="stopDrag($event, i - 1)"
8-
v-for="i in savedFloatingBallCount"
9-
:key="'floating-ball-' + i">
10-
<div class="weilin_prompt_ui_ball-content" @click="handleClick">
11-
<slot></slot>
12-
</div>
13-
<!-- 目录 -->
14-
<div v-if="showMenu[i - 1]" class="weilin_prompt_ui_menu-container" @mousedown.stop>
15-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item1')">{{ t('floatingBall.promptBox') }}</div>
16-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item2')">{{ t('floatingBall.tagManager') }}</div>
17-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item3')">{{ t('floatingBall.loraManager') }}</div>
18-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item4')">{{ t('floatingBall.aiWindow') }}</div>
19-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item6')">{{ t('floatingBall.openNodeListWindow') }}</div>
20-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item7')">{{ t('floatingBall.tranToWeb') }}</div>
21-
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item5')">{{ t('floatingBall.restoreWindow') }}</div>
22-
</div>
3+
<div class="weilin_prompt_ui_floating-ball" :style="ballStyle[i - 1]" @mouseenter="handleMouseEnter(i - 1)"
4+
@mouseleave="handleMouseLeave(i - 1)" @mousedown="startDrag($event, i - 1)" @mouseup="stopDrag($event, i - 1)"
5+
v-for="i in savedFloatingBallCount" :key="'floating-ball-' + i">
6+
<div class="weilin_prompt_ui_ball-content" @click="handleClick">
7+
<slot></slot>
8+
</div>
9+
<!-- 目录 -->
10+
<div v-if="showMenu[i - 1]" class="weilin_prompt_ui_menu-container" @mousedown.stop>
11+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item1')">{{ t('floatingBall.promptBox')
12+
}}</div>
13+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item2')">{{
14+
t('floatingBall.tagManager') }}</div>
15+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item3')">{{
16+
t('floatingBall.loraManager') }}</div>
17+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item4')">{{ t('floatingBall.aiWindow')
18+
}}</div>
19+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item6')">{{
20+
t('floatingBall.openNodeListWindow') }}</div>
21+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item7')">{{ t('floatingBall.tranToWeb')
22+
}}</div>
23+
<div class="weilin_prompt_ui_menu-item" @click="handleMenuItemClick('item5')">{{
24+
t('floatingBall.restoreWindow') }}</div>
25+
</div>
2326
</div>
2427

2528
<tranToWeb ref="tranToWebRef" />
@@ -59,43 +62,88 @@ const ballStyle = ref([]);
5962
for (let i = 0; i < savedFloatingBallCount.value; i++) {
6063
showMenu.value[i] = false;
6164
isDragging.value[i] = false;
65+
66+
const viewportWidth = window.innerWidth;
67+
const viewportHeight = window.innerHeight;
68+
const ballSize = savedFloatingBallSize.value;
69+
const spacing = 10; // 球之间的间距
70+
71+
// 计算每行能放多少个球
72+
const ballsPerRow = Math.floor(viewportWidth / (ballSize + spacing));
73+
74+
// 计算当前球的行和列
75+
const row = Math.floor(i / ballsPerRow);
76+
const col = i % ballsPerRow;
77+
78+
// 计算初始位置
79+
let x = 20 + col * (ballSize + spacing);
80+
let y = viewportHeight - 100 - row * (ballSize + spacing);
81+
82+
// 边界检查
83+
x = Math.max(0, x);
84+
x = Math.min(x, viewportWidth - ballSize);
85+
y = Math.max(0, y);
86+
y = Math.min(y, viewportHeight - ballSize);
87+
6288
ballPosition.value[i] = {
63-
x: 20 + i * (savedFloatingBallSize.value + 10), // 增加间距
64-
y: window.innerHeight - 100,
65-
width: savedFloatingBallSize.value + 'px',
66-
height: savedFloatingBallSize.value + 'px'
89+
x: x,
90+
y: y,
91+
width: ballSize + 'px',
92+
height: ballSize + 'px'
6793
};
6894
ballStyle.value[i] = {
6995
left: `${ballPosition.value[i].x}px`,
7096
top: `${ballPosition.value[i].y}px`,
71-
width: `${savedFloatingBallSize.value}px`,
72-
height: `${savedFloatingBallSize.value}px`,
97+
width: `${ballSize}px`,
98+
height: `${ballSize}px`,
7399
}
74100
}
75101
76102
// 开始拖拽
77103
const startDrag = (event, i) => {
78-
// 判断点击是否在悬浮球本体或其直接子元素上
79-
const target = event.target;
80-
if (target.closest('.weilin_prompt_ui_floating-ball')) {
81-
isDragging.value[i] = true;
82-
document.addEventListener('mousemove', (e) => onDrag(e, i));
83-
document.addEventListener('mouseup', (e) => stopDrag(e, i));
84-
}
104+
// 判断点击是否在悬浮球本体或其直接子元素上
105+
const target = event.target;
106+
if (target.closest('.weilin_prompt_ui_floating-ball')) {
107+
isDragging.value[i] = true;
108+
document.addEventListener('mousemove', (e) => onDrag(e, i));
109+
document.addEventListener('mouseup', (e) => stopDrag(e, i));
110+
}
85111
};
86112
87113
// 拖拽中
88114
const onDrag = (event, i) => {
89-
if (isDragging.value[i]) {
90-
ballPosition.value[i].x = event.clientX - savedFloatingBallSize.value / 2;
91-
ballPosition.value[i].y = event.clientY - savedFloatingBallSize.value / 2;
92-
ballStyle.value[i] = {
93-
left: `${ballPosition.value[i].x}px`,
94-
top: `${ballPosition.value[i].y}px`,
95-
width: `${savedFloatingBallSize.value}px`,
96-
height: `${savedFloatingBallSize.value}px`,
97-
};
98-
}
115+
if (isDragging.value[i]) {
116+
const viewportWidth = window.innerWidth;
117+
const viewportHeight = window.innerHeight;
118+
const ballSize = savedFloatingBallSize.value;
119+
120+
// 计算新位置并确保不超出边界
121+
let newX = event.clientX - ballSize / 2;
122+
let newY = event.clientY - ballSize / 2;
123+
124+
// 确保左侧不超出边界
125+
newX = Math.max(0, newX);
126+
// 确保右侧不超出边界
127+
newX = Math.min(newX, viewportWidth - ballSize);
128+
// 确保顶部不超出边界
129+
newY = Math.max(0, newY);
130+
// 确保底部不超出边界
131+
newY = Math.min(newY, viewportHeight - ballSize);
132+
133+
ballPosition.value[i] = {
134+
x: newX,
135+
y: newY,
136+
width: ballSize + 'px',
137+
height: ballSize + 'px'
138+
};
139+
140+
ballStyle.value[i] = {
141+
left: `${ballPosition.value[i].x}px`,
142+
top: `${ballPosition.value[i].y}px`,
143+
width: `${ballSize}px`,
144+
height: `${ballSize}px`,
145+
};
146+
}
99147
};
100148
101149
// 停止拖拽
@@ -163,17 +211,40 @@ const handleMessage = (event) => {
163211
for (let i = 0; i < savedFloatingBallCount.value; i++) {
164212
showMenu.value[i] = false;
165213
isDragging.value[i] = false;
214+
215+
const viewportWidth = window.innerWidth;
216+
const viewportHeight = window.innerHeight;
217+
const ballSize = savedFloatingBallSize.value;
218+
const spacing = 10; // 球之间的间距
219+
220+
// 计算每行能放多少个球
221+
const ballsPerRow = Math.floor(viewportWidth / (ballSize + spacing));
222+
223+
// 计算当前球的行和列
224+
const row = Math.floor(i / ballsPerRow);
225+
const col = i % ballsPerRow;
226+
227+
// 计算初始位置
228+
let x = 20 + col * (ballSize + spacing);
229+
let y = viewportHeight - 100 - row * (ballSize + spacing);
230+
231+
// 边界检查
232+
x = Math.max(0, x);
233+
x = Math.min(x, viewportWidth - ballSize);
234+
y = Math.max(0, y);
235+
y = Math.min(y, viewportHeight - ballSize);
236+
166237
ballPosition.value[i] = {
167-
x: 20 + i * (savedFloatingBallSize.value + 10),
168-
y: window.innerHeight - 100,
169-
width: savedFloatingBallSize.value + 'px',
170-
height: savedFloatingBallSize.value + 'px'
238+
x: x,
239+
y: y,
240+
width: ballSize + 'px',
241+
height: ballSize + 'px'
171242
};
172243
ballStyle.value[i] = {
173244
left: `${ballPosition.value[i].x}px`,
174245
top: `${ballPosition.value[i].y}px`,
175-
width: `${savedFloatingBallSize.value}px`,
176-
height: `${savedFloatingBallSize.value}px`,
246+
width: `${ballSize}px`,
247+
height: `${ballSize}px`,
177248
}
178249
}
179250
}

‎src/src/utils/version.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export const version = "v0.0.46";
1+
export const version = "v0.0.47";

0 commit comments

Comments
 (0)