58 lines
		
	
	
		
			No EOL
		
	
	
		
			1.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			58 lines
		
	
	
		
			No EOL
		
	
	
		
			1.3 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <div class="accounts-page">
 | |
|   {{#if loading}}
 | |
|     <LoadingPage />
 | |
|   {{elseif accounts && accounts.length}}
 | |
|     <ul class="accounts-results">
 | |
|       {{#each accounts as account}}
 | |
|         <AccountSearchResult :account />
 | |
|       {{/each}}
 | |
|     </ul>
 | |
|   {{/if}}
 | |
| </div>
 | |
| <style>
 | |
|   .accounts-page {
 | |
|     padding: 20px 20px;
 | |
|     position: relative;
 | |
|   }
 | |
|   .accounts-results {
 | |
|     list-style: none;
 | |
|     box-sizing: border-box;
 | |
|     border: 1px solid var(--main-border);
 | |
|     border-radius: 2px;
 | |
|   }
 | |
|   @media (max-width: 767px) {
 | |
|     .accounts-page {
 | |
|       padding: 20px 10px;
 | |
|     }
 | |
|   }
 | |
| </style>
 | |
| <script>
 | |
|   import { store } from '../_store/store'
 | |
|   import LoadingPage from '../_components/LoadingPage.html'
 | |
|   import AccountSearchResult from '../_components/search/AccountSearchResult.html'
 | |
|   import { toast } from '../_utils/toast'
 | |
| 
 | |
|   export default {
 | |
|     async oncreate() {
 | |
|       let accountsFetcher = this.get('accountsFetcher')
 | |
|       try {
 | |
|         // TODO: paginate
 | |
|         let accounts = await accountsFetcher()
 | |
|         this.set({ accounts: accounts })
 | |
|       } catch (e) {
 | |
|         toast.say('Error: ' + (e.name || '') + ' ' + (e.message || ''))
 | |
|       } finally {
 | |
|         this.set({loading: false})
 | |
|       }
 | |
|     },
 | |
|     data: () => ({
 | |
|       loading: true,
 | |
|       accounts: []
 | |
|     }),
 | |
|     store: () => store,
 | |
|     components: {
 | |
|       LoadingPage,
 | |
|       AccountSearchResult
 | |
|     }
 | |
|   }
 | |
| </script> |