migrate according to the solution
This commit is contained in:
parent
ce49f91d65
commit
3f0ae4d413
|
@ -34,10 +34,10 @@ export default {
|
||||||
UserItem
|
UserItem
|
||||||
},
|
},
|
||||||
props: ['users'],
|
props: ['users'],
|
||||||
|
emits: ['list-projects'],
|
||||||
setup(props) {
|
setup(props) {
|
||||||
const enteredSearchTerm = ref('');
|
const enteredSearchTerm = ref('');
|
||||||
const activeSearchTerm = ref('');
|
const activeSearchTerm = ref('');
|
||||||
const sorting = ref(null);
|
|
||||||
|
|
||||||
const availableUsers = computed(function() {
|
const availableUsers = computed(function() {
|
||||||
let users = [];
|
let users = [];
|
||||||
|
@ -50,9 +50,23 @@ export default {
|
||||||
}
|
}
|
||||||
return users;
|
return users;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function updateSearch(val) {
|
||||||
|
enteredSearchTerm.value = val;
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(enteredSearchTerm, function(newValue) {
|
||||||
|
setTimeout(() => {
|
||||||
|
if (newValue === enteredSearchTerm.value) {
|
||||||
|
activeSearchTerm.value = newValue;
|
||||||
|
}
|
||||||
|
}, 300);
|
||||||
|
});
|
||||||
|
|
||||||
|
const sorting = ref(null);
|
||||||
const displayedUsers = computed(function() {
|
const displayedUsers = computed(function() {
|
||||||
if (!sorting.value) {
|
if (!sorting.value) {
|
||||||
return availableUsers;
|
return availableUsers.value;
|
||||||
}
|
}
|
||||||
return availableUsers.value.slice().sort((u1, u2) => {
|
return availableUsers.value.slice().sort((u1, u2) => {
|
||||||
if (sorting.value === 'asc' && u1.fullName > u2.fullName) {
|
if (sorting.value === 'asc' && u1.fullName > u2.fullName) {
|
||||||
|
@ -67,29 +81,16 @@ export default {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(enteredSearchTerm, function(val) {
|
|
||||||
setTimeout(() => {
|
|
||||||
if (val === enteredSearchTerm.value) {
|
|
||||||
activeSearchTerm.value = val;
|
|
||||||
}
|
|
||||||
}, 300);
|
|
||||||
});
|
|
||||||
|
|
||||||
function updateSearch(val) {
|
|
||||||
enteredSearchTerm.value = val;
|
|
||||||
}
|
|
||||||
function sort(mode) {
|
function sort(mode) {
|
||||||
sorting.value = mode;
|
sorting.value = mode;
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
enteredSearchTerm,
|
enteredSearchTerm,
|
||||||
activeSearchTerm,
|
|
||||||
sorting,
|
|
||||||
availableUsers,
|
|
||||||
displayedUsers,
|
|
||||||
updateSearch,
|
updateSearch,
|
||||||
sort
|
displayedUsers,
|
||||||
|
sort,
|
||||||
|
sorting
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Reference in New Issue