Bug 37762: VueJS framework: Allow styling v-select dropdown

Signed-off-by: Jason Robb <jrobb@sekls.org>
Signed-off-by: Lisette Scheer <lisette@bywatersolutions.com>
Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
This commit is contained in:
Pedro Amorim 2025-10-01 08:40:34 +00:00 committed by Lucas Gass
parent 3e756390cb
commit bd9dc920de
No known key found for this signature in database
GPG Key ID: 60B447398B0D36CA
1 changed files with 14 additions and 0 deletions

View File

@ -276,6 +276,15 @@ export default {
return disabledAttr || false;
}
});
const getVselectStyle = computed(() => {
if (props.attr.vselectStyle) {
return props.attr.vselectStyle;
} else if (props.vselectStyle) {
return props.vselectStyle;
}
return { dropdownMaxHeight: "350px", dropdownMinWidth: "160px" }; //v-select defaults
});
const fieldInputError = ref(false);
const checkForInputError = () => {
if (props.attr.formErrorHandler) {
@ -293,6 +302,7 @@ export default {
getElementId,
requiredComponent,
selectOptions,
getVselectStyle,
disabled,
fieldInputError,
checkForInputError,
@ -328,4 +338,8 @@ input[type="number"] {
.filters > input[type="radio"] {
min-width: 0 !important;
}
:deep() {
--vs-dropdown-max-height: v-bind(getVselectStyle.dropdownMaxHeight);
--vs-dropdown-min-width: v-bind(getVselectStyle.dropdownMinWidth);
}
</style>