pages_messages.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. <!-- start: MESSAGES -->
  2. <div ct-fullheight data-ct-fullheight-exclusion="header, footer">
  3. <!-- /// controller: 'InboxCtrl' - localtion: assets/js/controllers/inboxCtrl.js /// -->
  4. <div class="inbox" id="inbox" ng-controller="InboxCtrl" toggleable active-class="message-open">
  5. <!-- start: EMAIL OPTIONS -->
  6. <div class="col email-options">
  7. <div class="padding-15">
  8. <button class="btn btn-primary btn-block margin-bottom-30">
  9. Compose {{$scope.isLargeDevice}}
  10. </button>
  11. <p class="email-options-title no-margin">
  12. BROWSE
  13. </p>
  14. <ul class="main-options padding-15">
  15. <li>
  16. <a href ng-click="filters = {sent: false}">
  17. <span class="title"><i class="ti-import"></i> Inbox</span>
  18. <span class="badge pull-right" ng-if="messages.length">{{(messages |filter: filters = {sent: false}).length}}</span>
  19. </a>
  20. </li>
  21. <li>
  22. <a href ng-click="filters = {sent: true}">
  23. <span class="title"><i class="ti-upload"></i> Sent</span>
  24. </a>
  25. </li>
  26. <li >
  27. <a href ng-click="filters = {spam: true}">
  28. <span class="title"><i class="ti-na"></i> Spam</span>
  29. <span class="badge pull-right" ng-if="(messages |filter: {spam: true}).length">{{(messages |filter: filters = {spam: true}).length}}</span>
  30. </a>
  31. </li>
  32. <li>
  33. <a href ng-click="filters = {starred: true}">
  34. <span class="title"><i class="ti-star"></i> Starred</span>
  35. <span class="badge pull-right" ng-if="(messages |filter: {starred: true}).length">{{(messages |filter: filters = {starred: true}).length}}</span>
  36. </a>
  37. </li>
  38. </ul>
  39. </div>
  40. </div>
  41. <!-- end: EMAIL OPTIONS -->
  42. <!-- start: EMAIL LIST -->
  43. <div class="col email-list" ng-hide="$state.current.name.indexOf('inbox')>= 0 && isMobileDevice">
  44. <div class="wrap-list">
  45. <div class="wrap-options" id="wrap-options" toggleable active-class="search-open">
  46. <div class="messages-options padding-15">
  47. <div class="btn-group" dropdown>
  48. <button type="button" class="btn btn-primary btn-wide">
  49. Compose
  50. </button>
  51. <button type="button" class="btn btn-primary dropdown-toggle" dropdown-toggle>
  52. <span class="caret"></span>
  53. </button>
  54. <ul class="dropdown-menu dropdown-light" role="menu">
  55. <li>
  56. <a href ng-click="filters = {sent: false}">
  57. <span class="title"><i class="ti-import"></i> Inbox</span>
  58. <span class="badge" ng-if="messages.length">{{(messages |filter: filters = {sent: false}).length}}</span>
  59. </a>
  60. </li>
  61. <li>
  62. <a href ng-click="filters = {sent: true}">
  63. <span class="title"><i class="ti-upload"></i> Sent</span>
  64. </a>
  65. </li>
  66. <li>
  67. <a href ng-click="filters = {spam: true}">
  68. <span class="title"><i class="ti-na"></i> Spam</span>
  69. <span class="badge" ng-if="(messages |filter: {spam: true}).length">{{(messages |filter: filters = {spam: true}).length}}</span>
  70. </a>
  71. </li>
  72. <li>
  73. <a href ng-click="filters = {starred: true}">
  74. <span class="title"><i class="ti-star"></i> Starred</span>
  75. <span class="badge" ng-if="(messages |filter: {starred: true}).length">{{(messages |filter: filters = {starred: true}).length}}</span>
  76. </a>
  77. </li>
  78. </ul>
  79. </div>
  80. <button class="btn btn-transparent pull-right open-message-search" ct-toggle="on" target="wrap-options">
  81. <i class="ti-search"></i>
  82. </button>
  83. <button class="btn btn-transparent pull-right close-message-search" ct-toggle="off" target="wrap-options" ng-click="inbox.search = null">
  84. <i class="ti-close"></i>
  85. </button>
  86. </div>
  87. <div class="messages-search">
  88. <form>
  89. <input type="text" class="form-control underline" placeholder="Search messages..." ng-model="inbox.search.$">
  90. </form>
  91. </div>
  92. </div>
  93. <ul class="messages-list" perfect-scrollbar wheel-propagation="true" suppress-scroll-x="true">
  94. <li ng-if="!messages.length">
  95. <div class="">
  96. No messages! Try sending one to a friend.
  97. </div>
  98. </li>
  99. <li class="messages-item" ng-class="{starred: message.starred}" ng-repeat="message in messages | filter:filters | filter:inbox.search">
  100. <a message-item="{{message.id}}" ui-sref="app.pages.messages.inbox({ inboxID:message.id })" href>
  101. <span title="{{ message.starred && 'Remove star' || 'Mark as starred' }}" class="messages-item-star" ng-click="message.starred = !message.starred"><i class="fa fa-star"></i></span>
  102. <img alt="{{ message.from }}" ng-src="{{ message.avatar && message.avatar || noAvatarImg }}" class="messages-item-avatar bordered border-primary">
  103. <span class="messages-item-from">{{ message.from }}</span>
  104. <div class="messages-item-time">
  105. <span class="text">{{ message.date | date: "MM/dd/yyyy 'at' h:mma" }}</span>
  106. </div>
  107. <span class="messages-item-subject"> <em class="spam" ng-if="message.spam">[SPAM] </em> {{ message.subject }}</span>
  108. <span class="messages-item-content">{{ message.content | htmlToPlaintext | words:15 :true }}</span>
  109. </a>
  110. </li>
  111. </ul>
  112. </div>
  113. </div>
  114. <!-- end: EMAIL LIST -->
  115. <!-- start: EMAIL READER -->
  116. <div class="email-reader" perfect-scrollbar wheel-propagation="true" suppress-scroll-x="true" ng-show="$state.current.name.indexOf('inbox')>= 0 || isLargeDevice || isSmallDevice">
  117. <div ui-view>
  118. <div class="no-messages">
  119. <h2>No email has been selected</h2>
  120. </div>
  121. </div>
  122. </div>
  123. <!-- end: EMAIL READER -->
  124. </div>
  125. </div>
  126. <!-- end: MESSAGES -->