diff --git a/src/components/base/BaseCategorySelection.vue b/src/components/base/BaseCategorySelection.vue index 55fb5b8..0b78313 100644 --- a/src/components/base/BaseCategorySelection.vue +++ b/src/components/base/BaseCategorySelection.vue @@ -2,13 +2,19 @@ .selection-wrapper.flex .left-side.flex.flex-col.gap-y-4 .flex.font-bold.text-xl Категории - base-input(placeholder="Поиск", outlined, :width="300") - .flex.items-center.cursor-pointer - q-icon( - name="app:icon-search", - size="18px", - style="color: var(--font-dark-blue-color)" - ) + base-input( + placeholder="Поиск", + @keyup.enter="searchCategory", + v-model="searchBenefit", + outlined, + :width="300", + iconLeft + ) + q-icon( + name="app:icon-search", + size="20px", + style="color: var(--font-grey-color)" + ) .field.flex.flex-col.overflow-y-scroll .flex.items-center( v-for="benefit in benefitData", @@ -24,7 +30,11 @@ .name.flex.items-center.font-medium.text-xm {{benefit.name}} .buttons-group.flex.py-4.px-8.justify-center base-button.text-base.font-semibold(outlined, :size="40", @click="closeModalCategories") Отменить - base-button.text-base.font-semibold(:size="40", @click="saveCategories(selected[0])") Сохранить + base-button.text-base.font-semibold( + v-if="selected.length > 0", + :size="40", + @click="saveCategories(selected[0])" + ) Сохранить .right-side.flex.px-14.font-bold.relative q-icon(name="app:icon-cancel").text-sm.absolute.top-4.right-4.cursor-pointer(@click="closeModalCategories") .flex.py-10.gap-y-6.flex-col(v-if="selected.length > 0 && selected[0]?.name !== 'Без льготы'") @@ -58,10 +68,12 @@ export default { shiftSelected: Function, closeModalCategories: Function, saveCategories: Function, + showModal: Boolean, }, data() { return { selected: [], + searchBenefit: "", }; }, computed: { @@ -75,6 +87,11 @@ export default { return this.selected[0]?.privileges.split(","); }, }, + methods: { + searchCategory() { + this.$emit("search", this.searchBenefit); + }, + }, watch: { selected: { immediate: true, @@ -83,6 +100,12 @@ export default { if (this.selected.length >= 2) this.selected.shift(); }, }, + showModal: { + immediate: true, + handler(newVal) { + if (!newVal) this.searchBenefit = ""; + }, + }, }, }; @@ -91,6 +114,7 @@ export default { .selection-wrapper width: 895px height: 660px + font-feature-settings: 'pnum' on, 'lnum' on .left-side width: 364px diff --git a/src/components/base/BaseInput.vue b/src/components/base/BaseInput.vue index b34dc06..70b157b 100644 --- a/src/components/base/BaseInput.vue +++ b/src/components/base/BaseInput.vue @@ -22,10 +22,12 @@ :autogrow="autogrow", :square="square", :standout="standout" - :accept="accept" + :accept="accept", hide-bottom-space ) - slot.cursor-pointer + template(v-slot:prepend, v-if="iconLeft") + slot + slot.cursor-pointer(v-if="!iconLeft")