Skip to content
This repository was archived by the owner on Feb 18, 2024. It is now read-only.

Commit e3e5596

Browse files
committed
Improve some ui logic
1 parent 67e147e commit e3e5596

File tree

6 files changed

+65
-54
lines changed

6 files changed

+65
-54
lines changed

dist/laravel-ui.min.js

Lines changed: 21 additions & 17 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/laravel-ui.min.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/index.html

Lines changed: 22 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -10851,9 +10851,7 @@
1085110851
}
1085210852
}),
1085310853
data: function data() {
10854-
return {
10855-
visible: true
10856-
};
10854+
return { visible: true };
1085710855
},
1085810856

1085910857
mounted: function mounted() {
@@ -10862,6 +10860,10 @@
1086210860
if (this.default) {
1086310861
this.$nextTick(function () {
1086410862
_this.select();
10863+
10864+
_this.$on('-toggle-visibility', function (state) {
10865+
return console.log(state);
10866+
});
1086510867
});
1086610868
}
1086710869
},
@@ -12427,7 +12429,11 @@
1242712429
});
1242812430
},
1242912431
methods: {
12430-
toggle: function toggle() {
12432+
toggle: function toggle(event) {
12433+
if (event && event.target && event.target.tagName.toString().toLowerCase() === 'input') {
12434+
return;
12435+
}
12436+
1243112437
if (!this.disabled && !this.loading) {
1243212438
this.isActive = !this.isActive;
1243312439
}
@@ -12485,25 +12491,25 @@
1248512491
doSearch: function doSearch(needles) {
1248612492
var caseSensitive = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
1248712493

12488-
var found = 0;
12494+
this.searchFoundItems = 0;
1248912495

1249012496
if (!caseSensitive) {
1249112497
needles = needles.map(function (string) {
1249212498
return string.toString().toLowerCase();
1249312499
});
1249412500
}
1249512501

12496-
/** @param {VNode} node */
1249712502
var _iteratorNormalCompletion2 = true;
1249812503
var _didIteratorError2 = false;
1249912504
var _iteratorError2 = undefined;
1250012505

1250112506
try {
12502-
for (var _iterator2 = (0, _getIterator3.default)(this.$slots.default || []), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
12503-
var node = _step2.value;
12507+
for (var _iterator2 = (0, _getIterator3.default)(this.$slots.default), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
12508+
var slot = _step2.value;
1250412509

12505-
var contains = false;
12506-
var haystack = node.componentInstance.getText().toString();
12510+
console.log(slot);
12511+
var visible = false;
12512+
var haystack = slot.componentInstance.getText();
1250712513

1250812514
if (!caseSensitive) {
1250912515
haystack = haystack.toLowerCase();
@@ -12518,8 +12524,8 @@
1251812524
var needle = _step3.value;
1251912525

1252012526
if (haystack.includes(needle)) {
12521-
found++;
12522-
contains = true;
12527+
visible = true;
12528+
this.searchFoundItems++;
1252312529
break;
1252412530
}
1252512531
}
@@ -12538,7 +12544,7 @@
1253812544
}
1253912545
}
1254012546

12541-
node.componentInstance.visible = contains;
12547+
slot.componentInstance.$emit('-toggle-visibility', visible);
1254212548
}
1254312549
} catch (err) {
1254412550
_didIteratorError2 = true;
@@ -12554,11 +12560,10 @@
1255412560
}
1255512561
}
1255612562
}
12557-
12558-
return found;
1255912563
},
1256012564
search: function search(text) {
12561-
this.searchFoundItems = this.doSearch(this.searchFuzzy ? text.split(/\W+/) : [text], this.searchCaseSensitive);
12565+
this.doSearch(this.searchFuzzy ? text.trim().split(/\W+/) : [text], this.searchCaseSensitive);
12566+
1256212567
this.searchAllItems = this.$slots.default.length;
1256312568

1256412569
this.searchValue = text;
@@ -12652,7 +12657,7 @@
1265212657
style: ({
1265312658
'max-height': _vm.sizeToHeight + 'px'
1265412659
})
12655-
}, [_vm._t("default")], 2), (_vm.searchEnabled) ? [_c('ui-button', {
12660+
}, [_vm._t("default")], 2), (_vm.searchEnabled && _vm.searchHiddenItems > 0) ? [_c('ui-button', {
1265612661
staticClass: "search-results",
1265712662
attrs: {
1265812663
"view": "flat"

docs/laravel-ui.min.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/components/Option.vue

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -71,17 +71,17 @@
7171
text: {
7272
type: String,
7373
default: ''
74-
},
74+
}
7575
},
7676
data() {
77-
return {
78-
visible: true
79-
};
77+
return { visible: true };
8078
},
8179
mounted: function () {
8280
if (this.default) {
8381
this.$nextTick(() => {
8482
this.select();
83+
84+
this.$on('-toggle-visibility', state => console.log(state));
8585
});
8686
}
8787
},

src/components/Select.vue

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -255,7 +255,7 @@
255255
<div class="options" :style="{'max-height': sizeToHeight + 'px'}">
256256
<slot></slot>
257257
</div>
258-
<template v-if="searchEnabled">
258+
<template v-if="searchEnabled && searchHiddenItems > 0">
259259
<ui-button view="flat" @click="resetSearch" class="search-results">
260260
{{ searchFormattedDescriptionReset }}
261261
</ui-button>
@@ -391,7 +391,11 @@
391391
})
392392
},
393393
methods: {
394-
toggle() {
394+
toggle(event) {
395+
if (event && event.target && event.target.tagName.toString().toLowerCase() === 'input') {
396+
return;
397+
}
398+
395399
if (!this.disabled && !this.loading) {
396400
this.isActive = !this.isActive;
397401
}
@@ -426,39 +430,37 @@
426430
}
427431
},
428432
doSearch(needles, caseSensitive = false) {
429-
let found = 0;
433+
this.searchFoundItems = 0;
430434
431435
if (!caseSensitive) {
432436
needles = needles.map(string => string.toString().toLowerCase());
433437
}
434438
435-
/** @param {VNode} node */
436-
for (let node of (this.$slots.default || [])) {
437-
let contains = false;
438-
let haystack = node.componentInstance.getText().toString();
439+
for (let slot of this.$slots.default) {
440+
let visible = false;
441+
let haystack = slot.componentInstance.getText();
439442
440443
if (!caseSensitive) {
441444
haystack = haystack.toLowerCase();
442445
}
443446
444447
for (let needle of needles) {
445448
if (haystack.includes(needle)) {
446-
found++;
447-
contains = true;
449+
visible = true;
450+
this.searchFoundItems++;
448451
break;
449452
}
450453
}
451454
452-
node.componentInstance.visible = contains;
455+
slot.componentInstance.visible = visible;
453456
}
454-
455-
return found;
456457
},
457458
search(text) {
458-
this.searchFoundItems = this.doSearch(
459-
this.searchFuzzy ? text.split(/\W+/) : [text],
459+
this.doSearch(
460+
this.searchFuzzy ? text.trim().split(/\W+/) : [text],
460461
this.searchCaseSensitive
461462
);
463+
462464
this.searchAllItems = this.$slots.default.length;
463465
464466
this.searchValue = text;

0 commit comments

Comments
 (0)