[fedi] instances moderation

components/admin/Federation.vue

@@ -1,21 +1,60 @@
 <template lang="pug">
   div
-    el-form(inline label-width='400px')
+    el-form(inline label-width='200px')
       el-form-item(:label="$t('admin.enable_federation')")
         el-switch(v-model='enable_federation')
       el-form-item(:label="$t('admin.enable_comments')")
         el-switch(v-model='enable_comments')
       el-form-item(:label="$t('admin.disable_gamification')")
         el-switch(v-model='disable_gamification')
+
+      el-divider {{$t('common.instances')}}
+      el-table(:data='paginatedInstances' small)
+        el-table-column(label='Domain' width='250')
+          template(slot-scope='data')
+            span(slot='reference') <img class='instance_thumb' :src="data.row.data.thumbnail"/> {{data.row.domain}}
+        el-table-column(label='Name' width='150')
+          template(slot-scope='data')
+            span(slot='reference') {{data.row.name}}
+        el-table-column(label='Users' width='150')
+          template(slot-scope='data')
+            span(slot='reference') {{data.row.users}}
+        el-table-column(:label="$t('common.actions')" width='300')
+          template(slot-scope='data')
+            el-button-group
+              el-button(size='mini'
+                :type='data.row.blocked?"danger":"warning"'
+                @click='toggleBlock(data.row)') {{data.row.blocked?$t('admin.unblock_instance'):$t('admin.block_instance')}}
+
+      client-only
+        el-pagination(:page-size='perPage' :currentPage.sync='instancePage' :total='instances.length')
+
 </template>
 <script>
 import { mapState, mapActions } from 'vuex'
 
 export default {
   name: 'Federation',
-  methods: mapActions(['setSetting']),
+  props: ['instances'],
+  data () {
+    return {
+      perPage: 10,
+      instancePage: 1
+    }
+  },
+  methods: {
+    ...mapActions(['setSetting']),
+    async toggleBlock (instance) {
+      await this.$axios.post('/instances/toggle_block', { instance: instance.domain, blocked: !instance.blocked })
+      instance.blocked = !instance.blocked
+    }
+  },
   computed: {
     ...mapState(['settings']),
+    paginatedInstances () {
+      return this.instances.slice((this.instancePage - 1) * this.perPage,
+        this.instancePage * this.perPage)
+    },
     enable_federation: {
       get () { return this.settings.enable_federation },
       set (value) { this.setSetting({ key: 'enable_federation', value }) }
@@ -31,3 +70,8 @@ export default {
   }
 }
 </script>
+<style lang="less">
+.instance_thumb {
+  height: 20px;
+}
+</style>