hft-informatik/ubiquitous-computing-geo-timetracking
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch '83-user-list-add-style' into 'master'

Browse Source 
Resolve "User list add style"

Closes #83

See merge request marcel.schwarz/2020ss-qbc-geofence-timetracking!62
This commit is contained in:
Tim Zieger 2020-05-22 12:15:27 +00:00
commit 4b2fe41d9f
3 changed files with 54 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/App.vue
View File

@ -197,7 +197,7 @@ export default {
sessionStorage.setItem("lastname", userInformation.lastname); sessionStorage.setItem("lastname", userInformation.lastname);
sessionStorage.setItem("username", userInformation.username); sessionStorage.setItem("username", userInformation.username);
sessionStorage.setItem("role", userInformation.role.name); sessionStorage.setItem("role", userInformation.role.name);
console.log(this.fullname);
this.fullname= sessionStorage.getItem("firstname") + " " + sessionStorage.getItem("lastname"); this.fullname= sessionStorage.getItem("firstname") + " " + sessionStorage.getItem("lastname");
location.reload(); location.reload();
@ -209,7 +209,7 @@ export default {
whoxhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt")); whoxhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt"));
whoxhttp.send(null); whoxhttp.send(null);
location.reload();
} }
}, },
signUp(signupData) { signUp(signupData) {

4
frontend/src/views/Users.vue
View File

@ -1,9 +1,9 @@
<template> <template>
<div> <v-container fluid>
<div v-bind:key="user.username" v-for="user in users"> <div v-bind:key="user.username" v-for="user in users">
<UsersItems v-bind:user="user" v-on:edit-user="edituser" /> <UsersItems v-bind:user="user" v-on:edit-user="edituser" />
</div> </div>
</div> </v-container>
</template> </template>
<script> <script>

128
frontend/src/views/UsersItems.vue
View File

@ -1,58 +1,51 @@
<template> <template>
<div class="time-record-item"> <v-card outlined>
<v-card outlined> <v-list-item class="main_accent">
<v-list-item class="main_accent"> <v-list-item-content>
<v-list-item-content> <v-row no-gutters align="center">
<v-row no-gutters align="center"> <v-col cols="1">
<v-col cols="2"> <v-avatar><img src="https://cdn.vuetifyjs.com/images/john.jpg" alt="John" /></v-avatar>
<pre> <v-avatar> </v-col>
<img src="https://cdn.vuetifyjs.com/images/john.jpg" alt="John" />
</v-avatar> <v-col cols="3">
<v-card color="background" elevation="0">
</pre> <pre><v-icon color="primary">mdi-account</v-icon>{{" " + user.username}}</pre>
</v-col> </v-card>
<v-col></v-col> </v-col>
<v-col cols="3"> <v-col></v-col>
<v-card color="background" elevation="0"> <v-col cols="3">
<pre><v-icon color="primary">mdi-account</v-icon>{{" " + user.username}}</pre> <v-card color="background" elevation="0">
</v-card> <pre><v-icon color="primary">mdi-account-box</v-icon>{{" " + user.firstname + " " +user.lastname}}</pre>
</v-col> </v-card>
<v-col></v-col> </v-col>
<v-col cols="3"> <v-col></v-col>
<v-card color="background" elevation="0"> <v-col cols="2"></v-col>
<pre><v-icon color="primary">mdi-account-box</v-icon>{{" " + user.firstname + " " +user.lastname}}</pre> <v-col></v-col>
</v-card> </v-row>
</v-col> </v-list-item-content>
<v-col></v-col> <v-list-item-action>
<v-col cols="2"> <v-speed-dial
</v-col> v-model="fab"
<v-col></v-col> transition="slide-x-reverse-transition"
</v-row> direction="left"
</v-list-item-content> open-on-hover
<v-list-item-action> >
<v-speed-dial <template v-slot:activator>
v-model="fab" <v-btn v-model="fab" color="background" elevation="0" dark fab>
transition="slide-x-reverse-transition" <v-icon v-if="fab">mdi-close</v-icon>
direction="left" <v-icon v-else>mdi-pencil</v-icon>
open-on-hover
>
<template v-slot:activator>
<v-btn v-model="fab" color="background" elevation="0" dark fab>
<v-icon v-if="fab">mdi-close</v-icon>
<v-icon v-else>mdi-pencil</v-icon>
</v-btn>
</template>
<v-btn fab dark small color="green" @click="$emit('edit-user', user.username)">
<v-icon>mdi-file-document-edit</v-icon>
</v-btn> </v-btn>
<v-btn fab dark small color="red" @click="$emit('del-user', user.username)"> </template>
<v-icon>mdi-delete</v-icon> <v-btn fab dark small color="green" @click="$emit('edit-user', user.username)">
</v-btn> <v-icon>mdi-file-document-edit</v-icon>
</v-speed-dial> </v-btn>
</v-list-item-action> <v-btn fab dark small color="red" @click="$emit('del-user', user.username)">
</v-list-item> <v-icon>mdi-delete</v-icon>
</v-card> </v-btn>
</div> </v-speed-dial>
</v-list-item-action>
</v-list-item>
</v-card>
</template> </template>
<script> <script>
@ -63,30 +56,9 @@ export default {
</script> </script>
<style scoped> <style scoped>
.time-record-item { .v-card {
background: #131313; border-color: #131313 !important;
padding: 10px; border-width: 3px !important;
border-bottom: 3px #272727 solid; border-radius: 10000px !important;
}
.del {
background: #ff0000;
color: #fff;
border: none;
padding: 5px 9px;
border-radius: 0%;
cursor: pointer;
float: right;
}
.edit {
background: #272727;
color: #fff;
border: none;
padding: 5px 9px;
border-radius: 0%;
cursor: pointer;
float: right;
margin: 0px;
} }
</style> </style>