mirror of
https://github.com/fofolee/uTools-quickcommand.git
synced 2025-06-08 22:51:25 +08:00
优化进度条组件,支持根据内容调整高度
This commit is contained in:
parent
1e5a4c1ff5
commit
7635f1ac64
@ -272,7 +272,7 @@ async function chat(content, apiConfig, options = {}) {
|
|||||||
if (processBar) {
|
if (processBar) {
|
||||||
quickcommand.updateProcessBar(
|
quickcommand.updateProcessBar(
|
||||||
{
|
{
|
||||||
text: fullResponse, // 只显示最后100个字符,避免内容过长
|
text: fullResponse,
|
||||||
},
|
},
|
||||||
processBar
|
processBar
|
||||||
);
|
);
|
||||||
|
@ -409,7 +409,10 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||||||
processBarInner.style.width = `${value}%`;
|
processBarInner.style.width = `${value}%`;
|
||||||
}
|
}
|
||||||
if (text) {
|
if (text) {
|
||||||
document.getElementById("process-text").textContent = text;
|
const processText = document.getElementById("process-text");
|
||||||
|
processText.innerHTML = text;
|
||||||
|
processText.scrollTop = processText.scrollHeight;
|
||||||
|
ipcRenderer.sendTo(parentId, "dialog-ready", calculateHeight());
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -425,9 +428,11 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||||||
(buttonBar.style.display !== "none" ? buttonBar.offsetHeight : 0);
|
(buttonBar.style.display !== "none" ? buttonBar.offsetHeight : 0);
|
||||||
|
|
||||||
const maxHeight = dialogType === "select" ? 620 : 520;
|
const maxHeight = dialogType === "select" ? 620 : 520;
|
||||||
|
// 进度条的最大高度通过.process-text的max-height限制
|
||||||
|
const minHeight = dialogType === "process" ? 60 : 100;
|
||||||
|
|
||||||
// 确保高度在最小值和最大值之间
|
// 确保高度在最小值和最大值之间
|
||||||
return Math.min(Math.max(totalHeight, 100), maxHeight);
|
return Math.min(Math.max(totalHeight, minHeight), maxHeight);
|
||||||
};
|
};
|
||||||
|
|
||||||
// 确定按钮点击事件
|
// 确定按钮点击事件
|
||||||
|
@ -328,7 +328,7 @@ const showProcessBar = async (options = {}) => {
|
|||||||
throw new Error("onPause 和 onResume 必须同时配置");
|
throw new Error("onPause 和 onResume 必须同时配置");
|
||||||
}
|
}
|
||||||
|
|
||||||
const windowWidth = 250;
|
const windowWidth = 350;
|
||||||
const windowHeight = 60;
|
const windowHeight = 60;
|
||||||
|
|
||||||
// 计算窗口位置
|
// 计算窗口位置
|
||||||
@ -364,10 +364,25 @@ const showProcessBar = async (options = {}) => {
|
|||||||
isLoading: value === undefined, // 当不传value时显示加载动画
|
isLoading: value === undefined, // 当不传value时显示加载动画
|
||||||
});
|
});
|
||||||
|
|
||||||
// 监听窗口准备就绪
|
const dialogReadyHandler = (event, height) => {
|
||||||
ipcRenderer.once("dialog-ready", () => {
|
// 获取当前窗口位置
|
||||||
|
const bounds = UBrowser.getBounds();
|
||||||
|
// 调整y坐标,保持窗口底部不变
|
||||||
|
const y = Math.round(bounds.y - (height - bounds.height));
|
||||||
|
// 确保坐标和尺寸都是有效的整数
|
||||||
|
const newBounds = {
|
||||||
|
x: Math.round(bounds.x),
|
||||||
|
y: Math.max(0, y), // 确保不会超出屏幕顶部
|
||||||
|
width: windowWidth,
|
||||||
|
height: Math.round(height),
|
||||||
|
};
|
||||||
|
// 设置新的位置和大小
|
||||||
|
UBrowser.setBounds(newBounds);
|
||||||
UBrowser.setOpacity(1);
|
UBrowser.setOpacity(1);
|
||||||
});
|
};
|
||||||
|
|
||||||
|
// 监听子窗口返回的计算高度
|
||||||
|
ipcRenderer.on("dialog-ready", dialogReadyHandler);
|
||||||
|
|
||||||
// 监听对话框结果
|
// 监听对话框结果
|
||||||
ipcRenderer.once("dialog-result", (event, result) => {
|
ipcRenderer.once("dialog-result", (event, result) => {
|
||||||
@ -395,6 +410,7 @@ const showProcessBar = async (options = {}) => {
|
|||||||
onClose();
|
onClose();
|
||||||
}
|
}
|
||||||
lastProcessBar = null;
|
lastProcessBar = null;
|
||||||
|
ipcRenderer.removeListener("dialog-ready", dialogReadyHandler);
|
||||||
UBrowser.destroy();
|
UBrowser.destroy();
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
@ -78,6 +78,7 @@ body {
|
|||||||
::-webkit-scrollbar-thumb {
|
::-webkit-scrollbar-thumb {
|
||||||
background: var(--scrollbar-thumb);
|
background: var(--scrollbar-thumb);
|
||||||
transition: background-color 0.3s;
|
transition: background-color 0.3s;
|
||||||
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 悬浮时显示滚动条 */
|
/* 悬浮时显示滚动条 */
|
||||||
@ -584,6 +585,9 @@ textarea:focus {
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
background: var(--button-bg);
|
background: var(--button-bg);
|
||||||
color: white;
|
color: white;
|
||||||
|
min-height: auto;
|
||||||
|
height: auto;
|
||||||
|
overflow: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
#process {
|
#process {
|
||||||
@ -596,16 +600,14 @@ textarea:focus {
|
|||||||
.process-text {
|
.process-text {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
white-space: nowrap;
|
white-space: pre-wrap;
|
||||||
overflow-x: auto;
|
overflow-y: auto;
|
||||||
overflow-y: hidden;
|
overflow-x: hidden;
|
||||||
scrollbar-width: none;
|
padding-right: 2px;
|
||||||
width: calc(100% - 30px);
|
width: calc(100% - 15px);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
max-height: 250px;
|
||||||
|
-webkit-app-region: no-drag;
|
||||||
.process-text::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.process-bar {
|
.process-bar {
|
||||||
@ -655,20 +657,6 @@ textarea:focus {
|
|||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 添加按钮区域的渐变遮罩 */
|
|
||||||
.process-buttons::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
right: -8px;
|
|
||||||
/* 对应#process的padding-right */
|
|
||||||
top: -6px;
|
|
||||||
/* 对应#process的padding-top */
|
|
||||||
width: 80px;
|
|
||||||
height: 30px;
|
|
||||||
background: linear-gradient(to right, transparent, var(--button-bg) 60%);
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 进度条关闭按钮 */
|
/* 进度条关闭按钮 */
|
||||||
.process-close-btn {
|
.process-close-btn {
|
||||||
width: 16px;
|
width: 16px;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user