users.html 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. <!DOCTYPE html>
  2. <html xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="~{layout/layout}">
  3. <head>
  4. <title>Asset Store :: Administration</title>
  5. <script src="/js/admin/page-users.js" defer></script>
  6. </head>
  7. <body>
  8. <div layout:fragment="content" class="ui container" id="app">
  9. <br />
  10. <h1 class="ui dividing header">Administrator :: Users</h1>
  11. <div th:replace="fragments/admin/admin-menu :: adminMenu"></div>
  12. <div class="ui search">
  13. <div class="ui left icon input">
  14. <input type="text" placeholder="Search..." class="searchInput" v-on:keyup.enter="findUsers($event.target.value)" />
  15. <i class="user outline icon"></i>
  16. </div>
  17. <button class="ui green button" @click="displayNewUserModal()"><i class="plus icon"></i>Create User</button>
  18. </div>
  19. <br />
  20. <div class="ui message" v-if="users != null && users.length == 0">No users found.</div>
  21. <table class="ui celled table" v-if="users != null && users.length > 0">
  22. <thead>
  23. <tr>
  24. <th>Username</th>
  25. </tr>
  26. </thead>
  27. <tbody>
  28. <tr v-for="user in users">
  29. <td data-label="Username">
  30. <a :href="'/admin/user/' + user.username">{{ user.username }}</a>
  31. </td>
  32. </tr>
  33. </tbody>
  34. </table>
  35. <h3 class="ui header">Users Registered in the last 24 hrs</h3>
  36. <table class="ui celled table" v-if="recentUsers.length > 0">
  37. <thead>
  38. <tr>
  39. <th>ID</th>
  40. <th>Username</th>
  41. <th>Registered</th>
  42. </tr>
  43. </thead>
  44. <tbody>
  45. <tr v-for="user in recentUsers">
  46. <td class="collapsing">{{ user.id }}</td>
  47. <td data-label="Username">
  48. <a :href="'/admin/user/' + user.username">{{ user.username }}</a>
  49. </td>
  50. <td>
  51. {{ millisToDate(user.registerDate) }}
  52. </td>
  53. </tr>
  54. </tbody>
  55. </table>
  56. <div class="ui message" v-if="recentUsers.length == 0">No users have registered in the last 24 hours.</div>
  57. <br /><br />
  58. <!-- Create User Modal -->
  59. <div class="ui small modal" id="newUserModal">
  60. <div class="header">Create User</div>
  61. <div class="content">
  62. <form class="ui form" id="newUserForm">
  63. <table class="ui very basic celled table">
  64. <tr>
  65. <td class="collapsing">Name</td>
  66. <td>
  67. <div class="ui input">
  68. <input name="username" autocomplete="off" type="text" />
  69. </div>
  70. </td>
  71. </tr>
  72. <tr>
  73. <td class="collapsing">Email</td>
  74. <td>
  75. <div class="ui input">
  76. <input name="email" autocomplete="off" type="email" />
  77. </div>
  78. </td>
  79. </tr>
  80. <tr>
  81. <td class="collapsing">Password</td>
  82. <td>
  83. <div class="ui input">
  84. <input name="password" autocomplete="new-password" type="password" />
  85. </div>
  86. </td>
  87. </tr>
  88. <tr>
  89. <td class="collapsing"></td>
  90. <td>
  91. <div class="ui checkbox">
  92. <input type="checkbox" name="sendEmail" />
  93. <label>Send email to user</label>
  94. </div>
  95. </td>
  96. </tr>
  97. </table>
  98. </form>
  99. </div>
  100. <div class="actions">
  101. <div class="ui green approve button"><i class="user plus icon"></i>Create User</div>
  102. <div class="ui red cancel button">Cancel</div>
  103. </div>
  104. </div>
  105. <!-- END Create User Modal -->
  106. </div>
  107. </body>
  108. </html>