You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
125 lines
5.5 KiB
HTML
125 lines
5.5 KiB
HTML
5 years ago
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
|
||
|
|
<link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
|
||
|
|
<link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
<div id="app">
|
||
|
|
<v-app>
|
||
|
|
<v-app-bar app>
|
||
|
|
<v-toolbar-title>
|
||
|
|
<b>MC</b> <b>A</b>ccount <b>C</b>hecker and <b>I</b>ntegrity <b>V</b>alidator
|
||
|
|
<sub>by <a href="https://github.com/cuddlycheetah">CuddlyCheetah</a></sub>
|
||
|
|
</v-toolbar-title>
|
||
|
|
</v-app-bar>
|
||
|
|
<v-content>
|
||
|
|
<!--
|
||
|
|
hello to anyone, who reads this :3
|
||
|
|
-->
|
||
|
|
<v-container>
|
||
|
|
<v-data-table must-sort :footer-props="footerProps" :options="options" :loading="loading" loading-text="Loading... Please wait" :headers="headers" item-key="_id" :items="accountData" :items-per-page="5"
|
||
|
|
class="elevation-1" :search="search" :custom-filter="filterOnlyCapsText">
|
||
|
|
<template v-slot:top>
|
||
|
|
<v-text-field v-model="search" label="Search" class="mx-4"></v-text-field>
|
||
|
|
</template>
|
||
|
|
<template v-slot:no-data>
|
||
|
|
No Accounts to show
|
||
|
|
</template>
|
||
|
|
<template v-slot:item.uuid="{ item }">
|
||
|
|
<tr>
|
||
|
|
<td :colspan="headers.length">
|
||
|
|
<img v-if="item.validState == 1" :alt="item.uuid"
|
||
|
|
:src="'https://www.mc-heads.net/avatar/' + item.uuid + '/48/nohelm.png'">
|
||
|
|
<img v-if="item.validState == -1" :src="'Barrier_2.png'">
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</template>
|
||
|
|
</v-data-table>
|
||
|
|
<hr>
|
||
|
|
Import Bulk Accounts
|
||
|
|
<v-textarea outlined v-model="bulkImportText" label="Bulk Import Data" placeholder="[username]:<user/email>:<password>
|
||
|
|
..."></v-textarea>
|
||
|
|
<v-btn :disabled="isBulkTextValid()" raised @click="bulkImport()">Import</v-btn>
|
||
|
|
</v-container>
|
||
|
|
</v-content>
|
||
|
|
</v-app>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js"></script>
|
||
|
|
<script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script>
|
||
|
|
<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1"></script>
|
||
|
|
<script>
|
||
|
|
new Vue({
|
||
|
|
el: '#app',
|
||
|
|
vuetify: new Vuetify(),
|
||
|
|
//vueResource: new vueResource(),
|
||
|
|
http: {
|
||
|
|
root: '/',
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
loading: true,
|
||
|
|
search: '',
|
||
|
|
options: {
|
||
|
|
itemsPerPage: -1,
|
||
|
|
groupBy: ['validState'],
|
||
|
|
groupDesc: ['validState']
|
||
|
|
},
|
||
|
|
footerProps: {
|
||
|
|
itemsPerPageOptions: [ -1, 5, 10, 20, 50, 75, 100 ]
|
||
|
|
},
|
||
|
|
validStateLUT: {
|
||
|
|
[-1]: '❌ Invalid',
|
||
|
|
[0]: '❔ Unknown',
|
||
|
|
[1]: '✅ Valid'
|
||
|
|
},
|
||
|
|
headers: [
|
||
|
|
{ text: 'UUID', align: 'start', groupable: false, sortable: false, value: 'uuid', },
|
||
|
|
{ text: 'State', value: 'validStateText', groupable: true },
|
||
|
|
{ text: 'E-Mail', value: 'email', groupable: false },
|
||
|
|
{ text: 'Username', value: 'username', groupable: false },
|
||
|
|
{ text: 'Passwort', value: 'password', groupable: false },
|
||
|
|
],
|
||
|
|
accountData: [],
|
||
|
|
bulkImportText: '',
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created() {
|
||
|
|
this.refresh()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
refresh() {
|
||
|
|
this.$http.get('/api/accounts').then(response => {
|
||
|
|
this.accountData = response.body.map(item => {
|
||
|
|
item.validStateText = this.validStateLUT[item.validState]
|
||
|
|
return item
|
||
|
|
})
|
||
|
|
//this.accountData.sort((a,b) => a.validState - b.validState)
|
||
|
|
this.loading = false
|
||
|
|
}, response => {
|
||
|
|
})
|
||
|
|
},
|
||
|
|
isBulkTextValid() {
|
||
|
|
return this.bulkImportText.length < 0 || this.bulkImportText.indexOf(':') === -1
|
||
|
|
},
|
||
|
|
bulkImport() {
|
||
|
|
console.log(this.bulkImportText)
|
||
|
|
const accounts = this.bulkImportText.split('\n')
|
||
|
|
console.log(accounts)
|
||
|
|
this.$http.post('/api/import', JSON.stringify(accounts)).then(response => {
|
||
|
|
this.bulkImportText = response.body
|
||
|
|
this.refresh()
|
||
|
|
}, console.error)
|
||
|
|
},
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|