1
0
mirror of https://gitlab.com/bramw/baserow.git synced 2024-11-25 00:46:46 +00:00
bramw_baserow/web-frontend/modules/database/components/view/grid/fields/GridViewFieldDuration.vue
2024-01-18 12:31:59 +00:00

59 lines
1.6 KiB
Vue

<template>
<div
class="grid-view__cell active"
:class="{
editing: editing,
invalid: editing && !isValid(),
}"
@contextmenu="stopContextIfEditing($event)"
>
<div v-show="!editing" class="grid-field-duration">
{{ formattedValue }}
</div>
<template v-if="editing">
<input
ref="input"
v-model="formattedValue"
type="text"
class="grid-field-duration__input"
:placeholder="field.duration_format"
@keypress="onKeyPress(field, $event)"
@input="onInput(field, $event)"
/>
<div v-show="!isValid()" class="grid-view__cell--error align-right">
{{ getError() }}
</div>
</template>
</div>
</template>
<script>
import gridField from '@baserow/modules/database/mixins/gridField'
import gridFieldInput from '@baserow/modules/database/mixins/gridFieldInput'
import durationField from '@baserow/modules/database/mixins/durationField'
export default {
mixins: [gridField, gridFieldInput, durationField],
methods: {
cancel() {
this.$super(gridFieldInput).cancel()
this.updateFormattedValue(this.field, this.copy)
},
beforeSave(value) {
this.updateFormattedValue(this.field, value)
return this.$super(gridFieldInput).beforeSave(value)
},
afterEdit(event, value) {
if (value !== null) {
this.updateCopy(this.field, value)
this.updateFormattedValue(this.field, this.copy)
}
this.$nextTick(() => {
this.$refs.input.focus()
this.$refs.input.selectionStart = this.$refs.input.selectionEnd = 100000
})
},
},
}
</script>