网站服务中域名多于1项时可以搜索

This commit is contained in:
GoEdgeLab
2021-01-11 21:13:36 +08:00
parent a1f610ea86
commit 32cac3b71b
2 changed files with 86 additions and 40 deletions

View File

@@ -6,7 +6,9 @@ Vue.component("server-name-box", {
serverNames = [] serverNames = []
} }
return { return {
serverNames: serverNames serverNames: serverNames,
isSearching: false,
keyword: ""
} }
}, },
methods: { methods: {
@@ -34,6 +36,40 @@ Vue.component("server-name-box", {
Vue.set(that.serverNames, index, serverName) Vue.set(that.serverNames, index, serverName)
} }
}); });
},
showSearchBox: function () {
this.isSearching = !this.isSearching
if (this.isSearching) {
let that = this
setTimeout(function () {
that.$refs.keywordRef.focus()
}, 200)
} else {
this.keyword = ""
}
},
},
watch: {
keyword: function (v) {
this.serverNames.forEach(function (serverName) {
if (v.length == 0) {
serverName.isShowing = true
return
}
if (serverName.subNames == null || serverName.subNames.length == 0) {
if (!teaweb.match(serverName.name, v)) {
serverName.isShowing = false
}
} else {
let found = false
serverName.subNames.forEach(function (subName) {
if (teaweb.match(subName, v)) {
found = true
}
})
serverName.isShowing = found
}
})
} }
}, },
template: `<div> template: `<div>
@@ -41,12 +77,22 @@ Vue.component("server-name-box", {
<div v-if="serverNames.length > 0"> <div v-if="serverNames.length > 0">
<div v-for="(serverName, index) in serverNames" class="ui label small basic"> <div v-for="(serverName, index) in serverNames" class="ui label small basic">
<em v-if="serverName.type != 'full'">{{serverName.type}}</em> <em v-if="serverName.type != 'full'">{{serverName.type}}</em>
<span v-if="serverName.subNames == null || serverName.subNames.length == 0">{{serverName.name}}</span> <span v-if="serverName.subNames == null || serverName.subNames.length == 0" :class="{disabled: serverName.isShowing === false}">{{serverName.name}}</span>
<span v-else>{{serverName.subNames[0]}}等{{serverName.subNames.length}}个域名</span> <span v-else :class="{disabled: serverName.isShowing === false}">{{serverName.subNames[0]}}等{{serverName.subNames.length}}个域名</span>
<a href="" title="修改" @click.prevent="updateServerName(index, serverName)"><i class="icon pencil small"></i></a> <a href="" title="删除" @click.prevent="removeServerName(index)"><i class="icon remove"></i></a> <a href="" title="修改" @click.prevent="updateServerName(index, serverName)"><i class="icon pencil small"></i></a> <a href="" title="删除" @click.prevent="removeServerName(index)"><i class="icon remove"></i></a>
</div> </div>
<div class="ui divider"></div> <div class="ui divider"></div>
</div> </div>
<a href="" @click.prevent="addServerName()">[添加域名绑定]</a> <div class="ui fields inline">
<div class="ui field"><a href="" @click.prevent="addServerName()">[添加域名绑定]</a></div>
<div class="ui field"><span class="grey">|</span> </div>
<div class="ui field">
<a href="" @click.prevent="showSearchBox()" v-if="!isSearching"><i class="icon search small"></i></a>
<a href="" @click.prevent="showSearchBox()" v-if="isSearching"><i class="icon close small"></i></a>
</div>
<div class="ui field" v-if="isSearching">
<input type="text" placeholder="搜索域名" ref="keywordRef" class="ui input tiny" v-model="keyword"/>
</div>
</div>
</div>` </div>`
}) })

View File

@@ -4,7 +4,7 @@
<div class="right-box"> <div class="right-box">
{$template "menu"} {$template "menu"}
<div v-if="isRequesting" class="ui message">正在节点服务检测中,请稍候...</div> <div v-if="isRequesting" class="ui message">正在节点服务状态检测中,请稍候...</div>
<div v-if="!isRequesting"> <div v-if="!isRequesting">
<div v-if="results.length == 0">暂时还没有节点。</div> <div v-if="results.length == 0">暂时还没有节点。</div>
<div v-else> <div v-else>