const fileName = [
    {id:1, name:'北面設置配置設計およ び発注案内操作マニュアル'},
    {id:2, name:'北面屋根設置に関する確認書'},
    {id:3, name:'サービス要求フォーム'},
    {id:4, name:'図面屋根の説明書'},
    {id:5, name:'保証書再発行依頼書 (申請内容訂正理由)'},
    {id:6, name:'図面操作マニュアル'},
    {id:7, name:'北面設置配置設計およ び発注案内操作マニュアル'},
    {id:8, name:'北面屋根設置に関する確認書'},
    {id:9, name:'サービス要求フォーム'},
    {id:10, name:'図面屋根の説明書'},
    {id:11, name:'図面屋根の説明書'},
    {id:12, name:'資料ダウンロードタイトル'},
]

export default function FileDownForm(){
    return(
        <div className="sub-table-box">
            <div className="community-search-warp">
                <div className="community-search-box">
                    <input type="text" className="community-input" />
                    <button className="community-search-ico"></button>
                </div>
                <div className="community-search-keyword"><span>qpeak</span> について銃 <span>5</span> 提案 投稿が検索されました.</div>
            </div>
            <div className="table-box-title-wrap">
                <div className="title-wrap">
                    <h3>文書リスト </h3>
                    <ul className="info-wrap">
                        <li>全体 <span className="red">6</span></li>
                    </ul>
                </div>
            </div>
                
            <div className="file-down-list">
                {fileName.map((item) => (
                    <div key={item.id} className="file-down-item">
                        <div className="file-item-info">
                            <div className="item-num">98</div>
                            <div className="item-name">{item.name}</div>
                            <div className="item-date">アップデート : 2024.07.18 10:00:11</div>
                        </div>
                        <div className="file-down-box">
                            <button className="file-down-btn"></button>
                        </div>
                    </div>
                ))}
            </div>

            {/* 자료 없을때 */}
            {/* <div className="file-down-nodata">
                No Data...
            </div> */}
        </div>
    )
}