<template>
    <div class="title-box flex justify-between mb40">
        <p class="title">공지 등록</p>
    </div>
        <div class="board-wrap">
            <div class="flex align-center">
                <label for="" class="title2">제목</label>
                <input type="text" class="data-wrap">
            </div>
            <hr>
            <textarea name="" id=""></textarea>
            <hr>
            <div class="flex align-center">
                <label for="" class="title2">첨부파일</label>
                <input type="file" ref="fileInput" @change="handleFileUpload" />
            </div>
            <hr>
            <div class="flex justify-between">
                <button type="button" class="flex align-center">
                            <svg-icon type="mdi" :path="mdilChevronLeft" ></svg-icon>
                   <p> 이전글</p>
                        </button>
                <button type="button" class="flex align-center"><p>다음글</p>
                            <svg-icon type="mdi" :path="mdilChevronRight" ></svg-icon>

                        </button>


            </div>
        </div>
        <div class="flex justify-between mt50">
                <button type="button" title="글쓰기" class="new-btn"  @click="goToPage('Board')">
                    목록
                </button>
               <div class="flex">
                    <button type="button" title="글쓰기" class="new-btn mr10"  >
                        수정
                    </button>
                    <button type="button" title="글쓰기" class="new-btn"  >
                        삭제
                    </button>
               </div>
        </div>
</template>

<script>
import SvgIcon from '@jamescoyle/vue-icon';
import { mdiMagnify } from '@mdi/js';
import { mdilChevronRight,mdilChevronLeft } from '@mdi/light-js';


export default {
    data () {
        return {
            mdiMagnify: mdiMagnify,
            mdilChevronRight: mdilChevronRight ,
            mdilChevronLeft:mdilChevronLeft,
        }
    },
    methods: {
        goToPage(page) {
         this.$router.push({ name: page });
      },
    },
    watch: {

    },
    computed: {
       
    },
    components:{
        SvgIcon
    },
    mounted() {
        console.log('Main2 mounted');
    }
}
</script>