<div ng:controller="NewsletterDetailsController" class="row-fluid" id="body-main" qn:fillheight>
    <div class="col10">
        <div class="toolbar cfix">
              <div class="toolbar-group">
                  <h3>
                      <span class="circle circle-small blue"><span class="icon icon-user"></span></span>
                      {{$resource('newsletters.newsletters')}}
                  </h3>
              </div>
             <div class="toolbar-group">
                  <button title="{{$resource('utility.reset')}}" class="button tooltip"  ng:click="reset()"><i class="icon-angle-left"></i></button>
                  <button title="{{$resource('utility.search')}}" class="button tooltip" ng:click="search()"><i class="icon-search"></i></button>
                  <div class="form button-widget" qn:popover>
                      <form>
                          <div class="control-group">
                              <label>{{$resource('newsletters.imeprezime')}}</label>
                              <div class="controls">
                                  <input class="input-xlarge" placeholder="i.e. Wordpress" ng:model="query.title"/>
                              </div>
                          </div>
                          <div class="control-group">
                              <label class="control-label"></label>
                              <div class="controls">
                                  <button class="button lightblue" ng:click="search()"><i class="icon-search"></i></button>
                              </div>
                          </div> 
                      </form>
                  </div>
              </div>
            <div class="toolbar-group">
                <button title="{{$resource('utility.refresh')}}" class="button tooltip" ng:click="refresh()"><i class="icon-refresh"></i></button>
            </div>
            <div class="toolbar-group">
                <button title="{{$resource('utility.new')}}" class="button lightblue tooltip" ng:click="newNewsletter()"><i class="icon-plus"></i></button>
            </div>
            <div class="toolbar-group right">
                <span class="info">{{pager.from}}-{{pager.to}} of {{pager.total}}</span>
                <button class="button prev" ng:disabled="!pager.canPrev()" ng:click="pager.prev()"><i class="icon-chevron-left"></i></button>
                <button class="button next" ng:disabled="!pager.canNext()" ng:click="pager.next()"><i class="icon-chevron-right"></i></button>
            </div>
       </div>
      
       <div class="table table-hover fillh">
           <table>
                <thead>
                    <tr>
                        <th class="icon"></th>
                        <th>{{$resource('newsletters.imeprezime')}}</th>
                        <th>{{$resource('newsletters.email')}}</th>
                        <th>{{$resource('newsletters.status')}}</th>
                        <th class="command"></th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng:repeat="newsletter in newsletters">
                        <td class="icon">
                            <div class="badges">
                                <div class="badge" ng:show="newsletter.Status == NeAktivan"><i class="icon-lock"></i></div>
                            </div>
                        </td>
                        <td class="title" ng:click="selectRadnik(newsletter)">
                            <div class="inner">
                                <h2>{{newsletter.ImePrezime}}</h2>
                            </div>
                        </td>
                        <td>{{newsletter.Email}}</td>
                        <td>{{newsletter.Status.DisplayName}}</td>
                        <td class="command icon">
                            <span title="{{$resource('utility.options')}}" class="trigger tooltip"><i class="icon-reorder"></i></span>
                            <div qn:popover="{position: {my: 'right top', at: 'left top'}}">
                                <ul>
                                    <li ng:click="edit(newsletter)"><a><i class="icon-edit"></i>{{$resource('newsletters.edit')}}</a></li>
                                    <li><a ng:click="remove(newsletter, $index)" value="Da li ste sigurni?"><i class="icon-trash"></i>{{$resource('newsletters.delete')}}</a></li>
                                    <li><a ng:click="setLock(newsletter)" value="Da li ste sigurni?"><span ng:show="newsletter.Status.DisplayName == 'Aktivan'"><i class=" icon-ban-circle"></i>{{$resource('newsletters.deaktivacija')}}</span><span ng:show="newsletter.Status.DisplayName == 'NeAktivan'"><i class="icon-ok-circle"></i>{{$resource('newsletters.aktivacija')}}</span></a></li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="col2 sidebar">
        <div class="toolbar toolbar-strip lightblue cfix">
             <div class="toolbar-group row-fluid">
                <button title="{{$resource('utility.basic')}}" class="button lightblue col3 tooltip" ng:class="{active:sidebarView == 'basic'}" ng:click="switchSidebar('basic')"><i class="icon-star"></i></button>
            </div>
            <div>
            </div>
        </div>
        <div class="inner fillh">
            <ul class="nav" ng:show="sidebarView == 'basic'">
                <li ng:class="{active:!isSearch()}"><a ng:click="reset()"><i class="icon-asterisk"></i>{{$resource('newsletters.newsletters_all')}}</a></li>
                <li ng:class="{active:query.Status=='Aktivan'}"><a ng:click="search({Status:'Aktivan'}, true)"><i class="icon-lock lightred"></i>{{$resource('newsletters.newslettersaktivni')}}</a></li>
                <li ng:class="{active:query.Status=='NeAktivan'}"><a ng:click="search({Status:'NeAktivan'}, true)"><i class="icon-lock green"></i>{{$resource('newsletters.newslettersneaktivni')}}</a></li>
                <li><hr /></li>
            </ul>
        </div>
    </div>
</div>