{{-- CityHub - Users (admin) --}}

<script type="text/javascript">
    var org_registrations = JSON.parse('{{$data}}');
    console.log(JSON.parse('{{$posts}}'));
    var posts = JSON.parse('{{$posts}}');
    var user_applications = JSON.parse('{{$userApplications}}');
    var mailing_list = JSON.parse('{{$mailing_list}}');

    var links =
        {
            registration:"{{URL::route('removeRegistrationForm')}}",
            post: "{{URL::route('deleteVolunteerPost')}}",
            application:"{{URL::route('removeUserApplication')}}",
            getJsonData:"{{URL::route('getJsonData')}}"
        }

</script>
<div id="vue">


                @if(isset($data))
                <div class="fadeIn" id="tab_a">
                    <div class="row">
                        <div class="col s12">
                            <div class="widget-holder hoverable fadeIn">
                                <div class="widget-heading">
                                    <h2 class="widget-heading-thick">{{ Lang::get('volontiranje.labels.registrations') }} </h2>
                                    <a href="{{ route('getRegistrationForm',array($city)) }}" class="btn-floating waves-effect waves-light btn-primary new-blog-post"> <i class="material-icons">add</i></a>
                                    <div class="row filter-row">
                                        <div class="col s12">
                                            <div class="input-field right">
                                                <i class="material-icons prefix">search</i>
                                                <input id="icon_prefix" v-model="searchString" v-on:keyup="searchfilter('registrations')" type="text">
                                                <label :class="{active:searchString}" for="icon_prefix">{{ ucfirst(Lang::get('core.search'))}}</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="widget-content">
                                    <div class="table-wrapper">
                                        <table class="bordered responsive-table">
                                            <thead>
                                            <tr>
                                                <th>{{ Lang::get('volontiranje.organization_name') }}</th>
                                                <th>{{ Lang::get('volontiranje.organization_address') }}</th>
                                                <th>{{ Lang::get('volontiranje.organization_contact_person') }}</th>
                                                <th>{{ Lang::get('volontiranje.organization_phone') }}</th>
                                            </tr>
                                            </thead>
                                            <tbody id="searchable">
                                                <tr v-for="registration in registrations">
                                                 <td>@{{ registration['organization_name'] }}</td>
                                                    <td>@{{ registration.street+" "+registration.postal_num+" "+registration.place }}</td>
                                                    <td>@{{ registration.contact_person }}</td>
                                                    <td>@{{ registration.phone}}

                                                    </td>
                                                    <td class="right-align">
                                                        <a v-on:click="deleteItem('registration', registration.id)" class="icon-btn icon-btn-delete"><i class="material-icons">mode_delete</i></a>
                                                        <a v-on:click="editItem('registration',registration.id)" class="icon-btn icon-btn-edit"><i class="material-icons">mode_edit</i></a>
                                                    </td>
                                                </tr>

                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                @endif
                <div class="fadeIn" id="tab_b">

                    <div class="row">
                        <div class="col s12">
                            <div class="widget-holder hoverable fadeIn">
                                <div class="widget-heading">
                                    <h2 class="widget-heading-thick">{{ Lang::get('volontiranje.labels.posts') }} </h2>
                                   <!-- <a href="{{ route('getVolunteerPost',array($city)) }}" class="btn-floating waves-effect waves-light btn-primary new-blog-post"> <i  class="material-icons">add</i></a> -->
                                    <a  class="btn-floating waves-effect waves-light btn-primary new-blog-post" v-on:click="openPostModal()"> <i  class="material-icons">add</i></a>
                                    <div class="row filter-row">
                                        <div class="col s12">
                                            <div class="input-field right">
                                                <i class="material-icons prefix">search</i>
                                                <input class="icon_prefix" id="icon_prefix1" v-model="searchString" v-on:keyup="searchfilter('posts')" type="text">
                                                <label :class="{active:searchString}" for="icon_prefix1">{{ ucfirst(Lang::get('core.search'))}}</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="widget-content">
                                    <div class="table-wrapper">
                                        <div class="widget-heading">

                                        </div>
                                        <table class="bordered responsive-table">
                                            <thead>
                                            <tr>
                                                <th>{{ Lang::get('volontiranje.labels.postTitle') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.created_at') }}</th>
                                            </tr>
                                            </thead>
                                            <tbody id="searchable">
                                                <tr v-for="post in posts">
                                                    <td>@{{ post.title }}</td>
                                                    <td>@{{ post.created_at }}</td>
                                                    <td class="right-align">
                                                        <a v-on:click="deleteItem('post',post.id)" class="icon-btn icon-btn-delete"><i class="material-icons">delete</i></a>
                                                        <a v-on:click="editPost(post.id)" class="icon-btn icon-btn-edit"><i class="material-icons">dvr</i></a>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="fadeIn" id="tab_c">
                    <div class="row">
                        <div class="col s12">
                            <div class="widget-holder hoverable fadeIn">
                                <div class="widget-heading">
                                    <h2 class="widget-heading-thick">{{ Lang::get('volontiranje.labels.users') }} </h2>
                                    <div class="row filter-row">
                                        <div class="col s12">
                                            <div class="input-field right">
                                                <i class="material-icons prefix">search</i>
                                                <input class="icon_prefix" id="icon_prefix2" v-model="searchString" v-on:keyup="searchfilter('user_applications')" type="text">
                                                <label :class="{active:searchString}" for="icon_prefix2">{{ ucfirst(Lang::get('core.search'))}}</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="widget-content">
                                    <div class="table-wrapper">
                                        <table class="bordered responsive-table">
                                            <thead>
                                            <tr>
                                                <th>{{ Lang::get('volontiranje.labels.user_post') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.username') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.user_address') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.user_phone') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.user_email') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.user_gender') }}</th>
                                            </tr>
                                            </thead>
                                            <tbody id="searchable">
                                                <tr v-for="userApplication in user_applications">
                                                    <td>@{{ userApplication.post_title }}</td>
                                                    <td>@{{ userApplication.name }}</td>
                                                    <td>@{{ userApplication.address }}</td>
                                                    <td>@{{ userApplication.phone }}</td>
                                                    <td>@{{ userApplication.email }}</td>
                                                    <td>@{{ userApplication.gender }}

                                                    </td>
                                                    <td class="right-align">
                                                        <a v-on:click="deleteItem('application', userApplication.id)" class="icon-btn icon-btn-delete"><i class="material-icons">mode_delete</i></a>

                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="fadeIn" id="tab_d">

                    <div class="row">
                        <div class="col s12">
                            <div class="widget-holder hoverable fadeIn">
                                <div class="widget-heading">
                                    <h2 class="widget-heading-thick">{{ Lang::get('volontiranje.labels.emails') }} </h2>
                                    <div class="row filter-row">
                                        <div class="col s12">
                                            <div class="input-field right">
                                                <i class="material-icons prefix">search</i>
                                                <input class="icon_prefix" id="icon_prefix2" v-model="searchString" v-on:keyup="searchfilter('mailing_list')" type="text">
                                                <label :class="{active:searchString}" for="icon_prefix2">{{ ucfirst(Lang::get('core.search'))}}</label>
                                            </div>
                                        </div>
                                    </div>
                                    <a href="{{ URL::route('volunteerMailExport', array('city'=>$city)) }}" id="" class="btn-floating waves-effect waves-light btn-primary new-blog-post"> <i  class="material-icons">file_download</i></a>
                                </div>

                                <div class="widget-content">
                                    <div class="table-wrapper">
                                        <table class="bordered responsive-table">
                                            <thead>
                                            <tr>
                                                <th>{{ Lang::get('volontiranje.labels.email_type') }}</th>
                                                <th>{{ Lang::get('volontiranje.labels.email') }}</th>
                                            </tr>
                                            </thead>
                                            <tbody id="searchable">
                                                <tr v-for="mail in mailing_list">
                                                    <td>@{{ mail.type == 1 ? "user" : "organization" }}</td>
                                                    <td>@{{ mail.email }}</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
</div>


<div id="vueModal" class="modal modal-fixed-footer" >
    <div class="modal-content">
        <div class="progress">
            <div class="indeterminate"></div>
        </div>
        <div id="report-delegate" class="fadeIn">
            <div class="inputs-wrapper">
               <div class="row">
                   <div>
                       <div class="input-field col s6">
                           <div class="row image-crop-holder">
                               <div class="col s12 center-align">
                                   <p v-if="imageLocation == '' ">{{ Lang::get('volontiranje.labels.upload_image') }}</p>
                                   <img style="width:100%;" v-if="postData.image != '' " v-bind:src="postData.image" v-on:click="openCrop()" >
                                   <a class="btn-floating waves-effect waves-light btn-primary edit-crop-img" v-on:click="openCrop()"><i class="material-icons">image</i></a>
                               </div>
                           </div>
                           <div class="row">
                               <div class="col s12"><p>{{ Lang::get('volontiranje.labels.position') }}:*</p>
                                   <div id="map" style="width: 100%; height: 50vh;"></div>
                               </div>
                           </div>
                       </div>

                       <div class="input-field col s6">
                           <label v-bind:class="{active : postData.title != ''}" for="content">{{ Lang::get('volontiranje.labels.title') }}:*</label>
                           <input type="text" class="form-control" id="title" v-model="postData.title"/>
                       </div>
                       <div class="input-field col s6">
                           <textarea name="text" id="postContent"></textarea>
                           <label v-bind:class="{active : postData.content != ''}" for="postContent" class=" ">{{ Lang::get('volontiranje.labels.content') }}:*</label>
                       </div>
                       <div class="input-field col s6 mt-30">
                           <label v-bind:class="{active : postData.email != ''}" for="email" class="">{{ Lang::get('volontiranje.labels.email') }}:*</label>
                           <input v-model="postData.email" type="email" id="email" class="form-control">
                       </div>

                   </div>
               </div>

            </div>

        </div>
    </div>

    <div class="modal-footer right-align">
        <a class="modal-action modal-close waves-effect waves-light btn-flat modal-cancel">Cancel</a>
        <a v-on:click="submitPost()" class="modal-action waves-effect waves-light btn-flat modal-save">Save</a>
    </div>
    <div id="preloader-bar" class="animated fadeIn progress" v-show="preloader == 'active'">
        <div class="indeterminate"></div>
    </div>
</div>

<div id="cropModal" class="modal modal-fixed-footer">
    <div class="modal-content">
        <div id="report-delegate" class="fadeIn">
            <div class="inputs-wrapper">
                <div class="row">
                    <div class="input-field col s6 offset-s3">
                        <label class="">{{ Lang::get('template.labels.image') }}:*</label>
                        <croppa v-model="croppa"
                                :initial-image="imageUrl"
                                :width="600"
                                :height="600"
                                placeholder="{{ Lang::get('initiatives.croppa') }}"
                                placeholder-color="#000"
                                :placeholder-font-size="16"
                                canvas-color="transparent"
                                :show-remove-button="true"
                                remove-button-color="#ff9800"
                                :prevent-white-space="true"
                        >
                        </croppa>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <div class="modal-footer right-align">
     <!--   <a v-on:click="saveImage()" class="modal-action modal-close waves-effect waves-light btn-flat modal-cancel">Cancel</a> -->
        <a v-on:click="saveImage()" class="modal-action waves-effect waves-light btn-flat modal-save">{{ Lang::get('volontiranje.labels.crop_image') }}</a>
    </div>
    <div id="preloader-bar" class="animated fadeIn progress" v-show="preloader == 'active'">
        <div class="indeterminate"></div>
    </div>
</div>


<script type="text/javascript" charset="utf-8">
    var city = '{{$city}}';
    var base_url='https://'+window.location.hostname;
    var getPostUrl = '{{URL::route('getVolunteerPost')}}';
    var volPostUrl = '{{URL::route('postVolunteerPost')}}';
</script>