WIP insurance search page.
This commit is contained in:
parent
2912407afd
commit
3e3e2d89db
1 changed files with 19 additions and 19 deletions
|
|
@ -78,7 +78,7 @@ export default {
|
||||||
},
|
},
|
||||||
forwardButtonAction() {
|
forwardButtonAction() {
|
||||||
// Still needs wired up when insurance-details page is created
|
// Still needs wired up when insurance-details page is created
|
||||||
alert("Needs wired up!")
|
alert("Needs wired up!");
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
@ -91,15 +91,17 @@ export default {
|
||||||
"Liberty Mutual Insurance",
|
"Liberty Mutual Insurance",
|
||||||
"State Auto Insurance",
|
"State Auto Insurance",
|
||||||
"State Farm Insurance",
|
"State Farm Insurance",
|
||||||
"Travelers Insurance"
|
"Travelers Insurance",
|
||||||
];
|
];
|
||||||
|
|
||||||
$("#autocomplete").autocomplete({
|
$("#autocomplete").autocomplete({
|
||||||
source: function( request, response ) {
|
source: function (request, response) {
|
||||||
var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
|
var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(request.term), "i");
|
||||||
response( $.grep( tags, function( item ){
|
response(
|
||||||
return matcher.test( item );
|
$.grep(tags, function (item) {
|
||||||
}) );
|
return matcher.test(item);
|
||||||
|
})
|
||||||
|
);
|
||||||
},
|
},
|
||||||
position: {
|
position: {
|
||||||
my: "left top+6",
|
my: "left top+6",
|
||||||
|
|
@ -109,21 +111,19 @@ export default {
|
||||||
select(ui.item.value);
|
select(ui.item.value);
|
||||||
},
|
},
|
||||||
// Bold matching letters as you type in the input
|
// Bold matching letters as you type in the input
|
||||||
search: function(event, ui) {
|
search: function (event, ui) {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
let w = $(this).autocomplete("widget").find("div"),
|
let w = $(this).autocomplete("widget").find("div"),
|
||||||
re = new RegExp("("+this.value+")", "i");
|
re = new RegExp("(" + this.value + ")", "i");
|
||||||
w.html((i, html) =>
|
w.html((i, html) => html.replace(re, "<span>$1</span>"));
|
||||||
html.replace(re, "<span>$1</span>")
|
}, 5);
|
||||||
);
|
|
||||||
},5);
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
selectedQuery(newValue, oldValue) {
|
selectedQuery(newValue, oldValue) {
|
||||||
if (oldValue.length > 0 && newValue.length === 0) {
|
if (oldValue.length > 0 && newValue.length === 0) {
|
||||||
$( "#autocomplete" ).autocomplete( "search", "" );
|
$("#autocomplete").autocomplete("search", "");
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
@ -142,7 +142,7 @@ ul {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: .25rem;
|
padding: 0.25rem;
|
||||||
background: $white;
|
background: $white;
|
||||||
border: 1px solid $gray;
|
border: 1px solid $gray;
|
||||||
border-radius: 0.25rem;
|
border-radius: 0.25rem;
|
||||||
|
|
@ -155,10 +155,10 @@ ul {
|
||||||
.ui-menu-item-wrapper {
|
.ui-menu-item-wrapper {
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
padding-left: .25rem;
|
padding-left: 0.25rem;
|
||||||
span {
|
span {
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
&.ui-state-active {
|
&.ui-state-active {
|
||||||
border: 1px solid $gray-200;
|
border: 1px solid $gray-200;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue