98 lines
2.9 KiB
Vue
98 lines
2.9 KiB
Vue
|
<template>
|
||
|
|
<form class="table-search-form" role="search" @submit.prevent="search">
|
||
|
|
<div class="form-group">
|
||
|
|
<div class="input-group">
|
||
|
|
<div class="input-group-prepend">
|
||
|
|
<span class="input-group-text">
|
||
|
|
<svg
|
||
|
|
class=""
|
||
|
|
aria-hidden="true"
|
||
|
|
focusable="false"
|
||
|
|
data-prefix="fas"
|
||
|
|
data-icon="search"
|
||
|
|
role="img"
|
||
|
|
xmlns="http://www.w3.org/2000/svg"
|
||
|
|
viewBox="0 0 512 512"
|
||
|
|
data-fa-i2svg=""
|
||
|
|
>
|
||
|
|
<path
|
||
|
|
fill="currentColor"
|
||
|
|
d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
|
||
|
|
></path>
|
||
|
|
</svg>
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<input
|
||
|
|
v-model="searchForm.query"
|
||
|
|
type="search"
|
||
|
|
required
|
||
|
|
class="form-control"
|
||
|
|
id="search-query"
|
||
|
|
placeholder="جستجو..."
|
||
|
|
name="search-query"
|
||
|
|
aria-label="جستجو در اسناد، عناوین و واژگان"
|
||
|
|
aria-describedby="basic-addon1"
|
||
|
|
size="50"
|
||
|
|
@keyup="search()"
|
||
|
|
@keydown="onKeyDown()"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<div class="input-group-append">
|
||
|
|
<button
|
||
|
|
:class="{ 'show-reset-btn': searchForm.query.length > 0 }"
|
||
|
|
type="button"
|
||
|
|
class="input-group-text"
|
||
|
|
id="basic-addon1"
|
||
|
|
>
|
||
|
|
<svg class="icon icon-Component-294--1">
|
||
|
|
<use xlink:href="#icon-Component-294--1"></use>
|
||
|
|
</svg>
|
||
|
|
</button>
|
||
|
|
|
||
|
|
<div class="dropdown">
|
||
|
|
<button
|
||
|
|
class="btn dropdown-toggle"
|
||
|
|
type="button"
|
||
|
|
data-bs-toggle="dropdown"
|
||
|
|
aria-expanded="false"
|
||
|
|
>
|
||
|
|
<svg class="icon icon-filter" style="width: 1.3em">
|
||
|
|
<use xlink:href="#icon-filter"></use>
|
||
|
|
</svg>
|
||
|
|
عنوان
|
||
|
|
</button>
|
||
|
|
<div class="dropdown-menu">
|
||
|
|
<button class="dropdown-item" type="button" value="current">
|
||
|
|
عنوان
|
||
|
|
</button>
|
||
|
|
<button class="dropdown-item" type="button" value="all">
|
||
|
|
شماره
|
||
|
|
</button>
|
||
|
|
<button class="dropdown-item" type="button" value="all">
|
||
|
|
کد
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
fieldThree: {
|
||
|
|
default() {
|
||
|
|
return undefined;
|
||
|
|
},
|
||
|
|
},
|
||
|
|
canDelete: {
|
||
|
|
default: "",
|
||
|
|
type: String,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|