@extends('layouts.app')

@section('content')
<div class="d-flex flex-column flex-xl-row bg-white">
    <div class="left-image-section board-left-section flex-column d-none d-xl-flex">
        <div class="page-header">
            <div class="menu-root d-none d-xl-block">{{ $page['title'] }}@if($page['subTitle']) <i class="fa-solid fa-chevron-right"></i> {{ $page['subTitle'] }}@endif</div>
            <div class="header-title d-none d-xl-block">@if($page['subTitle']){{ $page['subTitle'] }}@else{{ $page['title']}}@endif</div>
            <div class="header-mobile-logo d-block d-xl-none"><img src="/images/word-logo-white.png" class="img-fluid"></div>
        </div>
        <div class="board-links">
            <a href="{{ route('board.list', ['notice'], false) }}"@if($data->code == 'notice') class="active"@endif><div>공지사항</div></a>
            <a href="{{ route('board.list', ['news'], false) }}"@if($data->code == 'news') class="active"@endif><div>뉴스</div></a>
            <a href="{{ route('board.create', ['inquiry'], false) }}"@if($data->code == 'inquiry') class="active"@endif><div>문의하기</div></a>
        </div>
    </div>
    <div class="board-section notice-view">
        <div class="board-title d-flex">
            <div class="font-28" style="flex:1">{!! $data->subject !!}</div>
            <div class="complete-logo d-none d-xl-block">
                <img src="/images/complete-logo.png" class="img-fluid"/>
            </div>
        </div>
        <div class="board-date font-16 line-top line-bottom">{{ date('Y.m.d H:i', strtotime($data->created_at)) }}</div>
        <div class="board-content line-bottom">
            @if($data->images && count($data->images))
                @foreach($data->images as $i => $asset)
                    <p class="board-image"><img src="{{ route('image', [$asset->uid], false) }}" alt="" /></p>
                @endforeach
            @endif
            <div class="board-detail">
               {!! $data->content !!}
            </div>
            @if($data->files && count($data->files))
                <div class="board-file">
                    <p><i class="fas fa-folder"></i>첨부파일</p>
                    <ul class="file-btn">
                        @foreach($data->files as $i => $asset)
                            <li><a class="cut-text" href="{{ route('download', [$asset->uid], false) }}"><i class="fas fa-file"></i>{{ $asset->orgin_name }} ({{ human_filesize($asset->size) }})</a></li>
                        @endforeach
                    </ul>
                </div>
            @endif
        </div>
        <div class="board-controll justify-content-between">
            <a href="{{ route('board.list', [$data->code], false) }}" class="white-round-btn font-16">목록</a>
            @if($data->prev || $data->next)
            <div>
                @if($data->prev)
                    <a href="{{ route('board.view', [$data->code, $data->prev->uid], false) }}"><img src="/images/icons/btn-prev.png" alt="이전글" style="width:36px" /></a>
                @endif
                @if($data->next)
                    <a href="{{ route('board.view', [$data->code, $data->next->uid], false) }}"><img src="/images/icons/btn-next.png" alt="다음글" style="width:36px " /></a>
                @endif
            </div>
            @endif
        </div>
    </div>
</div>
@endsection

@push('style')
<link rel="stylesheet" type="text/css" href="/css/board.css?v={{ $now }}">
@endpush

@push('scripts')
<script type="text/javascript" src="/js/board.js?v={{ $now }}"></script>
<script type="text/javascript">
$(window).on('load', function() {
    imagesLoad($(".board-content img"));
});
</script>
@endpush