Skip to content

Commit

Permalink
Adding the user profile component
Browse files Browse the repository at this point in the history
  • Loading branch information
@nWidart
nWidart committed Oct 13, 2017
1 parent cb6aa25 commit cb5a8cc
Show file tree
Hide file tree
Showing 8 changed files with 3,686 additions and 2,954 deletions.
7 changes: 7 additions & 0 deletions Modules/User/Assets/js/UserRoutes.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import RoleTable from './components/RoleTable.vue';
import RoleForm from './components/RoleForm.vue';
import UserTable from './components/UserTable.vue';
import UserForm from './components/UserForm.vue';
import UserProfile from './components/UserProfile.vue';


const locales = window.AsgardCMS.locales;
Expand Down Expand Up @@ -55,4 +56,10 @@ export default [
pageTitle: 'title.edit-user',
},
},
// Account routes
{
path: '/account/profile',
name: 'admin.user.users.account',
component: UserProfile,
},
];
141 changes: 141 additions & 0 deletions Modules/User/Assets/js/components/UserProfile.vue
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,141 @@
<template>
<div>
<div class="content-header">
<h1>
{{ trans('users.title.edit-profile') }}
</h1>
<el-breadcrumb separator="/">
<el-breadcrumb-item>
<a href="/backend">{{ trans('core.breadcrumb.home') }}</a>
</el-breadcrumb-item>
<el-breadcrumb-item :to="{name: 'admin.user.users.profile'}">{{ trans('users.breadcrumb.edit-profile') }}
</el-breadcrumb-item>
</el-breadcrumb>
</div>

<el-form ref="form"
:model="user"
label-width="120px"
label-position="top"
v-loading.body="loading"
@keydown="form.errors.clear($event.target.name);">
<div class="row">
<div class="col-md-12">
<div class="box box-primary">
<div class="box-body">
<el-tabs>
<el-tab-pane :label="trans('users.tabs.data')">
<span slot="label"
:class="{'error' : form.errors.any()}">
{{ trans('users.tabs.data') }}
</span>
<el-form-item :label="trans('users.form.first-name')"
:class="{'el-form-item is-error': form.errors.has('first_name') }">
<el-input v-model="user.first_name"></el-input>
<div class="el-form-item__error" v-if="form.errors.has('first_name')"
v-text="form.errors.first('first_name')"></div>
</el-form-item>
<el-form-item :label="trans('users.form.last-name')"
:class="{'el-form-item is-error': form.errors.has('last_name') }">
<el-input v-model="user.last_name"></el-input>
<div class="el-form-item__error" v-if="form.errors.has('last_name')"
v-text="form.errors.first('last_name')"></div>
</el-form-item>
<el-form-item :label="trans('users.form.email')"
:class="{'el-form-item is-error': form.errors.has('email') }">
<el-input v-model="user.email"></el-input>
<div class="el-form-item__error" v-if="form.errors.has('email')"
v-text="form.errors.first('email')"></div>
</el-form-item>
</el-tab-pane>
<el-tab-pane :label="trans('users.tabs.new password')" v-if="! user.is_new">
<h4>{{ trans('users.new password setup') }}</h4>
<el-form-item :label="trans('users.form.password')"
:class="{'el-form-item is-error': form.errors.has('password') }">
<el-input v-model="user.password"
type="password"></el-input>
<div class="el-form-item__error" v-if="form.errors.has('password')"
v-text="form.errors.first('password')"></div>
</el-form-item>
<el-form-item :label="trans('users.form.password-confirmation')"
:class="{'el-form-item is-error': form.errors.has('password_confirmation') }">
<el-input v-model="user.password_confirmation"
type="password"></el-input>
<div class="el-form-item__error" v-if="form.errors.has('password_confirmation')"
v-text="form.errors.first('password_confirmation')"></div>
</el-form-item>
</el-tab-pane>
</el-tabs>
</div>
<div class="box-footer">
<el-form-item>
<el-button type="primary" @click="onSubmit()" :loading="loading">
{{ trans('core.save') }}
</el-button>
</el-form-item>
</div>
</div>
</div>
</div>
</el-form>
</div>
</template>

<script>
import axios from 'axios';
import Form from 'form-backend-validation';
export default {
props: {
locales: { default: null },
},
data() {
return {
user: {
first_name: '',
last_name: '',
permissions: {},
roles: {},
is_new: false,
},
roles: {},
form: new Form(),
loading: false,
};
},
methods: {
onSubmit() {
this.form = new Form(this.user);
this.loading = true;
this.form.post(route('api.account.profile.update'))
.then((response) => {
this.loading = false;
this.$message({
type: 'success',
message: response.message,
});
})
.catch((error) => {
console.log(error);
this.loading = false;
this.$notify.error({
title: 'Error',
message: 'There are some errors in the form.',
});
});
},
fetchUser() {
this.loading = true;
axios.get(route('api.account.profile.find-current-user'))
.then((response) => {
this.loading = false;
this.user = response.data.data;
});
},
},
mounted() {
this.fetchUser();
},
};
</script>
4 changes: 1 addition & 3 deletions Modules/User/Http/Controllers/Admin/Account/ProfileController.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,7 @@ public function __construct(UserRepository $user, Authentication $auth)
*/
public function edit()
{
$user = $this->auth->user();

return view('user::admin.account.profile.edit', compact('user'));
return view('user::admin.account.profile.edit');
}

/**
Expand Down
44 changes: 44 additions & 0 deletions Modules/User/Http/Controllers/Api/ProfileController.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
<?php

namespace Modules\User\Http\Controllers\Api;

use Illuminate\Routing\Controller;
use Modules\User\Contracts\Authentication;
use Modules\User\Http\Requests\UpdateProfileRequest;
use Modules\User\Repositories\UserRepository;
use Modules\User\Transformers\UserProfileTransformer;

class ProfileController extends Controller
{
/**
* @var Authentication
*/
private $auth;
/**
* @var UserRepository
*/
private $user;

public function __construct(Authentication $auth, UserRepository $user)
{
$this->auth = $auth;
$this->user = $user;
}

public function findCurrentUser()
{
return new UserProfileTransformer($this->auth->user());
}

public function update(UpdateProfileRequest $request)
{
$user = $this->auth->user();

$this->user->update($user, $request->all());

return response()->json([
'errors' => false,
'message' => trans('user::messages.profile updated'),
]);
}
}
11 changes: 11 additions & 0 deletions Modules/User/Http/apiRoutes.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,17 @@
]);
});

$router->group(['prefix' => '/account'], function (Router $router) {
$router->get('profile', [
'as' => 'api.account.profile.find-current-user',
'uses' => 'ProfileController@findCurrentUser',
]);
$router->post('profile', [
'as' => 'api.account.profile.update',
'uses' => 'ProfileController@update',
]);
});

$router->get('permissions', [
'as' => 'api.user.permissions.index',
'uses' => 'PermissionsController@index',
Expand Down
69 changes: 0 additions & 69 deletions Modules/User/Resources/views/admin/account/profile/edit.blade.php
View file
Original file line number Diff line number Diff line change
@@ -1,76 +1,7 @@
@extends('layouts.master')

@section('content-header')
<h1>
{{ trans('user::users.title.edit-profile') }}
</h1>
<ol class="breadcrumb">
<li><a href="{{ route('dashboard.index') }}"><i class="fa fa-dashboard"></i> {{ trans('core::core.breadcrumb.home') }}</a></li>
<li class="active">{{ trans('user::users.breadcrumb.edit-profile') }}</li>
</ol>
@stop

@section('content')
{!! Form::open(['route' => ['admin.account.profile.update'], 'method' => 'put']) !!}
<div class="row">
<div class="col-md-12">
<div class="nav-tabs-custom">
<ul class="nav nav-tabs">
<li class="active"><a href="#account_tab" data-toggle="tab">{{ trans('user::users.tabs.data') }}</a></li>
<li class=""><a href="#password_tab" data-toggle="tab">{{ trans('user::users.tabs.new password') }}</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="account_tab">
<div class="box-body">
<div class="row">
<div class="col-md-4">
{{ Form::normalInput('first_name', trans('user::users.form.first-name'), $errors, $user) }}
</div>
<div class="col-md-4">
{{ Form::normalInput('last_name', trans('user::users.form.last-name'), $errors, $user) }}
</div>
<div class="col-md-4">
{{ Form::normalInputOfType('email', 'email', trans('user::users.form.email'), $errors, $user) }}
</div>
</div>
</div>
</div>
<div class="tab-pane" id="password_tab">
<div class="box-body">
<h4>{{ trans('user::users.new password setup') }}</h4>
<div class="row">
<div class="col-md-6">
{{ Form::normalInputOfType('password', 'password', trans('user::users.form.new password'), $errors) }}
</div>
<div class="col-md-6">
{{ Form::normalInputOfType('password', 'password_confirmation', trans('user::users.form.new password confirmation'), $errors) }}
</div>
</div>
</div>
</div>
<div class="box-footer">
<button type="submit" class="btn btn-primary btn-flat">{{ trans('core::core.button.update') }}</button>
</div>
</div>
</div>
</div>
</div>
{!! Form::close() !!}
@stop
@section('footer')
<a data-toggle="modal" data-target="#keyboardShortcutsModal"><i class="fa fa-keyboard-o"></i></a> &nbsp;
@stop
@section('shortcuts')
@stop

@push('js-stack')
<script>
$( document ).ready(function() {
$('[data-toggle="tooltip"]').tooltip();
$('input[type="checkbox"].flat-blue, input[type="radio"].flat-blue').iCheck({
checkboxClass: 'icheckbox_flat-blue',
radioClass: 'iradio_flat-blue'
});
});
</script>
@endpush
19 changes: 19 additions & 0 deletions Modules/User/Transformers/UserProfileTransformer.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<?php

namespace Modules\User\Transformers;

use Illuminate\Http\Resources\Json\Resource;

class UserProfileTransformer extends Resource
{
public function toArray($request)
{
return [
'id' => $this->id,
'first_name' => $this->first_name,
'last_name' => $this->last_name,
'email' => $this->email,
'created_at' => $this->created_at,
];
}
}
Loading

0 comments on commit cb5a8cc

Please sign in to comment.