fix: select text on focus
This commit is contained in:
parent
32f3aaf38f
commit
8f79427720
@ -1,14 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<FormControl
|
<TextInput
|
||||||
|
ref="inputRef"
|
||||||
:value="displayValue"
|
:value="displayValue"
|
||||||
@focus="isFocused = true"
|
@focus="handleFocus"
|
||||||
@blur="isFocused = false"
|
@blur="isFocused = false"
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { FormControl } from 'frappe-ui'
|
import { TextInput } from 'frappe-ui'
|
||||||
import { ref, computed } from 'vue'
|
import { ref, computed, nextTick } from 'vue'
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
value: {
|
value: {
|
||||||
@ -22,8 +23,19 @@ const props = defineProps({
|
|||||||
})
|
})
|
||||||
|
|
||||||
const isFocused = ref(false)
|
const isFocused = ref(false)
|
||||||
|
const inputRef = ref(null)
|
||||||
|
|
||||||
|
function handleFocus() {
|
||||||
|
isFocused.value = true
|
||||||
|
|
||||||
|
nextTick(() => {
|
||||||
|
if (inputRef.value) {
|
||||||
|
inputRef.value.el?.select()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
const displayValue = computed(() => {
|
const displayValue = computed(() => {
|
||||||
return isFocused.value ? props.value : props.formattedValue
|
return isFocused.value ? props.value : props.formattedValue || props.value
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -206,7 +206,7 @@
|
|||||||
:options="field.options"
|
:options="field.options"
|
||||||
@change="(e) => fieldChange(e.target.value, field, row)"
|
@change="(e) => fieldChange(e.target.value, field, row)"
|
||||||
/>
|
/>
|
||||||
<FormControl
|
<FormattedInput
|
||||||
v-else-if="field.fieldtype === 'Int'"
|
v-else-if="field.fieldtype === 'Int'"
|
||||||
class="[&_input]:text-right"
|
class="[&_input]:text-right"
|
||||||
type="text"
|
type="text"
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user