import {Tag,} from "antd-mobile";
import React from "react";
import {useLocation, useNavigate} from 'react-router-dom';
import {CloseOutline, SearchOutline} from "antd-mobile-icons";
import "./index.css"

const DetailSearchBar = () => {
    const navigate = useNavigate();
    const location = useLocation();
    const search = location.state?.search;
    console.log("DetailSearchBar.search", search)
    return (
        <div className="detailSearchBar">
            <div className={"onSearchItem " + (search ? "onSearchItemWidth" : "onSearchItemOnlyWidth")} onClick={() => {
                navigate("/detail/searchTask")
            }}>
                <SearchOutline/><Tag color={"danger"}>紧急重要</Tag>
            </div>
            {search && <div className="CloseOutline-CloseOutline" onClick={() => {
                console.log("CloseOutline-Close");
            }}>
                <CloseOutline style={{float: "right"}}/>
            </div>
            }


            {/*<SearchBar placeholder='请输入内容' onFocus={() => {*/}
            {/*    navigate("/detail/searchTask")*/}
            {/*}}*/}

            {/*>*/}
            {/*    */}
            {/*</SearchBar>*/}
        </div>
    )
}
export default DetailSearchBar;