kenzok8-package/luci-app-openclash/luasrc/view/openclash/tblsection_dns.htm
2024-12-31 20:36:55 +08:00

331 lines
12 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<%-
local rowcnt = 1
local uci = require("luci.model.uci").cursor()
local fs = require "luci.openclash"
function rowstyle()
rowcnt = rowcnt + 1
return (rowcnt % 2) + 1
end
function width(o)
if o.width then
if type(o.width) == 'number' then
return ' style="width:%dpx"' % o.width
end
return ' style="width:%s"' % o.width
end
return ''
end
local head_width
local e={}
table.insert(e, {group="nameserver"})
table.insert(e, {group="fallback"})
table.insert(e, {group="default"})
local sectiontype = "_"..self.config.."_"..string.match(self.sectiontype, "[%w_]+") or "self.sectiontype"
-%>
<style type="text/css">
*{margin: 0;padding: 0;}
ul{
list-style: none;
}
h3{
margin-top: 0;
}
.cbi-value-field .cbi-dropdown, .cbi-value-field .cbi-input-select, .cbi-value input[type="text"], .cbi-value input[type="password"] {
min-width: auto;
}
#tab-header-<%=self.config%>-<%=self.sectiontype%>{
min-height: 35px;
text-align: center;
position: relative;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#tab-header-<%=self.config%>-<%=self.sectiontype%> ul{
left: -1px;
width: 100%;
padding: unset !important;
margin: unset !important;
}
#tab-header-<%=self.config%>-<%=self.sectiontype%> ul li{
float: left;
width: 160px;
line-height: 35px;
padding: 0 1px;
border-right: 1px solid #dddddd;
cursor: pointer;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#tab-header-<%=self.config%>-<%=self.sectiontype%> ul li a{
float: unset !important;
padding: unset !important;
vertical-align: middle;
}
#tab-header-<%=self.config%>-<%=self.sectiontype%> ul li.cbi-tab > a{
font-weight: bolder;
}
#tab-header-<%=self.config%>-<%=self.sectiontype%> ul li a:hover{
color: orangered;
}
#tab-content .dom-<%=self.config%>-<%=self.sectiontype%>{
display: none;
}
#tab-content .dom-<%=self.config%>-<%=self.sectiontype%> ul li{
float: left;
margin: 15px 10px;
width: 225px;
}
</style>
<!-- tblsection -->
<fieldset class="cbi-section" id="cbi-<%=self.config%>-<%=self.sectiontype%>">
<% if self.title and #self.title > 0 then -%>
<h3><%=self.title%></h3>
<%- end %>
<%- if self.sortable then -%>
<input type="hidden" id="cbi.sts.<%=self.config%>.<%=self.sectiontype%>" name="cbi.sts.<%=self.config%>.<%=self.sectiontype%>" value="" />
<%- end -%>
<div class="cbi-section-descr"><%=self.description%></div>
<%- local count = 0 -%>
<div id="tab-header-<%=self.config%>-<%=self.sectiontype%>" class="cbi-tabmenu">
<ul class="cbi-tabmenu">
<li name="tab-header-<%=self.config%>-<%=self.sectiontype%>" class="cbi-tab"><a>NameServer</a></li>
<li name="tab-header-<%=self.config%>-<%=self.sectiontype%>" class="cbi-tab-disabled"><a>FallBack</a></li>
<li name="tab-header-<%=self.config%>-<%=self.sectiontype%>" class="cbi-tab-disabled"><a>Default-NameServer</a></li>
</ul>
</div>
<div id="tab-content">
<%- for t,o in ipairs(e)do
if o.group == "nameserver" then
-%>
<div class="dom-<%=self.config%>-<%=self.sectiontype%>" style="display: block;">
<%- else -%>
<div class="dom-<%=self.config%>-<%=self.sectiontype%>">
<%- end -%>
<table class="cbi-section-table">
<tr class="cbi-section-table-titles">
<%- if not self.anonymous then -%>
<%- if self.sectionhead then -%>
<th class="cbi-section-table-cell"><%=self.sectionhead%></th>
<%- else -%>
<th>&#160;</th>
<%- end -%>
<%- end -%>
<%- for i, k in pairs(self.children) do if not k.optional then -%>
<%- if i == 1 then -%>
<th class="cbi-section-table-cell"><%:Serial Number%></th>
<%- end -%>
<th class="cbi-section-table-cell"<%=width(k)%>>
<%- if k.titleref then -%><a title="<%=self.titledesc or translate('Go to relevant configuration page')%>" class="cbi-title-ref" href="<%=k.titleref%>"><%- end -%>
<%-=k.title-%>
<%- if k.titleref then -%></a><%- end -%>
</th>
<%- count = count + 1; end; end; if self.sortable then -%>
<th class="cbi-section-table-cell"><%:Sort%></th>
<%- end; if self.extedit or self.addremove then -%>
<th class="cbi-section-table-cell"><%:Edit%></th>
<%- count = count + 1; end -%>
</tr>
<tr class="cbi-section-table-descr">
<%- if not self.anonymous then -%>
<%- if self.sectiondesc then -%>
<th class="cbi-section-table-cell"><%=self.sectiondesc%></th>
<%- else -%>
<th></th>
<%- end -%>
<%- end; if self.extedit or self.addremove then -%>
<th></th>
<%- end -%>
<%- for i, k in pairs(self.children) do if not k.optional then -%>
<th class="cbi-section-table-cell"<%=width(k)%>><%=k.description%></th>
<%- end; end; if self.sortable then -%>
<th class="cbi-section-table-cell"></th>
<%- end; if self.extedit or self.addremove then -%>
<th class="cbi-section-table-cell"></th>
<%- end -%>
</tr>
<%- local isempty = true
local num = 1
for i, k in ipairs(self:cfgsections()) do
section = k
while true do
if uci:get("openclash", section, "group") ~= o.group then
break
end
isempty = false
scope = { valueheader = "cbi/cell_valueheader", valuefooter = "cbi/cell_valuefooter" }
-%>
<tr class="cbi-section-table-row<% if self.extedit or self.rowcolors then %> cbi-rowstyle-<%=rowstyle()%><% end %>" id="cbi-<%=self.config%>-<%=section%>">
<% if not self.anonymous then -%>
<th><h3><%=(type(self.sectiontitle) == "function") and self:sectiontitle(section) or k%></h3></th>
<%- end %>
<td class="cbi-section-table-cell">
<p><%=num%></p>
<% num = num + 1 -%>
</td>
<%-
for k, node in ipairs(self.children) do
if not node.optional then
node:render(section, scope or {})
end
end
-%>
<%- if self.sortable then -%>
<td class="cbi-section-table-cell">
<input class="cbi-button cbi-button-up" type="button" value="<%:∧%>" onclick="return cbi_row_swap(this, true, 'cbi.sts.<%=self.config%>.<%=self.sectiontype%>')" alt="<%:Move up%>" title="<%:Move up%>" />
<input class="cbi-button cbi-button-down" type="button" value="<%:%>" onclick="return cbi_row_swap(this, false, 'cbi.sts.<%=self.config%>.<%=self.sectiontype%>')" alt="<%:Move down%>" title="<%:Move down%>" />
</td>
<%- end -%>
<%- if self.extedit or self.addremove then -%>
<td class="cbi-section-table-cell">
<%- if self.extedit then -%>
<input class="btn cbi-button cbi-button-edit" type="button" value="<%:Edit%>"
<%- if type(self.extedit) == "string" then
%> onclick="location.href='<%=self.extedit:format(section)%>';return switch_to_tab<%=sectiontype%>()"
<%- elseif type(self.extedit) == "function" then
%> onclick="location.href='<%=self:extedit(section)%>';return switch_to_tab<%=sectiontype%>()"
<%- end
%> alt="<%:Edit%>" title="<%:Edit%>" />
<%- end; if self.addremove then %>
<input class="btn cbi-button cbi-button-remove" type="submit" value="<%:Delete%>" onclick="this.form.cbi_state='del-section';return switch_to_tab<%=sectiontype%>()" name="cbi.rts.<%=self.config%>.<%=k%>" alt="<%:Delete%>" title="<%:Delete%>" />
<%- end -%>
</td>
<%- end -%>
<%-
break
end
-%>
</tr>
<%- end -%>
<%- if isempty then -%>
<tr class="cbi-section-table-row">
<td colspan="<%=count%>"><em><br /><%:This section contains no values yet%></em></td>
</tr>
<%- end -%>
</table>
<% if self.error then %>
<div class="cbi-section-error">
<ul><% for _, c in pairs(self.error) do for _, e in ipairs(c) do -%>
<li><%=pcdata(e):gsub("\n","<br />")%></li>
<%- end end %></ul>
</div>
<% end %>
<%- if self.addremove then -%>
<% if self.template_addremove then include(self.template_addremove) else -%>
<div class="cbi-section-create cbi-tblsection-create">
<% if self.anonymous then %>
<input class="btn cbi-button cbi-button-add" type="submit" onclick="return switch_to_tab<%=sectiontype%>('create')" value="<%:Add%>" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" title="<%:Add%>" />
<% else %>
<% if self.invalid_cts then -%><div class="cbi-section-error"><% end %>
<input type="text" class="cbi-section-create-name" id="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>.<%=section%>" data-type="uciname" data-optional="true" />
<input class="btn cbi-button cbi-button-add" type="submit" onclick="this.form.cbi_state='add-section'; return true" value="<%:Add%>" title="<%:Add%>" />
<% if self.invalid_cts then -%>
<br /><%:Invalid%></div>
<%- end %>
<% end %>
</div>
<%- end %>
<%- end -%>
</div>
<%- end -%>
</div>
</fieldset>
<!-- /tblsection -->
<script type="text/javascript">//<![CDATA[
window.addEventListener('load', onload<%=sectiontype%>, false);
var titles<%=sectiontype%> = document.getElementsByName('tab-header-<%=self.config%>-<%=self.sectiontype%>');
var divs<%=sectiontype%> = document.getElementsByClassName('dom-<%=self.config%>-<%=self.sectiontype%>');
function switch_to_tab<%=sectiontype%>(type){
if(titles<%=sectiontype%>.length != divs<%=sectiontype%>.length) return;
if ( type == 'create' ) {
for(var j=0; j < titles<%=sectiontype%>.length; j++){
titles<%=sectiontype%>[j].className = 'cbi-tab-disabled';
divs<%=sectiontype%>[j].style.display = 'none';
};
titles<%=sectiontype%>[0].className = 'cbi-tab';
divs<%=sectiontype%>[0].style.display = 'block';
localStorage.setItem("titles<%=sectiontype%>",0);
};
localStorage.setItem("id<%=sectiontype%>",'cbi-<%=self.config%>-<%=self.sectiontype%>');
return true;
};
function onload<%=sectiontype%>() {
if(titles<%=sectiontype%>.length != divs<%=sectiontype%>.length) return;
if (localStorage.getItem("id<%=sectiontype%>")) {
if (document.getElementById(localStorage.getItem("id<%=sectiontype%>"))) {
document.getElementById(localStorage.getItem("id<%=sectiontype%>")).scrollIntoView();
};
localStorage.removeItem("id<%=sectiontype%>");
};
if (localStorage.getItem("titles<%=sectiontype%>")) {
if (titles<%=sectiontype%>[localStorage.getItem("titles<%=sectiontype%>")]) {
for(var j=0; j < titles<%=sectiontype%>.length; j++){
titles<%=sectiontype%>[j].className = 'cbi-tab-disabled';
divs<%=sectiontype%>[j].style.display = 'none';
};
titles<%=sectiontype%>[localStorage.getItem("titles<%=sectiontype%>")].className = 'cbi-tab';
divs<%=sectiontype%>[localStorage.getItem("titles<%=sectiontype%>")].style.display = 'block';
};
localStorage.removeItem("titles<%=sectiontype%>");
};
for(var i=0; i < titles<%=sectiontype%>.length; i++){
var li<%=sectiontype%> = titles<%=sectiontype%>[i];
li<%=sectiontype%>.id = i;
li<%=sectiontype%>.onclick = function(){
for(var j=0; j < titles<%=sectiontype%>.length; j++){
titles<%=sectiontype%>[j].className = 'cbi-tab-disabled';
divs<%=sectiontype%>[j].style.display = 'none';
};
this.className = 'cbi-tab';
divs<%=sectiontype%>[this.id].style.display = 'block';
localStorage.setItem("titles<%=sectiontype%>",this.id);
};
li<%=sectiontype%>.onTouchStart = function(){
for(var j=0; j < titles<%=sectiontype%>.length; j++){
titles<%=sectiontype%>[j].className = 'cbi-tab-disabled';
divs<%=sectiontype%>[j].style.display = 'none';
};
this.className = 'cbi-tab';
divs<%=sectiontype%>[this.id].style.display = 'block';
localStorage.setItem("titles<%=sectiontype%>",this.id);
};
};
};
//]]>
</script>