<!DOCTYPE html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>搜尋引擎 - search5</title>
<script src="https://unpkg.com/htmx.org@1.9.10"></script>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-50 min-h-screen">
<div class="max-w-4xl mx-auto px-4 py-16">
<div class="text-center mb-12">
<h1 class="text-5xl font-bold text-gray-800 mb-4">🔍 搜尋引擎</h1>
<p class="text-gray-500 text-lg">search5 - 本地文件搜尋系統</p>
</div>
<form action="/search" method="get" class="mb-8">
<div class="flex gap-2 max-w-2xl mx-auto">
<input
type="text"
name="q"
placeholder="輸入關鍵字搜尋..."
class="flex-1 px-6 py-4 text-lg border-2 border-gray-300 rounded-lg focus:border-blue-500 focus:outline-none"
required
>
<button
type="submit"
class="px-8 py-4 bg-blue-600 text-white text-lg font-semibold rounded-lg hover:bg-blue-700 transition"
>
搜尋
</button>
</div>
</form>
{% if stats.indexed > 0 %}
<div class="bg-white rounded-lg shadow p-6 mb-6">
<h2 class="text-xl font-semibold mb-4">📊 索引狀態</h2>
<div class="grid grid-cols-2 gap-4">
<div class="text-center p-4 bg-blue-50 rounded-lg">
<div class="text-3xl font-bold text-blue-600">{{ stats.indexed }}</div>
<div class="text-gray-600">已索引文件</div>
</div>
<div class="text-center p-4 bg-green-50 rounded-lg">
<div class="text-3xl font-bold text-green-600">{{ stats.documents }}</div>
<div class="text-gray-600">文件總數</div>
</div>
</div>
</div>
{% else %}
<div class="bg-yellow-50 border border-yellow-200 rounded-lg p-6 mb-6">
<p class="text-yellow-800">
⚠️ 尚未建立索引,請先呼叫 <code>POST /index</code> 建立索引
</p>
</div>
{% endif %}
<div class="bg-white rounded-lg shadow p-6">
<h2 class="text-xl font-semibold mb-4">💡 API 使用說明</h2>
<div class="space-y-4 font-mono text-sm">
<div class="p-3 bg-gray-100 rounded">
<span class="text-green-600">POST</span> /index - 建立索引
</div>
<div class="p-3 bg-gray-100 rounded">
<span class="text-blue-600">GET</span> /search?q=關鍵字 - 搜尋
</div>
<div class="p-3 bg-gray-100 rounded">
<span class="text-blue-600">GET</span> /index/status - 索引狀態
</div>
</div>
</div>
</div>
</body>
</html>