revert: refs #7404 #7404 VnSelect hover
gitea/salix-front/pipeline/pr-dev This commit looks good
Details
gitea/salix-front/pipeline/pr-dev This commit looks good
Details
This commit is contained in:
parent
68f8037db4
commit
5e75bb29fb
|
@ -71,7 +71,7 @@ defineExpose({ orderBy });
|
|||
]"
|
||||
class="no-box-shadow"
|
||||
:clickable="true"
|
||||
style="min-width: 20px; padding: 0 0.9.em"
|
||||
style="min-width: 40px"
|
||||
>
|
||||
<div
|
||||
class="column flex-center"
|
||||
|
|
|
@ -453,7 +453,7 @@ function handleOnDataSaved(_) {
|
|||
<template #header-cell="{ col }">
|
||||
<QTh v-if="col.visible ?? true">
|
||||
<div
|
||||
class="column self-start ellipsis"
|
||||
class="column self-start q-ml-xs ellipsis"
|
||||
:class="`text-${col?.align ?? 'left'}`"
|
||||
:style="$props.columnSearch ? 'height: 75px' : ''"
|
||||
>
|
||||
|
|
|
@ -104,8 +104,7 @@ const noOneOpt = ref({
|
|||
[optionValue.value]: false,
|
||||
[optionLabel.value]: noOneText,
|
||||
});
|
||||
const getVal = (val) => ($props.useLike ? { like: `%${val}%` } : val);
|
||||
const hover = ref(false);
|
||||
|
||||
const value = computed({
|
||||
get() {
|
||||
return $props.modelValue;
|
||||
|
@ -226,6 +225,8 @@ async function filterHandler(val, update) {
|
|||
function nullishToTrue(value) {
|
||||
return value ?? true;
|
||||
}
|
||||
|
||||
const getVal = (val) => ($props.useLike ? { like: `%${val}%` } : val);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -239,53 +240,58 @@ function nullishToTrue(value) {
|
|||
:fields="fields"
|
||||
:params="params"
|
||||
/>
|
||||
<div @mouseover="hover = true" @mouseleave="hover = false">
|
||||
<QSelect
|
||||
v-model="value"
|
||||
:options="myOptions"
|
||||
:option-label="optionLabel"
|
||||
:option-value="optionValue"
|
||||
v-bind="$attrs"
|
||||
@filter="filterHandler"
|
||||
:emit-value="nullishToTrue($attrs['emit-value'])"
|
||||
:map-options="nullishToTrue($attrs['map-options'])"
|
||||
:use-input="nullishToTrue($attrs['use-input'])"
|
||||
:hide-selected="nullishToTrue($attrs['hide-selected'])"
|
||||
:fill-input="nullishToTrue($attrs['fill-input'])"
|
||||
ref="vnSelectRef"
|
||||
lazy-rules
|
||||
:class="{ required: $attrs.required }"
|
||||
:rules="mixinRules"
|
||||
virtual-scroll-slice-size="options.length"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-if="hover && value && !$attrs.disabled && isClearable" #append>
|
||||
<QIcon
|
||||
v-show="value"
|
||||
name="close"
|
||||
@click.stop="
|
||||
() => {
|
||||
value = null;
|
||||
emit('remove');
|
||||
}
|
||||
"
|
||||
class="cursor-pointer"
|
||||
size="xs"
|
||||
/>
|
||||
</template>
|
||||
<template
|
||||
v-for="(_, slotName) in $slots"
|
||||
#[slotName]="slotData"
|
||||
:key="slotName"
|
||||
>
|
||||
<slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
|
||||
</template>
|
||||
</QSelect>
|
||||
</div>
|
||||
<QSelect
|
||||
v-model="value"
|
||||
:options="myOptions"
|
||||
:option-label="optionLabel"
|
||||
:option-value="optionValue"
|
||||
v-bind="$attrs"
|
||||
@filter="filterHandler"
|
||||
:emit-value="nullishToTrue($attrs['emit-value'])"
|
||||
:map-options="nullishToTrue($attrs['map-options'])"
|
||||
:use-input="nullishToTrue($attrs['use-input'])"
|
||||
:hide-selected="nullishToTrue($attrs['hide-selected'])"
|
||||
:fill-input="nullishToTrue($attrs['fill-input'])"
|
||||
ref="vnSelectRef"
|
||||
lazy-rules
|
||||
:class="{ required: $attrs.required }"
|
||||
:rules="mixinRules"
|
||||
virtual-scroll-slice-size="options.length"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-if="isClearable" #append>
|
||||
<QIcon
|
||||
v-show="value"
|
||||
name="close"
|
||||
@click.stop="
|
||||
() => {
|
||||
value = null;
|
||||
emit('remove');
|
||||
}
|
||||
"
|
||||
class="cursor-pointer"
|
||||
size="xs"
|
||||
/>
|
||||
</template>
|
||||
<template v-for="(_, slotName) in $slots" #[slotName]="slotData" :key="slotName">
|
||||
<slot :name="slotName" v-bind="slotData ?? {}" :key="slotName" />
|
||||
</template>
|
||||
</QSelect>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.q-field--outlined {
|
||||
max-width: 100%;
|
||||
}
|
||||
.q-field__inner {
|
||||
.q-field__control {
|
||||
min-height: auto !important;
|
||||
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
.q-field__native.row {
|
||||
min-height: auto !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -87,7 +87,6 @@ const columns = computed(() => [
|
|||
},
|
||||
},
|
||||
columnClass: 'expand',
|
||||
style: 'min-width: 210px;',
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
|
|
Loading…
Reference in New Issue