<link rel="stylesheet" type="text/css" href="module/report/notification/css/notification.css" />
<section class="user_page container">
   <div class="sales_report">
   <div class="sales_report_in">
      <div class="sales_card" ng-show="listFound">
         <div class="container-fluid table_area">
            <div class="page-head">
               <p>Notifications</p>
           </div>
            <div class="row top_box">
               <div class="right_box">
                  <div class="addbtn">
                     <button class="btn export" ng-click="addFun()">
                        <p>Add</p>
                     </button>
                  </div>
               </div>
            </div>
            <div class="filter-area">
               <div class="table_box">
                  <div class="table-content table-fixed">
                     <table class="table table-striped">
                        <thead>
                           <tr class="row-name">
                              <th class="col-xs-1">S.No</th>
                              <th class="col-xs-2">Title</th>
                              <th class="col-xs-3">Description</th>
                              <th class="col-xs-3">Role</th>
                              <th class="col-xs-3">Published Date</th>
                              <!-- <th>action</th> -->
                           </tr>
                        </thead>
                        <tbody>
                           <tr class="row-content" ng-repeat="notification in notificationListdata track by $index" current-page="{{currentPage}}" style='min-height:50px'>
                              <td class="col-xs-1">{{pageSize * (currentPage-1)+$index+1}}</td>
                              <td class="col-xs-2">{{notification.notificationtitle}}</td>
                              <td class="col-xs-3">{{notification.notificationtext}}</td>
                              <td class="col-xs-3">
                                    <div ng-if="notification.filter_role_name.length!=0">
                                          <div class="td-content" ng-repeat="role in notification.filter_role_name">{{role.rolename}}{{$last ? '' : ', '}}</div>
                                    </div>
                                    <div ng-if="notification.filter_role_name.length==0">
                                          <div>-</div>
                                    </div>
                                  </td>
                              <td class="col-xs-3">{{notification.publisheddate| date}}</td>
                           </tr>
                        </tbody>
                     </table>
                  </div>
               </div>
            </div>
         </div>
         <div class="container">
            <div class="row">
               <nav aria-label="Page navigation" id="div1">
                  <ul class="pagination pager" uib-pagination total-items="totalItems" ng-model="currentPage" ng-change="pageChanged()" max-size="maxSize"
                     boundary-links="true" rotate="false" num-pages="numPages" items-per-page="itemsPerPage"></ul>
               </nav>
            </div>
         </div>
      </div>
      <!---ADD / EDIT FORM -------->
      <div class="profile_bg" ng-if="formLoad">
         <div class="container-fluid pro_head">
            <h4 class="text4">{{formTitle}}</h4>
            <button type="button" class="close ass-close" ng-click="closeForm()">
                    <span>×</span>
                </button>
         </div>
         <div class="container-fluid form_bg form-scroll">
            <form name="contentform" class="row form_2" ng-submit="notificationSubmit()">
               <div class="form-group col-sm-12">
                  <input id="topic" class="form-control" ng-model="formData.notificationtitle" autocomplete="off" required="required">
                  <label for="topic" class="control-label form-control-placeholder">{{sideselect.formText[0]}}</label>
                  <div class="color_error shake" ng-if="title_error!=''">
                  <a class="text-left shake">
                     {{title_error}}</a>
                  </div>
               </div>
               <div class="form-group col-sm-12">
                     <input id="topic" class="form-control" ng-model="formData.notificationtext" autocomplete="off" required="required">
                     <label for="topic" class="control-label form-control-placeholder">{{sideselect.formText[1]}}</label>
                     <div class="color_error shake" ng-if="description_error!=''">
                     <a class="text-left shake">
                        {{description_error}}</a>
                     </div>
                  </div>
                  <div  class="form-group col-sm-12">
                     <label>Role</label>
                     <multiple-autocomplete ng-model="formData.roleList" object-property="rolename" suggestions-arr="role">
                     </multiple-autocomplete>
                  </div>
                  <div class="clearfix"></div>
                  <div class="box-footer col-sm-12 text-center">
                     <button type="button" class="btn primary fixed" ng-click="closeForm()">Cancel</button>
                     <button type="submit" class="btn primary fixed">Publish</button>
                  </div>
               </form>
            </div>
         </div>
      </div>
   </div>
</section>