48 lines
1.4 KiB
TypeScript

'use client'
import { useInquiryFilterStore } from '@/store/inquiryFilterStore'
import { useRouter } from 'next/navigation'
import { useState } from 'react'
export default function ListForm() {
const router = useRouter()
const [searchKeyword, setSearchKeyword] = useState('')
const { inquiryListRequest, setInquiryListRequest } = useInquiryFilterStore()
const handleSearch = () => {
if (searchKeyword.length >= 2) {
setInquiryListRequest({ ...inquiryListRequest, schTitle: searchKeyword })
}
}
const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
handleSearch()
}
}
return (
<>
<div className="sale-frame">
<div className="sale-form-bx">
<button className="btn-frame n-blue icon" onClick={() => router.push('/inquiry/regist')}>
<i className="btn-arr"></i>
</button>
</div>
<div className="sale-form-bx">
<div className="search-input">
<input
type="text"
className="search-frame"
placeholder="タイトルを入力してください. (2文字以上)"
value={searchKeyword}
onChange={(e) => setSearchKeyword(e.target.value)}
onKeyDown={handleKeyDown}
/>
<button className="search-icon" onClick={handleSearch}></button>
</div>
</div>
</div>
</>
)
}