settings.html 4.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8"/>
  5. <link rel="icon" href="/assets/logo.png">
  6. <link href="https://fonts.googleapis.com/css?family=Titillium+Web&display=swap" rel="stylesheet">
  7. <link type="text/css" href="/css/index.css" rel="stylesheet">
  8. <link type="text/css" href="/css/styles.css" rel="stylesheet">
  9. <link type="text/css" href="/css/controls.css" rel="stylesheet">
  10. <script src="/js/jquery-3.4.1.min.js"></script>
  11. <script src="/js/forms.js"></script>
  12. <script src="/js/notifications.js"></script>
  13. <script>
  14. $(document).ready(function() {
  15. initControls()
  16. addValidation('#fullNameField', null, validateFullName)
  17. addValidation('#passwordField', null, validatePassword)
  18. })
  19. function update() {
  20. var formValue = $('#updateForm').serialize()
  21. $.ajax({
  22. url: "/update",
  23. data: formValue,
  24. success: function(result) {
  25. showToast(Severity.Normal, "User information updated successfully")
  26. },
  27. error: function(jqXHR, textStatus, errorThrown) {
  28. showToast(Severity.Warning, "Unable to udapte user information: " + errorThrown + " " + textStatus)
  29. }
  30. })
  31. }
  32. function back() {
  33. window.history.back();
  34. }
  35. </script>
  36. <title>Gostfix mail {{.Version}}</title>
  37. </head>
  38. <body>
  39. <div id="main">
  40. <div class="horizontalPaddingBox">
  41. <div class="contentBox">
  42. <div class="leftPanel">
  43. <div class="folderBtn" onclick="back();">Back</div>
  44. <div class="folderBtn">User settings</div>
  45. </div>
  46. <div class="verticalPaddingBox">
  47. <div class="innerConentBox materialLevel1">
  48. <div style="flex: 1 1 auto; display: flex; flex-direction: column;">
  49. <div class="settingsHeader">
  50. User settings
  51. </div>
  52. <form id="updateForm" style="margin: 0 auto;">
  53. <div class="inpt bad">
  54. <input id="fullNameField" name="fullName" type="text" required maxlength="128" autocomplete="off" value="{{.FullName}}">
  55. <span class="highlight"></span>
  56. <span class="bar"></span>
  57. <label>Full name</label>
  58. </div>
  59. <div class="inpt password bad">
  60. <input id="passwordField" name="password" type="password" required maxlength="28" autocomplete="off">
  61. <span class="highlight"></span>
  62. <span class="bar"></span>
  63. <label>New password</label>
  64. <img class="icon" src="/assets/eye.svg"/>
  65. </div>
  66. <div class="inpt">
  67. <input id="oldPasswordField" name="oldPassword" type="password" required maxlength="28" autocomplete="off">
  68. <span class="highlight"></span>
  69. <span class="bar"></span>
  70. <label>Old password</label>
  71. </div>
  72. <div id="updateButton" class="btn materialLevel1" style="margin-bottom: 30px;" onclick="update();">Update</div>
  73. </form>
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. <div id="copyrightBox" class="elidedText"><img src="/assets/logo.svg" height="30px"/>gostfix {{.Version}} Web interface. Copyright (c) 2020 Alexey Edelev &lt;semlanik@gmail.com&gt;</div>
  80. </div>
  81. </body>
  82. </html>