整体链接
Change-Id: Id3379c6188613acdc95548964f19e317eda8dc4f
diff --git a/src/components/corner/corner.tsx b/src/components/corner/corner.tsx
index ad80476..7f8d900 100644
--- a/src/components/corner/corner.tsx
+++ b/src/components/corner/corner.tsx
@@ -1,15 +1,30 @@
-// src/components/BottomRightUpload.tsx
-import React, { use } from 'react';
+
+import React, { useState, useCallback, useEffect } from 'react';
import styles from './corner.module.css';
import { useNavigate } from 'react-router';
import { useSearchParams } from 'react-router-dom';
-const BottomRightUpload: React.FC = () => {
+import { MainTag, MainPostTag } from '@/types/common';
+import { Button, Checkbox, Row, Col } from 'antd';
+import { getTagsByMainTag } from '@/utils/common';
+interface CornerProp {
+
+ setTagIds: (tagIds: number[]) => void;
+}
+
+const BottomRightUpload: React.FC<CornerProp> = (props:CornerProp) => {
const [searchParams] = useSearchParams();
+ const [tags, setTags] = useState<Map<string, number>>(new Map);
+ const [selectdTags, setSelectedTags] = useState<number[]>([])
+ const setTagIds = props.setTagIds;
const navigate = useNavigate();
const type = searchParams.get('type');
+
const handleUploadClick = () => {
navigate('/createPost', { state: { isNewPost: true, type} });
};
+ useEffect(()=>{
+ setTags(getTagsByMainTag(type as string))
+ },[])
return (
<div className={styles.container}>
@@ -18,17 +33,6 @@
</button>
<div className={styles.filterItem}>
- <label htmlFor="category">分区：</label>
- <select id="category">
- <option value="all">全部</option>
- <option value="video">视频</option>
- <option value="music">音乐</option>
- <option value="game">游戏</option>
- <option value="software">软件</option>
- </select>
- </div>
-
- <div className={styles.filterItem}>
<label htmlFor="rating">评分：</label>
<select id="rating">
<option value="all">全部</option>
@@ -40,8 +44,41 @@
<div className={styles.filterItem}>
<label htmlFor="tag">标签：</label>
- <input type="text" id="tag" placeholder="输入标签关键词" />
+ <Checkbox.Group
+ value={selectdTags}
+ onChange={(checkedValues) =>{
+ setSelectedTags([...checkedValues])
+ }}
+ >
+ <Row gutter={[12, 12]}>
+ {[...tags.entries()].map(([name, id]) => (
+ <Col key={id} xs={12} sm={12} md={8} lg={6}>
+ <Checkbox value={id}>{name}</Checkbox>
+ </Col>
+ ))}
+ </Row>
+ </Checkbox.Group>
</div>
+
+ <Button
+ color='primary'
+ variant='outlined'
+ onClick={()=>{
+ console.log(selectdTags)
+ setTagIds([...selectdTags])
+
+ }}
+ > 筛选 </Button>
+
+ <Button
+ color='danger'
+ variant='outlined'
+ onClick={()=>{
+ setTagIds([])
+ setSelectedTags([])
+ }}
+ >清空筛选
+ </Button>
</div>
);
};