feat:使用字典

src/components/DetailSearchBar/index.js

@@ -1,23 +1,54 @@
 import {Tag,} from "antd-mobile";
-import React from "react";
+import React, {useEffect, useState} from "react";
 import {useLocation, useNavigate} from 'react-router-dom';
 import {CloseOutline, SearchOutline} from "antd-mobile-icons";
 import "./index.css"
+import {getDictionary} from "../../utils/dictUtil";
 
-const DetailSearchBar = () => {
+const DetailSearchBar = (props) => {
-    const navigate = useNavigate();
+    // 从搜索设置中传来的search
-    const location = useLocation();
+    // const location = useLocation();
-    const search = location.state?.search;
+    // const searchUpdate = location.state?.search;
+    // 父子传值从搜索框传来的search
+    const {search,updateSearch} = props;
     console.log("DetailSearchBar.search", search)
+    const [tags, setTags] = useState([]);
+    useEffect(() => {
+        if (search && search.data) {
+            Promise.all(
+                search.data.map(async (searchObj) => {
+                    if (searchObj.name === "state") {
+                        const dictionary = await getDictionary("2");
+                        const items = searchObj.value.split(',');
+                        const itemPromises = items.map((item) => {
+                            const dict = dictionary.get(item);
+                            return dict ? <Tag key={dict.id} color={dict.jsonValue?.color}>{dict.itemName}</Tag> : null;
+                        });
+                        return Promise.all(itemPromises);
+                    }
+                })
+            ).then((results) => {
+                // Flatten the results and filter out null values
+                const flattenedResults = results.flat().filter(Boolean);
+                console.log("flattenedResults", flattenedResults);
+                setTags(flattenedResults);
+            });
+        }
+    }, []);
+
+    const navigate = useNavigate();
     return (
         <div className="detailSearchBar">
             <div className={"onSearchItem " + (search ? "onSearchItemWidth" : "onSearchItemOnlyWidth")} onClick={() => {
-                navigate("/detail/searchTask")
+                navigate("/detail/searchTask", {state: {"search":search}});
             }}>
-                <SearchOutline/><Tag color={"danger"}>紧急重要</Tag>
+                <SearchOutline/>
+                {/*根据search处理搜素框展示内容*/}
+                {tags}
             </div>
             {search && <div className="CloseOutline-CloseOutline" onClick={() => {
-                console.log("CloseOutline-Close");
+                updateSearch(null);
+                setTags([]);
             }}>
                 <CloseOutline style={{float: "right"}}/>
             </div>

src/components/ParentTask/index.js

@@ -38,11 +38,11 @@ const ParentTask = (props)=>{
         //     return
         // }
         const data = await getTaskByPid(v)
-        console.log("await getTaskByPid(v)",data.data.data.content)
+        console.log("await getTaskByPid(v)",data.content)
         const options =
-            data.data.data.content.length === 0
+            data.content.length === 0
                 ? null
-                : data.data.data.content.map(task => ({
+                : data.content.map(task => ({
                     value: task.id,
                     label: task.name,
                 }))

src/pages/DetailSearchContext/index.js

@@ -6,20 +6,25 @@ import {CloseCircleFill} from "antd-mobile-icons";
 import {useLocation, useNavigate, useOutletContext} from "react-router-dom";
 const now = new Date()
 const DetailSearchContext = () => {
+    // 使用Outlet,传值修改标题
     const {setTitle} = useOutletContext();
     setTitle("搜索查询")
     const navigate = useNavigate();
     const [form] = Form.useForm();
     const [visible, setVisible] = React.useState(false);
     const location = useLocation();
-    const search = location.state?.search;
+    console.log("DetailSearchContext",location);
+    const {search,updateSearch} = location.state;
     console.log("DetailSearchContext.search",search)
     return (
         <Form
             form={form}
             layout='horizontal'
             onFinish={(values)=>{
-                navigate("/home/todo", { state: { search: values } })
+                // navigate("/home/todo", { state: { search: values } })
+                // 根据values处理search
+                // updateSearch()
+                navigate("/home/todo")
             }}
             footer={
                 <Button block type='submit' color='primary' size='large'>

src/pages/Home/index.js

@@ -4,6 +4,7 @@ import './index.css'
 import {Outlet} from 'react-router-dom'
 import DetailSearchBar from "../../components/DetailSearchBar";
 
+
 export default class Home extends React.Component {
     constructor(props) {
         super(props);
@@ -17,10 +18,13 @@ export default class Home extends React.Component {
                     {"name":"expectedStartTime","value":"2024-12-29T16:00:00.000Z","operateType":"<="}]}
         };
     }
+    updateSearch = (values) => {
+        this.setState({search:values});
+    };
     render() {
         return (
             <div className='body'>
-                <DetailSearchBar/>
+                <DetailSearchBar search={ this.state.search } updateSearch={this.updateSearch} />
                 <div style={{marginTop:"40px",marginBottom:"49px",width:"100%"}}>
                     <Outlet/>
                 </div>

src/pages/ToDoList/index.js

@@ -31,15 +31,15 @@ const ToDoList = () => {
     console.log("ToDoList.search",search)
     async function loadMore() {
         getTaskList(pageNumber+1).then(result => {
-            setTaskList(val => [...val, ...result.data.data.content])
+            setTaskList(val => [...val, ...result.content])
-            setHasMore(result.data.data.content.length > 0)
+            setHasMore(result.content.length > 0)
         })
         setPageNumber(pageNumber + 1)
     }
 
     useEffect(() => {
         getTaskList(pageNumber).then(result => {
-            setTaskList(result.data.data.content)
+            setTaskList(result.content)
         })
     }, [])
     const onDragEnd = (result) => {
@@ -54,7 +54,7 @@ const ToDoList = () => {
                 onRefresh={async () => {
                     getTaskList(1).then(result => {
                         console.log("getTaskList()", result)
-                        setTaskList(result.data.data.content)
+                        setTaskList(result.content)
                         setPageNumber(1)
                         setHasMore(true)
                     })

src/utils/dictUtil.js

@@ -0,0 +1,17 @@
+import {requestUtil} from "./requestUtil";
+
+const dict = new Map();
+export const getDictionary= async (typeId) => {
+    if (dict.has(typeId)) {
+        return dict.get(typeId);
+    }
+    let search = encodeURI(`{"data":[{"code":"type_id","value":"${typeId}","operateType":"="}]}`)
+    let todo = await requestUtil.get(`/todo-server/search/dict_items?search=${search}`);
+     let context = todo.content;
+     let result;
+     if (context.length>0){
+         result = new Map(context.map(item => [item.itemCode, item]))
+         dict.set(typeId,result);
+     }
+    return result;
+}

src/utils/index.js

@@ -34,7 +34,5 @@ export const getTaskByPid = (pid) => {
 }
 export const addTask = async (entity) => {
     // 使用 Axios 发送 POST 请求添加数据
-    const response = await requestUtil.post('/todo-server' + '/task', entity);
+    return  await requestUtil.post('/todo-server' + '/task', entity);
-    // 从响应中提取数据并返回
+}
-    return response.data;
-}

src/utils/requestUtil.js

@@ -4,4 +4,18 @@ export const requestUtil = axios.create({
     baseURL: 'http://www.huaruyu.com/',
     timeout: 1000,
     headers: {'Authorization': 'Bearer eyJraWQiOiIwNzdlYzBjMi1iZDQwLTRjODktOGE5OC05OTI1YmZkNzJlZjAiLCJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpc3MiOiJzaGl4aWFvaHVhIiwic3ViIjoie1wiaWRcIjpcIjM2OTg0Nzc3MTAxODAzNTIwXCIsXCJuaWNrbmFtZVwiOlwi5biI5pmT5Y2OXCIsXCJ1c2VybmFtZVwiOlwic2hpeGlhb2h1YVwifSJ9.WiNGZYbWlIdu3WL7ujtlKsGa42IblW93SG-Mf4jDOuECWrDHFNA0gJBKUQkWKQfpWWRaIzcBmUC78WkIM5yFIHiB2_wBXyywHyjVCWBYC3sTJghtWogLB9ceR69eNfCZanm_ZlrcIEWJ9rqCk-hmMEuWwIk9xJ-M4hFGHkoAr_ftYJiBkGqgKpXOeVE_Tish6SqYZtN-V6Dcnyny3k7T6lG1jzXGyhokEzg_0B5hYpRvvA-GJx14Q1RO6Sv3vgMFOX63bhKX3L7KCSwLO2NJ5GkFHXqcDCf_-pnbiHUtP1JrchzXGWpI_Blrlf_65CdrMWuyVSGtDJ6_Z-Ef4Uq_tQ'}
+});
+// 添加响应拦截器
+requestUtil.interceptors.response.use(function (response) {
+    // 2xx 范围内的状态码都会触发该函数。
+    // 对响应数据做点什么
+    console.log("response",response);
+    if (response.data.data.status !== 200){
+
+    }
+    return response.data.data;
+}, function (error) {
+    // 超出 2xx 范围的状态码都会触发该函数。
+    // 对响应错误做点什么
+    return Promise.reject(error);
 });