Skip to content

Commit

Permalink
[FEATURE] Dashboard displaying various data items about database
Browse files Browse the repository at this point in the history
[FIX] Style fixes
[REFACTOR] Optimised some code
[REMOVED] phpcs.xml and phpunit-watcher.yml
  • Loading branch information
QuintenJustus committed Jul 15, 2019
1 parent e724f29 commit 5481b37
Show file tree
Hide file tree
Showing 23 changed files with 361 additions and 323 deletions.
1 change: 1 addition & 0 deletions .gitignore
Expand Up @@ -10,3 +10,4 @@ yarn-error.log
mix-manifest.json
todo.md
/public/phpmd.html
phpunit-watcher.yml
10 changes: 6 additions & 4 deletions CHANGELOG.md
Expand Up @@ -4,8 +4,10 @@
### TODO before release
- Fix #19, non-alphabetic characters breaking Prequel.
- Add support for postgres.
- Fix #37, not all column values are showing up
- Fix #37, not all column values are showing up -> Caused by model's $hidden properties.

##### Planned for next release
- Add support for postgres - Will be pushed back to next release.

### Functionality
- [FEATURE] Testing framework setup by @aaronsaray (see #44)
Expand All @@ -20,10 +22,10 @@
- Further functionality to be added.
- [FEATURE] Prequel now uses it's own database instance with the config defined in `config/prequel.php::database`
- [FEATURE] Pagination feature by @aaronsaray (see #26)
- [FEATURE] Added extra error suggestions.
- [FEATURE] Config: DB key renamed to database; changed all child keys to lowercase.
- [BREAKING][REFACTOR]Config: DB key renamed to database; changed all child keys to lowercase.

### Fixed
- [FIX] Added extra error suggestions.
- [FIX] Scrollbar appearing on the bottom of table view.
- [FIX] With Prequel now using it's own config issues #23 #24 #29 are solved.
- [FIX] Changed all config calls for database credentials solving.
Expand Down
12 changes: 0 additions & 12 deletions phpcs.xml

This file was deleted.

11 changes: 0 additions & 11 deletions phpunit-watcher.yml

This file was deleted.

2 changes: 1 addition & 1 deletion public/app.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion public/app.js

Large diffs are not rendered by default.

40 changes: 19 additions & 21 deletions resources/assets/js/components/Elements/Welcome.vue
@@ -1,21 +1,21 @@
<template>
<div class="welcome">
<h1>Overview</h1>
<div class="status-cards">
<Migrations class="flex-1"/>
<DatabaseStatus class="flex-1"/>
<Migrations class="flex-1"/>
<div class="img-wrapper">
<img class="no-drag" width="175" alt="Laravel Prequel" :src="$root.prequel.asset.logo">
</div>
<h1>
Welcome to Laravel Prequel!
</h1>
<Management/>
</div>
</template>

<script>
import Migrations from '../MainContent/ManageDatabase/Migrations';
import DatabaseStatus from '../MainContent/ManageDatabase/DatabaseStatus';
import Management from '../MainContent/ManageDatabase/Management';
export default {
name : 'Welcome',
components: {DatabaseStatus, Migrations},
components: {Management},
data() {
return {
//
Expand All @@ -24,26 +24,24 @@
};
</script>

<style lang="scss">
<style scoped lang="scss">
.welcome {
@apply my-2;
@apply mt-2;
.status-cards {
.img-wrapper {
@apply w-full;
@apply flex;
@apply flex-wrap;
@apply mt-2;
@apply bg-gray-100;
@apply border-t;
@apply border-b;
@apply justify-center;
@apply items-center;
}
h1 {
@apply text-left;
@apply text-header;
@apply font-normal;
@apply text-lg;
@apply text-center;
@apply text-gray-900;
@apply font-semibold;
@apply text-2xl;
@apply mt-2;
@apply ml-2;
@apply mb-4;
}
.button-wrapper {
Expand Down
4 changes: 3 additions & 1 deletion resources/assets/js/components/MainContent/MainContent.vue
Expand Up @@ -40,7 +40,8 @@
'tableLoadError',
'tableErrorDetailed',
'welcomeShown',
'mode'],
'mode',
],
};
</script>

Expand All @@ -51,5 +52,6 @@
@apply bg-white;
@apply rounded;
@apply shadow;
@apply ml-1;
}
</style>

This file was deleted.

@@ -1,20 +1,118 @@
<template>
<div>
<Migrations/>
<CurrentDatabaseSpeed/>
<div class="database-management">
<h1>Overview</h1>
<div class="status-cards">
<Migrations/>

<StatusDisplay header="Queries per second average"
:value="app.serverInfo.QUERIES_PER_SECOND_AVG ? app.serverInfo.QUERIES_PER_SECOND_AVG : 'Could not retrieve'"
:unit="app.serverInfo.QUERIES_PER_SECOND_AVG ? 'queries/second' : '...'"/>

<StatusDisplay header="Active Threads"
:value="app.serverInfo.THREADS ? app.serverInfo.THREADS : 'Could not retrieve...'"
:unit="app.serverInfo.THREADS ? 'Threads' : ''"/>

<StatusDisplay header="Open Tables"
:value="app.serverInfo.OPEN_TABLES ? app.serverInfo.OPEN_TABLES : 'Could not retrieve...'"
:unit="app.serverInfo.OPEN_TABLES ? 'Tables' : ''"/>
</div>
<div class="status-cards">
<StatusDisplay :header="`Permissions for user '${$root.prequel.env.user}'`"
:value="readableArray(app.permissions)"/>
<StatusDisplay header="Placeholder" value="Placeholder"/>
<StatusDisplay header="Placeholder" value="Placeholder"/>
</div>
</div>
</template>

<script>
import Migrations from './Migrations';
import CurrentDatabaseSpeed from './DatabaseStatus';
import api from 'axios';
import Migrations from './Migrations';
import StatusDisplay from './StatusDisplay';
export default {
name : 'Management',
components: {CurrentDatabaseSpeed, Migrations},
components: {StatusDisplay, Migrations},
data() {
return {
app: {},
};
},
created() {
let self = this;
this.getData();
setInterval(function() {
self.getData();
}, 10000);
},
methods: {
getData: function() {
api.get('status').then(res => {
this.app = res.data;
});
},
/**
* Create readable string from array
* @param arr
*/
readableArray: function(arr) {
return 'TODO';
// @TODO
// let readableString = '';
//
// for (let i = 0; i < arr; i++) {
// console.log(arr[i]);
// if (arr[i]) {
// readableString += arr[i].value();
// }
// }
//
// return readableString;
},
},
};
</script>

<style scoped>
<style scoped lang="scss">
.database-management {
h1 {
@apply text-center;
@apply text-header;
@apply font-normal;
@apply text-lg;
@apply pt-1;
@apply mb-1;
@apply pl-2;
@apply border-t;
@apply rounded;
}
.status-cards {
@apply flex;
@apply flex-wrap;
@apply bg-gray-100;
@apply border-t;
@apply border-b;
}
.button-wrapper {
@apply flex;
@apply justify-center;
@apply my-2;
a {
@apply text-white;
@apply font-bold;
@apply py-1;
@apply px-4;
@apply rounded-full;
@apply mx-1;
}
}
}
</style>
Expand Up @@ -45,10 +45,8 @@
},
resetMigrations: function() {
api.get('reset/migrations').then(res => {
if (res) {
window.location.reload();
}
api.get('reset/migrations').finally(() => {
window.location.reload();
});
},
},
Expand All @@ -57,6 +55,7 @@

<style lang="scss">
#migration-wrapper {
@apply flex-1;
@apply w-40;
@apply bg-gray-100;
@apply py-4;
Expand Down

0 comments on commit 5481b37

Please sign in to comment.