Revisions for ⁨Component⁩

@@ -0,0 +1,26 @@

+<template>
+    <badge>{{ getItem(this.rank) }}</badge>
+</template>
+
+<script>
+import Badge from '@/components/Badge';
+import { mapGetters } from 'vuex';
+
+export default {
+    name: "PlayerRanksBadge",
+    components: {
+        Badge,
+    },
+    computed: {
+        ...mapGetters({
+            getItem: "ComponentModule/getItem",
+        }),
+    },
+    props: {
+        rank: {
+            type: String,
+            required: true,
+        }
+    },
+}
+</script>

@@ -0,0 +1,58 @@

+<template>
+    <md-card-content>
+        <loading :active.sync="isLoading"
+                 :can-cancel="false"
+                 :isFullPage="false"
+                />
+        <div
+            v-if="error"
+            class="alert alert-danger">{{ error }}</div>
+        <md-table
+            :value="items"
+            class="paginated-table table-striped table-hover"
+        >
+            <md-table-row slot="md-table-row" slot-scope="{ item }" :key="item['@id']">
+                <Item :player="item" />
+            </md-table-row>
+        </md-table>
+    </md-card-content>
+</template>
+
+<script>
+import { mapActions } from 'vuex';
+import { createHelpers } from 'vuex-map-fields';
+import Loading from 'vue-loading-overlay'
+import Item from './Item';
+
+const { mapFields } = createHelpers({
+    getterType: 'AdminPlayerModule/List/getField',
+    mutationType: 'AdminPlayerModule/List/updateField',
+});
+
+export default {
+    components: {
+        Item,
+        Loading,
+    },
+    computed: {
+        ...mapFields({
+            error: 'error',
+            items: 'items',
+            isLoading: 'isLoading',
+        }),
+    },
+    mounted() {
+        this.getPage(this.$route.query);
+    },
+    watch: {
+        $route: function() {
+            this.getPage(this.$route.query);
+        },
+    },
+    methods: {
+        ...mapActions({
+            getPage: 'AdminPlayerModule/List/default',
+        }),
+    },
+};
+</script>

@@ -0,0 +1,38 @@

+<template>
+    <fragment>
+        <md-table-cell md-label="Nom">{{
+                player.username
+            }}</md-table-cell>
+        <md-table-cell md-label="Uuid">{{
+                player.minecraftUuid
+            }}</md-table-cell>
+        <md-table-cell md-label="Grades">
+            <template v-if="player.playerRanks !== undefined && player.playerRanks.length">
+                <player-ranks-badge :player-ranks="player.playerRanks"></player-ranks-badge>
+            </template>
+        </md-table-cell>
+        <md-table-cell md-label="Actions">
+            <router-link
+                class="md-just-icon md-info md-simple"
+                v-slot="{ href, navigate }"
+                :to="{name: 'PlayerShow', params: { id: player['@id'] }}">
+                <md-button :href="href" class="md-just-icon md-info md-simple" @click.native="navigate">
+                    <md-icon>eye</md-icon>
+                </md-button>
+            </router-link>
+        </md-table-cell>
+    </fragment>
+</template>
+
+<script>
+import PlayerRanksBadge from "@/views/components/Badges/PlayerRanksBadge";
+
+export default {
+    components: {PlayerRanksBadge},
+    props: {
+        player: {
+            type: Object
+        }
+    },
+};
+</script>

@@ -0,0 +1,24 @@

+<template>
+    <div>
+        <template v-for="playerRank in playerRanks">
+            <player-rank-badge v-bind:key="playerRank" :player-rank="playerRank"/>
+        </template>
+    </div>
+</template>
+
+<script>
+import PlayerRankBadge from './PlayerRankBadge';
+
+export default {
+    name: "PlayerRanksBadge",
+    components: {
+        PlayerRankBadge
+    },
+    props: {
+        playerRanks: {
+            type: Array,
+            required: true,
+        }
+    },
+}
+</script>

@@ -0,0 +1,34 @@

+<template>
+    <RankBadge :rank="getItem(playerRank)"></RankBadge>
+</template>
+
+<script>
+import RankBadge from './RankBadge';
+import { mapGetters, mapActions } from 'vuex';
+
+export default {
+    name: "PlayerRanksBadge",
+    components: {
+        RankBadge,
+    },
+    computed: {
+        ...mapGetters({
+            getItem: "ComponentModule/getItem",
+        }),
+    },
+    props: {
+        playerRank: {
+            type: String,
+            required: true,
+        }
+    },
+    mounted() {
+        this.getPage(this.$route.query);
+    },
+    methods: {
+        ...mapActions({
+            getPage: 'AdminPlayerModule/List/default',
+        }),
+    },
+}
+</script>