@extends('author')
@section('author_content')
<style>
@media (max-width: 1151px) {
    .rwd-table tr td{
        border-top: 1px solid #eee !important;
        border-bottom: 1px solid #eee !important;
    }
}
</style>
<div class="tab-pane fade show active author" id="message-panel">
    <div class='row'>
        <div class='col-12'>
            <div class='card my-3'>
                <div class='card-body'>
                    <!-- search line -->
                    <div class='row mx-2 my-3'>
                        <button class='btn py-2 w-100 btn-msg-search' type="button" data-toggle="collapse" data-target="#search">
                            進階搜尋
                        </button>
                        <div class="collapse w-100" id="search">
                            <div class="p-3 w-100">
                                <label class='w-100 mb-3'>
                                    <span>標題</span>
                                    <input class="form-control pl-2" name="adv_title" placeholder="請輸入標題">
                                </label>
                                <label class='w-100'>
                                    <span>寄件者</span>
                                    <input class="form-control pl-2" name="adv_sender" placeholder="請輸入寄件者">
                                </label>

                                <div class='d-flex mt-3'>
                                    <label class='mr-3'>
                                        <input type="radio" name="type" value="All" checked>
                                        <span>所有</span>
                                    </label>
                                    <label class='mr-3'>
                                        <input type="radio" name="type" value="1">
                                        <span>已回覆</span>
                                    </label>
                                    <label class='mr-3'>
                                        <input type="radio" name="type" value="0">
                                        <span>未回覆</span>
                                    </label>
                                </div>

                                <div class='w-100 d-flex justify-content-center mt-3'>
                                    <button class='btn btn__sending_msg adv-admin-search' type="button" data-toggle="collapse" data-target="#search">
                                        搜尋
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class='row d-flex justify-content-end mx-1'>
                        <span class='mr-2 text-success'>
                            <i class="fa fa-check-circle" aria-hidden="true"></i>
                            表示為您的回覆
                        </span>
                        <span>
                            <i class="fa fa-check-circle " aria-hidden="true"></i>
                            表示為由其他人回覆
                        </span>
                    </div>

                    <!-- table -->
                    <table class='table table-striped borderless table__main_messages mt-3 rwd-table'>
                        <thead>
                            <tr>
                                <th>編號</th>
                                <th>標題</th>
                                <th>寄件者</th>
                                <th>已回覆</th>
                                <th>收件時間</th>
                                <th>回覆時間</th>
                                <th>查看</th>
                            </tr>
                        </thead>
                        <tbody id="tbody_messages" data-role="admin">
                        </tbody>
                    </table>
                    
                    <!-- pagination -->
                    <div class='d-flex w-100 justify-content-center admin-pagination'></div>
                </div>
            </div>
        </div>
    </div>
</div>

@include('author.message_root_detail')

@endsection