shenjianZ
/
news-classifier
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 修复前端标题栏无法拖动窗口问题

This commit is contained in:
shenjianZ 2026-01-12 21:26:17 +08:00
parent d4eaf9909d
commit 9346e58e3e
3 changed files with 19 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
client/src-tauri/capabilities/default.json
View File

@ -13,6 +13,7 @@
"core:window:allow-close", "core:window:allow-close",
"core:window:allow-is-maximized", "core:window:allow-is-maximized",
"core:window:allow-toggle-maximize", "core:window:allow-toggle-maximize",
"core:window:allow-start-dragging",
"opener:default", "opener:default",
{ {
"identifier": "http:default", "identifier": "http:default",

24
client/src/components/TitleBar.vue
View File

@ -66,20 +66,21 @@ const close = async () => {
</script> </script>
<template> <template>
<!-- data-tauri-drag-region: Tauri 自动处理窗口拖拽 -->
<div <div
data-tauri-drag-region class="titlebar h-10 flex items-center select-none fixed top-0 left-0 right-0 z-50"
class="titlebar h-10 flex items-center justify-between px-3 select-none fixed top-0 left-0 right-0 z-50"
:class="{ 'titlebar-dark': isDark }" :class="{ 'titlebar-dark': isDark }"
> >
<!-- 左侧：标题 --> <!-- 左侧：标题区域（可拖拽） -->
<div data-tauri-drag-region class="flex items-center gap-2 pointer-events-none"> <div
data-tauri-drag-region
class="titlebar-drag-region flex items-center gap-2 px-3 flex-1"
>
<div class="titlebar-icon" :class="{ 'titlebar-icon-dark': isDark }" /> <div class="titlebar-icon" :class="{ 'titlebar-icon-dark': isDark }" />
<span class="titlebar-text">News Classifier</span> <span class="titlebar-text">News Classifier</span>
</div> </div>
<!-- 右侧：窗口控制按钮 --> <!-- 右侧：窗口控制按钮（不可拖拽） -->
<div class="flex items-center"> <div class="flex items-center" data-tauri-drag-region="false">
<!-- 最小化按钮 --> <!-- 最小化按钮 -->
<button <button
@click="minimize" @click="minimize"
@ -122,11 +123,17 @@ const close = async () => {
border-bottom: 1px solid hsl(var(--sidebar-border)); border-bottom: 1px solid hsl(var(--sidebar-border));
} }
.titlebar-drag-region {
/* 拖拽区域样式 */
min-width: 0;
}
.titlebar-icon { .titlebar-icon {
width: 12px; width: 12px;
height: 12px; height: 12px;
background: hsl(var(--primary)); background: hsl(var(--primary));
border-radius: 2px; border-radius: 2px;
flex-shrink: 0;
} }
.titlebar-icon-dark { .titlebar-icon-dark {
@ -137,6 +144,9 @@ const close = async () => {
font-size: 0.8125rem; font-size: 0.8125rem;
font-weight: 500; font-weight: 500;
color: hsl(var(--foreground)); color: hsl(var(--foreground));
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.titlebar-btn { .titlebar-btn {

2
client/src/views/admin/NewsManagement.vue
View File

@ -696,7 +696,7 @@ onMounted(async () => {
padding: 1rem; padding: 1rem;
background: hsl(var(--card)); background: hsl(var(--card));
border: 1px solid hsl(var(--border)); border: 1px solid hsl(var(--border));
border-radius: var(--radius)); border-radius: var(--radius);
} }
.pagination-info { .pagination-info {