pages.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289
  1. <!DOCTYPE html>
  2. <html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout/layout}">
  3. <head>
  4. <title>Store Pages :: Administration</title>
  5. <script type="text/javascript" src="/js/admin/page-pages.js" defer></script>
  6. </head>
  7. <body>
  8. <div layout:fragment="content" id="app">
  9. <input type="hidden" id="userId" th:value="${user.id}" />
  10. <div class="ui container">
  11. <br />
  12. <h1 class="ui dividing header">Administrator :: Store Pages</h1>
  13. <div th:replace="fragments/admin/admin-menu :: adminMenu"></div>
  14. <!-- START : Draft Pages -->
  15. <h2>Draft Pages</h2>
  16. <div>
  17. <div class="ui message" v-if="drafts.length == 0">
  18. There are no Draft Pages awaiting approval at this time.
  19. </div>
  20. <table class="ui small compact fluid orange celled table" v-if="drafts.length > 0">
  21. <thead>
  22. <tr>
  23. <th>Name</th>
  24. <th>Type</th>
  25. <th>Creator</th>
  26. <th>Created</th>
  27. <th>Last Edited</th>
  28. <th>Status</th>
  29. <th></th>
  30. </tr>
  31. </thead>
  32. <tbody>
  33. <tr v-for="(draft, index) in drafts" :class="draft.reviewState == 'Review_Requested' ? 'positive' : ''">
  34. <td>
  35. <a :href="'/preview/draft/' + draft.id" target="_blank" data-content="View" data-variation="mini">{{
  36. draft.details.title
  37. }}</a>
  38. </td>
  39. <td class="collapsing">{{ draft.softwareType }}</td>
  40. <td class="collapsing">{{ draft.owner.username }}</td>
  41. <td class="collapsing">{{ millisToDate(draft.dateCreated) }}</td>
  42. <td class="collapsing">
  43. {{ millisToDate(draft.dateUpdated) }}
  44. </td>
  45. <td class="collapsing">
  46. <i class="exclamation circle icon" v-if="draft.reviewState == 'Review_Requested'"></i>
  47. <i class="question circle outline icon" v-if="draft.reviewState == 'Under_Review'"></i>
  48. <span class="tooltip" :data-content="draft.reviewer != null ? draft.reviewer.username + ' is reviewing this page' : ''">{{
  49. draft.reviewState.replace("_", " ")
  50. }}</span>
  51. </td>
  52. <td class="collapsing">
  53. <input type="hidden" :value="draft.id" />
  54. <input type="hidden" value="opensource" />
  55. <button v-if="draft.reviewState == 'Review_Requested'" class="ui mini button icon purple tooltip" data-content="Take Job" data-variation="mini" v-on:click="takeJob('draft', draft.id, index)">
  56. <i class="thumbs up outline icon"></i>
  57. </button>
  58. <button v-if="draft.reviewState == 'Under_Review' && draft.reviewer.id == userId" class="ui mini button icon green tooltip" data-content="Approve" data-variation="mini" v-on:click="approveDraft(draft.id, index)">
  59. <i class="check icon"></i>
  60. </button>
  61. <button v-if="draft.reviewState == 'Under_Review' && draft.reviewer.id == userId" class="ui mini button icon orange tooltip" data-content="Reject" data-variation="mini" v-on:click="rejectDraft(draft.id, index)">
  62. <i class="close icon"></i>
  63. </button>
  64. <button class="ui mini button icon red tooltip" data-content="Delete" data-variation="mini" v-on:click="deleteDraft(draft.id, index)">
  65. <i class="trash alternate outline icon"></i>
  66. </button>
  67. </td>
  68. </tr>
  69. </tbody>
  70. </table>
  71. <!-- START: Draft Page reject modal -->
  72. <div class="ui large modal" id="RejectDraftModal">
  73. <div class="header">Reject Draft</div>
  74. <div class="scrolling content">
  75. <p>
  76. Please explain to the user why the page has been rejected. The contents of your explanation will be sent directly to the user.
  77. </p>
  78. <ul class="ui list">
  79. <li>Be as specific as possible.</li>
  80. <li>Explain how the problem may be resolved.</li>
  81. </ul>
  82. <div class="ui form">
  83. <div class="field">
  84. <textarea id="RejectDraftReason" cols="10"></textarea>
  85. </div>
  86. </div>
  87. </div>
  88. <div class="actions">
  89. <div class="ui black cancel button">Cancel</div>
  90. <button class="ui red ok button"><i class="trash alternate outline icon"></i>Reject Draft</button>
  91. </div>
  92. </div>
  93. <!-- END: Draft Page reject modal -->
  94. <!-- START: Draft Page delete confirmation modal -->
  95. <div class="ui small modal" id="DeleteDraftModal">
  96. <div class="header">Delete Draft Page</div>
  97. <div class="content">Are you sure you want to <b>permanently delete</b> this draft page? This action cannot be reversed.</div>
  98. <div class="actions">
  99. <div class="ui cancel green button">Cancel</div>
  100. <div class="ui red ok button"><i class="trash alternate outline icon"></i>Delete Draft Page</div>
  101. </div>
  102. </div>
  103. <!-- END: Draft Page delete confirmation modal -->
  104. </div>
  105. <!-- END : Draft Pages -->
  106. <!-- START : Live Page Amendments -->
  107. <h2>Live Page Amendments</h2>
  108. <div>
  109. <div class="ui message" v-if="amendments.length == 0">
  110. There are no live page amendments awaiting approval at this time.
  111. </div>
  112. <table class="ui small compact fluid blue celled table" v-if="amendments.length > 0">
  113. <thead>
  114. <tr>
  115. <th>Name</th>
  116. <th>Type</th>
  117. <th>Creator</th>
  118. <th>Created</th>
  119. <th>Last Edited</th>
  120. <th>Status</th>
  121. <th></th>
  122. </tr>
  123. </thead>
  124. <tbody>
  125. <tr v-for="(amendment, index) in amendments" :class="amendment.reviewState == 'Review_Requested' ? 'positive' : ''">
  126. <td>
  127. <a :href="'/preview/amendment/' + amendment.id" target="_blank" data-content="View" data-variation="mini">{{
  128. amendment.details.title
  129. }}</a>
  130. </td>
  131. <td class="collapsing">{{ amendment.softwareType }}</td>
  132. <td class="collapsing">{{ amendment.owner.username }}</td>
  133. <td class="collapsing">{{ millisToDate(amendment.dateCreated) }}</td>
  134. <td class="collapsing">
  135. {{ millisToDate(amendment.dateUpdated) }}
  136. </td>
  137. <td class="collapsing">
  138. <i class="exclamation circle icon" v-if="amendment.reviewState == 'Review_Requested'"></i>
  139. <i class="question circle outline icon" v-if="amendment.reviewState == 'Under_Review'"></i>
  140. <span class="tooltip" :data-content="amendment.reviewer != null ? amendment.reviewer.username + ' is reviewing this page' : ''">{{ amendment.reviewState.replace("_", " ") }}</span>
  141. </td>
  142. <td class="collapsing">
  143. <button v-if="amendment.reviewState == 'Review_Requested'" class="ui mini button icon purple tooltip" data-content="Take Job" data-variation="mini" v-on:click="takeJob('amendment', amendment.id, index)">
  144. <i class="thumbs up outline icon"></i>
  145. </button>
  146. <button v-if="amendment.reviewState == 'Under_Review' && amendment.reviewer.id == userId" class="ui mini button icon green tooltip" data-content="Approve" data-variation="mini" v-on:click="approveAmendment(amendment.id, index)">
  147. <i class="check icon"></i>
  148. </button>
  149. <button v-if="amendment.reviewer" class="ui mini button icon orange tooltip" data-content="Reject" data-variation="mini" v-on:click="rejectAmendment(amendment.id, index)">
  150. <i class="close icon"></i>
  151. </button>
  152. <button class="ui mini button icon red tooltip" data-content="Delete" data-variation="mini" v-on:click="deleteAmendment(amendment.id, index)">
  153. <i class="trash alternate outline icon"></i>
  154. </button>
  155. </td>
  156. </tr>
  157. </tbody>
  158. </table>
  159. <!-- START: Amendment delete confirmation modal -->
  160. <div class="ui small modal" id="DeleteAmendmentModal">
  161. <div class="header">Delete Amendment</div>
  162. <div class="content">Are you sure you want to <b>permanently delete</b> this amendment? This action cannot be reversed.</div>
  163. <div class="actions">
  164. <div class="ui cancel green button">Cancel</div>
  165. <div class="ui red ok button"><i class="trash alternate outline icon"></i>Delete Amendment</div>
  166. </div>
  167. </div>
  168. <!-- END: Amendment delete confirmation modal -->
  169. <!-- START: Amendment rejection modal -->
  170. <div class="ui modal" id="rejectAmendmentModal">
  171. <i class="close icon"></i>
  172. <div class="header">
  173. Reject Amendment
  174. </div>
  175. <div class="content">
  176. <p>
  177. Please explain to the user why the page amendment has been rejected. The contents of your explanation will be sent directly to
  178. the user.
  179. </p>
  180. <ul class="ui list">
  181. <li>Be as specific as possible.</li>
  182. <li>Explain how the problem may be resolved.</li>
  183. </ul>
  184. <div class="ui form">
  185. <textarea cols="5" id="RejectAmendmentReason"></textarea>
  186. </div>
  187. </div>
  188. <div class="actions">
  189. <div class="ui black cancel button">Cancel</div>
  190. <div class="ui red ok button"><i class="trash alternate outline icon"></i>Reject Amendment</div>
  191. </div>
  192. </div>
  193. <!-- END: Amendment rejection modal -->
  194. </div>
  195. <!-- END : Live Page Amendments -->
  196. <!-- START : Live Pages -->
  197. <h2>Live Pages</h2>
  198. <div>
  199. <div class="ui fluid action input">
  200. <input id="searchPagesInput" type="text" placeholder="Search..." v-on:keyup.enter="searchPages()" />
  201. <div class="ui black button" @click="searchPages()">Search</div>
  202. </div>
  203. <div class="ui message" v-if="page_search_results != null && page_search_results.length == 0"></div>
  204. <table class="ui small compact fluid celled table" v-if="page_search_results != null && page_search_results.length > 0">
  205. <thead>
  206. <tr>
  207. <th>Name</th>
  208. <th>Author</th>
  209. <th></th>
  210. </tr>
  211. </thead>
  212. <tr v-for="(page, index) in page_search_results">
  213. <td class="collapsing">
  214. <a :href="'/' + page.id">{{ page.details.title }}</a>
  215. </td>
  216. <td>
  217. {{ page.owner.username }}
  218. </td>
  219. <td class="collapsing">
  220. <button @click="deleteLivePage(page.id, index)" class="ui mini button icon red tooltip" data-content="Delete" data-variation="mini">
  221. <i class="trash alternate outline icon"></i>
  222. </button>
  223. </td>
  224. </tr>
  225. </table>
  226. <!-- START: page delete confirmation modal -->
  227. <div class="ui small modal" id="deleteLivePageModal">
  228. <div class="header">Delete Live Page</div>
  229. <div class="content">Are you sure you want to <b>permanently delete</b> this <b>LIVE PAGE</b>? This action cannot be reversed.</div>
  230. <div class="actions">
  231. <div class="ui cancel green button">Cancel</div>
  232. <div class="ui red ok button"><i class="trash alternate outline icon"></i>PERMANENTLY DELETE LIVE PAGE</div>
  233. </div>
  234. </div>
  235. <!-- END: page delete confirmation modal -->
  236. </div>
  237. <!-- END : Live pages -->
  238. <br /><br />
  239. </div>
  240. </div>
  241. </body>
  242. </html>