diff --git a/static/app.js b/static/app.js
index 37a6c51..8894db9 100644
--- a/static/app.js
+++ b/static/app.js
@@ -184,12 +184,22 @@ function renderProjects() {
     `<button class="btn btn-ghost btn-sm text-blue-600" onclick="event.stopPropagation(); showTaskModal(${x.id})"><i data-lucide="eye"></i>查看</button>`
   ]);
   document.querySelector("#projects").innerHTML = `<div class="grid gap-4">
-    ${card(formHtml([
-      { label: "项目名称", input: `<input name="project_name" required>` },
-      { label: "当前阶段", input: `<select name="current_stage"><option>项目准备</option><option>项目执行</option><option>项目验收</option><option>验收完毕</option></select>` },
-      { label: "项目金额", input: `<input name="expected_contract_amount" type="number" step="0.01" placeholder="万元">` },
-      { label: "负责人", input: `<input name="owner">` },
-    ], { handler: "createOperation", text: "新增项目" }), "p-4")}
+    <div class="flex items-center justify-between">
+      <div class="flex gap-2">
+        ${[["all","全部"],["项目准备","准备"],["项目执行","执行"],["项目验收","验收"],["验收完毕","完毕"]].map(([k,v]) => `<button class="btn ${state.opFilter === k ? "btn-primary" : "btn-ghost"} btn-sm" onclick="state.opFilter='${k}'; renderProjects()">${v}</button>`).join("")}
+      </div>
+      <button class="btn btn-primary" onclick="document.querySelector('#project-form').classList.toggle('hidden')">
+        <i data-lucide="plus"></i>新增项目
+      </button>
+    </div>
+    <div id="project-form" class="hidden">
+      ${card(formHtml([
+        { label: "项目名称", input: `<input name="project_name" required>` },
+        { label: "当前阶段", input: `<select name="current_stage"><option>项目准备</option><option>项目执行</option><option>项目验收</option><option>验收完毕</option></select>` },
+        { label: "项目金额", input: `<input name="expected_contract_amount" type="number" step="0.01" placeholder="万元">` },
+        { label: "负责人", input: `<input name="owner">` },
+      ], { handler: "createOperation", text: "确认新增" }), "p-4")}
+    </div>
     ${renderTable(["项目", "项目说明", "当前阶段", "项目金额", "负责人", "进展"], rows, items.map((x) => ({ resource: "operations", id: x.id })))}
   </div>`;
 }