Browse Source

Add AdminUsersCreate

pull/3/head
Tovi Jaeschke-Rogers 3 years ago
parent
commit
b8a76f8a9f
5 changed files with 192 additions and 9 deletions
  1. +8
    -0
      Api/Users.go
  2. +165
    -0
      Frontend/vue/src/components/admin/users/AdminUsersCreate.vue
  3. +1
    -2
      Frontend/vue/src/components/admin/users/AdminUsersForm.vue
  4. +9
    -7
      Frontend/vue/src/components/admin/users/AdminUsersList.vue
  5. +9
    -0
      Frontend/vue/src/router/index.js

+ 8
- 0
Api/Users.go View File

@ -105,6 +105,7 @@ func createUser(w http.ResponseWriter, r *http.Request) {
var ( var (
userData Models.User userData Models.User
requestBody []byte requestBody []byte
returnJson []byte
err error err error
) )
@ -157,8 +158,15 @@ func createUser(w http.ResponseWriter, r *http.Request) {
return return
} }
returnJson, err = json.MarshalIndent(userData, "", " ")
if err != nil {
Util.JsonReturn(w, 500, "An error occured")
return
}
// Return updated json // Return updated json
w.WriteHeader(http.StatusOK) w.WriteHeader(http.StatusOK)
w.Write(returnJson)
} }
func updateUser(w http.ResponseWriter, r *http.Request) { func updateUser(w http.ResponseWriter, r *http.Request) {


+ 165
- 0
Frontend/vue/src/components/admin/users/AdminUsersCreate.vue View File

@ -0,0 +1,165 @@
<template>
<div id="admin-page-container">
<admin-navbar/>
<section class="container mt-5">
<div class="row mb-3">
<div class="col-12">
<div class="page-nav-container">
<div class="btn-group" role="group">
<button
type="button"
class="btn btn-rounded"
:class="tab === 'details' ? 'btn-dark' : 'btn-outline-dark'"
>
User Details
</button>
</div>
</div>
</div>
</div>
<div class="card shadow-2-strong card-registration">
<div class="card-body p-4 p-md-5" v-if="tab === 'details'">
<h3 class="mb-4 pb-2 pb-md-0 mb-md-5">Create User</h3>
<Form @submit="createUser" v-slot="{ meta, errors }">
<div class="row">
<div class="col-md-6 mb-4">
<div class="form-outline">
<Field
v-model="user.first_name"
type="text"
id="firstName"
name="First Name"
class="form-control form-control-lg"
:class="errors['First Name'] ? 'invalid' : ''"
rules="required"/>
<label v-if="!errors['First Name']" class="form-label" for="firstName">First Name</label>
<ErrorMessage name="First Name" as="label" class="form-label" for="firstName"/>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="form-outline">
<Field
v-model="user.last_name"
type="text"
id="lastName"
name="Last Name"
class="form-control form-control-lg"
:class="errors['Last Name'] ? 'invalid' : ''"
rules="required"/>
<label v-if="!errors['Last Name']" class="form-label" for="lastName">Last Name</label>
<ErrorMessage name="Last Name" as="label" class="form-label" for="lastName"/>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 mb-4 pb-2">
<div class="form-outline">
<Field
v-model="user.email"
type="email"
id="email"
name="Email"
class="form-control form-control-lg"
:class="errors['Email'] ? 'invalid' : ''"
rules="required|email"/>
<label v-if="!errors['Email']" class="form-label" for="email">Email</label>
<ErrorMessage name="Email" as="label" class="form-label" for="email"/>
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-md-6 mb-4 pb-2">
<div class="form-outline">
<Field
v-model="user.password"
type="password"
id="password"
name="Password"
class="form-control form-control-lg"
:class="errors['Password'] ? 'invalid' : ''"
rules="required|min:8"/>
<label v-if="!errors['Password']" class="form-label" for="password">Password</label>
<ErrorMessage name="Password" as="label" class="form-label" for="email"/>
</div>
</div>
<div class="col-12 col-md-6 mb-4 pb-2">
<div class="form-outline">
<Field
v-model="user.confirm_password"
type="password"
id="confirm_password"
name="Confirm Password"
class="form-control form-control-lg"
:class="errors['Confirm Password'] ? 'invalid' : ''"
rules="required|min:8"/>
<label v-if="!errors['Confirm Password']" class="form-label" for="confirm_password">Confirm Password</label>
<ErrorMessage name="Confirm Password" as="label" class="form-label" for="confirm_password"/>
</div>
</div>
</div>
<div class="mt-2 pt-2 right-align">
<button :disabled="!meta.touched || !meta.valid" class="btn btn-primary btn-md" type="submit">
Create
</button>
</div>
</Form>
</div>
</div>
</section>
</div>
</template>
<script>
import AdminNavbar from '@/components/admin/AdminNavbar'
import { Form, Field, ErrorMessage } from 'vee-validate'
export default {
data() {
return {
tab: 'details',
user: {
first_name: null,
last_name: null,
email: null,
password: null,
confirm_password: null,
}
}
},
components: {
AdminNavbar,
Form,
Field,
ErrorMessage,
},
methods: {
async createUser () {
try {
let response = await this.axios.post(
'/admin/user',
this.user,
)
if (response.status === 200) {
this.$router.push({ name: 'AdminUsersForm', params: { id: response.data.id } })
this.$toast.success('Successfully created user details.');
}
} catch (error) {
this.$toast.error('An error occured');
}
},
}
}
</script>

+ 1
- 2
Frontend/vue/src/components/admin/users/AdminUsersForm.vue View File

@ -91,8 +91,7 @@
v-model="user.last_login" v-model="user.last_login"
format="dd/MM/yyyy, HH:mm" format="dd/MM/yyyy, HH:mm"
disabled="disabled" disabled="disabled"
id="last_login"
:month-year-component="monthYear"/>
id="last_login"/>
<label class="form-label" for="last_login">Last Login</label> <label class="form-label" for="last_login">Last Login</label>
</div> </div>
</div> </div>


+ 9
- 7
Frontend/vue/src/components/admin/users/AdminUsersList.vue View File

@ -29,13 +29,15 @@
<div class="col-sm-6 float-right col-3"> <div class="col-sm-6 float-right col-3">
<div class="btn-group float-right" role="group"> <div class="btn-group float-right" role="group">
<button
type="button"
class="btn btn-rounded btn-dark"
>
<!-- TODO: Change this to + sign on small screens -->
Add User
</button>
<router-link :to="{ name: 'AdminUsersCreate' }">
<button
type="button"
class="btn btn-rounded btn-dark"
>
<!-- TODO: Change this to + sign on small screens -->
Add User
</button>
</router-link>
</div> </div>
</div> </div>
</div> </div>


+ 9
- 0
Frontend/vue/src/router/index.js View File

@ -3,6 +3,7 @@ import HelloWorld from "@/components/HelloWorld.vue";
import AdminLogin from "@/components/admin/AdminLogin.vue"; import AdminLogin from "@/components/admin/AdminLogin.vue";
import AdminSignup from "@/components/admin/AdminSignup.vue"; import AdminSignup from "@/components/admin/AdminSignup.vue";
import AdminUsersList from "@/components/admin/users/AdminUsersList.vue"; import AdminUsersList from "@/components/admin/users/AdminUsersList.vue";
import AdminUsersCreate from "@/components/admin/users/AdminUsersCreate.vue";
import AdminUsersForm from "@/components/admin/users/AdminUsersForm.vue"; import AdminUsersForm from "@/components/admin/users/AdminUsersForm.vue";
import admin from '@/store/admin/index.js' import admin from '@/store/admin/index.js'
@ -31,6 +32,14 @@ const routes = [
requiresAuth: true, requiresAuth: true,
}, },
}, },
{
path: '/admin/users/new',
name: 'AdminUsersCreate',
component: AdminUsersCreate,
meta: {
requiresAuth: true,
},
},
{ {
path: '/admin/users/:id', path: '/admin/users/:id',
name: 'AdminUsersForm', name: 'AdminUsersForm',


Loading…
Cancel
Save