updates to users

This commit is contained in:
Kode 2020-02-22 15:30:17 +00:00
parent de0ede3885
commit 8b2c2e0dac
10 changed files with 126 additions and 37 deletions

19
package-lock.json generated
View File

@ -3455,6 +3455,16 @@
"integrity": "sha512-Phlt0plgpIIBOGTT/ehfFnbNlfsDEiqmzE2KRXoX1bLIlir4X/MR+zSyBEkL05ffWgnRSf/DXv+WrUAVr93/ow==",
"dev": true
},
"bindings": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
"integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
"dev": true,
"optional": true,
"requires": {
"file-uri-to-path": "1.0.0"
}
},
"block-stream": {
"version": "0.0.9",
"resolved": "https://registry.npmjs.org/block-stream/-/block-stream-0.0.9.tgz",
@ -6868,6 +6878,13 @@
"schema-utils": "^2.5.0"
}
},
"file-uri-to-path": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
"integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
"dev": true,
"optional": true
},
"filesize": {
"version": "3.6.1",
"resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz",
@ -16249,6 +16266,7 @@
"dev": true,
"optional": true,
"requires": {
"bindings": "^1.5.0",
"nan": "^2.12.1",
"node-pre-gyp": "*"
},
@ -17541,6 +17559,7 @@
"dev": true,
"optional": true,
"requires": {
"bindings": "^1.5.0",
"nan": "^2.12.1",
"node-pre-gyp": "*"
},

View File

@ -1,27 +1,20 @@
<template>
<div class="userdetails fit" style="background: #fcfcfc;">
<q-form @submit="onSubmit" class="fit">
<div class="popup-header">
<div class="text-h6">User</div>
<div class="actions">
<q-btn type="submit" flat>
<q-icon name="save" />
Save
</q-btn>
<q-btn flat @click="closeCreate">
<q-icon name="block" />
Cancel
</q-btn>
</div>
</div>
<q-form @submit="onSubmit" class="fit userform">
<q-scroll-area
style="height: calc(100% - 150px);"
style="height: 100%;"
>
<q-card-section class="q-pt-none">
<div id="create" class="create">
<q-file outlined v-model="avatar">
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<div class="input">
<q-input
outlined
@ -56,9 +49,7 @@
</q-card-section>
</q-scroll-area>
<div class="popup-header">
<div class="text-h6"></div>
<div class="actions">
<div class="useractions" :class="{ active: actions }">
<q-btn type="submit" flat>
<q-icon name="save" />
Save
@ -67,7 +58,7 @@
<q-icon name="block" />
Cancel
</q-btn>
</div>
</div>
</q-form>
</div>
@ -86,18 +77,22 @@ export default {
computed: {
user () {
return this.$store.state.users.edit
},
create () {
return this.$store.state.users.create
}
},
data () {
return {
id: null,
icon: null,
avatar: null,
email: null,
username: null,
password: '',
totp: null,
isPwd: true
isPwd: true,
actions: false
}
},
@ -105,25 +100,35 @@ export default {
user: function (newdata, olddata) {
// console.log(newdata)
this.id = newdata.id
this.icon = newdata.icon
this.avatar = newdata.avatar
this.email = newdata.email
this.username = newdata.username
this.password = newdata.password
this.totp = newdata.totp
},
create: function (newdata, olddata) {
if (newdata === true) {
setTimeout(function () {
this.actions = true
}.bind(this), 350)
} else {
this.actions = false
}
}
},
methods: {
async onSubmit (evt) {
/* const formData = new FormData()
const formData = new FormData()
formData.append('email', this.email)
formData.append('username', this.username)
formData.append('password', this.password) */
const formData = {
formData.append('password', this.password)
formData.append('avatar', this.avatar)
/* const formData = {
email: this.email,
username: this.username,
password: this.password
}
} */
const data = {
id: this.id,
user: formData
@ -165,6 +170,37 @@ export default {
}
</script>
<style lang="scss">
.useractions {
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 80px;
background: #724c7a;
transform: translateX(80px);
transition: all 0.3s;
color: white;
padding: 10px 0;
&.active {
transform: translateX(0);
}
button {
padding: 10px 0;
.q-btn__content {
font-size: 11px;
i {
font-size: 28px;
}
}
}
}
.userform {
padding: 0 80px 0 0;
overflow: hidden;
}
.create {
padding: 30px 0;
}
.userdetails {
position: absolute;
top: 0;

View File

@ -8,7 +8,9 @@
<div class="details">
<div class="name">{{ this.user.username }}</div>
<span class="email">{{ this.user.email }}</span>
<span>2FA</span>
<div class="extra">
<span class="mfa"><span>2FA</span><q-icon class="mfaicon" :name="mfaicon"></q-icon></span>
</div>
</div>
<div class="actions">
<q-btn size="12px" unelevated icon="more_vert" @click="showBack()"></q-btn>
@ -30,7 +32,9 @@ export default {
return {
edit: false,
showback: false,
icon: 'https://apps.heimdall.site/img/heimdall-logo-white.svg'
icon: 'https://apps.heimdall.site/img/heimdall-logo-white.svg',
// mfaicon: 'check_box_outline_blank'
mfaicon: 'check_box'
}
},
methods: {
@ -56,6 +60,8 @@ export default {
padding: 20px;
box-shadow: 0 0 10px #0000000f;
border-radius: 4px;
border-top: 1px solid #fdfdfd;
border-bottom: 1px solid #d2d2d2;
.icon {
margin-right: 20px;
img {
@ -78,8 +84,26 @@ export default {
padding: 0 15px 0 0;
font-weight: bold;
}
.extra {
margin-top: 5px;
}
.mfa {
background: #86658d;
padding: 1px 5px;
border-radius: 4px;
color: #f3f4f4;
display: inline-flex;
align-items: center;
font-weight: bold;
text-transform: uppercase;
}
.mfaicon {
font-size: 17px;
margin-left: 4px;
}
.email {
font-size: 12px;
color: #9c9c9c;
}
}

View File

@ -2,6 +2,7 @@
$grey1: #e6e8e8;
$darkborder: #cbccce;
$brand: #5e3267;
.text-brand {
color: #5e3267;
@ -9,6 +10,12 @@ $darkborder: #cbccce;
.bg-brand {
background: #5e3267;
}
.text-brand2 {
color: #724c7a;
}
.bg-brand2 {
background: #724c7a;
}
body {
color: #585858;
@ -23,7 +30,7 @@ h1 {
background-image: url('../statics/bg1.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position: bottom;
background-position: center;
}
.q-layout__section--marginal {
background: #19465073;

View File

@ -9,6 +9,7 @@ export default {
username_yes: 'Yes (Select from list of users)',
username_no: 'No (Username must by typed)',
select_user: 'Select user',
email: 'Email',
username: 'Username',
password: 'Password',
failed: 'Action failed',

View File

@ -42,7 +42,7 @@
<menu-list></menu-list>
</q-drawer>
<q-page-container id="app">
<q-page-container :style="background" id="app">
<router-view :filter="filter" />
</q-page-container>
</q-layout>
@ -72,7 +72,9 @@ export default {
return {
leftDrawerOpen: false,
version: version,
filter: null
filter: null,
// background: '',
background: 'background-image: url(statics/bg/bg11.jpg)'
}
},

View File

@ -15,7 +15,7 @@
User Management
</q-toolbar-title>
<q-btn size="15px" style="margin-left: 20px;" unelevated color="brand" @click="createNew">Add New</q-btn>
<q-btn size="15px" style="margin-left: 20px;" unelevated color="brand2" @click="createNew">Add New</q-btn>
<div class="searchbox">
<q-select
borderless

View File

@ -10,7 +10,7 @@
<div class="list-items">
<div class="no-items" v-if="applications.length < 1">
{{ this.$t('no_apps') }}
<q-btn style="margin-top:30px;" @click="create = true" unelevated color="cyan-8">Add New</q-btn>
<q-btn style="margin-top:30px;" @click="create = true" unelevated color="brand">Add New</q-btn>
</div>
<app-item
v-else

BIN
src/statics/bg/bg11.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 MiB

View File

@ -27,16 +27,16 @@ export function save (context, data) {
console.log(data)
return axios
.post(process.env.BACKEND_LOCATION + 'users', data.user, {
/* headers: {
headers: {
'Content-Type': 'multipart/form-data'
} */
}
})
} else {
return axios
.put(process.env.BACKEND_LOCATION + 'users', data.user, {
/* headers: {
headers: {
'Content-Type': 'multipart/form-data'
} */
}
})
}
}