TC
/
Zoraxy
zrcadlo https://git.hkwtc.org/TC/ReverseProxy


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
							<!DOCTYPE html>
<html>
  <head>
      <!-- Notes: This should be open in its original path-->
      <link rel="stylesheet" href="../script/semantic/semantic.min.css">
      <script src="../script/jquery-3.6.0.min.js"></script>
      <script src="../script/semantic/semantic.min.js"></script>
  </head>
  <body>
  <br>
  <div class="ui container">
    <div class="ui header">
        <div class="content">
            Certificates Auto Renew Settings
            <div class="sub header">Fetch and renew your certificates with ACME</div>
        </div>
    </div>
    <div class="ui message">
      
    </div>
    <div class="ui basic segment">
      <div class="ui toggle checkbox">
        <input type="checkbox" name="public">
        <label>Enable Domain Auto Renew</label>
      </div>
    </div>
    <div class="ui segment">
      <p>This is an example of using ACME.</p>
      <button id="fetchButton" class="ui primary button">Fetch Expired Domains</button>
    </div>

    <div id="domainTable" class="ui segment hidden">
      <h2 class="ui header">Expired Domains</h2>
      <table id="domainList" class="ui celled table">
        <thead>
          <tr>
            <th>Domain</th>
          </tr>
        </thead>
        <tbody></tbody>
      </table>
      <div class="ui segment">
        <h2 class="ui header">Obtain Certificate</h2>
        <div class="ui form">
          <div class="field">
            <label>Domains</label>
            <input id="domainsInput" type="text" placeholder="Enter domains separated by commas (e.g. r5desktop.alanyeung.co,alanyeung.co)">
          </div>
          <div class="field">
            <label>Filename</label>
            <input id="filenameInput" type="text" placeholder="Enter filename">
          </div>
          <button id="obtainButton" class="ui button" type="submit">Obtain Certificate</button>
        </div>
      </div>
    </div>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>
  <script>
    $(document).ready(function() {
      // Button click event handler
      $("#fetchButton").click(function() {
        fetchExpiredDomains();
      });

      // Fetch expired domains from API
      function fetchExpiredDomains() {
        $.ajax({
          url: "/api/acme/listExpiredDomains",
          method: "GET",
          success: function(response) {
            // Render domain table
            renderDomainTable(response.domain);
          },
          error: function(error) {
            console.log("Failed to fetch expired domains:", error);
          }
        });
      }

      // Render domain table with data
      function renderDomainTable(domains) {
        var tableBody = $("#domainList tbody");
        tableBody.empty();

        $.each(domains, function(index, domain) {
          var row = $("<tr>").appendTo(tableBody);
          $("<td>").text(domain).appendTo(row);
        });

        // Show the domain table
        $("#domainTable").removeClass("hidden");
      }

      // Button click event handler for obtaining certificate
      $("#obtainButton").click(function() {
        obtainCertificate();
      });

      // Obtain certificate from API
      function obtainCertificate() {
        var domains = $("#domainsInput").val();
        var filename = $("#filenameInput").val();

        $.ajax({
          url: "/api/acme/obtainCert",
          method: "GET",
          data: {
            domains: domains,
            filename: filename
          },
          success: function(response) {
            if (response.error) {
              console.log("Error:", response.error);
              // Show error message
              showMessage(response.error);
            } else {
              console.log("Certificate obtained successfully");
              // Show success message
              showMessage("Certificate obtained successfully");
            }
          },
          error: function(error) {
            console.log("Failed to obtain certificate:", error);
          }
        });
      }

      // Show message in a popup
      function showMessage(message) {
        $("<div>").addClass("ui message").text(message).appendTo("body").modal({
          onHide: function() {
            $(this).remove();
          }
        }).modal("show");
      }
    });
  </script>
</body>
</html>