fix router link disabling

This commit is contained in:
Samuel Lorch 2023-04-02 16:58:40 +02:00
parent 0fdd9ddf60
commit f0edca127f
7 changed files with 8 additions and 7 deletions

View file

@ -71,8 +71,9 @@ button, .button {
background-color: var(--cl-bg-hl);
}
.button:disabled, button:disabled {
.button:disabled, button:disabled, .disabled {
background-color: var(--cl-bg-hl);
pointer-events: none;
}
input, textarea {

View file

@ -56,7 +56,7 @@ onMounted(async() => {
<TableView title="DNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
<button @click="load">Refresh</button>
<router-link class="button" to="/edit/firewall/destinationnatrules">Create</router-link>
<router-link class="button" :disabled="selection.length != 1" :to="'/edit/firewall/destinationnatrules/' + selection[0]">Edit</router-link>
<router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/firewall/destinationnatrules/' + selection[0]">Edit</router-link>
<button @click="deleteRule" :disabled="selection.length != 1">Delete</button>
</TableView>
</div>

View file

@ -57,7 +57,7 @@ onMounted(async() => {
<TableView title="Forward Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
<button @click="load">Refresh</button>
<router-link class="button" to="/edit/firewall/forwardrules">Create</router-link>
<router-link class="button" :disabled="selection.length != 1" :to="'/edit/firewall/forwardrules/' + selection[0]">Edit</router-link>
<router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/firewall/forwardrules/' + selection[0]">Edit</router-link>
<button @click="deleteRule" :disabled="selection.length != 1">Delete</button>
</TableView>
</div>

View file

@ -56,7 +56,7 @@ onMounted(async() => {
<TableView title="SNAT Rules" :columns="columns" :loading="loading" @draggedRow="draggedRow" v-model:selection="selection" v-model:data="rules" :table-props="{sort:true, sortSelf: true, draggable: true}">
<button @click="load">Refresh</button>
<router-link class="button" to="/edit/firewall/sourcenatrules">Create</router-link>
<router-link class="button" :disabled="selection.length != 1" :to="'/edit/firewall/sourcenatrules/' + selection[0]">Edit</router-link>
<router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/firewall/sourcenatrules/' + selection[0]">Edit</router-link>
<button @click="deleteRule" :disabled="selection.length != 1">Delete</button>
</TableView>
</div>

View file

@ -60,7 +60,7 @@ onMounted(async() => {
<TableView title="Interfaces" :columns="columns" :loading="loading" v-model:selection="selection" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}">
<button @click="load">Refresh</button>
<router-link class="button" to="/edit/network/interfaces">Create</router-link>
<router-link class="button" :disabled="selection.length != 1" :to="'/edit/network/interfaces/' + selection[0]">Edit</router-link>
<router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/network/interfaces/' + selection[0]">Edit</router-link>
<button @click="deleteInterface" :disabled="selection.length != 1">Delete</button>
</TableView>
</template>

View file

@ -79,7 +79,7 @@ onMounted(async() => {
<TableView title="Addresses" :columns="columns" :loading="loading" v-model:selection="selection" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}">
<button @click="load">Refresh</button>
<router-link class="button" to="/edit/object/addresses">Create</router-link>
<router-link class="button" :disabled="selection.length != 1" :to="'/edit/object/addresses/' + selection[0]">Edit</router-link>
<router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/object/addresses/' + selection[0]">Edit</router-link>
<button @click="deleteAddress" :disabled="selection.length != 1">Delete</button>
</TableView>
</template>

View file

@ -84,7 +84,7 @@ onMounted(async() => {
<TableView title="Services" :columns="columns" :loading="loading" v-model:selection="selection" v-model:data="displayData" :table-props="{sort:true, sortSelf: true}">
<button @click="load">Refresh</button>
<router-link class="button" to="/edit/object/services">Create</router-link>
<router-link class="button" :disabled="selection.length != 1" :to="'/edit/object/services/' + selection[0]">Edit</router-link>
<router-link class="button" :class="{ disabled: selection.length != 1 }" :to="'/edit/object/services/' + selection[0]">Edit</router-link>
<button @click="deleteService" :disabled="selection.length != 1">Delete</button>
</TableView>
</template>