Skip to content

Commit 6a9f4a4

Browse files
authored
Merge pull request #7 from weizwz/dev
Dev
2 parents c9aff15 + df509fb commit 6a9f4a4

File tree

4 files changed

+1329
-187
lines changed

4 files changed

+1329
-187
lines changed

components/modals/EditCategoryModal.tsx

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export const EditCategoryModal: React.FC<EditCategoryModalProps> = ({
6565
cancelText="取消"
6666
destroyOnHidden
6767
>
68-
<div className='pt-2'></div>
68+
<div className="pt-2"></div>
6969
<Form
7070
form={form}
7171
labelCol={{ flex: '54px' }}
@@ -80,17 +80,13 @@ export const EditCategoryModal: React.FC<EditCategoryModalProps> = ({
8080
name="name"
8181
rules={[
8282
{ required: true, message: '请输入分类名称' },
83-
{ max: 20, message: '分类名称不能超过20个字符' },
83+
{ max: 20, message: '分类名称不能超过 20 个字符' },
8484
]}
8585
>
8686
<Input placeholder="请输入分类名称" />
8787
</Form.Item>
8888

89-
<Form.Item
90-
label="图标"
91-
name="icon"
92-
rules={[{ required: true, message: '请选择图标' }]}
93-
>
89+
<Form.Item label="图标" name="icon" rules={[{ required: true, message: '请选择图标' }]}>
9490
<IconPicker />
9591
</Form.Item>
9692
</Form>

components/modals/EditLinkModal.tsx

Lines changed: 18 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -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>

components/navigation/LinkCard.tsx

Lines changed: 35 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -260,14 +260,11 @@ const LinkCardBase: React.FC<LinkCardProps> = ({ link, onEdit, onDelete, isDragg
260260
{...(isDraggingEnabled ? listeners : {})}
261261
{...(isDraggingEnabled ? attributes : {})}
262262
>
263-
<Dropdown
264-
menu={{ items: menuItems }}
265-
trigger={['contextMenu']}
266-
>
263+
<Dropdown menu={{ items: menuItems }} trigger={['contextMenu']}>
267264
<motion.div
268-
whileHover={{
265+
whileHover={{
269266
y: -4,
270-
transition: { duration: 0.2 }
267+
transition: { duration: 0.2 },
271268
}}
272269
className="h-full"
273270
onContextMenu={handleContextMenu}
@@ -292,41 +289,42 @@ const LinkCardBase: React.FC<LinkCardProps> = ({ link, onEdit, onDelete, isDragg
292289
height: '100%',
293290
padding: 0,
294291
display: 'flex',
295-
}
292+
},
296293
}}
297294
>
298-
{/* 左侧:背景色 + 图标 */}
299-
<div
300-
className="flex-none w-22 flex items-center justify-center text-white relative overflow-hidden dark:brightness-[0.8]"
301-
style={{
302-
backgroundColor: link.backgroundColor || '#bae0ff',
303-
}}
304-
aria-hidden="true"
305-
>
306-
{renderIcon}
307-
{
308-
(link.backgroundColor === '#ffffff' || link.backgroundColor === 'rgb(255, 255, 255)' || link.backgroundColor?.indexOf('rgba(255, 255, 255') === 0) &&
309-
<div className='absolute right-0 top-7/32 h-9/16 w-0 border-r border-card-border z-0'></div>
310-
}
311-
</div>
312-
313-
{/* 右侧:名称 + 描述 */}
314-
<div className="flex-1 flex flex-col justify-center p-3 bg-(--background-main) gap-1">
315-
{/* 名称 */}
316-
<div className="text-[15px] font-semibold text-(--foreground) overflow-hidden text-ellipsis whitespace-nowrap leading-snug">
317-
{link.name}
295+
{/* 左侧:背景色 + 图标 */}
296+
<div
297+
className="flex-none w-22 flex items-center justify-center text-white relative overflow-hidden dark:brightness-[0.8]"
298+
style={{
299+
backgroundColor: link.backgroundColor || '#bae0ff',
300+
}}
301+
aria-hidden="true"
302+
>
303+
{renderIcon}
304+
{(link.backgroundColor === '#ffffff' ||
305+
link.backgroundColor === 'rgb(255, 255, 255)' ||
306+
link.backgroundColor?.indexOf('rgba(255, 255, 255') === 0) && (
307+
<div className="absolute right-0 top-7/32 h-9/16 w-0 border-r border-card-border z-0"></div>
308+
)}
318309
</div>
319-
320-
{/* 描述 */}
321-
{link.description && (
322-
<div className="text-xs text-(--foreground-secondary) overflow-hidden text-ellipsis line-clamp-2 leading-relaxed">
323-
{link.description}
310+
311+
{/* 右侧:名称 + 描述 */}
312+
<div className="w-full flex-1 flex flex-col justify-center p-3 bg-(--background-main) gap-1 overflow-hidden">
313+
{/* 名称 */}
314+
<div className="text-[15px] font-semibold text-(--foreground) overflow-hidden text-ellipsis whitespace-nowrap leading-snug">
315+
{link.name}
324316
</div>
325-
)}
326-
</div>
327-
</Card>
328-
</motion.div>
329-
</Dropdown>
317+
318+
{/* 描述 */}
319+
{link.description && (
320+
<div className="text-xs text-(--foreground-secondary) overflow-hidden text-ellipsis line-clamp-2">
321+
{link.description}
322+
</div>
323+
)}
324+
</div>
325+
</Card>
326+
</motion.div>
327+
</Dropdown>
330328
</div>
331329
);
332330
};

0 commit comments

Comments
 (0)