fix: 修复问题。

This commit is contained in:
tianyongbao
2025-12-16 22:26:54 +08:00
parent b17befa5f9
commit d2b02e8ea9

View File

@@ -83,7 +83,7 @@
<span class="tool-sort tool-drag-handle">排序: {{ tool.sortOrder || 0 }}</span>
</div>
<div class="tool-url-row">
<div class="tool-url" @click="openToolUrl(tool.url, $event)" title="点击打开">{{ tool.url }}</div>
<div class="tool-url" @click="openToolUrl(tool.url, $event)" :title="tool.url">{{ tool.url }}</div>
</div>
<div class="tool-footer">
<div class="tool-actions" @click.stop>
@@ -287,7 +287,6 @@ export default {
{ name: '紫蓝', value: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' },
{ name: '青色', value: 'linear-gradient(135deg, #84fab0 0%, #8fd3f4 100%)' },
{ name: '蓝绿', value: 'linear-gradient(135deg, #a8edea 0%, #fed6e3 100%)' },
{ name: '深紫', value: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' },
{ name: '粉蓝', value: 'linear-gradient(135deg, #f093fb 0%, #f5576c 100%)' },
{ name: '深绿', value: 'linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)' },
{ name: '淡紫', value: 'linear-gradient(135deg, #fbc2eb 0%, #a6c1ee 100%)' },
@@ -1178,6 +1177,9 @@ export default {
min-height: 100vh;
background: @primary-gradient;
padding-top: 64px; // 为固定头部预留空间
width: 100%; // 确保页面宽度不超出
overflow-x: hidden; // 防止横向滚动
box-sizing: border-box; // 包含padding在内
}
.manage-header {
@@ -1252,11 +1254,11 @@ export default {
.fixed-section {
position: fixed;
top: 64px; // 紧贴header底部
left: 0;
right: 0;
left: 8px; // 与容器左边距保持一致
right: 8px; // 与容器右边距保持一致
z-index: 999;
margin: 0;
border-radius: 0;
border-radius: 12px; // 添加圆角与其他section保持一致
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
padding: 20px; // PC端padding
}
@@ -1267,6 +1269,8 @@ export default {
padding: 10px 12px;
margin-bottom: 10px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
max-width: 100%; // 防止超出屏幕宽度
box-sizing: border-box; // 包含padding和border在内
.section-header {
display: flex;
@@ -1547,6 +1551,8 @@ export default {
.tool-group {
margin-bottom: 24px;
max-width: 100%; // 防止超出屏幕宽度
overflow: hidden; // 防止内容溢出
&:last-child {
margin-bottom: 0;
@@ -1572,6 +1578,7 @@ export default {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 10px;
max-width: 100%; // 防止grid布局超出
.tool-item {
display: flex;
@@ -1582,6 +1589,9 @@ export default {
border-radius: 6px;
border: 1px solid #e5e7eb;
transition: all 0.2s ease;
max-width: 100%; // 限制最大宽度
overflow: hidden; // 隐藏溢出内容
box-sizing: border-box; // 包含padding和border
&:hover {
background: #f3f4f6;
@@ -1669,6 +1679,8 @@ export default {
border-radius: 6px;
border: 1px solid rgba(102, 126, 234, 0.1);
transition: all 0.2s ease;
max-width: 100%; // 限制最大宽度
overflow: hidden; // 隐藏溢出内容
&:hover {
background: linear-gradient(135deg, #f0f4ff 0%, #e8f0ff 100%);
@@ -1688,6 +1700,7 @@ export default {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
min-width: 0; // 关键允许flex子项缩小到0
&:hover {
color: #5568d3;
@@ -2152,11 +2165,13 @@ button {
}
.manage-container {
padding: 16px 8px;
padding: 16px 12px; // 手机端增加左右内边距,与固定区域保持一致
padding-top: 200px; // 手机端为固定区域预留更多空间
// 手机端固定区域增加左右padding
.fixed-section {
left: 12px !important; // 与容器左边距保持一致
right: 12px !important; // 与容器右边距保持一致
padding-left: 12px !important;
padding-right: 12px !important;
}
@@ -2171,14 +2186,16 @@ button {
}
.tool-list {
grid-template-columns: 1fr !important;
grid-template-columns: 1fr !important; // 手机端单列布局,自适应屏幕宽度
.tool-item {
padding: 12px; // 增加padding防止按钮被截断
overflow: visible; // 允许内容超出
width: 100%; // 确保占满容器宽度
box-sizing: border-box; // 包含padding和border在内
.tool-url-row {
padding: 6px 0;
padding: 6px 10px; // 手机端增加左右内边距,确保网址不贴边
}
.tool-footer {