@extends('layouts.app')

@section('title', '編輯文章 - 經濟部產業發展署工業安全網站')

@push('styles')
    <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
    <link href="{{ asset('css/editor.css') }}" rel="stylesheet">
@endpush

@section('content') 
    
    <div class='container'>
        @isset($id)
        <span id="id" class='d-none'>{{ $id }}</span>
        @endisset
        <div class='card mt-4'>            
            <div class='card-header'>新增項目</div>
            <div class='card-body'>
                <form @if(isset($id)) action="{{ url( 'api/' . $type . '/upd/' . $id ) }}" @else action="{{ url( 'api/'.$type ) }}" @endif method="post" enctype="multipart/form-data">
                    @csrf

                    <!-- Tags -->
                    @if ($type === 'cats')
                        <div class='col-md-12 mb-3'>
                            <label for="inputTitle">標題：</label>
                            <input type="text" class="form-control @error('name') is-invalid @enderror" placeholder="類別名稱" name="name" required id="inputTitle">
                        </div>

                    <!-- News -->
                    @elseif ($type === 'news')
                        <input type="hidden" value="{{ Auth::id() }}" name="user_id">

                        <!-- title -->
                        <div class="form-group">
                            <label for="inputTitle">一、標題：</label>
                            <textarea class="form-control" id="inputTitle" name="title" placeholder="標題..." rows="2" required></textarea>
                        </div>

                        <!-- category_id -->
                        <div class="form-group">
                            <label for="Select">二、類別：</label>
                            <select class="form-control" id="Select" name="category_id" required></select>
                        </div>

                        <!-- expired time -->
                        <div class="form-group">
                            <label for="inputTime">三、設定過期日：</label>
                            <input type="date" class="form-control" id="inputTime" name="expired_date" required>
                            <small class="form-text text-muted">
                                若您選擇 2021-01-01，表示貼文只能發佈到 2020-12-31 23:59:59 為止。
                            </small>
                        </div>

                        <!-- pin -->
                         
                        <label>四、是否要設立為頂置：</label>
                        <select class="form-group" id="Select" name="pinned" required>
                            <option value="0">不設頂置</option>
                            <option value="1">設頂置</option>
                        </select>

                        <!-- content -->
                        <div class="form-group">
                            <label for="inputContent">五、內文：</label>
                            <small class="form-text text-muted">
                                請注意：務必使用「完整」網址 (https://...)，並且不要自行更改語法，以免魔法失效 (ง •̀_•́)ง <br>
                                若希望超連結以「新開視窗」的方式打開，超連結文字需含有「另開新視窗」此詞句。
                                超連結文字請務必<strong>詳細說明連結將導向何處</strong>，例如：「另開新視窗，109年度新生營隊活動報名連結」。
                            </small>
                            <button type="button" class='btn btn-insert mt-2'>
                                <i class="fa fa-link" aria-hidden="true"></i> 插入超連結
                            </button>

                            <div class='inserts'>
                                <textarea class="form-control" id="inputContent" rows="5" name="content" required></textarea>
                                <div class='pop'>
                                    <dl>
                                        <dt>連結網址： </dt>
                                        <dt><input id="insertlink"> </dt>
                                        <dt>連結文字： </dt>
                                        <dt><input id="inserttext"> </dt>
                                        <button type="button" class='btn btn-primary submit'>
                                            submit
                                        </button>
                                    </dl>
                                </div>
                            </div>
                        </div>

                        <!-- upload -->
                        <div class="form-group">
                            <label for="inputUpload">六、上傳附件：</label>
                            <small class="form-text text-muted">
                                請注意：若要上傳 Word(.doc)、PowperPoint(.ppt)、Excel(.xlsx) 三種檔案，請同時也上傳 (.odt)、(.odp)、(.ods) 類型檔案 (ง •̀_•́)ง <br>
                            </small>
                            <input type="file" class="form-control-file mt-2" id="inputUpload" name="uploads[]" multiple>
                        </div>

                    <!-- Infos & Tools -->
                    @elseif ($type === 'infos' || $type === 'tools')
                        <input type="hidden" value="{{ Auth::id() }}" name="user_id">
                        
                        @if ($type === 'infos')
                            <div id="titleDiv">
                                <label for="endDate">結束日期：</label>
                                <input type="date" class="form-control" id="endDate" name="end_date">

                                <div class="form-group mt-3">
                                    <label for="inputTitle">標題：</label>
                                    <textarea class="form-control" id="inputTitle" name="title" placeholder="標題..." rows="2" required></textarea>
                                </div>
                            </div>
                        @endif

                        <!-- 內文 -->
                        <div class="form-group mt-3">
                            <label for="inputContent">內文：</label>
                            <small class="form-text text-muted">
                                請注意：務必使用「完整」網址 (https://...)，並且不要自行更改語法，以免魔法失效 (ง •̀_•́)ง <br>
                                若希望超連結以「新開視窗」的方式打開，超連結文字需含有「另開新視窗」此詞句。<br>
                                超連結文字請務必<strong>詳細說明連結將導向何處</strong>，例如：「另開新視窗，109年度新生營隊活動報名連結」。
                            </small>
                            <button type="button" class='btn btn-insert mt-2'>
                                <i class="fa fa-link" aria-hidden="true"></i> 插入超連結
                            </button>

                            <div class='inserts'>
                                <textarea class="form-control" id="inputContent" name="content" placeholder="內文..." rows="5" required></textarea>
                                <div class='pop'>
                                    <dl>
                                        <dt>連結網址： </dt>
                                        <dt><input id="insertlink"> </dt>
                                        <dt>連結文字： </dt>
                                        <dt><input id="inserttext"> </dt>
                                        <button type="button" class='btn btn-primary submit'>
                                            submit
                                        </button>
                                    </dl>
                                </div>
                            </div>
                        </div>

                        <!-- 類別 -->
                        <div class="form-group">
                            <label for="Select">類別：</label>
                            <select class="form-control" id="Select" name="type" required>

                                @if ($type === 'infos')
                                    <option value="0">活動招生</option>
                                    <option value="1">成果分享</option>
                                    <option value="2">政府資訊廣宣</option>

                                @elseif ($type === 'tools')
                                    <option value="2">管理規章範例</option>
                                    <option value="3">既有固定式起重機...</option>
                                    <!-- <option value="4">職安法規檢索</option> -->
                                @endif

                            </select>
                        </div>
                        {{-- @if ($type === 'infos') --}}
                        @if ($type === 'infos' || $type === 'tools')
                            <div id="finished">
                                <label>是否已結束：</label>
                                <select class="form-group" name="finished" required>
                                    <option value="0">進行中</option>
                                    <option value="1">已結束</option>
                                </select>
                            </div>

                            <!-- upload -->
                            <hr>
                            <div class="form-group">
                                <label for="inputUpload">上傳附件：</label>
                                <small class="form-text text-muted">
                                    請注意：若要上傳 Word(.doc)、PowperPoint(.ppt)、Excel(.xlsx) 三種檔案，請同時也上傳 (.odt)、(.odp)、(.ods) 類型檔案 (ง •̀_•́)ง <br>
                                </small>
                                <input type="file" class="form-control-file mt-2" id="inputUpload" name="uploads[]" multiple>
                            </div>
                            <hr>
                        @endif

                    <!-- GovInfo -->
                    @elseif ($type === 'govinfo')
                        <input type="hidden" name="type" value="2">
                        <!-- 主旨 -->
                        <div class="form-group">
                            <label for="inputTitle">主旨：</label>
                            <input type="text" class="form-control" id="inputTitle" name="content" placeholder="主旨..." required>
                        </div>

                        <!-- upload -->
                        <div class="form-group">
                            <label for="inputUpload">上傳附件：</label>
                            <small class="form-text text-muted">
                                請注意：若要上傳 Word(.doc)、PowperPoint(.ppt)、Excel(.xlsx) 三種檔案，請同時也上傳 (.odt)、(.odp)、(.ods) 類型檔案 (ง •̀_•́)ง <br>
                            </small>
                            <input type="file" class="form-control-file mt-2" id="inputUpload" name="uploads[]" multiple>
                        </div>

                    @else
                        <div class="form-group">
                            <label for="summernote">內文：</label>
                            <div id="summernote"></div>
                            <small class="form-text text-muted">
                                請注意：圖檔以三張為限，且尺寸不超過 900 * 600 px。 超過此規定容易上傳失敗。
                            </small>
                        </div>

                    @endif

                    <ul id="file-list"></ul>

                    @if ($type === 'infos')
                    <!-- qrcode -->
                    <div class="form-group list-qrcodes">
                        <label for="inputUpload">上傳 Qrcode 圖片：</label>
                        <small class="form-text text-muted">
                            請注意：每張 qrcode 都需要描述前往網址。如：「前往經濟部首頁」。 (ง •̀_•́)ง <br>
                        </small>
                        <ol class='form-group'>
                            <li class='my-3'>
                                <input type="file" class="form-control-file" name="qrcodes[]" required>
                                <input placeholder="請描述此 Qrcode 的前往網址" class='form-control my-2' name="qrtitles[]" required>
                                <button class='btn btn-danger btn-rmqrcode' type='button'>刪除此 qrcode </button>
                                <hr>
                            </li>
                            <button class='btn btn-success btn-addqrcode' type='button'>新增 qrcode </button>
                        </ol>
                        <hr>
                    </div>

                    <ul id="qrcode-uploaded"></ul>
                    @endif
                        
                    <div class='text-center'>    
                        <button type="submit" class="btn btn-secondary">
                            Submit
                        </button>
                    </div>
                </form>
            </div>        
        </div>
    </div>
@endsection

@push('scripts')
    <script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>
    <script src="{{ asset('js/summernote.js')}}"></script>
    <script src="{{ asset('js/editor.js')}}"></script>
@endpush