1.4.5.2
This commit is contained in:
@@ -0,0 +1,72 @@
|
||||
Vue.component("dns-domain-selector", {
|
||||
props: ["v-domain-id", "v-domain-name", "v-provider-name"],
|
||||
data: function () {
|
||||
let domainId = this.vDomainId
|
||||
if (domainId == null) {
|
||||
domainId = 0
|
||||
}
|
||||
let domainName = this.vDomainName
|
||||
if (domainName == null) {
|
||||
domainName = ""
|
||||
}
|
||||
|
||||
let providerName = this.vProviderName
|
||||
if (providerName == null) {
|
||||
providerName = ""
|
||||
}
|
||||
|
||||
return {
|
||||
domainId: domainId,
|
||||
domainName: domainName,
|
||||
providerName: providerName
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
select: function () {
|
||||
let that = this
|
||||
teaweb.popup("/dns/domains/selectPopup", {
|
||||
callback: function (resp) {
|
||||
that.domainId = resp.data.domainId
|
||||
that.domainName = resp.data.domainName
|
||||
that.providerName = resp.data.providerName
|
||||
that.change()
|
||||
}
|
||||
})
|
||||
},
|
||||
remove: function() {
|
||||
this.domainId = 0
|
||||
this.domainName = ""
|
||||
this.change()
|
||||
},
|
||||
update: function () {
|
||||
let that = this
|
||||
teaweb.popup("/dns/domains/selectPopup?domainId=" + this.domainId, {
|
||||
callback: function (resp) {
|
||||
that.domainId = resp.data.domainId
|
||||
that.domainName = resp.data.domainName
|
||||
that.providerName = resp.data.providerName
|
||||
that.change()
|
||||
}
|
||||
})
|
||||
},
|
||||
change: function () {
|
||||
this.$emit("change", {
|
||||
id: this.domainId,
|
||||
name: this.domainName
|
||||
})
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" name="dnsDomainId" :value="domainId"/>
|
||||
<div v-if="domainName.length > 0">
|
||||
<span class="ui label small basic">
|
||||
<span v-if="providerName != null && providerName.length > 0">{{providerName}} » </span> {{domainName}}
|
||||
<a href="" @click.prevent="update"><i class="icon pencil small"></i></a>
|
||||
<a href="" @click.prevent="remove()"><i class="icon remove"></i></a>
|
||||
</span>
|
||||
</div>
|
||||
<div v-if="domainName.length == 0">
|
||||
<a href="" @click.prevent="select()">[选择域名]</a>
|
||||
</div>
|
||||
</div>`
|
||||
})
|
||||
@@ -0,0 +1,43 @@
|
||||
Vue.component("dns-resolver-config-box", {
|
||||
props:["v-dns-resolver-config"],
|
||||
data: function () {
|
||||
let config = this.vDnsResolverConfig
|
||||
if (config == null) {
|
||||
config = {
|
||||
type: "default"
|
||||
}
|
||||
}
|
||||
return {
|
||||
config: config,
|
||||
types: [
|
||||
{
|
||||
name: "默认",
|
||||
code: "default"
|
||||
},
|
||||
{
|
||||
name: "CGO",
|
||||
code: "cgo"
|
||||
},
|
||||
{
|
||||
name: "Go原生",
|
||||
code: "goNative"
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" name="dnsResolverJSON" :value="JSON.stringify(config)"/>
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">使用的DNS解析库</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" v-model="config.type">
|
||||
<option v-for="t in types" :value="t.code">{{t.name}}</option>
|
||||
</select>
|
||||
<p class="comment">边缘节点使用的DNS解析库。修改此项配置后,需要重启节点进程才会生效。<pro-warning-label></pro-warning-label></p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="margin"></div>
|
||||
</div>`
|
||||
})
|
||||
@@ -0,0 +1,83 @@
|
||||
Vue.component("dns-resolvers-config-box", {
|
||||
props: ["value", "name"],
|
||||
data: function () {
|
||||
let resolvers = this.value
|
||||
if (resolvers == null) {
|
||||
resolvers = []
|
||||
}
|
||||
|
||||
let name = this.name
|
||||
if (name == null || name.length == 0) {
|
||||
name = "dnsResolversJSON"
|
||||
}
|
||||
|
||||
return {
|
||||
formName: name,
|
||||
resolvers: resolvers,
|
||||
|
||||
host: "",
|
||||
|
||||
isAdding: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add: function () {
|
||||
this.isAdding = true
|
||||
let that = this
|
||||
setTimeout(function () {
|
||||
that.$refs.hostRef.focus()
|
||||
})
|
||||
},
|
||||
confirm: function () {
|
||||
let host = this.host.trim()
|
||||
if (host.length == 0) {
|
||||
let that = this
|
||||
setTimeout(function () {
|
||||
that.$refs.hostRef.focus()
|
||||
})
|
||||
return
|
||||
}
|
||||
this.resolvers.push({
|
||||
host: host,
|
||||
port: 0, // TODO
|
||||
protocol: "" // TODO
|
||||
})
|
||||
this.cancel()
|
||||
},
|
||||
cancel: function () {
|
||||
this.isAdding = false
|
||||
this.host = ""
|
||||
this.port = 0
|
||||
this.protocol = ""
|
||||
},
|
||||
remove: function (index) {
|
||||
this.resolvers.$remove(index)
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" :name="formName" :value="JSON.stringify(resolvers)"/>
|
||||
<div v-if="resolvers.length > 0">
|
||||
<div v-for="(resolver, index) in resolvers" class="ui label basic small">
|
||||
<span v-if="resolver.protocol.length > 0">{{resolver.protocol}}</span>{{resolver.host}}<span v-if="resolver.port > 0">:{{resolver.port}}</span>
|
||||
|
||||
<a href="" title="删除" @click.prevent="remove(index)"><i class="icon remove small"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="isAdding" style="margin-top: 1em">
|
||||
<div class="ui fields inline">
|
||||
<div class="ui field">
|
||||
<input type="text" placeholder="x.x.x.x" @keyup.enter="confirm" @keypress.enter.prevent="1" ref="hostRef" v-model="host"/>
|
||||
</div>
|
||||
<div class="ui field">
|
||||
<button class="ui button tiny" type="button" @click.prevent="confirm">确认</button>
|
||||
<a href="" @click.prevent="cancel" title="取消"><i class="icon remove small"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="!isAdding" style="margin-top: 1em">
|
||||
<button class="ui button tiny" type="button" @click.prevent="add">+</button>
|
||||
</div>
|
||||
</div>`
|
||||
})
|
||||
132
EdgeAdmin/web/public/js/components/dns/dns-route-selector.js
Normal file
132
EdgeAdmin/web/public/js/components/dns/dns-route-selector.js
Normal file
@@ -0,0 +1,132 @@
|
||||
Vue.component("dns-route-selector", {
|
||||
props: ["v-all-routes", "v-routes"],
|
||||
data: function () {
|
||||
let routes = this.vRoutes
|
||||
if (routes == null) {
|
||||
routes = []
|
||||
}
|
||||
routes.$sort(function (v1, v2) {
|
||||
if (v1.domainId == v2.domainId) {
|
||||
return v1.code < v2.code
|
||||
}
|
||||
return (v1.domainId < v2.domainId) ? 1 : -1
|
||||
})
|
||||
return {
|
||||
routes: routes,
|
||||
routeCodes: routes.$map(function (k, v) {
|
||||
return v.code + "@" + v.domainId
|
||||
}),
|
||||
isAdding: false,
|
||||
routeCode: "",
|
||||
keyword: "",
|
||||
searchingRoutes: this.vAllRoutes.$copy()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add: function () {
|
||||
this.isAdding = true
|
||||
this.keyword = ""
|
||||
this.routeCode = ""
|
||||
|
||||
let that = this
|
||||
setTimeout(function () {
|
||||
that.$refs.keywordRef.focus()
|
||||
}, 200)
|
||||
},
|
||||
cancel: function () {
|
||||
this.isAdding = false
|
||||
},
|
||||
confirm: function () {
|
||||
if (this.routeCode.length == 0) {
|
||||
return
|
||||
}
|
||||
if (this.routeCodes.$contains(this.routeCode)) {
|
||||
teaweb.warn("已经添加过此线路,不能重复添加")
|
||||
return
|
||||
}
|
||||
let that = this
|
||||
let route = this.vAllRoutes.$find(function (k, v) {
|
||||
return v.code + "@" + v.domainId == that.routeCode
|
||||
})
|
||||
if (route == null) {
|
||||
return
|
||||
}
|
||||
|
||||
this.routeCodes.push(this.routeCode)
|
||||
this.routes.push(route)
|
||||
|
||||
this.routes.$sort(function (v1, v2) {
|
||||
if (v1.domainId == v2.domainId) {
|
||||
return v1.code < v2.code
|
||||
}
|
||||
return (v1.domainId < v2.domainId) ? 1 : -1
|
||||
})
|
||||
|
||||
this.routeCode = ""
|
||||
this.isAdding = false
|
||||
},
|
||||
remove: function (route) {
|
||||
this.routeCodes.$removeValue(route.code + "@" + route.domainId)
|
||||
this.routes.$removeIf(function (k, v) {
|
||||
return v.code + "@" + v.domainId == route.code + "@" + route.domainId
|
||||
})
|
||||
},
|
||||
clearKeyword: function () {
|
||||
this.keyword = ""
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
keyword: function (keyword) {
|
||||
if (keyword.length == 0) {
|
||||
this.searchingRoutes = this.vAllRoutes.$copy()
|
||||
this.routeCode = ""
|
||||
return
|
||||
}
|
||||
this.searchingRoutes = this.vAllRoutes.filter(function (route) {
|
||||
return teaweb.match(route.name, keyword) || teaweb.match(route.code, keyword) || teaweb.match(route.domainName, keyword)
|
||||
})
|
||||
if (this.searchingRoutes.length > 0) {
|
||||
this.routeCode = this.searchingRoutes[0].code + "@" + this.searchingRoutes[0].domainId
|
||||
} else {
|
||||
this.routeCode = ""
|
||||
}
|
||||
}
|
||||
},
|
||||
template: `<div>
|
||||
<input type="hidden" name="dnsRoutesJSON" :value="JSON.stringify(routeCodes)"/>
|
||||
<div v-if="routes.length > 0">
|
||||
<tiny-basic-label v-for="route in routes" :key="route.code + '@' + route.domainId">
|
||||
{{route.name}} <span class="grey small">({{route.domainName}})</span><a href="" @click.prevent="remove(route)"><i class="icon remove"></i></a>
|
||||
</tiny-basic-label>
|
||||
<div class="ui divider"></div>
|
||||
</div>
|
||||
<button type="button" class="ui button small" @click.prevent="add" v-if="!isAdding">+</button>
|
||||
<div v-if="isAdding">
|
||||
<table class="ui table">
|
||||
<tr>
|
||||
<td class="title">所有线路</td>
|
||||
<td>
|
||||
<span v-if="keyword.length > 0 && searchingRoutes.length == 0">没有和关键词“{{keyword}}”匹配的线路</span>
|
||||
<span v-show="keyword.length == 0 || searchingRoutes.length > 0">
|
||||
<select class="ui dropdown" v-model="routeCode">
|
||||
<option value="" v-if="keyword.length == 0">[请选择]</option>
|
||||
<option v-for="route in searchingRoutes" :value="route.code + '@' + route.domainId">{{route.name}}({{route.code}}/{{route.domainName}})</option>
|
||||
</select>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>搜索线路</td>
|
||||
<td>
|
||||
<div class="ui input" :class="{'right labeled':keyword.length > 0}">
|
||||
<input type="text" placeholder="线路名称或代号..." size="10" style="width: 10em" v-model="keyword" ref="keywordRef" @keyup.enter="confirm" @keypress.enter.prevent="1"/>
|
||||
<a class="ui label" v-if="keyword.length > 0" @click.prevent="clearKeyword" href=""><i class="icon remove small blue"></i></a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<button class="ui button tiny" type="button" @click.prevent="confirm">确定</button> <a href="" @click.prevent="cancel()"><i class="icon remove small"></i></a>
|
||||
</div>
|
||||
</div>`
|
||||
})
|
||||
Reference in New Issue
Block a user