25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

144 lines
3.0 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>Monitoring Tool</title>
  7. <style>
  8. body {
  9. font-family: Arial, sans-serif;
  10. margin: 20px;
  11. }
  12. table {
  13. width: 100%;
  14. max-width: 600px;
  15. margin: 20px auto;
  16. border-collapse: collapse;
  17. }
  18. td {
  19. padding: 10px;
  20. }
  21. label {
  22. font-weight: bold;
  23. }
  24. button {
  25. display: block;
  26. margin: 20px auto;
  27. padding: 10px 20px;
  28. font-size: 16px;
  29. cursor: pointer;
  30. background-color: #007bff;
  31. color: white;
  32. border: none;
  33. border-radius: 5px;
  34. }
  35. button:hover {
  36. background-color: #0056b3;
  37. }
  38. textarea {
  39. width: 100%;
  40. min-height: 60px;
  41. }
  42. input, select {
  43. width: 100%;
  44. }
  45. h1 {
  46. text-align: center;
  47. color: #333;
  48. }
  49. .section {
  50. margin: 40px 0;
  51. }
  52. </style>
  53. </head>
  54. <body>
  55. <!-- Token Saving Section -->
  56. <div class="section">
  57. <h1>Save Token</h1>
  58. <form id="tokenForm">
  59. <table>
  60. <tr>
  61. <td>
  62. <label for="token">Token:</label>
  63. </td>
  64. <td>
  65. <input type="text" id="token" placeholder="Enter your token" required />
  66. </td>
  67. </tr>
  68. </table>
  69. <button type="submit">Save Token</button>
  70. </form>
  71. </div>
  72. <!-- Check-Out Form Section -->
  73. <div class="section">
  74. <h1>Check Out Form</h1>
  75. <form id="taskForm">
  76. <table>
  77. <tr>
  78. <td>
  79. <label for="tasks">Tasks:</label>
  80. </td>
  81. <td>
  82. <textarea id="tasks" placeholder="Describe your tasks..." required></textarea>
  83. </td>
  84. </tr>
  85. </table>
  86. <button type="submit">Submit Check-Out</button>
  87. </form>
  88. </div>
  89. <script>
  90. // Handle token saving
  91. const tokenForm = document.getElementById('tokenForm');
  92. const tokenInput = document.getElementById('token');
  93. if (localStorage.token) {
  94. tokenInput.value = localStorage.token;
  95. }
  96. tokenForm.addEventListener('submit', (e) => {
  97. e.preventDefault();
  98. const token = tokenInput.value.trim();
  99. if (token) {
  100. localStorage.token = token;
  101. alert('Token saved successfully!');
  102. } else {
  103. alert('Please enter a valid token.');
  104. }
  105. });
  106. // Handle check-out form submission
  107. const taskForm = document.getElementById('taskForm');
  108. taskForm.addEventListener('submit', (e) => {
  109. e.preventDefault();
  110. const project = document.getElementById('project').value;
  111. const tasks = document.getElementById('tasks').value;
  112. const token = localStorage.token || '';
  113. if (!token) {
  114. alert('Please save your token first.');
  115. return;
  116. }
  117. // Send data to Electron main process
  118. window.electronAPI.submitCheckout({ project, tasks, token });
  119. // Display success message
  120. alert('Check-Out submitted successfully!');
  121. });
  122. </script>
  123. </body>
  124. </html>