mirror of
https://github.com/TeaOSLab/EdgeAdmin.git
synced 2025-11-11 01:50:27 +08:00
优化交互
This commit is contained in:
@@ -110,6 +110,29 @@ Vue.component("combo-box", {
|
||||
},
|
||||
change: function () {
|
||||
this.$emit("change", this.selectedItem)
|
||||
|
||||
let that = this
|
||||
setTimeout(function () {
|
||||
if (that.$refs.selectedLabel != null) {
|
||||
that.$refs.selectedLabel.focus()
|
||||
}
|
||||
})
|
||||
},
|
||||
submitForm: function (event) {
|
||||
if (event.target.tagName != "A") {
|
||||
return
|
||||
}
|
||||
let parentBox = this.$refs.selectedLabel.parentNode
|
||||
while (true) {
|
||||
parentBox = parentBox.parentNode
|
||||
if (parentBox == null || parentBox.tagName == "BODY") {
|
||||
return
|
||||
}
|
||||
if (parentBox.tagName == "FORM") {
|
||||
parentBox.submit()
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
template: `<div style="display: inline; z-index: 10; background: white">
|
||||
@@ -121,9 +144,9 @@ Vue.component("combo-box", {
|
||||
<!-- 当前选中 -->
|
||||
<div v-if="selectedItem != null">
|
||||
<input type="hidden" :name="name" :value="selectedItem.value"/>
|
||||
<span class="ui label basic">{{title}}:{{selectedItem.name}}
|
||||
<a href="" title="清除" @click.prevent="reset"><i class="icon remove small"></i></a>
|
||||
</span>
|
||||
<a href="" class="ui label basic" ref="selectedLabel" @click.prevent="submitForm"><span>{{title}}:{{selectedItem.name}}</span>
|
||||
<span title="清除" @click.prevent="reset"><i class="icon remove small"></i></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- 菜单 -->
|
||||
|
||||
@@ -6,10 +6,7 @@
|
||||
<form class="ui form" method="get" action="/clusters/ip-addrs">
|
||||
<div class="ui fields inline">
|
||||
<div class="ui field">
|
||||
集群:
|
||||
</div>
|
||||
<div class="ui field">
|
||||
<cluster-selector :v-cluster-id="clusterId"></cluster-selector>
|
||||
<node-cluster-combo-box :v-cluster-id="clusterId"></node-cluster-combo-box>
|
||||
</div>
|
||||
<div class="ui field">
|
||||
状态:
|
||||
|
||||
@@ -27,14 +27,9 @@
|
||||
<form method="get" class="ui form" action="/servers">
|
||||
<input type="hidden" name="auditingFlag" :value="auditingFlag"/>
|
||||
<div class="ui margin"></div>
|
||||
<div class="ui menu basic text">
|
||||
<div class="item">
|
||||
<div class="ui fields inline">
|
||||
<div class="ui field" v-if="clusters.length > 0">
|
||||
<select class="ui dropdown auto-width" name="clusterId" v-model="clusterId">
|
||||
<option value="0">[选择集群]</option>
|
||||
<option v-for="cluster in clusters" :value="cluster.id">{{cluster.name}}</option>
|
||||
</select>
|
||||
<node-cluster-combo-box :v-cluster-id="clusterId"></node-cluster-combo-box>
|
||||
</div>
|
||||
<div class="ui field" v-if="groups.length > 0">
|
||||
<select class="ui dropdown auto-width" name="groupId" v-model="groupId">
|
||||
@@ -53,9 +48,7 @@
|
||||
<div class="ui field" v-if="clusterId == 0 && groupId == 0 && keyword.length == 0 && latestServers.length > 0">
|
||||
<a href="" @click.prevent="showLatest()">常用<i class="icon angle" :class="{down: !latestVisible, up: latestVisible}"></i> </a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item right">
|
||||
<div class="ui field">
|
||||
<checkbox name="checkDNS" :v-value="1" v-model="checkDNS">检查域名解析</checkbox>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user