@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', ['gallery'], false) }}"@if($board->code == 'gallery') 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