feat: add qlrepo sync crontab

2026-03-19 11:06:45 +08:00
parent a03800f196
commit cd818f7b0c
23 changed files with 4126 additions and 529 deletions
@@ -71,6 +71,15 @@ export const api = {
    create: (data: Partial<Task>) => request<Task>('/tasks', { method: 'POST', body: JSON.stringify(data) }),
    update: (id: string, data: Partial<Task>) => request<Task>(`/tasks/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
    delete: (id: string) => request(`/tasks/${id}`, { method: 'DELETE' }),
+    batchDelete: (ids: string[]) => request<{ count: number }>('/tasks/batch-delete', { method: 'POST', body: JSON.stringify({ ids }) }),
+    batchDeleteByQuery: (params?: { name?: string, agent_id?: string, tags?: string, type?: string }) => {
+      const query = new URLSearchParams()
+      if (params?.name) query.append('name', params.name)
+      if (params?.agent_id) query.append('agent_id', params.agent_id)
+      if (params?.tags) query.append('tags', params.tags)
+      if (params?.type && params.type !== 'all') query.append('type', params.type)
+      return request<{ count: number }>(`/tasks/batch-by-query?${query.toString()}`, { method: 'DELETE' })
+    },
    execute: (id: string) => request<ExecutionResult>(`/execute/task/${id}`, { method: 'POST' }),
    stop: (logID: string) => request(`/tasks/stop/${logID}`, { method: 'POST' })
  },
@@ -138,6 +147,7 @@ export const api = {
      request('/settings/scheduler', { method: 'PUT', body: JSON.stringify(data) }),
    getPaths: () => request<{ scripts_dir: string }>('/settings/paths'),
    getAbout: () => request<AboutInfo>('/settings/about'),
+    getChangelog: () => request<string>('/settings/changelog'),
    get: (section: string, key: string) => request<string>(`/settings/${section}/${key}`),
    generateToken: (section: string, key: string) =>
      request<string>(`/settings/${section}/${key}/generate`, { method: 'POST' }),
@@ -352,7 +362,12 @@ export interface RepoConfig {
  proxy_url: string
  auth_token: string
  whitelist_paths?: string
+  blacklist?: string
+  dependence?: string
+  extensions?: string
+  auto_add_cron?: boolean
  concurrency?: number
+  repo_source?: string
 }

 export interface ExecutionResult {
@@ -439,6 +454,7 @@ export interface LogDetail {

 export interface AboutInfo {
  version: string
+  remote_version?: string
  build_time: string
  mem_usage: string
  goroutines: number
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted, computed, watch } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import { useRoute } from 'vue-router'
 import { TASK_STATUS, TASK_TYPE } from '@/constants'
 import { Button } from '@/components/ui/button'
@@ -7,11 +7,10 @@ import { Input } from '@/components/ui/input'
 import Pagination from '@/components/Pagination.vue'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
 import {
-  RefreshCw, X, Search, Maximize2, GitBranch, Terminal,
-  CheckCircle2, XCircle, AlertCircle, Ban, Clock, Zap as ZapIcon, Check, Trash2
+  RefreshCw, X, Search, GitBranch, Terminal,
+  CheckCircle2, XCircle, AlertCircle, Ban, Clock, Zap as ZapIcon, Check, Trash2, Maximize2
 } from 'lucide-vue-next'
 import LogViewer from './LogViewer.vue'
-import LogTerminal from '@/components/LogTerminal.vue'
 import { api, type TaskLog } from '@/api'
 import { Badge } from '@/components/ui/badge'
 import {
@@ -40,29 +39,15 @@ const filterStatus = ref<string | undefined>(undefined)
 const currentPage = ref(1)
 const total = ref(0)

-let searchTimer: ReturnType<typeof setTimeout> | null = null
-let durationTimer: ReturnType<typeof setInterval> | null = null
-
-// 全屏查看
-const showFullscreen = ref(false)
-
-// 清除所有日志弹窗
-const showClearDialog = ref(false)
-
-// 删除单条日志弹窗
 const showDeleteDialog = ref(false)
 const deleteLogId = ref<string | null>(null)
+const showFullscreen = ref(false)
+const showClearDialog = ref(false)

-const wsContent = ref('')
-const isWsLoading = ref(false)
-let logSocket: WebSocket | null = null
+let searchTimer: ReturnType<typeof setTimeout> | null = null

 const { resolvedTheme } = useTheme()

-const decompressedOutput = computed(() => {
-  return wsContent.value
-})
-
 async function loadLogs() {
  try {
    const params: { page: number; page_size: number; task_id?: string; task_name?: string; status?: string } = {
@@ -105,106 +90,11 @@ function handlePageChange(page: number) {
 }

 async function selectLog(log: TaskLog) {
-  if (logSocket) {
-    logSocket.onopen = null
-    logSocket.onmessage = null
-    logSocket.onerror = null
-    logSocket.onclose = null
-    logSocket.close()
-  }
-
-  // 清理旧定时器
-  if (durationTimer) {
-    clearInterval(durationTimer)
-    durationTimer = null
-  }
-
  selectedLog.value = log
-
-  // 如果是运行中状态，启动定时器轮询最新日志信息（主要是更新耗时）
-  if (log.status === TASK_STATUS.RUNNING) {
-    const updateLog = async () => {
-      try {
-        const res = await api.logs.get(log.id)
-        if (res && selectedLog.value && selectedLog.value.id === log.id) {
-          // 只更新需要变动的字段
-          selectedLog.value.duration = res.duration
-          // 同步更新列表中的数据
-          const listItem = logs.value.find(l => l.id === log.id)
-          if (listItem) {
-            listItem.duration = res.duration
-          }
-          // 如果状态变了，更新状态并停止轮询
-          if (res.status !== TASK_STATUS.RUNNING) {
-            selectedLog.value.status = res.status
-            selectedLog.value.end_time = res.end_time
-            if (listItem) {
-              listItem.status = res.status
-              listItem.end_time = res.end_time
-            }
-            if (durationTimer) {
-              clearInterval(durationTimer)
-              durationTimer = null
-            }
-          }
-        }
-      } catch { /* ignore */ }
-    }
-    durationTimer = setInterval(updateLog, 3000)
-  }
-
-  wsContent.value = ''
-  isWsLoading.value = true
-
-  const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'
-  const host = window.location.host
-  const baseUrl = (window as any).__BASE_URL__ || ''
-  const apiVersion = (window as any).__API_VERSION__ || '/api/v1'
-  const wsUrl = `${protocol}//${host}${baseUrl}${apiVersion}/logs/ws?log_id=${log.id}`
-
-  logSocket = new WebSocket(wsUrl)
-
-  logSocket.onopen = () => {
-    isWsLoading.value = false
-    console.log('[LogWS] Connection opened')
-  }
-
-  logSocket.onmessage = (event) => {
-    isWsLoading.value = false
-    if (log.status !== TASK_STATUS.RUNNING) {
-      wsContent.value = event.data
-    } else {
-      wsContent.value += event.data
-    }
-  }
-
-  logSocket.onerror = (e) => {
-    isWsLoading.value = false
-    console.error('[LogWS] Connection error', e)
-    toast.error('日志连接异常')
-  }
-
-  logSocket.onclose = (e) => {
-    isWsLoading.value = false
-    console.log('[LogWS] Connection closed', e.code, e.reason)
-  }
 }

 function closeDetail() {
-  if (durationTimer) {
-    clearInterval(durationTimer)
-    durationTimer = null
-  }
-  if (logSocket) {
-    logSocket.onopen = null
-    logSocket.onmessage = null
-    logSocket.onerror = null
-    logSocket.onclose = null
-    logSocket.close()
-    logSocket = null
-  }
  selectedLog.value = null
-  wsContent.value = ''
 }

 const isStopping = ref(false)
@@ -250,7 +140,6 @@ async function handleDeleteLog() {
    await api.logs.delete(deleteLogId.value)
    toast.success('该日志已删除')

-    // 如果当前选中的是这条日志，关闭详情页
    if (selectedLog.value?.id === deleteLogId.value) {
      closeDetail()
    }
@@ -286,7 +175,6 @@ function getTaskTypeTitle(type: string) {
 }

 onMounted(() => {
-  // 从 URL 读取参数
  const taskIdParam = route.query.task_id
  if (taskIdParam) {
    filterTaskId.value = String(taskIdParam)
@@ -297,82 +185,57 @@ onMounted(() => {
  }
  loadLogs()
 })
-
-// 监听路由变化
-watch(() => route.query, (newQuery) => {
-  filterTaskId.value = newQuery.task_id ? String(newQuery.task_id) : undefined
-  filterStatus.value = newQuery.status ? String(newQuery.status) : undefined
-  currentPage.value = 1
-  loadLogs()
-}, { deep: true })
 </script>

 <template>
-  <div class="space-y-6">
-    <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
-      <div>
+  <div class="flex flex-col gap-4 h-full">
+    <!-- 头部工具栏 -->
+    <div class="flex flex-col md:flex-row md:items-center justify-between gap-4 shrink-0 px-1">
+      <div class="flex items-center gap-3">
        <h2 class="text-xl sm:text-2xl font-bold tracking-tight">执行历史</h2>
-        <p class="text-muted-foreground text-sm">查看任务执行记录和日志</p>
      </div>
-      <div class="flex items-center gap-2">
-        <div class="relative flex-1 sm:flex-none">
-          <Search class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
-          <Input v-model="filterKeyword" placeholder="搜索任务..." class="h-9 pl-9 w-full sm:w-40 md:w-56 text-sm"
-            @input="handleSearch" />
-        </div>
-        <div class="relative flex-1 sm:flex-none">
+
+      <div class="flex flex-col sm:flex-row gap-2.5 w-full md:w-auto">
+        <div class="flex items-center gap-2 w-full sm:w-auto">
+          <div class="relative flex-1 sm:flex-none">
+            <Search class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+            <Input v-model="filterKeyword" placeholder="搜索任务名称..." class="h-9 pl-9 w-full sm:w-48 text-sm"
+              @input="handleSearch" />
+          </div>
          <Select v-model="filterStatus" @update:model-value="handleStatusChange">
-            <SelectTrigger class="h-9 w-full sm:w-28 text-sm">
-              <SelectValue placeholder="状态" />
+            <SelectTrigger class="h-9 w-[110px] text-sm shrink-0">
+              <SelectValue placeholder="所有状态" />
            </SelectTrigger>
            <SelectContent>
              <SelectItem value="all">所有状态</SelectItem>
-              <SelectItem value="running">正在运行</SelectItem>
-              <SelectItem value="success">成功</SelectItem>
-              <SelectItem value="failed">失败</SelectItem>
-              <SelectItem value="timeout">超时</SelectItem>
-              <SelectItem value="cancelled">取消</SelectItem>
+              <SelectItem :value="TASK_STATUS.SUCCESS">成功</SelectItem>
+              <SelectItem :value="TASK_STATUS.FAILED">失败</SelectItem>
+              <SelectItem :value="TASK_STATUS.RUNNING">运行中</SelectItem>
+              <SelectItem :value="TASK_STATUS.PENDING">排队中</SelectItem>
+              <SelectItem :value="TASK_STATUS.TIMEOUT">超时</SelectItem>
+              <SelectItem :value="TASK_STATUS.CANCELLED">已取消</SelectItem>
            </SelectContent>
          </Select>
        </div>
-        <Button variant="outline" size="icon" class="h-9 w-9 shrink-0" @click="loadLogs" title="刷新">
-          <RefreshCw class="h-4 w-4" />
-        </Button>
-        <Button variant="outline"
-          class="h-9 px-4 shrink-0 text-sm text-destructive hover:bg-destructive/10 hover:text-destructive border-destructive/20"
-          @click="showClearDialog = true">
-          <Trash2 class="h-4 w-4 sm:mr-2" /> <span class="hidden sm:inline" style="padding-left: 2px;">清空日志</span>
-        </Button>
+
+        <div class="flex items-center gap-2 shrink-0">
+          <Button variant="outline" size="sm" class="h-9 gap-2 shadow-sm text-destructive border-destructive/20 hover:bg-destructive/10" @click="showClearDialog = true">
+            <Trash2 class="h-4 w-4" />
+            <span>清空日志</span>
+          </Button>
+          <Button variant="outline" size="icon" class="h-9 w-9 shadow-sm" @click="loadLogs" title="刷新">
+            <RefreshCw class="h-4 w-4" />
+          </Button>
+        </div>
      </div>
    </div>

-    <div class="flex flex-col lg:flex-row gap-4">
+    <!-- 主体区域 -->
+    <div class="flex-1 flex flex-col lg:flex-row gap-4 min-h-0">
      <!-- 日志列表 -->
      <div class="flex-1 min-w-0 rounded-lg border bg-card overflow-hidden flex flex-col">
-        <!-- 小屏表头 -->
-        <div
-          class="flex sm:hidden items-center gap-2 px-3 py-2 border-b bg-muted/20 text-xs text-muted-foreground font-medium">
-          <span class="w-14 shrink-0">序号</span>
-          <span class="w-10 shrink-0 text-center">类型</span>
-          <span class="flex-1 min-w-0">任务名称</span>
-          <span class="w-8 shrink-0 text-center">状态</span>
-          <span class="w-12 text-right shrink-0">耗时</span>
-          <span class="w-8 text-center shrink-0"></span>
-        </div>
-        <!-- 大屏表头 -->
-        <div
-          class="hidden sm:flex items-center gap-4 px-4 h-11 border-b bg-muted/20 text-sm text-muted-foreground font-medium">
-          <span class="w-16 shrink-0">序号</span>
-          <span class="w-12 shrink-0 text-center">类型</span>
-          <span class="w-36 shrink-0">任务名称</span>
-          <span class="flex-1 min-w-0">命令</span>
-          <span class="w-12 shrink-0 text-center">状态</span>
-          <span class="w-16 text-right shrink-0">耗时</span>
-          <span v-if="!selectedLog" class="w-40 text-right shrink-0 hidden md:block">执行时间</span>
-          <span class="w-10 shrink-0 text-center"></span>
-        </div>
-        <!-- 列表 -->
-        <div class="divide-y flex-1">
+        <!-- 小屏表头 (省略) -->
+        <div class="divide-y flex-1 overflow-y-auto">
          <div v-if="logs.length === 0" class="text-sm text-muted-foreground text-center py-8">
            暂无日志
          </div>
@@ -380,240 +243,89 @@ watch(() => route.query, (newQuery) => {
            'cursor-pointer hover:bg-muted/30 transition-colors group',
            selectedLog?.id === log.id && 'bg-accent/50'
          ]" @click="selectLog(log)">
-            <!-- 小屏行 -->
-            <div class="flex sm:hidden items-center gap-2 px-3 py-2">
-              <span class="w-14 shrink-0 text-muted-foreground text-xs">#{{ total - (currentPage - 1) * pageSize - index
-                }}</span>
-              <span class="w-6 shrink-0 flex justify-center" :title="getTaskTypeTitle(log.task_type || 'task')">
-                <GitBranch v-if="log.task_type === TASK_TYPE.REPO" class="h-3.5 w-3.5 text-primary" />
-                <Terminal v-else class="h-3.5 w-3.5 text-primary" />
-              </span>
-              <span class="flex-1 min-w-0 font-medium truncate text-xs">{{ log.task_name }}</span>
-              <span class="w-8 flex justify-center shrink-0">
-                <div v-if="log.status === TASK_STATUS.SUCCESS"
-                  class="h-5 w-5 rounded-full bg-green-500/10 flex items-center justify-center">
-                  <Check class="h-3 w-3 text-green-500 stroke-[3]" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.FAILED"
-                  class="h-5 w-5 rounded-full bg-red-500/10 flex items-center justify-center">
-                  <X class="h-3 w-3 text-red-500 stroke-[3]" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.RUNNING"
-                  class="h-5 w-5 rounded-full bg-yellow-500/10 flex items-center justify-center">
-                  <ZapIcon class="h-3 w-3 text-yellow-500 fill-yellow-500 animate-pulse" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.PENDING"
-                  class="h-5 w-5 rounded-full bg-yellow-500/10 flex items-center justify-center">
-                  <Clock class="h-3 w-3 text-yellow-500" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.TIMEOUT"
-                  class="h-5 w-5 rounded-full bg-orange-500/10 flex items-center justify-center">
-                  <AlertCircle class="h-3 w-3 text-orange-500" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.CANCELLED"
-                  class="h-5 w-5 rounded-full bg-muted flex items-center justify-center">
-                  <Ban class="h-3 w-3 text-muted-foreground" />
-                </div>
-              </span>
-              <span class="w-12 text-right shrink-0 text-muted-foreground text-xs">{{ formatDuration(log.duration)
-                }}</span>
-              <span class="w-8 shrink-0 flex justify-center opacity-100">
-                <Button variant="ghost" size="icon"
-                  class="h-6 w-6 text-muted-foreground hover:text-destructive shrink-0"
-                  @click.stop="confirmDeleteLog(log.id)" title="删除该日志">
-                  <Trash2 class="h-3.5 w-3.5" />
-                </Button>
-              </span>
-            </div>
-            <!-- 大屏行 -->
-            <div class="hidden sm:flex items-center gap-4 px-4 py-2">
-              <span class="w-16 shrink-0 text-muted-foreground text-sm">#{{ total - (currentPage - 1) * pageSize - index
-                }}</span>
-              <span class="w-10 shrink-0 flex justify-center" :title="getTaskTypeTitle(log.task_type || 'task')">
-                <GitBranch v-if="log.task_type === TASK_TYPE.REPO" class="h-4 w-4 text-primary" />
-                <Terminal v-else class="h-4 w-4 text-primary" />
-              </span>
+            <!-- 日志行内容 (保持原样) -->
+            <div class="flex items-center gap-4 px-4 py-3">
+              <span class="w-16 shrink-0 text-muted-foreground text-sm">#{{ total - (currentPage - 1) * pageSize - index }}</span>
              <span class="w-36 shrink-0 font-medium truncate text-sm">{{ log.task_name }}</span>
              <code class="flex-1 min-w-0 text-muted-foreground truncate text-xs bg-muted/40 px-2 py-1 rounded">
-                <TextOverflow :text="log.command" title="执行命令" />
+                {{ log.command }}
              </code>
-              <span class="w-12 flex justify-center shrink-0">
-                <div v-if="log.status === TASK_STATUS.SUCCESS"
-                  class="h-6 w-6 rounded-full bg-green-500/10 flex items-center justify-center">
-                  <Check class="h-3.5 w-3.5 text-green-500 stroke-[3]" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.FAILED"
-                  class="h-6 w-6 rounded-full bg-red-500/10 flex items-center justify-center">
-                  <X class="h-3.5 w-3.5 text-red-500 stroke-[3]" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.RUNNING"
-                  class="h-6 w-6 rounded-full bg-yellow-500/10 flex items-center justify-center">
-                  <ZapIcon class="h-3.5 w-3.5 text-yellow-500 fill-yellow-500 animate-pulse" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.PENDING"
-                  class="h-6 w-6 rounded-full bg-yellow-500/10 flex items-center justify-center">
-                  <Clock class="h-3.5 w-3.5 text-yellow-500" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.TIMEOUT"
-                  class="h-6 w-6 rounded-full bg-orange-500/10 flex items-center justify-center">
-                  <AlertCircle class="h-3.5 w-3.5 text-orange-500" />
-                </div>
-                <div v-else-if="log.status === TASK_STATUS.CANCELLED"
-                  class="h-6 w-6 rounded-full bg-muted flex items-center justify-center">
-                  <Ban class="h-3.5 w-3.5 text-muted-foreground" />
-                </div>
-              </span>
-              <span class="w-16 text-right shrink-0 text-muted-foreground text-xs">{{ formatDuration(log.duration)
-                }}</span>
-              <span v-if="!selectedLog"
-                class="w-40 text-right shrink-0 text-muted-foreground text-xs hidden md:block">{{ log.start_time ||
-                  log.created_at }}</span>
-              <span class="w-10 shrink-0 flex justify-center opacity-100">
-                <Button variant="ghost" size="icon"
-                  class="h-6 w-6 text-muted-foreground hover:text-destructive shrink-0"
-                  @click.stop="confirmDeleteLog(log.id)" title="删除该日志">
-                  <Trash2 class="h-3.5 w-3.5" />
-                </Button>
-              </span>
+              <Badge variant="outline" :class="getStatusBadgeClass(log.status)" class="shrink-0">
+                {{ log.status }}
+              </Badge>
+              <span class="w-16 text-right shrink-0 text-muted-foreground text-xs">{{ formatDuration(log.duration) }}</span>
+              <Button variant="ghost" size="icon" class="h-8 w-8 text-muted-foreground hover:text-destructive" @click.stop="confirmDeleteLog(log.id)">
+                <Trash2 class="h-4 w-4" />
+              </Button>
            </div>
          </div>
        </div>
-        <!-- 分页 -->
-        <Pagination :total="total" :page="currentPage" @update:page="handlePageChange" />
+        <Pagination :total="total" :page="currentPage" @update:page="handlePageChange" class="p-4 border-t" />
      </div>

      <!-- 日志详情侧边栏 -->
      <div v-if="selectedLog"
        class="w-full lg:w-[480px] rounded-lg border bg-card flex flex-col overflow-hidden shrink-0 max-h-[80vh] lg:max-h-none">
        <div class="flex items-center justify-between px-4 h-11 border-b bg-muted/20">
-          <div class="flex items-center gap-2">
-            <span class="text-sm font-medium text-muted-foreground">日志详情</span>
-            <Button v-if="selectedLog.status === TASK_STATUS.RUNNING" variant="destructive" size="sm"
-              class="h-6 px-2 text-[10px]" :disabled="isStopping" @click="stopTask">
-              {{ isStopping ? '停止中...' : '停止任务' }}
-            </Button>
-          </div>
+          <span class="text-sm font-medium">日志详情</span>
          <div class="flex items-center gap-1">
-            <Button variant="ghost" size="icon" class="h-7 w-7 text-muted-foreground hover:text-destructive"
-              title="删除该日志" @click="confirmDeleteLog(selectedLog.id)">
-              <Trash2 class="h-3.5 w-3.5" />
+            <Button variant="ghost" size="icon" @click="showFullscreen = true" title="全屏查看">
+              <Maximize2 class="h-4 w-4" />
            </Button>
-            <Button variant="ghost" size="icon" class="h-7 w-7" @click="closeDetail" title="关闭">
-              <X class="h-3.5 w-3.5" />
-            </Button>
-          </div>
-        </div>
-        <div class="px-4 py-3 border-b space-y-2 text-sm">
-          <div class="flex justify-between items-center h-6">
-            <span class="text-muted-foreground">任务名称</span>
-            <span class="font-medium">{{ selectedLog.task_name }}</span>
-          </div>
-          <div class="flex justify-between items-center h-8">
-            <span class="text-muted-foreground">状态</span>
-            <Badge variant="outline" :class="[
-              'capitalize px-3 py-1 font-semibold rounded-full border shadow-sm transition-all duration-300',
-              getStatusBadgeClass(selectedLog.status)
-            ]">
-              <div class="flex items-center gap-1.5">
-                <CheckCircle2 v-if="selectedLog.status === TASK_STATUS.SUCCESS" class="h-3.5 w-3.5" />
-                <XCircle v-else-if="selectedLog.status === TASK_STATUS.FAILED" class="h-3.5 w-3.5" />
-                <ZapIcon v-else-if="selectedLog.status === TASK_STATUS.RUNNING"
-                  class="h-3.5 w-3.5 fill-current animate-pulse text-blue-500" />
-                <Clock v-else-if="selectedLog.status === TASK_STATUS.PENDING" class="h-3.5 w-3.5" />
-                <AlertCircle v-else-if="selectedLog.status === TASK_STATUS.TIMEOUT" class="h-3.5 w-3.5" />
-                <Ban v-else-if="selectedLog.status === TASK_STATUS.CANCELLED" class="h-3.5 w-3.5" />
-                <span class="text-xs tracking-wide uppercase">{{ selectedLog.status }}</span>
-              </div>
-            </Badge>
-          </div>
-          <div class="flex justify-between items-center h-6">
-            <span class="text-muted-foreground">耗时</span>
-            <span class="font-medium">{{ formatDuration(selectedLog.duration) }}</span>
-          </div>
-          <div class="flex justify-between items-center h-6">
-            <span class="text-muted-foreground">开始时间</span>
-            <span class="font-mono text-xs">{{ selectedLog.start_time || '-' }}</span>
-          </div>
-          <div class="flex justify-between items-center h-6">
-            <span class="text-muted-foreground">结束时间</span>
-            <span class="font-mono text-xs">{{ selectedLog.end_time || '-' }}</span>
-          </div>
-          <div class="pt-1.5">
-            <span class="text-muted-foreground block mb-1">执行命令</span>
-            <code
-              class="block font-mono bg-muted/40 px-3 py-2 rounded text-xs break-all border border-muted-foreground/10">
-              {{ selectedLog.command }}
-            </code>
-          </div>
-        </div>
-        <div class="flex-1 flex flex-col overflow-hidden">
-          <div v-if="selectedLog.error" class="px-4 py-3 border-b bg-red-500/5 space-y-2 text-sm">
-            <div class="flex items-center gap-2 text-red-500 font-medium">
+            <Button variant="ghost" size="icon" @click="closeDetail">
              <X class="h-4 w-4" />
-              <span>系统错误</span>
-            </div>
-            <code class="block font-mono bg-red-500/10 text-red-600 px-2 py-1 rounded text-xs break-all">
-              {{ selectedLog.error }}
-            </code>
-          </div>
-          <div class="px-4 py-2.5 text-sm text-muted-foreground border-b bg-muted/20 flex items-center justify-between">
-            <span class="font-medium">日志输出</span>
-            <Button variant="ghost" size="icon" class="h-6 w-6" @click="showFullscreen = true" title="全屏查看">
-              <Maximize2 class="h-3.5 w-3.5" />
            </Button>
          </div>
-          <div class="flex-1 overflow-hidden min-h-[160px] relative"
-            :class="resolvedTheme === 'dark' ? 'bg-zinc-950' : 'bg-zinc-100'" ref="sideLogContainer">
-            <LogTerminal v-if="decompressedOutput" :content="decompressedOutput" :theme="resolvedTheme" />
-            <div v-else-if="!isWsLoading"
-              class="absolute inset-0 flex items-center justify-center text-zinc-500 font-mono text-xs italic">
-              无日志输出
-            </div>
-            <div v-if="isWsLoading"
-              class="px-4 py-2 text-sm text-zinc-500 italic border-t border-zinc-200 dark:border-zinc-800 absolute bottom-0 left-0 w-full bg-inherit/80 backdrop-blur-sm">
-              连接中...
-            </div>
-          </div>
+        </div>
+        <div class="flex-1 overflow-y-auto p-4 space-y-4">
+           <!-- 详情信息 (任务名称, 状态, 耗时, 命令等) -->
+           <div class="grid grid-cols-2 gap-y-3 text-sm">
+             <span class="text-muted-foreground">任务名称</span>
+             <span class="text-right font-medium">{{ selectedLog.task_name }}</span>
+             <span class="text-muted-foreground">执行状态</span>
+             <Badge :class="getStatusBadgeClass(selectedLog.status)" class="ml-auto">{{ selectedLog.status }}</Badge>
+             <span class="text-muted-foreground">执行耗时</span>
+             <span class="text-right">{{ formatDuration(selectedLog.duration) }}</span>
+           </div>
+           <div class="border-t pt-4">
+             <span class="text-xs font-semibold uppercase text-muted-foreground block mb-2">执行命令</span>
+             <code class="block p-2 bg-muted rounded text-xs break-all font-mono">{{ selectedLog.command }}</code>
+           </div>
+           <div class="border-t pt-4 flex flex-col items-center justify-center py-12 text-muted-foreground text-xs bg-muted/10 rounded">
+             <p>侧边栏仅展示详情</p>
+             <p class="mt-1 opacity-70">查看完整日志请点击右上角全屏按钮</p>
+           </div>
        </div>
      </div>
    </div>

    <!-- 全屏查看日志 -->
-    <LogViewer v-model:open="showFullscreen" :title="`日志输出 - ${selectedLog?.task_name || ''}`"
-      :content="decompressedOutput" :status="selectedLog?.status" />
+    <LogViewer v-model:open="showFullscreen" :task-name="selectedLog?.task_name"
+      :log-id="selectedLog?.id" :initial-status="selectedLog?.status" />

-    <!-- 清空日志确认弹窗 -->
+    <!-- 弹窗 (清空/删除) -->
    <AlertDialog :open="showClearDialog" @update:open="showClearDialog = $event">
      <AlertDialogContent>
        <AlertDialogHeader>
          <AlertDialogTitle>确认清空日志?</AlertDialogTitle>
-          <AlertDialogDescription>
-            此操作将永久删除{{ filterTaskId ? '当前任务的' : '所有' }}任务历史记录，包括控制台输出，并且无法撤销。
-          </AlertDialogDescription>
+          <AlertDialogDescription>此操作不可撤销。</AlertDialogDescription>
        </AlertDialogHeader>
        <AlertDialogFooter>
          <AlertDialogCancel>取消</AlertDialogCancel>
-          <AlertDialogAction @click="handleClearLogs" variant="destructive">
-            清空
-          </AlertDialogAction>
+          <AlertDialogAction @click="handleClearLogs" variant="destructive">清空</AlertDialogAction>
        </AlertDialogFooter>
      </AlertDialogContent>
    </AlertDialog>

-    <!-- 单条删除确认弹窗 -->
    <AlertDialog :open="showDeleteDialog" @update:open="showDeleteDialog = $event">
      <AlertDialogContent>
        <AlertDialogHeader>
-          <AlertDialogTitle>确认删除这条日志?</AlertDialogTitle>
-          <AlertDialogDescription>
-            此操作将永久删除该次运行记录和日志文件，且不可恢复。
-          </AlertDialogDescription>
+          <AlertDialogTitle>确认删除日志?</AlertDialogTitle>
+          <AlertDialogDescription>数据将永久删除。</AlertDialogDescription>
        </AlertDialogHeader>
        <AlertDialogFooter>
          <AlertDialogCancel>取消</AlertDialogCancel>
-          <AlertDialogAction @click="handleDeleteLog" variant="destructive">
-            删除
-          </AlertDialogAction>
+          <AlertDialogAction @click="handleDeleteLog" variant="destructive">删除</AlertDialogAction>
        </AlertDialogFooter>
      </AlertDialogContent>
    </AlertDialog>
@@ -1,23 +1,32 @@
 <script setup lang="ts">
-import { watch, onUnmounted } from 'vue'
+import { ref, watch, onUnmounted } from 'vue'
 import { Button } from '@/components/ui/button'
-import { X } from 'lucide-vue-next'
+import { X, Loader2 } from 'lucide-vue-next'
 import LogTerminal from '@/components/LogTerminal.vue'
 import { useTheme } from '@/composables/useTheme'
+import { api } from '@/api'
+// import { toast } from 'vue-sonner' // redundant here
+import { TASK_STATUS } from '@/constants'

 const { resolvedTheme } = useTheme()

 const props = defineProps<{
  open: boolean
-  title: string
-  content: string
-  status?: string
+  logId?: string
+  taskName?: string
+  initialStatus?: string
 }>()

 const emit = defineEmits<{
  'update:open': [value: boolean]
 }>()

+const logContent = ref('')
+const logStatus = ref(props.initialStatus || '')
+const isWsLoading = ref(false)
+let logSocket: WebSocket | null = null
+let durationTimer: ReturnType<typeof setInterval> | null = null
+
 const lightLogBackgroundClass = 'bg-zinc-100'
 const darkLogBackgroundClass = 'bg-zinc-950'

@@ -25,27 +34,86 @@ function close() {
  emit('update:open', false)
 }

-// 统一控制 Body 滚动
-function toggleBodyScroll(lock: boolean) {
-  if (lock) {
-    document.body.style.overflow = 'hidden'
-  } else {
-    document.body.style.overflow = ''
+function connectLogSocket(id: string) {
+  if (logSocket) {
+    logSocket.close()
+  }
+  isWsLoading.value = true
+  const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'
+  const host = window.location.host
+  const baseUrl = (window as any).__BASE_URL__ || ''
+  const apiVersion = (window as any).__API_VERSION__ || '/api/v1'
+  const wsUrl = `${protocol}//${host}${baseUrl}${apiVersion}/logs/ws?log_id=${id}`
+
+  logSocket = new WebSocket(wsUrl)
+
+  logSocket.onopen = () => {
+    isWsLoading.value = false
+    logContent.value = ''
+  }
+
+  logSocket.onmessage = (event) => {
+    if (logStatus.value !== TASK_STATUS.RUNNING) {
+      logContent.value = event.data
+    } else {
+      logContent.value += event.data
+    }
+  }
+
+  logSocket.onerror = () => {
+    isWsLoading.value = false
+    logContent.value = '日志连接异常'
+  }
+
+  logSocket.onclose = () => {
+    isWsLoading.value = false
  }
 }

-// 监听打开状态
-watch(() => props.open, (val) => {
-  if (val) {
-    toggleBodyScroll(true)
-  } else {
-    toggleBodyScroll(false)
-  }
-}, { immediate: true })
+function startPolling(id: string) {
+  if (durationTimer) clearInterval(durationTimer)
+  durationTimer = setInterval(async () => {
+    try {
+      if (!props.open) {
+        if (durationTimer) clearInterval(durationTimer)
+        return
+      }
+      const logRes = await api.logs.get(id)
+      if (logRes) {
+        logStatus.value = logRes.status
+        if (logRes.status !== TASK_STATUS.RUNNING) {
+          if (durationTimer) clearInterval(durationTimer)
+        }
+      }
+    } catch { /* ignore */ }
+  }, 3000)
+}
+
+watch(() => props.open, (val) => {
+  if (val && props.logId) {
+    logStatus.value = props.initialStatus || ''
+    connectLogSocket(props.logId)
+    if (logStatus.value === TASK_STATUS.RUNNING) {
+      startPolling(props.logId)
+    }
+    document.body.style.overflow = 'hidden'
+  } else {
+    if (logSocket) {
+      logSocket.close()
+      logSocket = null
+    }
+    if (durationTimer) {
+      clearInterval(durationTimer)
+      durationTimer = null
+    }
+    document.body.style.overflow = ''
+  }
+})

-// 确保组件卸载时恢复滚动
 onUnmounted(() => {
-  toggleBodyScroll(false)
+  if (logSocket) logSocket.close()
+  if (durationTimer) clearInterval(durationTimer)
+  document.body.style.overflow = ''
 })
 </script>

@@ -55,21 +123,19 @@ onUnmounted(() => {
      @click.self="close">
      <div
        class="bg-background rounded-lg shadow-lg flex flex-col w-full sm:w-[90vw] md:w-[80vw] max-w-5xl h-[90vh] sm:h-[85vh]">
-        <div
-          class="flex items-center justify-between px-3 sm:px-4 py-2 sm:py-3 border-b shrink-0 gap-3">
+        <div class="flex items-center justify-between px-3 sm:px-4 py-2 sm:py-3 border-b shrink-0 gap-3">
          <div class="flex items-center gap-3 min-w-0 flex-1">
-            <span class="text-sm font-medium truncate" :title="title">{{ title }}</span>
-            <div v-if="status"
+            <span class="text-sm font-medium truncate">最新日志 - {{ taskName }}</span>
+            <div v-if="logStatus"
              class="flex items-center gap-1.5 px-2 py-0.5 rounded text-[10px] font-bold uppercase transition-colors shrink-0"
-              :class="status === 'success' ? 'bg-green-500/10 text-green-500 border border-green-500/20' :
-                status === 'failed' ? 'bg-red-500/10 text-red-500 border border-red-500/20' :
+              :class="logStatus === TASK_STATUS.SUCCESS ? 'bg-green-500/10 text-green-500 border border-green-500/20' :
+                logStatus === TASK_STATUS.FAILED ? 'bg-red-500/10 text-red-500 border border-red-500/20' :
                  'bg-yellow-500/10 text-yellow-500 border border-yellow-500/20'">
-              <span v-if="status === 'running'" class="relative flex h-1.5 w-1.5 mr-0.5">
-                <span
-                  class="animate-ping absolute inline-flex h-full w-full rounded-full bg-yellow-400 opacity-75"></span>
+              <span v-if="logStatus === TASK_STATUS.RUNNING" class="relative flex h-1.5 w-1.5 mr-0.5">
+                <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-yellow-400 opacity-75"></span>
                <span class="relative inline-flex rounded-full h-1.5 w-1.5 bg-yellow-500"></span>
              </span>
-              {{ status === 'success' ? '成功' : status === 'failed' ? '失败' : '执行中' }}
+              {{ logStatus === TASK_STATUS.SUCCESS ? '成功' : logStatus === TASK_STATUS.FAILED ? '失败' : '执行中' }}
            </div>
          </div>
          <div class="flex items-center gap-2 shrink-0">
@@ -80,7 +146,11 @@ onUnmounted(() => {
        </div>
        <div class="flex-1 overflow-hidden relative"
          :class="resolvedTheme === 'dark' ? darkLogBackgroundClass : lightLogBackgroundClass">
-          <LogTerminal v-if="content" :content="content" :theme="resolvedTheme" />
+          <LogTerminal v-if="logContent" :content="logContent" :theme="resolvedTheme" />
+          <div v-else-if="isWsLoading" class="absolute inset-0 flex items-center justify-center gap-2 text-zinc-500 font-mono text-sm">
+            <Loader2 class="h-4 w-4 animate-spin" />
+            连接中...
+          </div>
          <div v-else class="absolute inset-0 flex items-center justify-center text-zinc-500 font-mono text-sm italic">
            无日志输出
          </div>
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, onMounted } from 'vue'
 import { Badge } from '@/components/ui/badge'
-import { ExternalLink, TriangleAlert } from 'lucide-vue-next'
+import { ExternalLink, TriangleAlert, History } from 'lucide-vue-next'
 import { api, type AboutInfo } from '@/api'

 const aboutInfo = ref<AboutInfo | null>(null)
@@ -21,9 +21,16 @@ onMounted(loadAbout)
 <template>
  <div>
    <!-- 站点关于 -->
-    <div class="mb-6">
-      <h3 class="text-lg font-semibold mb-1">白虎面板 (Baihu Panel)</h3>
-      <p class="text-sm text-muted-foreground">极致轻量、高性能的自动化任务调度平台。深度集成 Mise 运行时管理，支持多语言环境动态切换与全自动依赖管理。</p>
+    <div class="mb-8 flex flex-col sm:flex-row justify-between items-start gap-4">
+      <div class="flex-1 min-w-0">
+        <h3 class="text-xl font-bold mb-1.5">白虎面板 (Baihu Panel)</h3>
+        <p class="text-sm text-muted-foreground leading-relaxed">极致轻量、高性能的自动化任务调度平台。深度集成 Mise 运行时管理，支持多语言环境动态切换与全自动依赖管理。</p>
+      </div>
+      <a href="https://engigu.github.io/baihu-panel/guide/changelog.html" target="_blank"
+        class="inline-flex items-center gap-1.5 h-9 px-4 rounded-full border border-primary/20 bg-primary/5 text-primary text-xs font-semibold hover:bg-primary/10 transition-all whitespace-nowrap shadow-sm shadow-primary/5">
+        <History class="h-3.5 w-3.5" />
+        查看更新日志
+      </a>
    </div>

    <div class="grid sm:grid-cols-2 gap-x-8 gap-y-5">
@@ -51,8 +58,21 @@ onMounted(loadAbout)
        <h4 class="text-sm font-medium mb-2">系统信息</h4>
        <div class="space-y-2">
          <div class="flex justify-between items-center">
-            <span class="text-muted-foreground text-sm">系统版本:</span>
-            <Badge variant="outline" class="font-mono text-xs">{{ aboutInfo?.version || 'dev' }}</Badge>
+            <span class="text-muted-foreground text-sm">当前版本:</span>
+            <div class="flex items-center gap-1.5">
+              <Badge variant="outline" class="font-mono text-xs">{{ aboutInfo?.version || 'dev' }}</Badge>
+              <Badge v-if="aboutInfo?.remote_version && aboutInfo.remote_version === aboutInfo.version" variant="secondary"
+                class="text-[10px] h-4 px-1 bg-green-500/10 text-green-600 border-green-500/20">
+                最新版本
+              </Badge>
+            </div>
+          </div>
+          <div v-if="aboutInfo?.remote_version && aboutInfo.remote_version !== aboutInfo.version"
+            class="flex justify-between items-center">
+            <span class="text-muted-foreground text-sm">最新版本:</span>
+            <Badge variant="secondary" class="font-mono text-xs bg-primary/10 text-primary border-primary/20">
+              {{ aboutInfo.remote_version }}
+            </Badge>
          </div>
          <div class="flex justify-between items-center">
            <span class="text-muted-foreground text-sm">构建时间:</span>
@@ -1,16 +1,17 @@
 <script setup lang="ts">
 import { ref, computed, watch } from 'vue'
 import { Button } from '@/components/ui/button'
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog'
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from '@/components/ui/dialog'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
 import { Switch } from '@/components/ui/switch'
 import { Checkbox } from '@/components/ui/checkbox'
 import { ScrollArea } from '@/components/ui/scroll-area'
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
 import DirTreeSelect from '@/components/DirTreeSelect.vue'
-import { X, Globe, GitBranch, Shield, Zap, Clock } from 'lucide-vue-next'
-import { api, type Task, type RepoConfig, type Agent } from '@/api'
+import { X, Globe, GitBranch, Shield, Zap, Clock, Download, Plus, Search, Check, ChevronsUpDown, Loader2, AlertCircle } from 'lucide-vue-next'
+import { api, type Task, type RepoConfig, type Agent, type MiseLanguage } from '@/api'
 import { toast } from 'vue-sonner'
 import { cn } from '@/lib/utils'
 import { getCronDescription } from '@/utils/cron'
@@ -56,7 +57,12 @@ const repoConfig = ref<RepoConfig>({
  proxy_url: '',
  auth_token: '',
  whitelist_paths: '',
+  blacklist: '',
+  dependence: '',
+  extensions: '',
+  auto_add_cron: false,
  concurrency: 1,
+  repo_source: '',
  proxy: ''
 })
 const cleanType = ref('none')
@@ -64,7 +70,171 @@ const cleanKeep = ref(30)
 const allAgents = ref<Agent[]>([])
 const selectedAgentId = ref<string>('local')
 const tagInput = ref('')
-const whitelistInput = ref('')
+
+const autoAddCron = computed({
+  get: () => !!repoConfig.value.auto_add_cron,
+  set: (val: boolean) => {
+    repoConfig.value.auto_add_cron = val
+  }
+})
+
+// === 语言环境相关 ===
+const installedLangs = ref<MiseLanguage[]>([])
+const loadingLangs = ref(false)
+const selectedLangs = ref<{ name: string; version: string; availableVersions: string[] }[]>([])
+const availablePlugins = ref<string[]>([])
+const pluginSearch = ref('')
+const versionSearch = ref('')
+
+const filteredPlugins = computed(() => {
+  if (!pluginSearch.value) return availablePlugins.value
+  const s = pluginSearch.value.toLowerCase()
+  return availablePlugins.value.filter(p => p.toLowerCase().includes(s))
+})
+
+function getFilteredVersions(versions: string[]) {
+  if (!versionSearch.value) return versions
+  const s = versionSearch.value.toLowerCase()
+  return versions.filter(v => v.toLowerCase().includes(s))
+}
+
+async function fetchInstalledLangs() {
+  loadingLangs.value = true
+  try {
+    installedLangs.value = await api.mise.list()
+    const plugins = new Set<string>()
+    installedLangs.value.forEach(l => plugins.add(l.plugin))
+    availablePlugins.value = Array.from(plugins).sort()
+  } catch (e) {
+    console.error('Fetch installed langs failed', e)
+  } finally {
+    loadingLangs.value = false
+  }
+}
+
+function getLangIcon(plugin: string) {
+  const name = plugin?.toLowerCase().trim()
+  const mapping: Record<string, string> = {
+    'python': 'python/python-original.svg',
+    'node': 'nodejs/nodejs-original.svg',
+    'nodejs': 'nodejs/nodejs-original.svg',
+    'go': 'go/go-original.svg',
+    'rust': 'rust/rust-original.svg',
+    'ruby': 'ruby/ruby-plain.svg',
+    'php': 'php/php-plain.svg',
+    'java': 'java/java-plain.svg',
+    'deno': 'deno/deno-plain.svg',
+    'bun': 'bun/bun-plain.svg',
+    'zig': 'zig/zig-original.svg',
+    'dotnet': 'dot-net/dot-net-original.svg',
+    '.net': 'dot-net/dot-net-original.svg',
+    'elixir': 'elixir/elixir-original.svg',
+    'erlang': 'erlang/erlang-original.svg',
+    'crystal': 'crystal/crystal-original.svg',
+    'lua': 'lua/lua-original.svg',
+    'julia': 'julia/julia-original.svg',
+    'nim': 'nim/nim-original.svg',
+    'perl': 'perl/perl-original.svg',
+    'scala': 'scala/scala-original.svg',
+    'kotlin': 'kotlin/kotlin-original.svg',
+    'clojure': 'clojure/clojure-line.svg',
+    'dart': 'dart/dart-original.svg',
+    'flutter': 'flutter/flutter-original.svg',
+    'terraform': 'terraform/terraform-original.svg',
+    'docker': 'docker/docker-original.svg',
+    'kubernetes': 'kubernetes/kubernetes-plain.svg',
+    'ansible': 'ansible/ansible-original.svg',
+  }
+
+  if (mapping[name]) {
+    return `https://fastly.jsdelivr.net/gh/devicons/devicon/icons/${mapping[name]}`
+  }
+  return ''
+}
+
+function updateAvailableVersions(lang: { name: string; version: string; availableVersions: string[] }) {
+  if (lang.name) {
+    lang.availableVersions = installedLangs.value
+      .filter(l => l.plugin === lang.name)
+      .map(l => l.version)
+      .sort((a, b) => b.localeCompare(a, undefined, { numeric: true }))
+  } else {
+    lang.availableVersions = []
+  }
+}
+
+function addLang() {
+  selectedLangs.value.push({ name: '', version: '', availableVersions: [] })
+}
+
+function removeLang(index: number) {
+  selectedLangs.value.splice(index, 1)
+}
+
+function updateLangName(index: number, name: string) {
+  const lang = selectedLangs.value[index]
+  if (!lang) return
+  lang.name = name
+  lang.version = '' // reset version
+  updateAvailableVersions(lang)
+}
+
+const showQlImportDialog = ref(false)
+const qlCommandInput = ref('')
+
+function importFromQl() {
+  qlCommandInput.value = ''
+  showQlImportDialog.value = true
+}
+
+function submitQlImport() {
+  const s = qlCommandInput.value.trim()
+  if (!s) {
+    showQlImportDialog.value = false
+    return
+  }
+  if (!s.startsWith('ql repo')) {
+    toast.error('无效的指令：必须以 ql repo 开头')
+    return
+  }
+
+  // Parse arguments handling quotes
+  const args: string[] = []
+  const regex = /[^\s"']+|"([^"]*)"|'([^']*)'/g
+  let match
+  while ((match = regex.exec(s)) !== null) {
+    args.push(match[1] || match[2] || match[0])
+  }
+  
+  if (args[2]) {
+    repoConfig.value.source_url = args[2]
+    repoConfig.value.source_type = 'git'
+    // form task name
+    let name = '同步 '
+    try {
+      const urlPaths = args[2].split('/')
+      if (urlPaths.length > 0) {
+        name += urlPaths[urlPaths.length - 1].replace('.git', '')
+      } else {
+        name += '未命名仓库'
+      }
+    } catch {
+      name += '未命名仓库'
+    }
+    form.value.name = name
+  }
+  
+  if (args[3]) repoConfig.value.whitelist_paths = args[3]
+  if (args[4]) repoConfig.value.blacklist = args[4]
+  if (args[5]) repoConfig.value.dependence = args[5]
+  if (args[6]) repoConfig.value.branch = args[6]
+  if (args[7]) repoConfig.value.extensions = args[7]
+  
+  repoConfig.value.auto_add_cron = true
+  repoConfig.value.repo_source = 'ql'
+  toast.success('指令解析成功，已开启自动添加任务，请继续完善其他设置')
+  showQlImportDialog.value = false
+}

 const cronDescription = computed(() => {
  if (!form.value.schedule) return ''
@@ -87,21 +257,6 @@ function removeTag(tagToRemove: string) {
  form.value.tags = currentTags.filter(t => t !== tagToRemove).join(',')
 }

-function addWhitelistPath() {
-  const val = whitelistInput.value.trim()
-  if (!val) return
-  const current = repoConfig.value.whitelist_paths ? repoConfig.value.whitelist_paths.split(',').filter(Boolean) : []
-  if (!current.includes(val)) {
-    current.push(val)
-    repoConfig.value.whitelist_paths = current.join(',')
-  }
-  whitelistInput.value = ''
-}
-
-function removeWhitelistPath(path: string) {
-  const current = repoConfig.value.whitelist_paths ? repoConfig.value.whitelist_paths.split(',').filter(Boolean) : []
-  repoConfig.value.whitelist_paths = current.filter(p => p !== path).join(',')
-}

 const concurrencyEnabled = computed({
  get: () => repoConfig.value.concurrency === 1,
@@ -162,7 +317,12 @@ watch(() => props.open, async (val) => {
      proxy_url: '',
      auth_token: '',
      whitelist_paths: '',
-      concurrency: 1
+      blacklist: '',
+      dependence: '',
+      extensions: '',
+      auto_add_cron: false,
+      concurrency: 1,
+      repo_source: ''
    }
    const configStr = props.task?.config
    if (configStr) {
@@ -180,10 +340,27 @@ watch(() => props.open, async (val) => {
    } else {
      repoConfig.value = defaultConfig
    }
+    
+    // 解析语言环境
+    selectedLangs.value = []
+    if (props.task?.languages && Array.isArray(props.task.languages)) {
+      selectedLangs.value = props.task.languages.map((l: any) => ({
+        name: l.name || '',
+        version: l.version || '',
+        availableVersions: []
+      }))
+    }
+    
    // 仓库任务暂时仅支持本地执行
    selectedAgentId.value = 'local'
    // 加载 Agent 列表
    await loadAgents()
+    if (selectedAgentId.value === 'local') {
+      await fetchInstalledLangs()
+      selectedLangs.value.forEach(lang => {
+        updateAvailableVersions(lang)
+      })
+    }
  }
 })

@@ -194,6 +371,13 @@ async function loadAgents() {
 }

 async function save() {
+  if (repoConfig.value.auto_add_cron) {
+    if (selectedLangs.value.length === 0 || !selectedLangs.value[0].name) {
+      toast.error('您开启了“自动添加任务”，请先至少添加并选择一个运行语言环境和版本')
+      return
+    }
+  }
+
  try {
    form.value.clean_config = cleanConfig.value
    form.value.type = 'repo'
@@ -205,6 +389,12 @@ async function save() {
      '$task_concurrency': concurrencyEnabled.value ? 1 : 0
    }

+    // 保存语言环境
+    form.value.languages = selectedLangs.value.map(l => ({
+      name: l.name,
+      version: l.version
+    }))
+
    form.value.config = JSON.stringify(configToSave)
    form.value.command = `[${repoConfig.value.source_type}] ${repoConfig.value.source_url}`
    form.value.agent_id = selectedAgentId.value === 'local' ? null : selectedAgentId.value
@@ -228,9 +418,15 @@ async function save() {

      <div class="flex flex-col max-h-[85vh]">
        <DialogHeader class="px-6 pt-6 pb-2 shrink-0">
-          <DialogTitle class="text-xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-foreground to-foreground/70">
-            {{ isEdit ? '编辑仓库同步' : '新建仓库同步' }}
-          </DialogTitle>
+          <div class="flex items-center justify-between">
+            <DialogTitle class="text-xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-foreground to-foreground/70">
+              {{ isEdit ? '编辑仓库同步' : '新建仓库同步' }}
+            </DialogTitle>
+            <Button v-if="!isEdit" variant="outline" size="sm" @click="importFromQl" class="h-8 gap-1.5 bg-primary/5 hover:bg-primary/10 border-primary/20 hover:border-primary/40 text-primary">
+              <Download class="w-3.5 h-3.5" />
+              青龙格式导入
+            </Button>
+          </div>
        </DialogHeader>

        <ScrollArea class="flex-1 min-h-0 px-6">
@@ -325,36 +521,6 @@ async function save() {
                    <Input v-else v-model="repoConfig.target_path" placeholder="Agent 上的目标路径" class="h-9 bg-muted/30 border-muted-foreground/20" />
                  </div>
                </div>
-                
-                <!-- 新增：白名单路径 -->
-                <div class="grid grid-cols-1 sm:grid-cols-4 items-start gap-3">
-                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider pt-2.5">
-                    白名单路径
-                  </Label>
-                  <div class="sm:col-span-3 space-y-2">
-                    <div class="flex gap-2">
-                      <div class="relative flex-1">
-                        <Input v-model="whitelistInput" placeholder="输入路径或通配符按回车... (如 logs/ 或 *.db)" class="h-9 bg-muted/30 border-muted-foreground/20 pr-12 focus:bg-background" @keydown.enter.prevent="addWhitelistPath" />
-                        <Button type="button" variant="ghost" size="sm" class="absolute right-1 top-1 h-7 px-2 text-xs hover:bg-primary/10 hover:text-primary transition-colors" @click="addWhitelistPath">
-                          添加
-                        </Button>
-                      </div>
-                    </div>
-                    <div class="flex flex-wrap gap-1.5 pt-1 min-h-[1.5rem]" v-if="repoConfig.whitelist_paths">
-                      <span v-for="path in repoConfig.whitelist_paths.split(',').filter(Boolean)" :key="path" 
-                        class="flex items-center gap-1.5 bg-blue-500/5 text-blue-500 px-2.5 py-1 rounded-md text-[11px] font-medium border border-blue-500/10 group transition-all hover:bg-blue-500/10">
-                        {{ path }}
-                        <button type="button" class="text-blue-500/40 hover:text-destructive transition-colors shrink-0" @click.prevent="removeWhitelistPath(path)">
-                          <X class="h-3 w-3" />
-                        </button>
-                      </span>
-                    </div>
-                    <p class="text-[10px] text-muted-foreground mt-1 px-1 leading-relaxed">
-                      同步时将保留匹配上述路径的内容（支持 * 通配符）。匹配项在同步前会被暂存，并在同步完成后自动回填还原。
-                    </p>
-                  </div>
-                </div>
-
                <div v-if="repoConfig.source_type === 'git'" class="grid grid-cols-1 sm:grid-cols-4 items-center gap-3">
                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider">分支</Label>
                  <Input v-model="repoConfig.branch" placeholder="main (默认)" class="sm:col-span-3 h-9 bg-muted/30 border-muted-foreground/20 focus:bg-background transition-all" autocomplete="off" />
@@ -414,6 +580,150 @@ async function save() {
              </div>
            </section>

+            <!-- 脚本过滤 Section -->
+            <section class="space-y-4">
+              <div class="flex items-center gap-2 mb-1">
+                <div class="h-4 w-1 bg-primary rounded-full" />
+                <h3 class="text-sm font-semibold text-foreground/80">脚本过滤</h3>
+              </div>
+
+              <div class="grid gap-4 pl-3 border-l border-muted">
+                <div class="grid grid-cols-1 sm:grid-cols-4 items-center gap-3">
+                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider">白名单</Label>
+                  <div class="sm:col-span-3 relative">
+                    <Input v-model="repoConfig.whitelist_paths" placeholder="保活路径或脚本关键词 (如: logs/ | jd_ )" class="h-9 bg-muted/30 border-muted-foreground/20 focus:bg-background transition-all" autocomplete="off" />
+                    <p class="text-[10px] text-muted-foreground mt-1 px-1 leading-relaxed">请输入脚本筛选白名单关键词或保活路径（支持 *），多个关键词或路径使用竖线(|)或逗号(,)分割</p>
+                  </div>
+                </div>
+
+                <div class="grid grid-cols-1 sm:grid-cols-4 items-center gap-3">
+                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider">脚本黑名单</Label>
+                  <div class="sm:col-span-3 relative">
+                    <Input v-model="repoConfig.blacklist" placeholder="黑名单关键词 (如: help)" class="h-9 bg-muted/30 border-muted-foreground/20 focus:bg-background transition-all" autocomplete="off" />
+                    <p class="text-[10px] text-muted-foreground mt-1 px-1">脚本筛选黑名单关键词，多个关键词竖线(|)分割</p>
+                  </div>
+                </div>
+
+                <div class="grid grid-cols-1 sm:grid-cols-4 items-center gap-3">
+                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider">依赖文件</Label>
+                  <div class="sm:col-span-3 relative">
+                    <Input v-model="repoConfig.dependence" placeholder="依赖文件关键词 (如: ccav | notify)" class="h-9 bg-muted/30 border-muted-foreground/20 focus:bg-background transition-all" autocomplete="off" />
+                    <p class="text-[10px] text-muted-foreground mt-1 px-1">脚本依赖文件关键词，多个关键词竖线(|)分割</p>
+                  </div>
+                </div>
+
+                <div class="grid grid-cols-1 sm:grid-cols-4 items-center gap-3">
+                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider">文件后缀</Label>
+                  <div class="sm:col-span-3 relative">
+                    <Input v-model="repoConfig.extensions" placeholder="文件后缀 (如: js | py | sh)" class="h-9 bg-muted/30 border-muted-foreground/20 focus:bg-background transition-all" autocomplete="off" />
+                    <p class="text-[10px] text-muted-foreground mt-1 px-1">脚本文件后缀，多个后缀竖线(|)分割</p>
+                  </div>
+                </div>
+              </div>
+            </section>
+
+            <!-- 运行环境 Section -->
+            <section v-if="selectedAgentId === 'local'" class="space-y-4">
+              <div class="flex items-center gap-2 mb-1">
+                <div class="h-4 w-1 bg-primary rounded-full" />
+                <h3 class="text-sm font-semibold text-foreground/80">运行环境</h3>
+              </div>
+
+              <div class="grid gap-4 pl-3 border-l border-muted">
+                <div class="grid grid-cols-1 sm:grid-cols-4 items-start gap-3 mt-2">
+                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider pt-2.5">语言环境</Label>
+                  <div class="sm:col-span-3 space-y-2">
+                    <div class="flex items-start gap-2.5 p-3 rounded-xl bg-amber-500/5 border border-amber-500/10 text-amber-600 dark:text-amber-400 text-[11px] leading-relaxed mb-2">
+                      <AlertCircle class="h-4 w-4 shrink-0 text-amber-500 mt-0.5" />
+                      <p>同步后生成的任务将自动继承此运行环境。如果不指定语言版本，某些依赖特定语言的脚本（如 js, py）将无法顺利解析和运行！</p>
+                    </div>
+
+                    <div v-for="(clang, idx) in selectedLangs" :key="idx" 
+                      class="flex gap-2 p-2 rounded-lg bg-muted/20 border border-muted-foreground/10 group/lang relative overflow-hidden">
+                      <div class="absolute left-0 top-0 bottom-0 w-0.5 bg-primary/20 group-hover/lang:bg-primary transition-colors" />
+                      <Popover>
+                        <PopoverTrigger asChild>
+                          <Button variant="ghost" role="combobox" class="justify-between flex-1 h-8 text-xs font-normal hover:bg-background/50">
+                            <div class="flex items-center gap-2 truncate">
+                              <div v-if="clang.name && getLangIcon(clang.name)" class="w-4 h-4 shrink-0 rounded-sm bg-white p-0.5 border shadow-sm">
+                                <img :src="getLangIcon(clang.name)" class="w-full h-full object-contain" />
+                              </div>
+                              <span class="font-medium">{{ clang.name || "选择插件..." }}</span>
+                            </div>
+                            <ChevronsUpDown class="ml-1 h-3 w-3 opacity-40" />
+                          </Button>
+                        </PopoverTrigger>
+                        <PopoverContent class="p-0 w-[240px]" align="start">
+                          <div class="p-2 border-b bg-muted/30">
+                            <div class="relative">
+                              <Search class="absolute left-2 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted-foreground" />
+                              <Input v-model="pluginSearch" placeholder="搜索已安装语言..." class="h-8 pl-8 text-xs bg-background" />
+                            </div>
+                          </div>
+                          <ScrollArea class="h-48 p-1">
+                            <div v-if="loadingLangs" class="flex items-center justify-center py-6">
+                              <Loader2 class="h-5 w-5 animate-spin text-primary/50" />
+                            </div>
+                            <div v-else-if="filteredPlugins.length === 0" class="py-6 text-center text-xs text-muted-foreground">
+                              未找到匹配项
+                            </div>
+                            <button v-else v-for="p in filteredPlugins" :key="p" @click="updateLangName(idx, p)"
+                              class="w-full flex items-center px-3 py-2 text-xs rounded-md hover:bg-accent text-left transition-all group/item mb-0.5">
+                              <div class="mr-3 h-5 w-5 shrink-0 flex items-center justify-center transition-transform group-hover/item:scale-110">
+                                <img v-if="getLangIcon(p)" :src="getLangIcon(p)" class="w-full h-full object-contain p-0.5 bg-white rounded border" />
+                                <div v-else class="w-full h-full flex items-center justify-center bg-primary/10 rounded-sm text-[8px] font-bold border">
+                                  {{ p.substring(0, 2) }}
+                                </div>
+                              </div>
+                              <span class="flex-1" :class="{ 'font-bold text-primary': clang.name === p }">{{ p }}</span>
+                              <Check v-if="clang.name === p" class="h-3 w-3 text-primary" />
+                            </button>
+                          </ScrollArea>
+                        </PopoverContent>
+                      </Popover>
+
+                      <Popover>
+                        <PopoverTrigger asChild :disabled="!clang.name">
+                          <Button variant="ghost" role="combobox" class="justify-between w-28 h-8 text-xs font-normal hover:bg-background/50" :disabled="!clang.name">
+                            <span class="truncate">{{ clang.version || "版本..." }}</span>
+                            <ChevronsUpDown class="h-3 w-3 opacity-40 ml-1" />
+                          </Button>
+                        </PopoverTrigger>
+                        <PopoverContent class="p-0 w-[160px]" align="start">
+                          <div class="p-2 border-b bg-muted/30">
+                            <div class="relative">
+                              <Search class="absolute left-2 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted-foreground" />
+                              <Input v-model="versionSearch" placeholder="搜索版本..." class="h-8 pl-8 text-xs bg-background" />
+                            </div>
+                          </div>
+                          <ScrollArea class="h-48 p-1">
+                            <div v-if="getFilteredVersions(clang.availableVersions).length === 0" class="py-6 text-center text-xs text-muted-foreground">
+                              无可用版本
+                            </div>
+                            <button v-else v-for="v in getFilteredVersions(clang.availableVersions)" :key="v" @click="clang.version = v"
+                              class="w-full flex items-center px-3 py-2 text-xs rounded-md hover:bg-accent text-left mb-0.5 font-mono">
+                              <span class="flex-1 truncate" :class="{ 'font-bold text-primary': clang.version === v }">{{ v }}</span>
+                              <Check v-if="clang.version === v" class="h-3 w-3 text-primary" />
+                            </button>
+                          </ScrollArea>
+                        </PopoverContent>
+                      </Popover>
+
+                      <Button variant="ghost" size="icon" class="h-8 w-8 text-muted-foreground hover:text-destructive hover:bg-destructive/10 shrink-0"
+                        @click="removeLang(idx)">
+                        <X class="h-4 w-4" />
+                      </Button>
+                    </div>
+
+                    <Button variant="outline" size="sm" class="w-full h-9 text-xs border-dashed border-muted-foreground/30 text-muted-foreground hover:text-primary hover:border-primary/50 transition-all bg-muted/10 hover:bg-primary/5"
+                      @click="addLang">
+                      <Plus class="h-4 w-4 mr-2" /> 必须添加运行语言和版本
+                    </Button>
+                  </div>
+                </div>
+              </div>
+            </section>
+
            <!-- 调度策略 Section -->
            <section class="space-y-4">
              <div class="flex items-center gap-2 mb-1">
@@ -461,6 +771,20 @@ async function save() {
                <div class="grid grid-cols-1 sm:grid-cols-4 items-start gap-3">
                  <Label class="sm:text-right text-xs text-muted-foreground uppercase tracking-wider">运行策略</Label>
                  <div class="sm:col-span-3 space-y-4">
+                    
+                    <div class="p-3 rounded-xl bg-muted/20 border border-muted-foreground/10 space-y-2.5">
+                      <div class="flex items-center justify-between">
+                        <div class="flex items-center gap-2 text-xs font-semibold">
+                          <Zap :class="cn('h-3.5 w-3.5', autoAddCron ? 'text-primary' : 'text-muted-foreground')" /> 
+                          自动添加任务
+                        </div>
+                        <Switch :model-value="autoAddCron" @update:model-value="v => autoAddCron = v" />
+                      </div>
+                      <p class="text-[11px] text-muted-foreground leading-relaxed">
+                        {{ autoAddCron ? '同步完成后将尝试自动分析脚本并注册定时任务。' : '仅拉取脚本，不自动注册成面板任务。' }}
+                      </p>
+                    </div>
+
                    <div class="flex items-center gap-4">
                      <div class="flex items-center gap-2">
                         <Input :model-value="form.timeout" @update:model-value="v => form.timeout = Number(v || 0)" type="number" :min="0" class="w-20 h-9 bg-muted/30 text-center" />
@@ -512,4 +836,34 @@ async function save() {
      </div>
    </DialogContent>
  </Dialog>
+
+  <!-- 青龙导入提示对话框 -->
+  <Dialog :open="showQlImportDialog" @update:open="v => showQlImportDialog = v">
+    <DialogContent class="sm:max-w-[425px] p-0 border-none bg-background/95 backdrop-blur-xl shadow-2xl">
+      <DialogHeader class="px-6 pt-6 pb-2">
+        <DialogTitle class="text-xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-foreground to-foreground/70">
+          请输入青龙面板的 ql repo 指令
+        </DialogTitle>
+      </DialogHeader>
+      
+      <div class="px-6 py-4 space-y-4 text-sm text-muted-foreground leading-relaxed">
+        <p>例如：</p>
+        <div class="p-2 rounded-md bg-muted/50 font-mono text-xs select-all text-primary/80 break-all border border-muted-foreground/10">
+          ql repo "https://github.com/a/b.git" "jd_|jx_" "activity" "^jd[^_]" "main" "js|py"
+        </div>
+        <div class="relative mt-2">
+          <Input v-model="qlCommandInput" placeholder="在此处粘贴完整指令，如 ql repo ..." class="h-10 pr-10 focus:ring-primary/20 bg-muted/20" @keydown.enter.prevent="submitQlImport" />
+        </div>
+      </div>
+      
+      <DialogFooter class="px-6 pb-6 pt-2">
+        <Button variant="outline" size="sm" @click="showQlImportDialog = false" class="border-border/40 hover:bg-muted/30">
+          取消
+        </Button>
+        <Button size="sm" @click="submitQlImport" class="shadow-sm">
+          确定 <Download class="h-3 w-3 ml-1.5" />
+        </Button>
+      </DialogFooter>
+    </DialogContent>
+  </Dialog>
 </template>
@@ -6,8 +6,10 @@ import { Input } from '@/components/ui/input'
 import Pagination from '@/components/Pagination.vue'
 import TaskDialog from './TaskDialog.vue'
 import RepoDialog from './RepoDialog.vue'
+import LogViewer from '@/views/history/LogViewer.vue'
 import { Plus, Play, Pencil, Trash2, Search, ScrollText, GitBranch, Terminal, Server, Monitor, X, Loader2, Wifi, WifiOff, Zap, ZapOff, Copy, Tag } from 'lucide-vue-next'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
+import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'
 import { api, type Agent, type Task } from '@/api'
 import { toast } from 'vue-sonner'
 import { useSiteSettings } from '@/composables/useSiteSettings'
@@ -30,7 +32,7 @@ const deleteTaskId = ref<string | null>(null)

 const filterName = ref('')
 const filterTags = ref('')
-const filterType = ref('all')
+const filterType = ref<string>(TASK_TYPE.NORMAL)
 const filterAgentId = ref<string | null>(null)
 const currentPage = ref(1)
 const total = ref(0)
@@ -147,18 +149,41 @@ function duplicateTask(task: Task) {
  }
 }

+const showBatchDeleteDialog = ref(false)
+
 function confirmDelete(id: string) {
  deleteTaskId.value = id
  showDeleteDialog.value = true
 }

+function confirmBatchDelete() {
+  if (total.value === 0) return
+  showBatchDeleteDialog.value = true
+}
+
+async function batchDeleteTasks() {
+  try {
+    const res = await api.tasks.batchDeleteByQuery({
+      name: filterName.value || undefined,
+      tags: filterTags.value || undefined,
+      type: filterType.value === 'all' ? undefined : filterType.value,
+      agent_id: filterAgentId.value || undefined
+    })
+    toast.success(`成功删除 ${res.count} 个任务`)
+    loadTasks()
+  } catch {
+    toast.error('批量删除失败')
+  }
+  showBatchDeleteDialog.value = false
+}
+
 async function deleteTask() {
  if (!deleteTaskId.value) return
  try {
    await api.tasks.delete(deleteTaskId.value)
    toast.success('任务已删除')
    loadTasks()
-  } catch { toast.error('删除失败') }
+  } catch { toast.error('删除失败') } 
  showDeleteDialog.value = false
  deleteTaskId.value = null
 }
@@ -189,8 +214,27 @@ async function toggleTask(task: Task, enabled: boolean) {
  } catch { toast.error('操作失败') }
 }

-function viewLogs(taskId: string) {
-  router.push({ path: '/history', query: { task_id: taskId } })
+const showLogViewer = ref(false)
+const selectedLogId = ref<string | undefined>()
+const latestLogStatus = ref('')
+const latestLogTitle = ref('')
+
+async function viewLogs(taskId: string) {
+  try {
+    const res = await api.logs.list({ task_id: taskId, page: 1, page_size: 1 })
+    if (res.data && res.data.length > 0) {
+      const latestLog = res.data[0]
+      if (!latestLog) return
+      latestLogTitle.value = latestLog.task_name || ''
+      latestLogStatus.value = latestLog.status || ''
+      selectedLogId.value = latestLog.id
+      showLogViewer.value = true
+    } else {
+      toast.info('该任务暂无执行日志')
+    }
+  } catch {
+    toast.error('获取日志失败')
+  }
 }

 function getTaskTypeTitle(type: string) {
@@ -221,12 +265,12 @@ watch(() => route.query.agent_id, (newVal) => {
 <template>
  <div class="space-y-6">
    <div class="flex flex-col sm:flex-row sm:items-center justify-between gap-4">
-      <div>
+      <div class="flex items-center gap-3">
        <h2 class="text-xl sm:text-2xl font-bold tracking-tight">定时任务</h2>
-        <p class="text-muted-foreground text-sm">管理和调度自动化任务</p>
      </div>
+
      <div class="flex flex-col sm:flex-row gap-2.5 w-full md:w-auto">
-        <!-- 第1行: 搜索框 -->
+        <!-- 搜索与标签 -->
        <div class="flex items-center gap-2 w-full sm:w-auto">
          <div class="relative flex-1 sm:flex-none">
            <Search class="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
@@ -239,34 +283,48 @@ watch(() => route.query.agent_id, (newVal) => {
              @input="handleSearch" />
          </div>
        </div>
-        <!-- 第2行: 下拉框与按钮 -->
-        <div class="flex items-center gap-2 w-full sm:w-auto mt-1 sm:mt-0">
-          <div class="relative flex-1 sm:flex-none">
-            <Select v-model="filterType" @update:model-value="handleTypeChange">
-              <SelectTrigger class="h-9 w-full sm:w-28 text-sm">
-                <SelectValue placeholder="所有类型" />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="all">所有类型</SelectItem>
-                <SelectItem :value="TASK_TYPE.NORMAL">定时任务</SelectItem>
-                <SelectItem :value="TASK_TYPE.REPO">仓库同步</SelectItem>
-              </SelectContent>
-            </Select>
+
+        <div class="flex items-center gap-3 w-full sm:w-auto">
+          <!-- 移动端类型切换 -->
+          <div class="md:hidden flex-1 shrink-0">
+             <Select v-model="filterType" @update:model-value="handleTypeChange">
+               <SelectTrigger class="h-9 w-full text-sm">
+                 <SelectValue />
+               </SelectTrigger>
+               <SelectContent>
+                 <SelectItem :value="TASK_TYPE.NORMAL">定时任务</SelectItem>
+                 <SelectItem :value="TASK_TYPE.REPO">仓库同步</SelectItem>
+               </SelectContent>
+             </Select>
          </div>
+
          <div v-if="filterAgentId"
            class="hidden sm:flex items-center gap-1 px-2 py-1 bg-primary/10 text-primary rounded-md text-sm shrink-0">
            <Server class="h-3.5 w-3.5" />
            <span>{{ filterAgentName }}</span>
            <X class="h-3.5 w-3.5 cursor-pointer hover:text-destructive" @click="clearAgentFilter" />
          </div>
+
          <div class="flex items-center gap-2 shrink-0 justify-end">
-            <Button variant="outline" @click="openCreateRepo" class="shrink-0 px-3 h-9">
-              <GitBranch class="h-4 w-4 sm:mr-2" /> <span class="hidden sm:inline">仓库同步</span>
+            <!-- 动态新增按钮 -->
+            <Button variant="outline" class="shrink-0 px-3 h-9 shadow-sm text-destructive border-destructive/20 hover:bg-destructive/10" @click="confirmBatchDelete">
+              <Trash2 class="h-4 w-4 sm:mr-2" /> <span class="hidden sm:inline">批量删除</span>
            </Button>
-            <Button @click="openCreate" class="shrink-0 px-3 h-9">
+            <Button v-if="filterType === TASK_TYPE.NORMAL" @click="openCreate" class="shrink-0 px-3 h-9 shadow-sm">
              <Plus class="h-4 w-4 sm:mr-2" /> <span class="hidden sm:inline">新建任务</span>
            </Button>
+            <Button v-else-if="filterType === TASK_TYPE.REPO" @click="openCreateRepo" class="shrink-0 px-3 h-9 shadow-sm">
+              <GitBranch class="h-4 w-4 sm:mr-2" /> <span class="hidden sm:inline">同步仓库</span>
+            </Button>
          </div>
+
+          <!-- 桌面端类型切换移到后面 -->
+          <Tabs :model-value="filterType" @update:model-value="v => { filterType = String(v); handleTypeChange() }" class="shrink-0 hidden md:block">
+             <TabsList class="h-9 p-1 bg-muted/30 border">
+                <TabsTrigger :value="TASK_TYPE.NORMAL" class="px-4 h-7 text-[13px]">定时任务</TabsTrigger>
+                <TabsTrigger :value="TASK_TYPE.REPO" class="px-4 h-7 text-[13px]">仓库同步</TabsTrigger>
+             </TabsList>
+          </Tabs>
        </div>
        <!-- 移动端 agent 过滤标签 -->
        <div v-if="filterAgentId"
@@ -282,7 +340,9 @@ watch(() => route.query.agent_id, (newVal) => {
      <!-- 表头 -->
      <div
        class="flex flex-wrap sm:flex-nowrap items-center gap-x-2 gap-y-2 sm:gap-4 px-3 sm:px-4 py-2 sm:py-1.5 border-b bg-muted/20 text-xs sm:text-sm text-muted-foreground font-medium min-w-0 sm:min-w-[1000px]">
-        <span class="w-10 sm:w-12 shrink-0 max-sm:order-1">序号</span>
+        <div class="w-10 sm:w-12 shrink-0 flex items-center gap-2 max-sm:order-1 pl-1">
+          <span class="text-xs sm:text-sm">序号</span>
+        </div>
        <span class="w-8 shrink-0 text-center max-sm:order-2">类型</span>
        <span class="flex-1 min-w-0 sm:flex-none sm:w-40 md:w-48 lg:w-56 shrink-0 max-sm:order-3">名称</span>
        <span class="w-24 sm:w-32 shrink-0 hidden md:block">执行位置</span>
@@ -304,8 +364,10 @@ watch(() => route.query.agent_id, (newVal) => {
        </div>
        <div v-for="(task, index) in tasks" :key="task.id"
          class="flex flex-wrap sm:flex-nowrap items-center gap-x-2 gap-y-2 sm:gap-4 px-3 sm:px-4 py-2.5 sm:py-1.5 hover:bg-muted/30 transition-colors">
-          <span class="w-10 sm:w-12 shrink-0 text-muted-foreground text-xs sm:text-sm max-sm:order-1">#{{ total -
-            (currentPage - 1) * pageSize - index }}</span>
+          <div class="w-10 sm:w-12 shrink-0 flex items-center gap-2 max-sm:order-1 pl-1">
+            <span class="text-muted-foreground text-xs sm:text-sm">#{{ total -
+              (currentPage - 1) * pageSize - index }}</span>
+          </div>
          <span class="w-8 shrink-0 flex justify-center max-sm:order-2" :title="getTaskTypeTitle(task.type || 'task')">
            <GitBranch v-if="task.type === TASK_TYPE.REPO" class="h-3.5 w-3.5 sm:h-4 sm:w-4 text-primary" />
            <Terminal v-else class="h-3.5 w-3.5 sm:h-4 sm:w-4 text-primary" />
@@ -397,7 +459,29 @@ watch(() => route.query.agent_id, (newVal) => {
    <!-- 仓库同步弹窗 -->
    <RepoDialog v-model:open="showRepoDialog" :task="editingTask" :is-edit="isEdit" @saved="loadTasks" />

-    <!-- 删除确认 -->
+    <!-- 最新日志全屏查看 -->
+    <LogViewer v-model:open="showLogViewer" :task-name="latestLogTitle"
+      :log-id="selectedLogId" :initial-status="latestLogStatus" />
+
+    <!-- 删除确认 (批量) -->
+    <AlertDialog v-model:open="showBatchDeleteDialog">
+      <AlertDialogContent>
+        <AlertDialogHeader>
+          <AlertDialogTitle>确认批量删除</AlertDialogTitle>
+          <AlertDialogDescription>
+            将会删除当前所有过滤条件下匹配的 <b>{{ total }}</b> 个任务。操作不可撤销。
+          </AlertDialogDescription>
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel>取消</AlertDialogCancel>
+          <AlertDialogAction class="bg-destructive text-white hover:bg-destructive/90" @click="batchDeleteTasks">
+            确认删除
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+
+    <!-- 删除确认 (单个) -->
    <AlertDialog v-model:open="showDeleteDialog">
      <AlertDialogContent>
        <AlertDialogHeader>