MT#61710 change inputs behavior

Bin icon misplaced bug fixed by changing the
css class. This commit also improve input
behaviors. With the Vue 3 migration it seems
that $atts doesn't overwrite binded attributes
anymore, so we had two clear buttons on inputs.
To prevent this the following steps have been
taken:
* custom clear button is switched on only when
  the attribute "value" is used.
* native clear button is switched on in all
  other cases
This should avoid adding regressions.

Change-Id: I39f41ce8d461efc5eff5c7e541d227dbfd6c667d
mr13.2
Hugo Zigha 4 months ago committed by Crescenzo Debora
parent acd0da5bfe
commit b13bf52a45

@ -27,7 +27,7 @@
name="append" name="append"
/> />
<q-btn <q-btn
v-if="$attrs.clearable !== undefined && value !== ''" v-if="$attrs.clearable !== undefined && value !== undefined && value !== ''"
icon="backspace" icon="backspace"
color="white" color="white"
flat flat
@ -55,13 +55,6 @@ export default {
} }
}, },
emits: ['input', 'clear'], emits: ['input', 'clear'],
date () {
return {
}
},
mounted () {
},
methods: { methods: {
clear () { clear () {
this.$emit('input', '') this.$emit('input', '')

@ -6,7 +6,7 @@
class="q-mr-sm" class="q-mr-sm"
data-cy="filter-from" data-cy="filter-from"
dense dense
clearable :clearable="false"
:label="$t('From')" :label="$t('From')"
:disable="loading" :disable="loading"
@input="inputFrom" @input="inputFrom"
@ -15,7 +15,7 @@
:value="value.to" :value="value.to"
data-cy="filter-to" data-cy="filter-to"
dense dense
clearable :clearable="false"
:label="$t('To')" :label="$t('To')"
:disable="loading" :disable="loading"
@input="inputTo" @input="inputTo"

@ -18,7 +18,7 @@
data-cy="csc-call-number-input" data-cy="csc-call-number-input"
:value="callNumberInput" :value="callNumberInput"
:readonly="dialpadOpened" :readonly="dialpadOpened"
clearable :clearable="false"
:disable="!isCallEnabled" :disable="!isCallEnabled"
@keypress.space.prevent @keypress.space.prevent
@keydown.space.prevent @keydown.space.prevent

@ -410,6 +410,6 @@ export default {
</script> </script>
<style> <style>
.no-wrap { .no-wrap {
flex-wrap: wrap; flex-wrap: nowrap;
} }
</style> </style>

Loading…
Cancel
Save