前端页面
This commit is contained in:
robin
@@ -116,26 +116,8 @@
|
||||
<p class="comment httpdns-note">用于生成鉴权接口的安全密钥。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">数据加密 Secret</td>
|
||||
<td>
|
||||
<div class="httpdns-secret-line">
|
||||
<code>{{aesSecretVisible ? settings.aesSecretPlain : settings.aesSecretMasked}}</code>
|
||||
<a href="" class="httpdns-mini-icon" @click.prevent="aesSecretVisible = !aesSecretVisible"
|
||||
:title="aesSecretVisible ? '隐藏明文' : '查看明文'"><i class="icon"
|
||||
:class="aesSecretVisible ? 'eye slash' : 'eye'"></i></a>
|
||||
<a href="" class="httpdns-mini-icon" title="复制数据加密 Secret"
|
||||
@click.prevent="copySecret(settings.aesSecretPlain, 'AES Secret')"><i
|
||||
class="copy outline icon"></i></a>
|
||||
<a href="" class="httpdns-mini-icon" title="重置数据加密 Secret" @click.prevent="resetAESSecret"><i
|
||||
class="redo icon"></i></a>
|
||||
</div>
|
||||
<p class="comment httpdns-note">最近更新：{{settings.aesSecretUpdatedAt}}</p>
|
||||
<p class="comment httpdns-note">用于解析接口数据加密的密钥。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,14 +2,13 @@ Tea.context(function () {
|
||||
this.activeSection = this.activeSection || "basic";
|
||||
this.success = NotifyReloadSuccess("保存成功");
|
||||
this.signSecretVisible = false;
|
||||
this.aesSecretVisible = false;
|
||||
|
||||
this.toggleSignEnabled = function () {
|
||||
let that = this;
|
||||
let targetIsOn = !this.settings.signEnabled;
|
||||
|
||||
if (targetIsOn) {
|
||||
teaweb.confirm("html:开启后，服务端会对解析请求进行签名鉴权，<span class='red'>未签名、签名无效或过期的请求都解析失败</span>，确认开启吗？", function () {
|
||||
teaweb.confirm("html:开启后，服务端会对解析请求进行签名鉴权，<span class='red'>未签名、签名无效或过期的请求都会解析失败</span>，确认开启吗？", function () {
|
||||
that.$post("/httpdns/apps/app/settings/toggleSignEnabled")
|
||||
.params({
|
||||
appId: that.app.id,
|
||||
@@ -93,20 +92,4 @@ Tea.context(function () {
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
this.resetAESSecret = function () {
|
||||
let that = this;
|
||||
teaweb.confirm("确定要重置 AES Secret 吗？", function () {
|
||||
that.$post("/httpdns/apps/app/settings/resetAESSecret")
|
||||
.params({
|
||||
appId: that.app.id
|
||||
})
|
||||
.success(function () {
|
||||
teaweb.success("AES Secret 已重置", function () {
|
||||
teaweb.reload();
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
@@ -8,8 +8,8 @@
|
||||
return;
|
||||
}
|
||||
teaweb.popup("/httpdns/apps/customRecords/createPopup?appId=" + this.app.id + "&domainId=" + this.domain.id, {
|
||||
width: "56em",
|
||||
height: "40em",
|
||||
width: "42em",
|
||||
height: "33em",
|
||||
title: "新增自定义解析规则"
|
||||
});
|
||||
};
|
||||
@@ -19,8 +19,8 @@
|
||||
return;
|
||||
}
|
||||
teaweb.popup("/httpdns/apps/customRecords/createPopup?appId=" + this.app.id + "&domainId=" + this.domain.id + "&recordId=" + recordId, {
|
||||
width: "56em",
|
||||
height: "40em",
|
||||
width: "42em",
|
||||
height: "33em",
|
||||
title: "编辑自定义解析规则"
|
||||
});
|
||||
};
|
||||
|
||||
@@ -1,32 +1,37 @@
|
||||
{$layout "layout_popup"}
|
||||
|
||||
<style>
|
||||
.httpdns-inline-actions {
|
||||
margin-top: .6em;
|
||||
}
|
||||
.httpdns-inline-actions .count {
|
||||
color: #8f9aa6;
|
||||
margin-left: .4em;
|
||||
}
|
||||
.httpdns-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: .5em;
|
||||
margin-bottom: .45em;
|
||||
}
|
||||
.httpdns-row .field {
|
||||
margin: 0 !important;
|
||||
}
|
||||
.httpdns-row .field.flex {
|
||||
flex: 1;
|
||||
}
|
||||
.httpdns-line-row {
|
||||
display: flex !important;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
gap: .5em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.httpdns-inline-actions {
|
||||
margin-top: .6em;
|
||||
}
|
||||
|
||||
.httpdns-inline-actions .count {
|
||||
color: #8f9aa6;
|
||||
margin-left: .4em;
|
||||
}
|
||||
|
||||
.httpdns-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: .5em;
|
||||
margin-bottom: .45em;
|
||||
}
|
||||
|
||||
.httpdns-row .field {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.httpdns-row .field.flex {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.httpdns-line-row {
|
||||
display: flex !important;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
gap: .5em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
</style>
|
||||
|
||||
<h3 v-if="isEditing">编辑自定义解析规则</h3>
|
||||
@@ -40,98 +45,116 @@
|
||||
<input type="hidden" name="recordId" :value="record.id" />
|
||||
<input type="hidden" name="recordItemsJSON" :value="JSON.stringify(recordItems)" />
|
||||
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">域名 *</td>
|
||||
<td><strong>{{record.domain}}</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">规则名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="ruleName" maxlength="50" v-model="record.ruleName" ref="focus" />
|
||||
<p class="comment">例如：上海电信灰度-v2。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">线路</td>
|
||||
<td>
|
||||
<div class="httpdns-line-row">
|
||||
<select class="ui dropdown auto-width" style="display:inline-block !important;width:auto !important;margin:0 !important;" name="lineScope" v-model="record.lineScope" @change="onLineScopeChange">
|
||||
<option value="china">中国大陆</option>
|
||||
<option value="overseas">港澳台及境外</option>
|
||||
</select>
|
||||
<table class="ui table definition selectable small">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="title">域名 *</td>
|
||||
<td><strong>{{record.domain}}</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">规则名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="ruleName" maxlength="50" v-model="record.ruleName" ref="focus" />
|
||||
<p class="comment">例如：上海电信灰度-v2。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">线路</td>
|
||||
<td>
|
||||
<div class="httpdns-line-row">
|
||||
<select class="ui dropdown auto-width"
|
||||
style="display:inline-block !important;width:auto !important;margin:0 !important;"
|
||||
name="lineScope" v-model="record.lineScope" @change="onLineScopeChange">
|
||||
<option value="china">中国地区</option>
|
||||
<option value="overseas">境外</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width"
|
||||
style="display:inline-block !important;width:auto !important;margin:0 !important;"
|
||||
name="lineCarrier" v-if="record.lineScope == 'china'" v-model="record.lineCarrier">
|
||||
<option v-for="carrier in chinaCarriers" :value="carrier">{{carrier}}</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width"
|
||||
style="display:inline-block !important;width:auto !important;margin:0 !important;"
|
||||
name="lineRegion" v-if="record.lineScope == 'china'" v-model="record.lineRegion"
|
||||
@change="onChinaRegionChange">
|
||||
<option v-for="region in chinaRegions" :value="region">{{region}}</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width"
|
||||
style="display:inline-block !important;width:auto !important;margin:0 !important;"
|
||||
name="lineProvince" v-if="record.lineScope == 'china'" v-model="record.lineProvince">
|
||||
<option v-for="province in provinceOptions" :value="province">{{province}}</option>
|
||||
</select>
|
||||
|
||||
<select class="ui dropdown auto-width" style="display:inline-block !important;width:auto !important;margin:0 !important;" name="lineCarrier" v-if="record.lineScope == 'china'" v-model="record.lineCarrier">
|
||||
<option v-for="carrier in chinaCarriers" :value="carrier">{{carrier}}</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width" style="display:inline-block !important;width:auto !important;margin:0 !important;" name="lineRegion" v-if="record.lineScope == 'china'" v-model="record.lineRegion" @change="onChinaRegionChange">
|
||||
<option v-for="region in chinaRegions" :value="region">{{region}}</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width" style="display:inline-block !important;width:auto !important;margin:0 !important;" name="lineProvince" v-if="record.lineScope == 'china'" v-model="record.lineProvince">
|
||||
<option v-for="province in provinceOptions" :value="province">{{province}}</option>
|
||||
</select>
|
||||
|
||||
<select class="ui dropdown auto-width" style="display:inline-block !important;width:auto !important;margin:0 !important;" name="lineContinent" v-if="record.lineScope == 'overseas'" v-model="record.lineContinent" @change="onContinentChange">
|
||||
<option v-for="continent in continents" :value="continent">{{continent}}</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width" style="display:inline-block !important;width:auto !important;margin:0 !important;" name="lineCountry" v-if="record.lineScope == 'overseas'" v-model="record.lineCountry">
|
||||
<option v-for="country in countryOptions" :value="country">{{country}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">解析记录值 *</td>
|
||||
<td>
|
||||
<div style="float:right;">
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="weightEnabled" value="1" v-model="record.weightEnabled" />
|
||||
<label>按权重调度</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="httpdns-row" v-for="(item, index) in recordItems">
|
||||
<div class="field">
|
||||
<select class="ui dropdown auto-width" v-model="item.type">
|
||||
<option value="A">A</option>
|
||||
<option value="AAAA">AAAA</option>
|
||||
<select class="ui dropdown auto-width"
|
||||
style="display:inline-block !important;width:auto !important;margin:0 !important;"
|
||||
name="lineContinent" v-if="record.lineScope == 'overseas'" v-model="record.lineContinent"
|
||||
@change="onContinentChange">
|
||||
<option v-for="continent in continents" :value="continent">{{continent}}</option>
|
||||
</select>
|
||||
<select class="ui dropdown auto-width"
|
||||
style="display:inline-block !important;width:auto !important;margin:0 !important;"
|
||||
name="lineCountry" v-if="record.lineScope == 'overseas'" v-model="record.lineCountry">
|
||||
<option v-for="country in countryOptions" :value="country">{{country}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="field flex">
|
||||
<input type="text" placeholder="记录值（与记录类型匹配）" v-model="item.value" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">解析记录值 *</td>
|
||||
<td>
|
||||
<div style="margin-bottom: 0.5em;">
|
||||
<div class="ui checkbox" style="margin-bottom: 0.5em;">
|
||||
<input type="checkbox" name="weightEnabled" value="1" v-model="record.weightEnabled" />
|
||||
<label>开启权重调度设置</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field" v-if="record.weightEnabled">
|
||||
<input type="text" style="width:8em;" placeholder="权重(1-100)" v-model="item.weight" />
|
||||
|
||||
<div class="httpdns-row" v-for="(item, index) in recordItems">
|
||||
<div class="field">
|
||||
<select class="ui dropdown auto-width" v-model="item.type">
|
||||
<option value="A">A</option>
|
||||
<option value="AAAA">AAAA</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="field flex">
|
||||
<input type="text" placeholder="记录值" v-model="item.value" />
|
||||
</div>
|
||||
<div class="field" v-if="record.weightEnabled">
|
||||
<input type="text" style="width:7em;" placeholder="权重1-100" v-model="item.weight" />
|
||||
</div>
|
||||
<div class="field">
|
||||
<a href="" @click.prevent="removeRecordItem(index)" title="删除"><i
|
||||
class="icon trash alternate outline"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="" @click.prevent="removeRecordItem(index)" title="删除"><i class="icon trash alternate outline"></i></a>
|
||||
</div>
|
||||
<div class="httpdns-inline-actions">
|
||||
<a href="" @click.prevent="addRecordItem" :class="{disabled: recordItems.length >= 10}">
|
||||
<i class="icon plus circle"></i>添加记录值
|
||||
</a>
|
||||
<span class="count">{{recordItems.length}}/10</span>
|
||||
</div>
|
||||
<p class="comment" v-if="record.weightEnabled">开启后每条记录可配置权重，范围 1-100。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">TTL *</td>
|
||||
<td>
|
||||
<div class="ui input right labeled">
|
||||
<input type="text" name="ttl" maxlength="5" style="width:8em;" v-model="record.ttl" />
|
||||
<span class="ui basic label">秒</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">规则状态</td>
|
||||
<td>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="isOn" value="1" v-model="record.isOn" />
|
||||
<label>启用</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<div class="httpdns-inline-actions">
|
||||
<a href="" @click.prevent="addRecordItem" :class="{disabled: recordItems.length >= 10}">
|
||||
<i class="icon plus circle"></i>添加记录值
|
||||
</a>
|
||||
<span class="count">{{recordItems.length}}/10</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">TTL *</td>
|
||||
<td>
|
||||
<div class="ui input right labeled">
|
||||
<input type="text" name="ttl" maxlength="5" style="width:8em;" v-model="record.ttl" />
|
||||
<span class="ui basic label">秒</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="title">状态</td>
|
||||
<td>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="isOn" value="1" v-model="record.isOn" />
|
||||
<label>启用当前规则</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
</form>
|
||||
@@ -26,11 +26,11 @@
|
||||
|
||||
<table class="ui table selectable celled httpdns-apps-table" v-if="apps.length > 0">
|
||||
<colgroup>
|
||||
<col style="width:34%;" />
|
||||
<col style="width:28%;" />
|
||||
<col style="width:32%;" />
|
||||
<col style="width:26%;" />
|
||||
<col style="width:12%;" />
|
||||
<col style="width:10%;" />
|
||||
<col style="width:16%;" />
|
||||
<col style="width:20%;" />
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
|
||||
Reference in New Issue
Block a user