From 61e2f6ad9e61af177222b7450a2d1a08e72a8050 Mon Sep 17 00:00:00 2001
From: seaHi <me@seahi.me>
Date: Sat, 8 Aug 2026 08:21:50 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=BA=20slug=20=E7=94=9F=E6=88=90?=
 =?UTF-8?q?=E8=BF=87=E7=A8=8B=E6=B7=BB=E5=8A=A0=E5=8A=A0=E8=BD=BD=E7=8A=B6?=
 =?UTF-8?q?=E6=80=81=E4=B8=8E=E4=BA=A4=E4=BA=92=E5=8F=8D=E9=A6=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/utils/slugify.ts                 |  7 ++++++-
 src/routes/admin/categories/+page.svelte |  9 ++++++---
 src/routes/admin/pages/new/+page.svelte  |  9 ++++++---
 src/routes/admin/posts/new/+page.svelte  | 11 +++++++----
 src/routes/admin/series/+page.svelte     |  9 ++++++---
 5 files changed, 31 insertions(+), 14 deletions(-)

diff --git a/src/lib/utils/slugify.ts b/src/lib/utils/slugify.ts
index d171542..2817444 100644
--- a/src/lib/utils/slugify.ts
+++ b/src/lib/utils/slugify.ts
@@ -31,6 +31,7 @@ export function createSlugAutoHandler(opts: {
 	setSlug: (val: string) => void;
 	getIsUserModified: () => boolean;
 	setIsUserModified: (val: boolean) => void;
+	setIsGenerating?: (val: boolean) => void;
 	delayMs?: number;
 }) {
 	const delay = opts.delayMs ?? 400;
@@ -52,7 +53,9 @@ export function createSlugAutoHandler(opts: {
 			}
 
 			timer = setTimeout(async () => {
+				if (opts.setIsGenerating) opts.setIsGenerating(true);
 				const generated = await fetchSlug(nameValue);
+				if (opts.setIsGenerating) opts.setIsGenerating(false);
 				// 在异步返回后，再次确认用户期间没有手动修改 slug
 				if (!opts.getIsUserModified() && generated) {
 					opts.setSlug(generated);
@@ -73,11 +76,13 @@ export function createSlugAutoHandler(opts: {
 		},
 
 		/**
-		 * 用户点击 🔄 重新生成按钮时强制生成
+		 * 用户点击 重新生成按钮时强制生成
 		 */
 		async forceGenerate(nameValue: string) {
 			if (!nameValue.trim()) return;
+			if (opts.setIsGenerating) opts.setIsGenerating(true);
 			const generated = await fetchSlug(nameValue);
+			if (opts.setIsGenerating) opts.setIsGenerating(false);
 			if (generated) {
 				opts.setSlug(generated);
 				// 标记为重置/由系统填充
diff --git a/src/routes/admin/categories/+page.svelte b/src/routes/admin/categories/+page.svelte
index df38d8a..e5220ec 100644
--- a/src/routes/admin/categories/+page.svelte
+++ b/src/routes/admin/categories/+page.svelte
@@ -8,12 +8,14 @@
 	let name = $state('');
 	let slug = $state('');
 	let isSlugUserModified = $state(false);
+	let isGenerating = $state(false);
 
 	const slugHandler = createSlugAutoHandler({
 		getSlug: () => slug,
 		setSlug: (val) => (slug = val),
 		getIsUserModified: () => isSlugUserModified,
-		setIsUserModified: (val) => (isSlugUserModified = val)
+		setIsUserModified: (val) => (isSlugUserModified = val),
+		setIsGenerating: (val) => (isGenerating = val)
 	});
 
 	function handleNameInput() {
@@ -60,10 +62,11 @@
 					<button
 						type="button"
 						class="btn btn-secondary"
-						style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer;"
+						style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer; flex-shrink: 0; min-width: max-content;"
 						onclick={() => slugHandler.forceGenerate(name)}
+						disabled={isGenerating}
 					>
-						重新生成
+						{isGenerating ? '正在生成...' : '重新生成'}
 					</button>
 				</div>
 				<input
diff --git a/src/routes/admin/pages/new/+page.svelte b/src/routes/admin/pages/new/+page.svelte
index 4cc4c24..1c30810 100644
--- a/src/routes/admin/pages/new/+page.svelte
+++ b/src/routes/admin/pages/new/+page.svelte
@@ -13,12 +13,14 @@
 	let content = $state('');
 	let mode = $state<'edit' | 'preview'>('edit');
 	let isSlugUserModified = $state(false);
+	let isGenerating = $state(false);
 
 	const slugHandler = createSlugAutoHandler({
 		getSlug: () => slug,
 		setSlug: (val) => (slug = val),
 		getIsUserModified: () => isSlugUserModified,
-		setIsUserModified: (val) => (isSlugUserModified = val)
+		setIsUserModified: (val) => (isSlugUserModified = val),
+		setIsGenerating: (val) => (isGenerating = val)
 	});
 
 	function handleTitleInput() {
@@ -107,10 +109,11 @@
 					<button
 						type="button"
 						class="btn btn-secondary"
-						style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer;"
+						style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer; flex-shrink: 0; min-width: max-content;"
 						onclick={() => slugHandler.forceGenerate(title)}
+						disabled={isGenerating}
 					>
-						重新生成
+						{isGenerating ? '正在生成...' : '重新生成'}
 					</button>
 				</div>
 				<input
diff --git a/src/routes/admin/posts/new/+page.svelte b/src/routes/admin/posts/new/+page.svelte
index 5a4e6d6..431bcc4 100644
--- a/src/routes/admin/posts/new/+page.svelte
+++ b/src/routes/admin/posts/new/+page.svelte
@@ -30,14 +30,16 @@
 
 	let tagsList = $state(initialData.tags || []);
 	let seriesList = $state(initialData.series || []);
-
+	let isPublished = $state(true);
 	let isSlugUserModified = $state(false);
+	let isGenerating = $state(false);
 
 	const slugHandler = createSlugAutoHandler({
 		getSlug: () => slug,
 		setSlug: (val) => (slug = val),
 		getIsUserModified: () => isSlugUserModified,
-		setIsUserModified: (val) => (isSlugUserModified = val)
+		setIsUserModified: (val) => (isSlugUserModified = val),
+		setIsGenerating: (val) => (isGenerating = val)
 	});
 
 	function handleTitleInput() {
@@ -517,11 +519,12 @@
 					<button
 						type="button"
 						class="btn btn-secondary"
-						style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer;"
+						style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer; flex-shrink: 0; min-width: max-content;"
 						title="生成英文 Slug"
 						onclick={() => slugHandler.forceGenerate(title)}
+						disabled={isGenerating}
 					>
-						重新生成
+						{isGenerating ? '正在生成...' : '重新生成'}
 					</button>
 				</div>
 				<input
diff --git a/src/routes/admin/series/+page.svelte b/src/routes/admin/series/+page.svelte
index 4d8a19d..5183ec6 100644
--- a/src/routes/admin/series/+page.svelte
+++ b/src/routes/admin/series/+page.svelte
@@ -8,12 +8,14 @@
 	let name = $state('');
 	let slug = $state('');
 	let isSlugUserModified = $state(false);
+	let isGenerating = $state(false);
 
 	const slugHandler = createSlugAutoHandler({
 		getSlug: () => slug,
 		setSlug: (val) => (slug = val),
 		getIsUserModified: () => isSlugUserModified,
-		setIsUserModified: (val) => (isSlugUserModified = val)
+		setIsUserModified: (val) => (isSlugUserModified = val),
+		setIsGenerating: (val) => (isGenerating = val)
 	});
 
 	function handleNameInput() {
@@ -54,10 +56,11 @@
 				<button
 					type="button"
 					class="btn btn-secondary"
-					style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer;"
+					style="padding: 0.2rem 0.6rem; font-size: 0.8rem; cursor: pointer; flex-shrink: 0; min-width: max-content;"
 					onclick={() => slugHandler.forceGenerate(name)}
+					disabled={isGenerating}
 				>
-					重新生成
+					{isGenerating ? '正在生成...' : '重新生成'}
 				</button>
 			</div>
 			<input