diff --git a/src/components/base/BaseCustomSelect.vue b/src/components/base/BaseCustomSelect.vue index a517071..8c852a6 100644 --- a/src/components/base/BaseCustomSelect.vue +++ b/src/components/base/BaseCustomSelect.vue @@ -2,6 +2,7 @@ .flex.flex-col.gap-y-2 .label.font-semibold.text-xxs.opacity-40(v-if="label") {{ label }} .base-select.flex.justify-between.items-center.py-9px.px-4.gap-4.cursor-pointer.relative( + ref="select", @click="open = !open", :class="{'open': open, 'border-none': borderNone}", ) @@ -16,7 +17,8 @@ ) .items-container.mt-1( @click="closeOptions", - v-click-outside="leaveSelect" + v-click-outside="leaveSelect", + :class="textClass" ) .item.py-2.px-4.cursor-pointer( v-for="item in items", @@ -43,6 +45,7 @@ export default { placeholderOpacity: Boolean, center: Boolean, label: String, + textStyle: String, }, emits: ["update:modelValue"], data() { @@ -59,6 +62,15 @@ export default { this.$emit("update:modelValue", value); }, }, + textClass() { + return this.textStyle + ? { + [this.textStyle]: true, + } + : { + "text-base": true, + }; + }, }, methods: { clickItem(id, label) { diff --git a/src/components/base/BaseOptions.vue b/src/components/base/BaseOptions.vue index 0d4787b..0d0d0d8 100644 --- a/src/components/base/BaseOptions.vue +++ b/src/components/base/BaseOptions.vue @@ -8,7 +8,7 @@ export default { name: "BaseOptions", computed: { parent() { - return this.$parent.$el; + return this.$parent.$refs.select; }, parentSize() { return this.parent?.getBoundingClientRect(); diff --git a/src/components/base/BaseSelect.vue b/src/components/base/BaseSelect.vue index 1ce144d..98d7c67 100644 --- a/src/components/base/BaseSelect.vue +++ b/src/components/base/BaseSelect.vue @@ -1,5 +1,9 @@