- {{ $t('fileExplorer.selectFileHint') }}
+
📄
+
{{ $t('fileExplorer.selectFileHint') }}
@@ -75,9 +76,9 @@
-
-
-
{{ n }}
+
@@ -116,10 +117,6 @@ const lineCount = computed(() => {
return lines.length
})
-/** 当前激活行(预留:后续可点击行号跳转/选中高亮)。 */
-const activeLine = ref
(null)
-const lineNumRef = ref(null)
-
/** Diff 显示控制 */
const showDiff = ref(false)
const diffContent = ref('')
@@ -398,6 +395,15 @@ onUnmounted(() => {
min-height: 200px;
}
+.preview-placeholder-icon {
+ font-size: 48px;
+ opacity: 0.4;
+}
+
+.preview-placeholder-text {
+ font-size: 13px;
+}
+
.preview-error { color: #e05050; }
.binary-icon { font-size: 32px; opacity: 0.5; }
@@ -423,24 +429,22 @@ onUnmounted(() => {
font-size: 12.5px;
line-height: 1.55;
white-space: pre;
- overflow: auto;
+ overflow: visible;
tab-size: 2;
- flex: 1;
min-width: 0;
- min-height: 0;
}
.preview-code code { font-family: inherit; }
-/* 行号 + 代码并排容器 */
-.preview-code-wrap {
+/* 行号 + 代码共享同一个滚动容器 */
+.preview-code-scroll {
display: flex;
- overflow: hidden;
+ flex: 1;
min-height: 0;
- flex: 1 1 0;
+ overflow: auto;
}
-/* 行号列 */
+/* 行号列 — sticky 固定在左侧,跟随滚动容器一起滚 */
.preview-line-numbers {
flex-shrink: 0;
padding: 14px 0;
@@ -449,13 +453,16 @@ onUnmounted(() => {
background: rgba(255, 255, 255, 0.03);
border-right: 0.5px solid var(--df-border);
user-select: none;
- overflow: hidden;
+ position: sticky;
+ left: 0;
+ z-index: 1;
+ align-self: flex-start;
}
.preview-line-num {
padding: 0 10px 0 8px;
font-family: var(--df-font-mono, 'Cascadia Code', Consolas, monospace);
- font-size: 12px;
+ font-size: 12.5px;
line-height: 1.55;
color: var(--df-text-dim);
opacity: 0.5;
diff --git a/src/components/project/GitChanges.vue b/src/components/project/GitChanges.vue
index 0896be3..31a012d 100644
--- a/src/components/project/GitChanges.vue
+++ b/src/components/project/GitChanges.vue
@@ -7,7 +7,9 @@
{{ gitStatus?.changed_files.length ?? 0 }} {{ $t('gitChanges.changedFiles') }}
-
+
@@ -474,6 +476,25 @@ watch(() => props.moduleId, loadStatus, { immediate: true })
}
.gc-load-more:hover { background: rgba(255,255,255,0.04); }
+/* 骨架屏 */
+.gc-skeleton {
+ padding: 14px;
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+.gc-skeleton-row {
+ height: 24px;
+ border-radius: 4px;
+ background: linear-gradient(90deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 100%);
+ background-size: 200% 100%;
+ animation: gc-shimmer 1.5s infinite linear;
+}
+@keyframes gc-shimmer {
+ 0% { background-position: 200% 0; }
+ 100% { background-position: -200% 0; }
+}
+
/* 通用 */
.gc-loading, .gc-empty {
display: flex; justify-content: center; align-items: center;
diff --git a/src/views/ProjectDetail.vue b/src/views/ProjectDetail.vue
index 0ff91da..20f5f88 100644
--- a/src/views/ProjectDetail.vue
+++ b/src/views/ProjectDetail.vue
@@ -38,27 +38,7 @@
-
-
+