Convert footer editing to EditableField
This commit is contained in:
@@ -5,9 +5,11 @@ import { Button, FormGroup, TextInput } from '@cloudron/pankow';
|
||||
|
||||
const props = defineProps({
|
||||
label: { type: String, required: true },
|
||||
helpUrl: { type: String, required: false },
|
||||
value: { type: String, required: true },
|
||||
disabled: { type: Boolean, default: false },
|
||||
saving: { type: Boolean, default: false }
|
||||
saving: { type: Boolean, default: false },
|
||||
multiline: { type: Boolean, default: false },
|
||||
});
|
||||
|
||||
const emit = defineEmits(['save']);
|
||||
@@ -47,9 +49,10 @@ function cancel() {
|
||||
|
||||
<template>
|
||||
<FormGroup>
|
||||
<label>{{ label }}</label>
|
||||
<div v-if="editing" style="display: flex; gap: 6px">
|
||||
<TextInput ref="textInput" v-model="draftValue" @keydown.enter="save()" :disabled="saving"/>
|
||||
<label>{{ label }} <sup v-if="helpUrl"><a :href="helpUrl" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
|
||||
<div v-if="editing" style="display: flex; align-items: center; gap: 6px">
|
||||
<TextInput v-if="!multiline" ref="textInput" v-model="draftValue" @keydown.enter="save()" :disabled="saving"/>
|
||||
<textarea v-else ref="textInput" rows="2" cols="80" v-model="draftValue" @keydown.enter="save()" :disabled="saving"></textarea>
|
||||
<Button tool @click="save" :disabled="saving">{{ $t('main.dialog.save') }}</Button>
|
||||
<Button tool plain secondary @click="cancel" :disabled="saving">{{ $t('main.dialog.cancel') }}</Button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user