<template>
    <div class="data-main">
        <section class="main-sec sec1">
            <!-- <div class="main-content"> -->
            <div class="flex">
                <!-- 자료집 비주얼 -->
                <div class="data-b">
                    <div class="w1400">
                        <div class="data-b-b">
                            <!-- 자료집 텍스트 -->
                            <div class="data-text">

                                <p>자료집</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- 자료집 메인 -->
        <section class="data-b-main">
            <div class="data-b">
                <div class="w1400">
                    <div class="data-b-grid">
                        <!-- 윗쪽 아이콘 -->
                        <div class="data-b-1 da1">
                            <p>AI 디지털교과서<br><span>개발 가이드 라인<br> 설명회 발표자료</span></p>
                        </div>
                        <div class="data-b-2 da1">
                            <p>AI 디지털교과서<br><span>정책</span></p>
                        </div>
                        <div class="data-b-3 da1">
                            <p>AI 디지털교과서<br><span>개발아이디어<br> 해커톤 작품집</span></p>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <!-- 자료집 테이블 -->

        <section class="data-table">
            <div class="data-b">
                <div class="w1400">
                    <div class="data-select">


                        <select name="data-table-sild" id="data-table-sild">
                            <option value="전체" selected>전체</option>
                            <option value="기본순">기본순</option>
                            <option value="업로드순" disabled>업로드순</option>
                            <option value="조회순">조회순</option>
                        </select>
                        <div class="input-group">
                            <input type="text" class="input" onfocus="this.value=''; return true;" value="검색어를 입력해주세요.">
                            <input class="button--submit" value="검색" type="submit">
                        </div>
                    </div>
                    <div class="data-table-tr">
                        <table>
                            <th>NO</th>
                            <th>공지사항</th>
                            <th>날짜</th>
                            <th>조회수</th>

                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                            <tr>
                                <td>588</td>
                                <td>[자료집] K-MOOC 마이크로러닝 강좌 개발 가이드라인</td>
                                <td>2023/10/19</td>
                                <td>555</td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </section>
    </div>
</template>

<script>
export default {
    data() {
        return {
        }
    },
    methods: {

    },
    watch: {

    },
    computed: {

    },
    mounted() {
        console.log('Data mounted');
    }
}
</script>