Merge pull request #2169 from brkcvn/search-box-top

Search box done development for blade
This commit is contained in:
Cüneyt Şentürk 2021-06-30 18:42:50 +03:00 committed by GitHub
commit dcae2f2c68
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 15 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<div :id="'search-field-' + _uid" class="searh-field tags-input__wrapper" :style="[!search_hidden ? {'height': '0px'} : {'height': 'auto'}]"> <div :id="'search-field-' + _uid" class="searh-field tags-input__wrapper js-search">
<div class="tags-group" v-for="(filter, index) in filtered" :index="index"> <div class="tags-group" v-for="(filter, index) in filtered" :index="index">
<span v-if="filter.option" class="el-tag el-tag--primary el-tag--small el-tag--light el-tag-option"> <span v-if="filter.option" class="el-tag el-tag--primary el-tag--small el-tag--light el-tag-option">
{{ filter.option }} {{ filter.option }}
@ -178,20 +178,10 @@ export default {
values: [], values: [],
current_value: null, current_value: null,
show_date: false, show_date: false,
search_hidden: false
}; };
}, },
methods: { methods: {
searchBoxShow() {
if(document.querySelector('.js-search-input-box')) {
let search_box_html = document.querySelector('.js-search-input-box');
search_box_html.remove();
}
this.search_hidden = true;
},
onInputFocus() { onInputFocus() {
if (!this.filter_list.length) { if (!this.filter_list.length) {
return; return;
@ -588,8 +578,6 @@ export default {
}, },
created() { created() {
this.searchBoxShow();
let path = window.location.href.replace(window.location.search, ''); let path = window.location.href.replace(window.location.search, '');
let cookie = Cookies.get('search-string'); let cookie = Cookies.get('search-string');
@ -729,7 +717,6 @@ export default {
}, },
mounted() { mounted() {
this.searchBoxShow();
}, },
computed: { computed: {

View File

@ -1,4 +1,4 @@
<div class="position-relative js-search-input-box" style="height: 45px;"> <div class="position-relative js-search-box-hidden" style="height: 48.5px;">
<div class="border-bottom-0 w-100 position-absolute left-0 right-0" style="z-index: 9;"> <div class="border-bottom-0 w-100 position-absolute left-0 right-0" style="z-index: 9;">
<input type="text" placeholder="Search or filter results..." class="form-control" /> <input type="text" placeholder="Search or filter results..." class="form-control" />
</div> </div>

View File

@ -16,6 +16,15 @@
'use strict'; 'use strict';
var Layout = (function() { var Layout = (function() {
if (document.querySelector('.js-search-box-hidden')) {
let search_box_html = document.querySelector('.js-search-box-hidden');
let search_box_vue_component = search_box_html.parentNode.querySelector('.js-search');
search_box_vue_component.classList.add('d-none');
search_box_html.classList.add('d-none');
search_box_vue_component.classList.remove('d-none');
}
function pinSidenav() { function pinSidenav() {
$('.sidenav-toggler').addClass('active'); $('.sidenav-toggler').addClass('active');
$('.sidenav-toggler').data('action', 'sidenav-unpin'); $('.sidenav-toggler').data('action', 'sidenav-unpin');