PSForever/PSFPortal
1
0
Fork 0
mirror of https://github.com/psforever/PSFPortal.git synced 2026-07-14 07:54:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Application improvements

Browse source 
* Change favicon
* Display account banned status on admin search
* Pull in application version from Webpack
* Add "Feedback" button in footer and github references
* Fix faction icons to make them the same size
* PaginatedList component now supports back
* Tabbed navs support back
* Hide Pagination when only one page
* Improve admin table style and size
This commit is contained in:
Chord 2019-12-31 09:46:34 -05:00
parent 817796e181
commit fa6e168ccc
23 changed files with 244 additions and 158 deletions
Download patch file Download diff file Expand all files Collapse all files

22
app/views/AdminPanel.svelte
View file

@ -1,8 +1,10 @@
<script>
import { onMount } from 'svelte'
import UserList from '../views/UserList'
import CharacterList from '../views/CharacterList'
import CharacterLink from '../components/CharacterLink'
import AccountLink from '../components/AccountLink'
import { monitor_tabs } from '../util/navigation'
import axios from 'axios'
export let appAlert;
@ -17,6 +19,10 @@
appAlert.message(e.message)
}
}
onMount(() => monitor_tabs((tab) => {
console.log(tab);
}));
</script>
<svelte:head>
@ -40,13 +46,11 @@
</ul>
<div class="tab-content" id="tabs-tabContent">
<div class="tab-pane fade show active" id="search" role="tabpanel" aria-labelledby="search-tab">
<div class="tab-pane show active" id="search" role="tabpanel" aria-labelledby="search-tab">
<form name="search" class="form-inline" on:submit|preventDefault={submitSearch}>
<div class="form-group mx-sm-3 mb-2">
<label for="inputSearch" class="sr-only">Search</label>
<input type="text" class="form-control" id="inputSearch" name="search" placeholder="Search" minlength=3 required>
<div class="form-group mx-sm-3">
<input type="text" class="form-control" id="inputSearch" name="search" placeholder="Username/Character Name" minlength=3 required>
</div>
<button type="submit" class="btn btn-primary mb-2">Search</button>
</form>
{#if results}
@ -66,10 +70,10 @@
</ol>
{/if}
</div>
<div class="tab-pane fade" id="users" role="tabpanel" aria-labelledby="users-tab">
<UserList {appAlert} />
<div class="tab-pane" id="users" role="tabpanel" aria-labelledby="users-tab">
<UserList setURLParam={true} {appAlert} />
</div>
<div class="tab-pane fade" id="characters" role="tabpanel" aria-labelledby="characters-tab">
<CharacterList {appAlert} />
<div class="tab-pane" id="characters" role="tabpanel" aria-labelledby="characters-tab">
<CharacterList setURLParam={true} {appAlert} />
</div>
</div>

15
app/views/CharacterList.svelte
View file

@ -4,6 +4,7 @@
import CharacterLink from '../components/CharacterLink'
import PaginatedList from '../components/PaginatedList'
import moment from 'moment'
export let setURLParam = true;
export let appAlert
@ -19,17 +20,17 @@
}
</script>
<PaginatedList bind:fetch={fetch} let:data={characters} let:pagination={pagination}>
<PaginatedList {setURLParam} URLSearchName='page_char' bind:fetch={fetch} let:data={characters} let:pagination={pagination}>
<div slot="header">
<p>{pagination.item_count.toLocaleString()} characters in the database</p>
</div>
<table slot="body" class="table table-dark table-responsive">
<thead>
<td>ID</td>
<td>Name</td>
<td>Last Played</td>
<td>Created</td>
<table slot="body" class="table table-sm table-dark table-responsive-md table-striped table-hover">
<thead class="thead-light">
<th>ID</th>
<th>Name</th>
<th>Last Played</th>
<th>Created</th>
</thead>
<tbody>
{#each characters as char, i}

2
app/views/Home.svelte
View file

@ -33,7 +33,7 @@
</script>
<svelte:head>
<title>PSForever</title>
<title>PSForever Portal</title>
</svelte:head>
<Alert bind:this={alert} />

19
app/views/UserList.svelte
View file

@ -6,6 +6,7 @@
import ActionModal from '../components/ActionModal.svelte'
import moment from 'moment'
export let setURLParam = false;
export let appAlert
let userList;
@ -21,23 +22,23 @@
}
</script>
<PaginatedList bind:this={userList} bind:fetch={fetch} let:data={users} let:pagination={pagination}>
<PaginatedList {setURLParam} bind:this={userList} bind:fetch={fetch} let:data={users} let:pagination={pagination}>
<div slot="header">
<p>{pagination.item_count.toLocaleString()} users in the database</p>
</div>
<table slot="body" class="table table-dark table-responsive">
<thead>
<td>ID</td>
<td>Username</td>
<td>User Created</td>
<td>Last Login</td>
<td>Actions</td>
<table slot="body" class="table table-sm table-dark table-responsive-md table-striped table-hover">
<thead class="thead-light">
<th>ID</th>
<th>Username</th>
<th>User Created</th>
<th>Last Login</th>
<th>Actions</th>
</thead>
<tbody>
{#each users as user, i}
<tr>
<td>#{user.id}</td>
<th>#{user.id}</th>
<td><AccountLink account={user} /></td>
<td>{moment(user.created).fromNow()}</td>
<td>{#if user.last_login.time}