fix: delete inquiry test files
This commit is contained in:
parent
c12a010bff
commit
b11cd41ceb
@ -1,73 +0,0 @@
|
|||||||
'use client'
|
|
||||||
|
|
||||||
import { useParams } from 'next/navigation'
|
|
||||||
|
|
||||||
const inquiryDummyData = {
|
|
||||||
writer: {
|
|
||||||
name: 'writer',
|
|
||||||
email: 'writer@example.com',
|
|
||||||
},
|
|
||||||
title: 'title',
|
|
||||||
content: 'content',
|
|
||||||
files: ['file1.jpg', 'file2.jpg', 'file3.jpg'],
|
|
||||||
createdAt: '2021-01-01',
|
|
||||||
answer: {
|
|
||||||
writer: '佐藤一貴',
|
|
||||||
content:
|
|
||||||
'一次側接続は、自動切替開閉器と住宅分電盤主幹ブレーカの間に蓄電システムブレーカを配線する方法です。\n二次側接続は、住宅分電盤主幹ブレ―カの二次側に蓄電システムブレーカを接続する',
|
|
||||||
createdAt: '2021-01-01 12:00:00',
|
|
||||||
files: ['file4.jpg', 'file5.jpg', 'file6.jpg'],
|
|
||||||
},
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function InquiryDetail() {
|
|
||||||
const params = useParams()
|
|
||||||
const id = params.id
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h1>InquiryDetail</h1>
|
|
||||||
<p>{id}</p>
|
|
||||||
<div className="mt-5">
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
<p>writer</p>
|
|
||||||
<p>{inquiryDummyData.writer.name}</p>
|
|
||||||
</div>
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
<p>email</p>
|
|
||||||
<p>{inquiryDummyData.writer.email}</p>
|
|
||||||
</div>
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
<p>title</p>
|
|
||||||
<p>{inquiryDummyData.title}</p>
|
|
||||||
</div>
|
|
||||||
<div className="grid grid-cols-2 gap-4">
|
|
||||||
<p>content</p>
|
|
||||||
<p>{inquiryDummyData.content}</p>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<p>files</p>
|
|
||||||
<div className="flex flex-col gap-2">
|
|
||||||
{inquiryDummyData.files.map((file) => (
|
|
||||||
<span key={file}>{file}</span>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{inquiryDummyData.answer && (
|
|
||||||
<div className="mt-4">
|
|
||||||
<h1>Reply: Hanwha Japan</h1>
|
|
||||||
<div>
|
|
||||||
<p>{inquiryDummyData.answer.writer}</p>
|
|
||||||
<p>{inquiryDummyData.answer.createdAt}</p>
|
|
||||||
<p>{inquiryDummyData.answer.content}</p>
|
|
||||||
<div className="flex flex-col gap-2">
|
|
||||||
{inquiryDummyData.answer.files.map((file) => (
|
|
||||||
<span key={file}>{file}</span>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
'use client'
|
|
||||||
|
|
||||||
import { Search } from 'lucide-react'
|
|
||||||
import { useRouter } from 'next/navigation'
|
|
||||||
|
|
||||||
|
|
||||||
export default function InquiryFilter({ handleSearch }: { handleSearch: (e: React.ChangeEvent<HTMLInputElement>) => void }) {
|
|
||||||
const router = useRouter()
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<button onClick={() => router.push('/inquiry/write')}>write 1:1 Inquiry {'>'}</button>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<input type="text" placeholder="Search" onChange={handleSearch} />
|
|
||||||
<button>
|
|
||||||
<Search />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,21 +0,0 @@
|
|||||||
'use client'
|
|
||||||
|
|
||||||
import { useRouter } from 'next/navigation'
|
|
||||||
|
|
||||||
export default function InquiryItems({ inquiryData }: { inquiryData: any }) {
|
|
||||||
const router = useRouter()
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
{inquiryData.map((item: any) => (
|
|
||||||
<div key={item.id} onClick={() => router.push(`/inquiry/${item.id}`)}>
|
|
||||||
<div>{item.title}</div>
|
|
||||||
<div>{item.content}</div>
|
|
||||||
<div>{item.createdAt}</div>
|
|
||||||
<div>{item.writer}</div>
|
|
||||||
<div>{item.category}</div>
|
|
||||||
{item.file && <div>{item.file}</div>}
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,171 +0,0 @@
|
|||||||
'use client'
|
|
||||||
import { useState } from 'react'
|
|
||||||
import InquiryItems from './InquiryItems'
|
|
||||||
import InquiryFilter from './InquiryFilter'
|
|
||||||
import LoadMoreButton from '../LoadMoreButton'
|
|
||||||
|
|
||||||
const inquiryDummyData = [
|
|
||||||
{
|
|
||||||
id: 1,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: 'file.png',
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer',
|
|
||||||
category: 'A',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: 'file.png',
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'B',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: null,
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'C',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: null,
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'A',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 5,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: null,
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'B',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 6,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: null,
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'C',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 7,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: 'file.png',
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer',
|
|
||||||
category: 'A',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 8,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: 'file.png',
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'B',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 9,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: null,
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'C',
|
|
||||||
},
|
|
||||||
|
|
||||||
{
|
|
||||||
id: 10,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: 'file.png',
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'A',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 11,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: 'file.png',
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer',
|
|
||||||
category: 'B',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 12,
|
|
||||||
title: 'post',
|
|
||||||
content: 'content',
|
|
||||||
file: null,
|
|
||||||
createdAt: '2024-01-01',
|
|
||||||
writer: 'writer1',
|
|
||||||
category: 'C',
|
|
||||||
},
|
|
||||||
]
|
|
||||||
|
|
||||||
export default function InquiryList() {
|
|
||||||
const [visibleItems, setVisibleItems] = useState(5)
|
|
||||||
const [isMyPostsOnly, setIsMyPostsOnly] = useState(false)
|
|
||||||
const [category, setCategory] = useState('')
|
|
||||||
const [search, setSearch] = useState('')
|
|
||||||
const [hasMore, setHasMore] = useState(inquiryDummyData.length > 5)
|
|
||||||
|
|
||||||
const inquriyData = () => {
|
|
||||||
if (isMyPostsOnly) {
|
|
||||||
return inquiryDummyData.filter((item) => item.writer === 'writer')
|
|
||||||
}
|
|
||||||
if (category.trim().length > 0) {
|
|
||||||
return inquiryDummyData.filter((item) => item.category === category)
|
|
||||||
}
|
|
||||||
if (search.trim().length > 0) {
|
|
||||||
return inquiryDummyData.filter((item) => item.title.includes(search))
|
|
||||||
}
|
|
||||||
return inquiryDummyData
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleLoadMore = () => {
|
|
||||||
const newVisibleItems = Math.min(visibleItems + 5, inquriyData().length)
|
|
||||||
setVisibleItems(newVisibleItems)
|
|
||||||
setHasMore(newVisibleItems < inquriyData().length)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
||||||
setSearch(e.target.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleScrollToTop = () => {
|
|
||||||
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex flex-col gap-2">
|
|
||||||
<InquiryFilter handleSearch={handleSearch} />
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<input type="checkbox" id="myPosts" checked={isMyPostsOnly} onChange={(e) => setIsMyPostsOnly(e.target.checked)} />
|
|
||||||
<label htmlFor="myPosts">my posts</label>
|
|
||||||
</div>
|
|
||||||
<select onChange={(e) => setCategory(e.target.value)}>
|
|
||||||
<option value="">All</option>
|
|
||||||
<option value="A">A</option>
|
|
||||||
<option value="B">B</option>
|
|
||||||
<option value="C">C</option>
|
|
||||||
</select>
|
|
||||||
<span>total {inquriyData().length}</span>
|
|
||||||
<InquiryItems inquiryData={inquriyData().slice(0, visibleItems)} />
|
|
||||||
<LoadMoreButton hasMore={hasMore} onLoadMore={handleLoadMore} onScrollToTop={handleScrollToTop} />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@ -1,67 +0,0 @@
|
|||||||
'use client'
|
|
||||||
|
|
||||||
import { useState } from 'react'
|
|
||||||
import { useRouter } from 'next/navigation'
|
|
||||||
|
|
||||||
export interface InquiryFormData {
|
|
||||||
category: string
|
|
||||||
title: string
|
|
||||||
content: string
|
|
||||||
file: File[]
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function InquiryWriteForm() {
|
|
||||||
const router = useRouter()
|
|
||||||
const [formData, setFormData] = useState<InquiryFormData>({
|
|
||||||
category: 'A',
|
|
||||||
title: '',
|
|
||||||
content: '',
|
|
||||||
file: [],
|
|
||||||
})
|
|
||||||
|
|
||||||
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
||||||
const file = Array.from(e.target.files || [])
|
|
||||||
setFormData({ ...formData, file: [...formData.file, ...file] })
|
|
||||||
}
|
|
||||||
const handleSubmit = () => {
|
|
||||||
console.log('submit: ', formData)
|
|
||||||
// router.push(`/inquiry`)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div>
|
|
||||||
<label htmlFor="category">category</label>
|
|
||||||
<select id="category" onChange={(e) => setFormData({ ...formData, category: e.target.value })}>
|
|
||||||
<option value="A">A</option>
|
|
||||||
<option value="B">B</option>
|
|
||||||
<option value="C">C</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label htmlFor="title">title</label>
|
|
||||||
<input type="text" id="title" onChange={(e) => setFormData({ ...formData, title: e.target.value })} />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label htmlFor="content">content</label>
|
|
||||||
<textarea id="content" onChange={(e) => setFormData({ ...formData, content: e.target.value })} />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label htmlFor="file">file</label>
|
|
||||||
<input type="file" id="file" accept="image/*" capture="environment" onChange={handleFileChange} />
|
|
||||||
<div>
|
|
||||||
<p>file count: {formData.file.length}</p>
|
|
||||||
{formData.file.map((f) => (
|
|
||||||
<div key={f.name}>
|
|
||||||
<div>{f.name}</div>
|
|
||||||
<div>
|
|
||||||
<button>delete</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<button onClick={handleSubmit}>submit</button>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
Loading…
x
Reference in New Issue
Block a user