fully featured

This commit is contained in:
wt
2025-06-27 18:31:28 +07:00
parent 5ba52dd285
commit 90a39bca44
2 changed files with 138 additions and 7 deletions
+26 -1
View File
@@ -29,6 +29,13 @@
<tbody id="upstream-dns-servers-table-body"></tbody>
</table>
</div>
<div class="card-footer">
<button
class="btn btn-primary"
style="width: 100%"
id="add_dns_server_button"
>Add</button>
</div>
</div>
<div class="card">
<div class="card-header"><h3 class="card-title">Local Domains</h3></div>
@@ -39,6 +46,13 @@
</tbody>
</table>
</div>
<div class="card-footer">
<button
class="btn btn-primary"
style="width: 100%"
id="add_local_domain_button"
>Add</button>
</div>
</div>
<div class="card">
<div class="card-header d-flex align-items-center gap-3 justify-content-between">
@@ -54,7 +68,7 @@
</div>
</div>
</div>
<div class="card" style="margin-bottom: 50px;">
<div class="card">
<div class="card-header d-flex align-items-center gap3 justify-content-between">
<h3>Cache size</h3>
</div>
@@ -62,6 +76,17 @@
<input type="number" name="" id="cache-size-input" class="form-control">
</div>
</div>
<div class="card" style="margin-bottom: 50px;">
<div class="card-header d-flex align-items-center gap3 justify-content-between">
<h3>Edit config file</h3>
</div>
<div class="card-body">
<textarea id="edit_file_input" style="width: 100%;height: 200px;"></textarea>
</div>
<div class="card-footer">
<button class="btn btn-primary" id="save_config_file_button" style="width: 100%">Save config file</button>
</div>
</div>
</section>
<button class="btn btn-primary" id="save-settings-button">Save</button>
<script src="js/checkbox.js"></script>
+112 -6
View File
@@ -2,27 +2,35 @@ const upstream_dns_servers_table_body = document.querySelector('#upstream-dns-se
const local_domains_table_body = document.querySelector('#local-domains-table-body')
const cache_size_input = document.querySelector('#cache-size-input')
const save_settings_button = document.querySelector('#save-settings-button')
const add_dns_server_button = document.querySelector('#add_dns_server_button')
const add_local_domain_button = document.querySelector('#add_local_domain_button')
const edit_file_input = document.querySelector('#edit_file_input')
const save_config_file_button = document.querySelector('#save_config_file_button')
var settings = {}
var configFile = ""
const updateInterface = () => {
const updateDnsServersTable = () => {
upstream_dns_servers_table_body.innerHTML = ""
local_domains_table_body.innerHTML = ""
for (var i = 0; i < settings.resolv.length; i++) {
upstream_dns_servers_table_body.innerHTML += `<tr>
<th class="d-flex align-items-center justify-content-between">
${settings.resolv[i]}
<button class="delete-table-button btn btn-danger">Del</button>
<button id="${i}" class="delete-table-button btn btn-danger">Del</button>
</th>
</tr>`
}
}
const updateLocalDomainsTable = () => {
local_domains_table_body.innerHTML = ""
for (const [key, value] of Object.entries(settings.hosts)) {
if (Array.isArray(value)) {
for (var i = 0; i < value.length; i++) {
local_domains_table_body.innerHTML += `<tr>
<th>${key}</th>
<th>${value[i]}</th>
<th><button class="deldomain btn btn-danger" id="${value[i]}">Del</button>
<th><button class="deldomain btn btn-danger" id="${key}|${value[i]}">Del</button>
</th>
</tr>`
}
@@ -30,11 +38,16 @@ const updateInterface = () => {
local_domains_table_body.innerHTML += `<tr>
<th>${key}</th>
<th>${value}</th>
<th><button class="deldomain btn btn-danger" id="${value}">Del</button>
<th><button class="deldomain btn btn-danger" id="${key}|${value}">Del</button>
</th>
</tr>`
}
}
}
const updateInterface = () => {
updateDnsServersTable()
updateLocalDomainsTable()
cache_size_input.value = settings.cache_size
}
@@ -74,4 +87,97 @@ cache_size_input.addEventListener('input', (e) => {
write_cache_size(e.target.value)
})
getSettings()
getSettings()
add_dns_server_button.addEventListener('click', () => {
const dns_server = prompt("Input your DNS server:")
if (dns_server === null) return
if (confirm("Confirm DNS settings? (add DNS server)")) {
if (Array.isArray(settings.resolv)) {
if (!settings.resolv.includes(dns_server)) {
settings.resolv.push(dns_server)
updateDnsServersTable()
}
}
}
})
upstream_dns_servers_table_body.addEventListener('click', (e) => {
if (e.target.classList.contains("delete-table-button")) {
if (confirm(`Confirm DNS settings? (delete DNS server: ${e.target.id})`)) {
if (Array.isArray(settings.resolv)) {
settings.resolv.splice(e.target.id, 1)
updateDnsServersTable()
}
}
}
})
add_local_domain_button.addEventListener('click', () => {
const domainip = prompt('Input localdomain IP:')
if (domainip === null) return
const domain = prompt('Input domain:')
if (domainip === null || domain === null) return
if (confirm(`Confirm DNS settings? (Add Local Domain: ${domainip} ${domain})`)) {
for (const [key, value] of Object.entries(settings.hosts)) {
if (key === domainip) {
if (Array.isArray(value)) {
if (!value.includes(domain)) {
value.push(domain)
updateLocalDomainsTable()
return
}
return
}
const domainsarray = [value, domain]
settings.hosts[key] = domainsarray
updateLocalDomainsTable()
return
}
}
settings.hosts[domainip] = domain
updateLocalDomainsTable()
}
})
local_domains_table_body.addEventListener('click', (e) => {
if (e.target.classList.contains('deldomain')) {
if (confirm(`Confirm DNS settings? (delete domain: ${e.target.id})`)) {
const domainip = e.target.id.split("|")[0]
const domain = e.target.id.split("|")[1]
for (const [key, value] of Object.entries(settings.hosts)) {
if (key === domainip) {
if (Array.isArray(value)) {
if (value.includes(domain)) {
value.splice(value.indexOf(domain), 1)
updateLocalDomainsTable()
return
}
return
}
delete settings.hosts[key]
updateLocalDomainsTable()
return
}
}
}
}
})
const getConfigFile = () => {
fetch(window.location.origin + "/api/settings/file")
.then(data => data.text())
.then(textdata => edit_file_input.value = textdata)
}
getConfigFile()
save_config_file_button.addEventListener('click', () => {
if (confirm("Save Config file?")) {
fetch(window.location.origin + "/api/settings/file", {
method: 'POST',
body: edit_file_input.value
}).then(data => data.text())
.then(textdata => edit_file_input.value = textdata)
}
})