Commit 85cb34eb authored by gj4210's avatar gj4210 👁
Browse files

FIX: WPA Key now in CopyField

didn't show in Firefox + shadow refactoring
parent 81b3e5d3
Pipeline #106646 passed with stages
in 7 minutes and 29 seconds
<template>
<div class="copy-field">
<b-input-group class="shadow">
<b-form-textarea v-if="multiline" rows="10" :id="'text-input' + id" ref="textInput" v-model="text"
readonly :class="`border-${variant} text-${variant} invisible-scrollbar`"/>
<b-form-input v-else :id="'text-input' + id" ref="textInput" v-model="text" readonly/>
<b-tooltip :target="'text-input' + id" :show.sync="text_copied" :disabled="!text_copied" placement="bottom"
:variant="variant" :class="`border-${variant} text-${variant}`">
Kopiert.
</b-tooltip>
<b-input-group-append>
<b-button :variant="variant" @click="copyText">
<font-awesome-icon :icon="['fas', 'copy']"/>
</b-button>
</b-input-group-append>
</b-input-group>
</div>
<b-input-group class="copy-field">
<b-form-textarea v-if="multiline" rows="10" :id="'text-input' + id" ref="textInput" v-model="text"
readonly :class="`border-${variant} text-${variant} invisible-scrollbar`"/>
<b-form-input v-else :id="'text-input' + id" ref="textInput" v-model="text" readonly/>
<b-tooltip :target="'text-input' + id" :show.sync="text_copied" :disabled="!text_copied" placement="bottom"
:variant="variant" :class="`border-${variant} text-${variant}`">
Kopiert.
</b-tooltip>
<b-input-group-append>
<b-button :variant="variant" @click="copyText">
<font-awesome-icon :icon="['fas', 'copy']"/>
</b-button>
</b-input-group-append>
</b-input-group>
</template>
<script>
export default {
name: "CopyField",
props: {
'text': String,
'variant': {
'type': String,
'default': 'primary'
},
'multiline': {
'type': Boolean,
'default': false
}
},
data() {
return {
id: null,
text_copied: false
}
},
methods: {
copyText() {
// https://www.w3schools.com/howto/howto_js_copy_clipboard.asp
let text_input = this.$refs.textInput
text_input.select()
text_input.setSelectionRange(0, 99999) // For mobile devices
document.execCommand("copy")
this.text_copied = true
},
},
mounted() {
this.id = this._uid
}
export default {
name: "CopyField",
props: {
'text': String,
'variant': {
'type': String,
'default': 'primary'
},
'multiline': {
'type': Boolean,
'default': false
}
</script>
\ No newline at end of file
},
data() {
return {
id: null,
text_copied: false
}
},
methods: {
copyText() {
// https://www.w3schools.com/howto/howto_js_copy_clipboard.asp
let text_input = this.$refs.textInput
text_input.select()
text_input.setSelectionRange(0, 99999) // For mobile devices
document.execCommand("copy")
this.text_copied = true
},
},
mounted() {
this.id = this._uid
}
}
</script>
......@@ -110,7 +110,7 @@
<font-awesome-icon :icon="['fas','exclamation-triangle']"/>
Weitere Fehlerinformationen:
</p>
<CopyField variant="danger" :text="JSON.stringify($store.state.transaction_result.error, null, 1)"
<CopyField class="shadow" variant="danger" :text="JSON.stringify($store.state.transaction_result.error, null, 1)"
multiline/>
</template>
<template v-if="$store.state.transaction_result.type === 'success'">
......
......@@ -60,11 +60,12 @@
</b-tooltip>
</template>
<template v-slot:cell(wpa_key)="data">
<font-awesome-icon class="text-secondary" :icon="['fas','eye']"
:id="'show-wpa-key-' + bcd.name + '-' + data.index"/>
<b-button :id="'show-wpa-key-' + bcd.name + '-' + data.index" variant="primary">
<font-awesome-icon :icon="['fas','eye']"/>
</b-button>
<b-popover :target="'show-wpa-key-' + bcd.name + '-' + data.index"
triggers="focus" custom-class="popover-wide">
{{ data.item.wpa_key }}
<CopyField :text="data.item.wpa_key"/>
</b-popover>
</template>
<template v-slot:cell(last_login_date)="data">
......@@ -112,10 +113,11 @@ import ApiUtil from '@/util/apiutil'
import DBEditor from "@/components/DBEditor";
import transactionutil from "@/util/transactionutil";
import MACAuthService from "@/api-services.gen/macauth.client";
import CopyField from "@/components/CopyField";
export default {
name: 'macauth',
components: {DBEditor, Loading},
components: {CopyField, DBEditor, Loading},
data() {
return {
db_editor_object_function: 'create',
......
......@@ -174,7 +174,7 @@
</template>
</b-modal>
<b-modal id="modal-token" size=lg title="Token erstellt">
<CopyField :text="token"/>
<CopyField class="shadow" :text="token"/>
<b-alert show variant="warning" class="mb-0 mt-3">Bewahren Sie das Token gut auf. Hier werden Sie es nicht
mehr einsehen können!
</b-alert>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment