settings.html 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  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>
  13. $(document).ready(function() {
  14. initControls()
  15. addValidation('#fullNameField', null, validateFullName)
  16. addValidation('#passwordField', null, validatePassword)
  17. })
  18. function update() {
  19. var formValue = $('#updateForm').serialize()
  20. $.ajax({
  21. url: "/update",
  22. data: formValue,
  23. success: function(result) {
  24. console.log("update ok")
  25. },
  26. error: function(jqXHR, textStatus, errorThrown) {
  27. console.log("Update failed: " + textStatus)
  28. }
  29. })
  30. }
  31. function back() {
  32. window.history.back();
  33. }
  34. </script>
  35. <title>Gostfix mail {{.Version}}</title>
  36. </head>
  37. <body>
  38. <div id="main">
  39. <div class="horizontalPaddingBox">
  40. <div class="contentBox">
  41. <div class="leftPanel">
  42. <div class="folderBtn" onclick="back();">Back</div>
  43. <div class="folderBtn">User settings</div>
  44. </div>
  45. <div class="verticalPaddingBox">
  46. <div class="innerConentBox materialLevel1">
  47. <div style="flex: 1 1 auto; display: flex; flex-direction: column;">
  48. <div class="settingsHeader">
  49. User settings
  50. </div>
  51. <form id="updateForm" style="margin: 0 auto;">
  52. <div class="inpt bad">
  53. <input id="fullNameField" name="fullName" type="text" required maxlength="128" autocomplete="off" value="{{.FullName}}">
  54. <span class="highlight"></span>
  55. <span class="bar"></span>
  56. <label>Full name</label>
  57. </div>
  58. <div class="inpt password bad">
  59. <input id="passwordField" name="password" type="password" required maxlength="128" autocomplete="off">
  60. <span class="highlight"></span>
  61. <span class="bar"></span>
  62. <label>New password</label>
  63. <img class="icon" src="/assets/eye.svg"/>
  64. </div>
  65. <div class="inpt">
  66. <input id="oldPasswordField" name="oldPassword" type="password" required maxlength="128" autocomplete="off">
  67. <span class="highlight"></span>
  68. <span class="bar"></span>
  69. <label>Old password</label>
  70. </div>
  71. <div id="updateButton" class="btn materialLevel1" style="margin-bottom: 30px;" onclick="update();">Update</div>
  72. </form>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. <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>
  79. </div>
  80. </body>
  81. </html>