@@ -334,7 +334,7 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
334334 < span id = "edit-link-modal-description" className = "sr-only" >
335335 填写表单以{ link ? '编辑' : '添加' } 导航链接信息
336336 </ span >
337- < div className = ' pt-2' > </ div >
337+ < div className = " pt-2" > </ div >
338338 < Form
339339 form = { form }
340340 labelCol = { { flex : '54px' } }
@@ -350,18 +350,15 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
350350 { max : 500 , message : '地址长度不能超过 500 个字符' } ,
351351 ] }
352352 >
353- < Input
354- placeholder = "https://example.com"
355- onChange = { handleUrlChange }
356- />
353+ < Input placeholder = "https://example.com" onChange = { handleUrlChange } />
357354 </ Form . Item >
358355
359356 < Form . Item
360357 label = "名称"
361358 name = "name"
362359 rules = { [
363360 { required : true , message : '请输入链接名称' } ,
364- { max : 50 , message : '名称长度不能超过 50 个字符' } ,
361+ { max : 30 , message : '名称长度不能超过 30 个字符' } ,
365362 ] }
366363 >
367364 < Input placeholder = "链接名称" />
@@ -370,26 +367,13 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
370367 < Form . Item
371368 label = "描述"
372369 name = "description"
373- rules = { [
374- { max : 200 , message : '描述长度不能超过 200 个字符' } ,
375- ] }
370+ rules = { [ { max : 200 , message : '描述长度不能超过 200 个字符' } ] }
376371 >
377- < Input . TextArea
378- placeholder = "链接描述(可选)"
379- rows = { 3 }
380- showCount
381- maxLength = { 200 }
382- />
372+ < Input . TextArea placeholder = "链接描述(可选)" rows = { 3 } showCount maxLength = { 200 } />
383373 </ Form . Item >
384374
385- < Form . Item
386- label = "分类"
387- name = "category"
388- >
389- < Select
390- placeholder = "选择分类(可选)"
391- allowClear
392- >
375+ < Form . Item label = "分类" name = "category" >
376+ < Select placeholder = "选择分类(可选)" allowClear >
393377 { categories . map ( ( category ) => (
394378 < Select . Option key = { category . id } value = { category . name } >
395379 < span className = "mr-2" > { renderIcon ( category . icon ) } </ span >
@@ -400,12 +384,12 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
400384 </ Form . Item >
401385
402386 < Form . Item label = "图标" >
403- < Space . Compact className = ' w-full flex' >
404- < Select
405- className = ' w-32!'
387+ < Space . Compact className = " w-full flex" >
388+ < Select
389+ className = " w-32!"
406390 value = { iconType }
407391 onChange = { handleIconTypeChange }
408- options = { iconOptions }
392+ options = { iconOptions }
409393 />
410394 { iconType === '2' ? (
411395 < Form . Item name = "icon" className = "flex-1 mb-0!" >
@@ -418,7 +402,7 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
418402 </ Form . Item >
419403 ) : (
420404 < Form . Item name = "icon" className = "flex-1 mb-0!" >
421- < Input
405+ < Input
422406 placeholder = { iconType === '1' ? '自动获取' : '输入图标 URL' }
423407 disabled = { iconType === '1' }
424408 onChange = { handleIconUrlChange }
@@ -455,12 +439,12 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
455439 </ Space . Compact >
456440 </ Form . Item >
457441 </ Col >
458-
442+
459443 < Col xs = { 24 } sm = { 12 } >
460444 < Form . Item label = "预览" >
461445 < div className = "flex items-center gap-3" >
462446 { /* 预览卡片 */ }
463- < div
447+ < div
464448 className = "w-25 h-25 rounded-xl flex items-center justify-center relative overflow-hidden border border-input-border dark:border-dark-input-border dark:brightness-[0.8] transition-all"
465449 style = { { backgroundColor : previewBgColor } }
466450 >
@@ -478,12 +462,10 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
478462 } }
479463 />
480464 ) : (
481- < div className = "text-white/40 text-xs text-center px-2" >
482- 暂无图标
483- </ div >
465+ < div className = "text-white/40 text-xs text-center px-2" > 暂无图标</ div >
484466 ) }
485467 </ div >
486-
468+
487469 { /* 缩放控制按钮 */ }
488470 < div className = "flex flex-col gap-2" >
489471 < Button
@@ -507,11 +489,9 @@ export const EditLinkModal: React.FC<EditLinkModalProps> = ({
507489 title = "重置"
508490 />
509491 </ div >
510-
492+
511493 { /* 缩放比例显示 */ }
512- < div className = "text-sm text-gray-500" >
513- { Math . round ( iconScale * 100 ) } %
514- </ div >
494+ < div className = "text-sm text-gray-500" > { Math . round ( iconScale * 100 ) } %</ div >
515495 </ div >
516496 </ Form . Item >
517497 </ Col >
0 commit comments