Skip to content

feat (core): 拆分 Modal 为独立组件 #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Aug 10, 2025
Merged

feat (core): 拆分 Modal 为独立组件 #10

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
14f0b6c
feat (core): 拆分 Modal 为独立组件
qianmoQ Aug 10, 2025
b5d89a1
fix (core): 修复 Toast 展示窗口优先性
qianmoQ Aug 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 7 additions & 29 deletions .github/workflows/docs.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,52 +1,30 @@
name: Publish Docs
name: Publish docs via GitHub Pages

on:
push:
pull_request:
types: [closed]
workflow_dispatch:

jobs:
test:
deploy:
runs-on: ubuntu-latest
strategy:
matrix:
node-version: [ 18.x ]

steps:
- uses: actions/checkout@v3
with:
fetch-depth: 0

- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v3
with:
node-version: ${{ matrix.node-version }}

- name: Install pnpm
uses: pnpm/action-setup@v2
with:
version: 8

- name: Get pnpm store directory
shell: bash
run: |
echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV

- uses: actions/cache@v3
name: Setup pnpm cache
with:
path: ${{ env.STORE_PATH }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-pnpm-store-

- name: Install dependencies
run: pnpm install

- name: Link package globally
run: |
pnpm link --global
pnpm link --global pageforge
run: npm install pageforge -g

- name: Test build command
- name: Build
run: |
cd docs
pageforge build
Expand Down
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,3 +25,4 @@ dist-ssr
pnpm-lock.yaml
*.csv
*.json
!config*.json
18 changes: 18 additions & 0 deletions config/config.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
{
"log_directory": null,
"auto_clear_logs": true,
"keep_log_days": 30,
"theme": "system",
"plugins": [
{
"enabled": true,
"execute_home": null,
"extensions": [],
"language": "python2",
"before_compile": null,
"after_compile": null,
"run_command": null,
"template": null
}
]
}
34 changes: 8 additions & 26 deletions src/components/About.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,6 @@
<template>
<div class="fixed inset-0 backdrop-blur-sm bg-white/20 dark:bg-gray-900/20 flex items-center justify-center z-50 transition-all duration-300 ease-out"
:class="{ 'opacity-0': !isVisible, 'opacity-100': isVisible }"
@click.self="$event.preventDefault()">
<div
class="bg-white/95 dark:bg-gray-800/95 backdrop-blur-md rounded-xl shadow-2xl w-4xl p-6 transform transition-all duration-300 ease-out border border-white/20 dark:border-gray-700/30"
:class="{
'scale-95 opacity-0 translate-y-4': !isVisible,
'scale-100 opacity-100 translate-y-0': isVisible
}">

<div class="flex items-center justify-between mb-6">
<h2 class="text-xl font-bold text-gray-900 dark:text-white">关于 CodeForge</h2>
<!-- 关闭按钮 -->
<div class="flex justify-end mb-4">
<button
class="text-gray-400 hover:cursor-pointer dark:hover:text-gray-200 transition-all duration-200 hover:scale-110 rounded-full p-1 hover:bg-gray-300 dark:hover:bg-gray-700"
@click="closeAbout">
<X class="w-5 h-5"></X>
</button>
</div>
</div>

<Modal v-model:show="isVisible" title="关于 CodeForge" size="3xl" :close-on-backdrop="false" :close-on-esc="false" @close="closeAbout">
<div class="space-y-6">
<!-- 应用图标和标题 -->
<div class="text-center mb-6">
<div
Expand Down Expand Up @@ -76,22 +56,24 @@
</span>
</div>
</div>
</div>

<template #footer>
<!-- 底部信息 -->
<div class="border-t border-gray-200/50 dark:border-gray-600/50 pt-4 transition-all duration-600 delay-600">
<div class="border-gray-200/50 dark:border-gray-600/50 pt-4 transition-all duration-600 delay-600">
<p class="text-xs text-center text-gray-500 dark:text-gray-400">
© 2025 Devlive Community. 专为开发者打造的代码执行工具
</p>
</div>
</div>
</div>
</template>
</Modal>
</template>

<script setup lang="ts">
import { nextTick, onMounted, ref, watch } from 'vue'
import { invoke } from '@tauri-apps/api/core'
import { open } from '@tauri-apps/plugin-shell'
import { X } from 'lucide-vue-next'
import Modal from '../ui/Modal.vue'

interface AppInfo
{
Expand Down
190 changes: 86 additions & 104 deletions src/components/Settings.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,132 +1,114 @@
<template>
<div class="fixed inset-0 backdrop-blur-sm bg-white/20 dark:bg-gray-900/20 flex items-center justify-center z-50 transition-all duration-300 ease-out"
:class="{ 'opacity-0': !isVisible, 'opacity-100': isVisible }">
<div
class="bg-white/95 dark:bg-gray-800/95 backdrop-blur-md rounded-xl shadow-2xl w-6xl h-screen p-6 transform transition-all duration-300 ease-out border border-white/20 dark:border-gray-700/30 max-h-[80vh] overflow-y-auto"
:class="{
'scale-95 opacity-0 translate-y-4': !isVisible,
'scale-100 opacity-100 translate-y-0': isVisible
}">

<!-- 头部 -->
<div class="flex items-center justify-between mb-6">
<h2 class="text-xl font-bold text-gray-900 dark:text-white">设置</h2>
<button
@click="closeSettings"
class="text-gray-400 hover:cursor-pointer hover:text-gray-600 dark:hover:text-gray-200 transition-all duration-200 hover:scale-110 rounded-full p-1 hover:bg-gray-200 dark:hover:bg-gray-700">
<X class="w-5 h-5"/>
</button>
</div>

<!-- 日志设置 -->
<div class="mb-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4 flex items-center">
<FileText class="w-5 h-5 mr-2"/>
日志设置
</h3>

<div class="space-y-4">
<!-- 当前日志目录 -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
当前日志目录
</label>
<div class="bg-gray-50 dark:bg-gray-700 rounded-lg p-3 text-sm text-gray-600 dark:text-gray-400 font-mono">
{{ currentLogDir || '加载中...' }}
</div>
</div>

<!-- 修改日志目录 -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
选择新的日志目录
</label>
<div class="flex gap-2">
<input v-model="newLogDir"
type="text"
placeholder="选择或输入日志目录路径"
class="flex-1 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent text-sm"
readonly/>

<Button type="primary"
:icon-only="true"
:icon="Folder"
@click="selectLogDirectory">
</Button>
</div>
<Modal v-model:show="isVisible" title="设置" size="4xl" :close-on-backdrop="false" :close-on-esc="false" @close="closeSettings">
<!-- 日志设置 -->
<div class="mb-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4 flex items-center">
<FileText class="w-5 h-5 mr-2"/>
日志设置
</h3>

<div class="space-y-4">
<!-- 当前日志目录 -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
当前日志目录
</label>
<div class="bg-gray-50 dark:bg-gray-700 rounded-lg p-3 text-sm text-gray-600 dark:text-gray-400 font-mono">
{{ currentLogDir || '加载中...' }}
</div>
</div>

<!-- 操作按钮 -->
<div class="flex gap-3 pt-0.5">
<Button @click="applyLogDirChange"
:disabled="!newLogDir || newLogDir === currentLogDir"
type="secondary">
应用更改
</Button>
<Button @click="openLogDirectory" type="secondary">
打开日志目录
</Button>
<Button @click="resetLogDirectory"
class="cursor-pointer px-4 py-2 bg-orange-500 hover:bg-orange-600 text-white text-sm font-medium rounded-md transition-colors">
重置为默认
<!-- 修改日志目录 -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
选择新的日志目录
</label>
<div class="flex gap-2">
<input v-model="newLogDir"
type="text"
placeholder="选择或输入日志目录路径"
class="flex-1 px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent text-sm"
readonly/>

<Button type="primary"
:icon-only="true"
:icon="Folder"
@click="selectLogDirectory">
</Button>
</div>
</div>

<!-- 操作按钮 -->
<div class="flex gap-3 pt-0.5">
<Button @click="applyLogDirChange"
:disabled="!newLogDir || newLogDir === currentLogDir"
type="secondary">
应用更改
</Button>
<Button @click="openLogDirectory" type="secondary">
打开日志目录
</Button>
<Button @click="resetLogDirectory"
class="cursor-pointer px-4 py-2 bg-orange-500 hover:bg-orange-600 text-white text-sm font-medium rounded-md transition-colors">
重置为默认
</Button>
</div>

<!-- 日志文件列表 -->
<div v-if="logFiles.length > 0">
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
最近的日志文件
</label>
<div class="bg-gray-50 dark:bg-gray-700 rounded-lg p-3 max-h-32 overflow-y-auto">
<div v-for="file in logFiles.slice(0, 5)" :key="file"
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"
@click="openLogFile(file)">
{{ file }}
</div>
<!-- 日志文件列表 -->
<div v-if="logFiles.length > 0">
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
最近的日志文件
</label>
<div class="bg-gray-50 dark:bg-gray-700 rounded-lg p-3 max-h-32 overflow-y-auto">
<div v-for="file in logFiles.slice(0, 5)" :key="file"
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"
@click="openLogFile(file)">
{{ file }}
</div>
</div>
</div>
</div>
</div>

<!-- 日志管理 -->
<div class="mb-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4 flex items-center">
<Settings2 class="w-5 h-5 mr-2"/>
日志管理
</h3>

<div class="space-y-4">
<!-- 清理旧日志 -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
自动清理日志
</label>
<div class="flex items-center gap-3">
<Select v-model="keepDays"
class="w-36"
:options="keepDaysOptions"
placeholder="选择保留天数">
</Select>
<Button type="danger" @click="clearLogs">
立即清理
</Button>
</div>
<!-- 日志管理 -->
<div class="mb-6">
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4 flex items-center">
<Settings2 class="w-5 h-5 mr-2"/>
日志管理
</h3>

<div class="space-y-4">
<!-- 清理旧日志 -->
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
自动清理日志
</label>
<div class="flex items-center gap-3">
<Select v-model="keepDays"
class="w-36"
:options="keepDaysOptions"
placeholder="选择保留天数">
</Select>
<Button type="danger" @click="clearLogs">
立即清理
</Button>
</div>
</div>
</div>
</div>
</div>
</Modal>
</template>

<script setup lang="ts">
import { nextTick, onMounted, ref } from 'vue'
import { invoke } from '@tauri-apps/api/core'
import { open as openDialog } from '@tauri-apps/plugin-dialog'
import { openPath } from '@tauri-apps/plugin-opener'
import { FileText, Folder, Settings2, X } from 'lucide-vue-next'
import { FileText, Folder, Settings2 } from 'lucide-vue-next'
import Select from '../ui/Select.vue'
import { useToast } from '../plugins/toast'
import Button from '../ui/Button.vue'
import Modal from '../ui/Modal.vue'

const toast = useToast()
const isVisible = ref(false)
Expand Down
2 changes: 1 addition & 1 deletion src/components/Toast.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<template>
<Teleport to="body">
<div class="fixed bottom-4 right-4 z-50 space-y-2 w-96">
<div class="fixed z-[99999] bottom-4 right-4 space-y-2 w-96">
<TransitionGroup name="toast"
enter-active-class="transition-all duration-300 ease-out"
enter-from-class="transform translate-x-full opacity-0"
Expand Down
Loading
Loading