Skip to content

Commit 3b25246

Browse files
qianmoQqianmoQ
authored
Merge pull request #40 from qianmoQ/dev-25.0.2
feat (ui): 增加 Label 组件
2 parents aa001eb + 49d2cce commit 3b25246

8 files changed

Lines changed: 1109 additions & 359 deletions

File tree

‎src/components/setting/Editor.vue‎

Lines changed: 13 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,20 @@
11
<template>
22
<div v-if="editorConfig" class="space-y-2">
3-
<div>
4-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
5-
是否使用 tab 缩进
6-
</label>
7-
<div class="flex gap-2">
8-
<Switch v-model="editorConfig.indent_with_tab"/>
9-
</div>
10-
</div>
3+
<Label label="是否使用 Tab 缩进">
4+
<Switch v-model="editorConfig.indent_with_tab"/>
5+
</Label>
116

12-
<div>
13-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
14-
缩进空格数
15-
</label>
16-
<div class="flex gap-2">
17-
<Number v-model="editorConfig.tab_size" :min="1" :max="8" placeholder="缩进空格数"/>
18-
</div>
19-
</div>
7+
<Label label="缩进空格数">
8+
<Number v-model="editorConfig.tab_size" :min="1" :max="8" placeholder="缩进空格数"/>
9+
</Label>
2010

21-
<div>
22-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
23-
字体大小
24-
</label>
25-
<div class="flex gap-2">
26-
<Number v-model="editorConfig.font_size" :min="1" :max="30" placeholder="字体大小"/>
27-
</div>
28-
</div>
11+
<Label label="字体大小">
12+
<Number v-model="editorConfig.font_size" :min="1" :max="30" placeholder="字体大小"/>
13+
</Label>
2914

30-
<div>
31-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
32-
编辑器主题
33-
</label>
34-
<div class="flex gap-2">
35-
<Select v-model="editorConfig.theme" class="w-1/4" placeholder="选择编辑器主题" :options="themeOptions"/>
36-
</div>
37-
</div>
15+
<Label label="编辑器主题">
16+
<Select v-model="editorConfig.theme" class="w-1/4" placeholder="选择编辑器主题" :options="themeOptions"/>
17+
</Label>
3818
</div>
3919
</template>
4020

@@ -44,6 +24,7 @@ import { useEditorConfig } from '../../composables/useEditorConfig'
4424
import Select from '../../ui/Select.vue'
4525
import Switch from '../../ui/Switch.vue'
4626
import Number from '../../ui/Number.vue'
27+
import Label from '../../ui/Label.vue'
4728
4829
const emit = defineEmits<{
4930
'settings-changed': [config: any]

‎src/components/setting/General.vue‎

Lines changed: 30 additions & 153 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,13 @@
88
</h3>
99

1010
<div class="space-y-4">
11-
<!-- 当前日志目录 -->
12-
<div>
13-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
14-
当前日志目录
15-
</label>
11+
<Label label="当前日志目录">
1612
<div class="bg-gray-50 dark:bg-gray-700 rounded-lg p-3 text-sm text-gray-600 dark:text-gray-400 font-mono">
1713
{{ currentLogDir || '加载中...' }}
1814
</div>
19-
</div>
15+
</Label>
2016

21-
<!-- 修改日志目录 -->
22-
<div>
23-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
24-
选择新的日志目录
25-
</label>
17+
<Label label="选择新的日志目录">
2618
<div class="flex gap-2">
2719
<input v-model="newLogDir"
2820
type="text"
@@ -36,7 +28,7 @@
3628
@click="selectLogDirectory">
3729
</Button>
3830
</div>
39-
</div>
31+
</Label>
4032

4133
<!-- 操作按钮 -->
4234
<div class="flex gap-3 pt-0.5">
@@ -54,19 +46,15 @@
5446
</Button>
5547
</div>
5648

57-
<!-- 日志文件列表 -->
58-
<div v-if="logFiles.length > 0">
59-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
60-
最近的日志文件
61-
</label>
49+
<Label v-if="logFiles.length > 0" label="最近的日志文件">
6250
<div class="bg-gray-50 dark:bg-gray-700 rounded-lg p-3 max-h-32 overflow-y-auto">
6351
<div v-for="file in logFiles.slice(0, 5)" :key="file"
6452
class="text-sm text-gray-600 dark:text-gray-400 font-mono py-1 hover:text-blue-600 dark:hover:text-blue-400 cursor-pointer"
6553
@click="openLogFile(file)">
6654
{{ file }}
6755
</div>
6856
</div>
69-
</div>
57+
</Label>
7058
</div>
7159
</div>
7260

@@ -78,11 +66,7 @@
7866
</h3>
7967

8068
<div class="space-y-4">
81-
<!-- 清理旧日志 -->
82-
<div>
83-
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
84-
自动清理日志
85-
</label>
69+
<Label label="清理日志">
8670
<div class="flex items-center gap-3">
8771
<Select v-model="keepDays"
8872
class="w-36"
@@ -93,151 +77,44 @@
9377
立即清理
9478
</Button>
9579
</div>
96-
</div>
80+
</Label>
9781
</div>
9882
</div>
9983
</div>
10084
</template>
10185

10286
<script setup lang="ts">
103-
import { onMounted, ref } from 'vue'
104-
import { invoke } from '@tauri-apps/api/core'
105-
import { open as openDialog } from '@tauri-apps/plugin-dialog'
106-
import { openPath } from '@tauri-apps/plugin-opener'
87+
import { onMounted } from 'vue'
10788
import { FileText, Folder, Settings2 } from 'lucide-vue-next'
10889
import Select from '../../ui/Select.vue'
10990
import Button from '../../ui/Button.vue'
110-
import { useToast } from '../../plugins/toast'
91+
import Label from '../../ui/Label.vue'
92+
import { useLogDirectory } from '../../composables/useLogDirectory'
93+
import { useLogCleanup } from '../../composables/useLogCleanup'
11194
11295
const emit = defineEmits<{
11396
'settings-changed': [type: string, value: any]
11497
'error': [message: string]
11598
}>()
11699
117-
const toast = useToast()
118-
119-
const currentLogDir = ref('')
120-
const newLogDir = ref('')
121-
const logFiles = ref<string[]>([])
122-
const keepDays = ref(30)
123-
124-
const keepDaysOptions = [
125-
{ label: '保留 1 天', value: 1 },
126-
{ label: '保留 7 天', value: 7 },
127-
{ label: '保留 14 天', value: 14 },
128-
{ label: '保留 30 天', value: 30 },
129-
{ label: '保留 90 天', value: 90 }
130-
]
131-
132-
const loadLogDirectory = async () => {
133-
try {
134-
const logDir = await invoke<string>('get_log_directory')
135-
currentLogDir.value = logDir
136-
newLogDir.value = logDir
137-
}
138-
catch (error) {
139-
console.error('Failed to get current log directory:', error)
140-
toast.error('获取日志目录失败 - 错误信息: ' + error)
141-
emit('error', '获取日志目录失败')
142-
}
143-
}
144-
145-
const loadLogFiles = async () => {
146-
try {
147-
logFiles.value = await invoke<string[]>('get_log_files')
148-
}
149-
catch (error) {
150-
console.error('Failed to get log files:', error)
151-
emit('error', '获取日志文件列表失败')
152-
}
153-
}
154-
155-
const selectLogDirectory = async () => {
156-
try {
157-
const selected = await openDialog({
158-
directory: true,
159-
multiple: false,
160-
title: '选择日志目录'
161-
})
162-
163-
if (selected) {
164-
newLogDir.value = selected as string
165-
}
166-
}
167-
catch (error) {
168-
console.error('Failed to select directory:', error)
169-
emit('error', '选择目录失败')
170-
}
171-
}
172-
173-
const applyLogDirChange = async () => {
174-
try {
175-
await invoke('set_log_directory', { path: newLogDir.value })
176-
currentLogDir.value = newLogDir.value
177-
await loadLogFiles()
178-
toast.success('日志目录已更新')
179-
emit('settings-changed', 'logDirectory', newLogDir.value)
180-
}
181-
catch (error) {
182-
console.error('Failed to set log directory:', error)
183-
const errorMessage = '日志目录更新失败, 错误信息: ' + error
184-
toast.error(errorMessage)
185-
emit('error', errorMessage)
186-
}
187-
}
188-
189-
const openLogDirectory = async () => {
190-
try {
191-
await openPath(currentLogDir.value)
192-
}
193-
catch (error) {
194-
console.error('Failed to open log directory:', error)
195-
emit('error', '打开日志目录失败')
196-
}
197-
}
198-
199-
const resetLogDirectory = async () => {
200-
try {
201-
await invoke('reset_log_directory')
202-
await loadLogDirectory()
203-
await loadLogFiles()
204-
toast.success('日志目录已重置为默认')
205-
emit('settings-changed', 'logDirectory', 'reset')
206-
}
207-
catch (error) {
208-
console.error('Failed to reset log directory:', error)
209-
const errorMessage = '日志目录重置失败, 错误信息: ' + error
210-
toast.error(errorMessage)
211-
emit('error', errorMessage)
212-
}
213-
}
214-
215-
const openLogFile = async (filename: string) => {
216-
try {
217-
const logPath = `${ currentLogDir.value }/${ filename }`
218-
await openPath(logPath)
219-
}
220-
catch (error) {
221-
console.error('Failed to open log file:', error)
222-
toast.error('打开日志文件失败 - 错误信息: ' + error)
223-
emit('error', '打开日志文件失败')
224-
}
225-
}
226-
227-
const clearLogs = async () => {
228-
try {
229-
await invoke('clear_logs', { keepDays: parseInt(keepDays.value.toString()) })
230-
await loadLogFiles()
231-
toast.success(`已清理 ${ keepDays.value } 天前的日志`)
232-
emit('settings-changed', 'logCleanup', keepDays.value)
233-
}
234-
catch (error) {
235-
console.error('Failed to clear old logs:', error)
236-
const errorMessage = '清理日志失败, 错误信息: ' + error
237-
toast.error(errorMessage)
238-
emit('error', errorMessage)
239-
}
240-
}
100+
const {
101+
currentLogDir,
102+
newLogDir,
103+
logFiles,
104+
loadLogDirectory,
105+
loadLogFiles,
106+
selectLogDirectory,
107+
applyLogDirChange,
108+
openLogDirectory,
109+
resetLogDirectory,
110+
openLogFile
111+
} = useLogDirectory(emit)
112+
113+
const {
114+
keepDays,
115+
keepDaysOptions,
116+
clearLogs
117+
} = useLogCleanup(emit, loadLogFiles)
241118
242119
// 暴露方法给父组件
243120
defineExpose({

0 commit comments

Comments
 (0)