17th-Ranger-Battalion-ORG/17th-Site-Front-End-V2
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

members-api-integration #3

Merged
Ajdj100 merged 5 commits from members-api-integration into master 2024-05-26 10:53:57 -05:00
Conversation 0 Commits 5 Files Changed 2 +37 -27
2 changed files with 37 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
17th Website/package-lock.json generated
View File

@@ -2591,9 +2591,9 @@
} }
}, },
"node_modules/caniuse-lite": { "node_modules/caniuse-lite": {
"version": "1.0.30001486", "version": "1.0.30001616",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001486.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001616.tgz",
"integrity": "sha512-uv7/gXuHi10Whlj0pp5q/tsK/32J2QSqVRKQhs2j8VsDCjgyruAh/eEXHF822VqO9yT6iZKw3nRwZRSPBE9OQg==", "integrity": "sha512-RHVYKov7IcdNjVHJFNY/78RdG4oGVjbayxv8u5IO74Wv7Hlq4PnJE6mo/OjFijjVFNy5ijnCt6H3IIo4t+wfEw==",
"dev": true, "dev": true,
"funding": [ "funding": [
{ {
@@ -11644,9 +11644,9 @@
} }
}, },
"caniuse-lite": { "caniuse-lite": {
"version": "1.0.30001486", "version": "1.0.30001616",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001486.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001616.tgz",
"integrity": "sha512-uv7/gXuHi10Whlj0pp5q/tsK/32J2QSqVRKQhs2j8VsDCjgyruAh/eEXHF822VqO9yT6iZKw3nRwZRSPBE9OQg==", "integrity": "sha512-RHVYKov7IcdNjVHJFNY/78RdG4oGVjbayxv8u5IO74Wv7Hlq4PnJE6mo/OjFijjVFNy5ijnCt6H3IIo4t+wfEw==",
"dev": true "dev": true
}, },
"case-sensitive-paths-webpack-plugin": { "case-sensitive-paths-webpack-plugin": {

48
17th Website/src/views/users.vue
View File

@@ -1,7 +1,5 @@
<script> <script>
import { Listbox, ListboxButton, ListboxOptions, ListboxOption } from '@headlessui/vue'
import { Icon } from '@iconify/vue' import { Icon } from '@iconify/vue'
import QueryApolloGraphQL from '../api/request'
import Dropdown from '../components/dropdown/Dropdown.vue' import Dropdown from '../components/dropdown/Dropdown.vue'
export default { export default {
@@ -13,8 +11,8 @@ export default {
statusFilters: [ statusFilters: [
{ id: 1, name: 'All Groups', filter: 'none', disabled: false }, { id: 1, name: 'All Groups', filter: 'none', disabled: false },
{ id: 2, name: 'Alpha', filter: 'Alpha Company', disabled: false }, { id: 2, name: 'Alpha', filter: 'Alpha', disabled: false },
{ id: 3, name: 'Echo', filter: 'Echo Company', disabled: false }, { id: 3, name: 'Echo', filter: 'Echo', disabled: false },
{ id: 4, name: 'HHC', filter: 'HHC', disabled: false }, { id: 4, name: 'HHC', filter: 'HHC', disabled: false },
{ id: 5, name: 'Recruit', filter: 'Recruit', disabled: false }, { id: 5, name: 'Recruit', filter: 'Recruit', disabled: false },
], ],
@@ -40,33 +38,42 @@ export default {
}, },
filterByName(item) { filterByName(item) {
if (this.search != '') if (this.search != '')
return item.member_name.toLowerCase().includes(this.search.toLowerCase()); return item.name.toLowerCase().includes(this.search.toLowerCase());
else else
return true; return true;
}, },
filterByUnit(item) { filterByUnit(item) {
// console.log(item, this.statusFilters[this.currentStatusFilterIndex]);
if (this.statusFilters[this.currentStatusFilterIndex].filter != 'none') if (this.statusFilters[this.currentStatusFilterIndex].filter != 'none')
return item.status == this.unitFilter.filter; //do the filter
return item.company.toLowerCase() == this.statusFilters[this.currentStatusFilterIndex].filter.toLowerCase();
else else
//no filter applied
return true; return true;
}, },
filterByRole(item) { //THIS IS NOT IMPLEMENTED YET filterByRole(item) { //THIS IS NOT IMPLEMENTED YET
return true; return true;
} },
}, },
components: { components: {
Listbox,
ListboxButton,
ListboxOption,
ListboxOptions,
Icon, Icon,
Dropdown, Dropdown,
}, },
mounted() { mounted() {
// QueryApolloGraphQL("getPageViewMemberRankStatusAll", "query Query {getPageViewMemberRankStatusAll {items {member_name,rank,status}}}").then(value => { this.items = value }) //console.log(value); for debug reasons // QueryApolloGraphQL("getPageViewMemberRankStatusAll", "query Query {getPageViewMemberRankStatusAll {items {member_name,rank,status}}}").then(value => { this.items = value }) //console.log(value); for debug reasons
// this.items = fetch("http://iceberg-gaming.com:1323/api/members"); // this.items = fetch("http://iceberg-gaming.com:1323/api/members");
//make API request here //make API request here
fetch('http://iceberg-gaming.com:1323/api/v1/member').then(res => {
console.log(res);
res.json().then(list => {
this.items = list;
console.log(this.items);
});
});
}, },
computed: { computed: {
filteredTable() { filteredTable() {
@@ -92,11 +99,11 @@ export default {
<div id="dropdownWrapper"> <div id="dropdownWrapper">
<Dropdown :values="statusFilters" :currentIndex="currentStatusFilterIndex" display="name" <Dropdown :values="statusFilters" :currentIndex="currentStatusFilterIndex" display="name"
@changeSelection="(index) => currentStatusFilterIndex = index" class="w-36 mr-2"> @changeSelection="(index) => currentStatusFilterIndex = index" class="w-36 mr-2">
</Dropdown> </Dropdown>
<Dropdown :values="roleFilters" :currentIndex="currentRoleFilter" display="name" <Dropdown :values="roleFilters" :currentIndex="currentRoleFilter" display="name"
@changeSelection="(index) => currentRoleFilter = index" class="w-36"> @changeSelection="(index) => currentRoleFilter = index" class="w-36">
</Dropdown> </Dropdown>
<button @click="resetFilters()" <button @click="resetFilters()"
@@ -110,7 +117,7 @@ export default {
<thead> <thead>
<tr> <tr>
<th>Member</th> <th>Member</th>
<th>Unit</th> <th>Status</th>
<th>Rank</th> <th>Rank</th>
<th>Join Date</th> <th>Join Date</th>
<th>LOA Until</th> <th>LOA Until</th>
@@ -119,10 +126,13 @@ export default {
</thead> </thead>
<tbody id="tableBody"> <tbody id="tableBody">
<tr v-for="(item, index) in filteredTable" <tr v-for="(item, index) in filteredTable"
v-on:click="$router.push({ path: `/profile/${item.member_name}/home` })"> v-on:click="$router.push({ path: `/profile/${item.id}/home` })">
<td>{{ item.member_name }}</td> <td>{{ item.name }}</td>
<td>{{ item.status }}</td> <td>{{ item.company }}</td>
<td>{{ item.rank }}</td> <td>{{ item.rank.name }}</td>
<td>{{ item.created_at.split('T')[0] }}</td>
<td>hello</td>
<td>hello</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>