| | |
| | | /////// SEARCH //////////////////////////////////////////////////////////////// |
| | | |
| | | const search = useRouteQuery("search", "",)// {transform: s => s.trim()}) |
| | | async function _doSearch (search) { |
| | | console.log("doSEarch", search) |
| | | // return init(0, search) |
| | | async function _doSearch (asearch) { |
| | | console.log("doSEarch", asearch) |
| | | // return init(0, asearch) |
| | | // TODO offset muss zurückgesetzt werden wenn die Suche neu ist |
| | | return init(offset.value, search) |
| | | // search.value = asearch |
| | | return init(offset.value, asearch) |
| | | } |
| | | const doSearch = useDebounceFn(_doSearch, 333) |
| | | |
| | |
| | | <div class="search"> |
| | | Search |
| | | <input @keyup="doSearch(search)" v-model="search" type="text" size="30"> |
| | | <button type="button" @click="_doSearch('')"> |
| | | <div style="transform:scale(1.4); font-weight: bold;">×</div> |
| | | </button> |
| | | </div> |
| | | <Pagination :offset="users.offset" :limit="users.limit" :total="users.total" @go="go" /> |
| | | </div> |
| | |
| | | border 1px dotted #ccc |
| | | background-color #eee; |
| | | |
| | | .search |
| | | display flex; |
| | | gap .33em |
| | | align-items center; |
| | | button |
| | | display flex; |
| | | //background-color blue |
| | | align-items stretch |
| | | display grid |
| | | grid-template-columns 1fr |
| | | padding 0 |
| | | min-width 1.33em |
| | | cursor pointer; |
| | | |
| | | </style> |