Skip to content

Commit 7eab92f

Browse files
ismcagdasismcagdas
committed
#94: completed user pages.
1 parent da80c66 commit 7eab92f

File tree

7 files changed

+365
-64
lines changed

7 files changed

+365
-64
lines changed

‎src/AbpCompanyName.AbpProjectName.WebSpaAngular/AbpCompanyName.AbpProjectName.WebSpaAngular.csproj‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -357,6 +357,7 @@
357357
<Content Include="App\Main\views\layout\sidebar-user-area.js" />
358358
<Content Include="App\Main\views\layout\topbar.js" />
359359
<Content Include="App\Main\views\tenants\editModal.js" />
360+
<Content Include="App\Main\views\users\editModal.js" />
360361
<Content Include="App\Main\views\users\createModal.js" />
361362
<Content Include="App\Main\views\users\index.js" />
362363
<Content Include="App\Main\views\tenants\createModal.js" />
@@ -2749,6 +2750,7 @@
27492750
<Content Include="App\Main\views\layout\sidebar-footer.cshtml" />
27502751
<Content Include="App\Main\views\layout\right-sidebar.cshtml" />
27512752
<Content Include="App\Main\views\tenants\editModal.cshtml" />
2753+
<Content Include="App\Main\views\users\editModal.cshtml" />
27522754
<None Include="compilerconfig.json" />
27532755
<None Include="compilerconfig.json.defaults">
27542756
<DependentUpon>compilerconfig.json</DependentUpon>

‎src/AbpCompanyName.AbpProjectName.WebSpaAngular/App/Main/views/users/createModal.cshtml‎

Lines changed: 106 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,115 @@
1-
@using Abp.Authorization.Users
2-
<div>
3-
<form name="userCreateForm" role="form" novalidate class="form-validation">
4-
<div class="modal-header">
5-
<h4 class="modal-title">
6-
<span>@L("CreateNewUser")</span>
7-
</h4>
8-
</div>
9-
<div class="modal-body">
1+
<form id="frm_create_user" novalidate>
2+
<div class="modal-header">
3+
<button type="button" class="close" ng-click="vm.cancel()" aria-label="Close">
4+
<span aria-hidden="true">&times;</span>
5+
</button>
6+
<h4 class="modal-title">
7+
<span>@L("CreateNewUser")</span>
8+
</h4>
9+
</div>
10+
<div class="modal-body">
11+
<ul class="nav nav-tabs tab-nav-right" role="tablist">
12+
<li role="presentation" class="active"><a href="#user-details" data-toggle="tab">User Details</a></li>
13+
<li role="presentation"><a href="#user-roles" data-toggle="tab">User Roles</a></li>
14+
</ul>
15+
<div class="tab-content">
16+
<div role="tabpanel" class="tab-pane animated fadeIn active" id="user-details">
1017

11-
<div class="form-group">
12-
<label>@L("UserName")</label>
13-
<input class="form-control" type="text" name="TenancyName" ng-model="vm.user.userName" required maxlength="@AbpUserBase.MaxUserNameLength">
14-
</div>
18+
<div class="row clearfix" style="margin-top:10px;">
19+
<div class="col-sm-12">
20+
<div class="form-group form-float">
21+
<div class="form-line">
22+
<input id="username" type="text" name="UserName" ng-model="vm.user.userName" required maxlength="32" minlength="2" class="validate form-control">
23+
<label for="username" class="form-label">@L("UserName")</label>
24+
</div>
25+
</div>
26+
</div>
27+
</div>
1528

16-
<div class="form-group">
17-
<label>@L("Name")</label>
18-
<input type="text" name="Name" class="form-control" ng-model="vm.user.name" required maxlength="@AbpCompanyName.AbpProjectName.Authorization.Users.User.MaxNameLength">
19-
</div>
29+
<div class="row clearfix">
30+
<div class="col-sm-6">
31+
<div class="form-group form-float">
32+
<div class="form-line">
33+
<input id="name" type="text" name="Name" ng-model="vm.user.name" required maxlength="32" class="validate form-control">
34+
<label for="name" class="form-label">@L("Name")</label>
35+
</div>
36+
</div>
37+
</div>
38+
<div class="col-sm-6">
39+
<div class="form-group form-float">
40+
<div class="form-line">
41+
<input id="surname" type="text" name="Surname" ng-model="vm.user.surname" required maxlength="32" class="validate form-control">
42+
<label for="surname" class="form-label">@L("Surname")</label>
43+
</div>
44+
</div>
45+
</div>
46+
</div>
2047

21-
<div class="form-group">
22-
<label>@L("Surname")</label>
23-
<input type="text" name="Surname" class="form-control" ng-model="vm.user.surname" required maxlength="@AbpCompanyName.AbpProjectName.Authorization.Users.User.MaxSurnameLength">
24-
</div>
48+
<div class="row clearfix">
49+
<div class="col-sm-12">
50+
<div class="form-group form-float">
51+
<div class="form-line">
52+
<input id="email" type="email" name="EmailAddress" ng-model="vm.user.emailAddress" maxlength="256" class="validate form-control">
53+
<label for="email" class="form-label">@L("EmailAddress")</label>
54+
</div>
55+
</div>
56+
</div>
57+
</div>
2558

26-
<div class="form-group">
27-
<label>@L("EmailAddress")</label>
28-
<input type="email" name="EmailAddress" class="form-control" ng-model="vm.user.emailAddress" required maxlength="@AbpCompanyName.AbpProjectName.Authorization.Users.User.MaxEmailAddressLength">
29-
</div>
59+
<div class="row clearfix">
60+
<div class="col-sm-12">
61+
<div class="form-group form-float">
62+
<div class="form-line">
63+
<input id="password" type="password" name="Password" ng-model="vm.user.password" required maxlength="32" class="validate form-control">
64+
<label for="password" class="form-label">@L("Password")</label>
65+
</div>
66+
</div>
67+
</div>
68+
</div>
3069

31-
<div class="form-group">
32-
<label>@L("Password")</label>
33-
<input type="password" name="Password" class="form-control" ng-model="vm.user.password" maxlength="@AbpCompanyName.AbpProjectName.Authorization.Users.User.MaxPlainPasswordLength">
34-
</div>
70+
<div class="row clearfix">
71+
<div class="col-sm-12">
72+
<div class="form-group form-float">
73+
<div class="form-line">
74+
<input id="confirmpassword" type="password" name="ConfirmPassword" class="validate form-control" ng-model="vm.user.confirmPassword" equalTo="#password" data-msg-equalto="Please enter the same password again." required maxlength="32">
75+
<label for="confirmpassword" class="form-label">Confirm Password</label>
76+
</div>
77+
</div>
78+
</div>
79+
</div>
3580

36-
<div class="checkbox">
37-
<label>
38-
<input type="checkbox" name="IsActive" ng-model="vm.user.isActive" value="true"> @L("IsActive")
39-
</label>
81+
<div class="row clearfix">
82+
<div class="col-sm-12">
83+
<div class="form-group form-float">
84+
<div class="">
85+
<input id="isactive" type="checkbox" name="IsActive" ng-model="vm.user.isActive" checked class="form-control" />
86+
<label for="isactive" class="form-label">@L("IsActive")</label>
87+
</div>
88+
</div>
89+
</div>
90+
</div>
4091
</div>
4192

93+
<div role="tabpanel" class="tab-pane animated fadeIn" id="user-roles">
94+
<div class="row">
95+
<div class="col-sm-12 ">
96+
<div class="col-sm-6" ng-repeat="role in vm.roles">
97+
<input type="checkbox" name="role" value="{{role.name}}" title="{{role.description}}" class="filled-in" id="role-{{role.id}}" checked="checked" ng-model="role.isAssigned" />
98+
<label for="role-{{role.id}}" title="{{role.displayName}}">{{role.name}}</label>
99+
</div>
100+
</div>
101+
</div>
102+
</div>
42103
</div>
43-
<div class="modal-footer">
44-
<button type="button" class="btn btn-default" ng-click="vm.cancel()">@L("Cancel")</button>
45-
<button type="submit" class="btn btn-primary blue" ng-click="vm.save()" ng-disabled="userCreateForm.$invalid"><i class="fa fa-save"></i> <span>@L("Save")</span></button>
46-
</div>
47-
</form>
48-
</div>
104+
105+
</div>
106+
<div class="modal-footer">
107+
<button type="button" class="btn btn-default waves-effect" ng-click="vm.cancel()">
108+
@L("Cancel")
109+
</button>
110+
<button type="submit" class="btn btn-primary waves-effect" ng-click="vm.save()" ng-disabled="userCreateForm.$invalid">
111+
@L("Save")
112+
</button>
113+
</div>
114+
115+
</form>

‎src/AbpCompanyName.AbpProjectName.WebSpaAngular/App/Main/views/users/createModal.js‎

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,30 @@
88
isActive: true
99
};
1010

11+
vm.roles = [];
12+
13+
function getRoles() {
14+
userService.getRoles()
15+
.then(function (result) {
16+
console.log(result);
17+
vm.roles = result.data.items;
18+
});
19+
}
20+
1121
vm.save = function () {
12-
userService.createUser(vm.user)
22+
var assingnedRoles = [];
23+
24+
for (var i = 0; i < vm.roles.length; i++) {
25+
var role = vm.roles[i];
26+
if (!role.isAssigned) {
27+
continue;
28+
}
29+
30+
assingnedRoles.push(role.name);
31+
}
32+
33+
vm.user.roleNames = assingnedRoles;
34+
userService.create(vm.user)
1335
.then(function () {
1436
abp.notify.info(App.localize('SavedSuccessfully'));
1537
$uibModalInstance.close();
@@ -19,6 +41,8 @@
1941
vm.cancel = function () {
2042
$uibModalInstance.dismiss({});
2143
};
44+
45+
getRoles();
2246
}
2347
]);
2448
})();

‎src/AbpCompanyName.AbpProjectName.WebSpaAngular/App/Main/views/users/editModal.cshtml‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
<form id="frm_edit_user" novalidate>
2+
<div class="modal-header">
3+
<button type="button" class="close" ng-click="vm.close()" aria-label="Close">
4+
<span aria-hidden="true">&times;</span>
5+
</button>
6+
<h4 class="modal-title">
7+
<span>@L("EditUser")</span>
8+
</h4>
9+
</div>
10+
<div class="modal-body">
11+
<uib-tabset class="tab-container tabbable-line">
12+
<uib-tab heading="User Details">
13+
<div class="row clearfix" style="margin-top: 10px;">
14+
<div class="col-sm-12">
15+
<div class="form-group form-float">
16+
<div class="form-line">
17+
<input id="username" type="text" name="UserName" ng-model="vm.user.userName" required maxlength="32" minlength="2" class="validate form-control">
18+
<label for="username" class="form-label">@L("UserName")</label>
19+
</div>
20+
</div>
21+
</div>
22+
</div>
23+
24+
<div class="row clearfix">
25+
<div class="col-sm-6">
26+
<div class="form-group form-float">
27+
<div class="form-line">
28+
<input id="name" type="text" name="Name" ng-model="vm.user.name" required maxlength="32" class="validate form-control">
29+
<label for="name" class="form-label">@L("Name")</label>
30+
</div>
31+
</div>
32+
</div>
33+
<div class="col-sm-6">
34+
<div class="form-group form-float">
35+
<div class="form-line">
36+
<input id="surname" type="text" name="Surname" ng-model="vm.user.surname" required maxlength="32" class="validate form-control">
37+
<label for="surname" class="form-label">@L("Surname")</label>
38+
</div>
39+
</div>
40+
</div>
41+
</div>
42+
43+
<div class="row clearfix">
44+
<div class="col-sm-12">
45+
<div class="form-group form-float">
46+
<div class="form-line">
47+
<input id="email" type="email" name="EmailAddress" ng-model="vm.user.emailAddress" maxlength="256" class="validate form-control">
48+
<label for="email" class="form-label">@L("EmailAddress")</label>
49+
</div>
50+
</div>
51+
</div>
52+
</div>
53+
54+
<div class="row clearfix">
55+
<div class="col-sm-12">
56+
<div class="form-group form-float">
57+
<div class="">
58+
<input id="isactive" type="checkbox" name="IsActive" ng-model="vm.user.isActive" checked class="form-control" />
59+
<label for="isactive" class="form-label">@L("IsActive")</label>
60+
</div>
61+
</div>
62+
</div>
63+
</div>
64+
</uib-tab>
65+
<uib-tab heading="User Roles">
66+
<div class="row">
67+
<div class="col-sm-12 ">
68+
<div class="col-sm-6" ng-repeat="role in vm.roles">
69+
<input type="checkbox" name="role" value="{{role.normalizedName}}" title="{{role.description}}" class="filled-in" id="role-{{role.id}}" ng-model="role.isAssigned" />
70+
<label for="role-{{role.id}}" title="{{role.displayName}}">{{role.name}}</label>
71+
</div>
72+
</div>
73+
</div>
74+
</uib-tab>
75+
</uib-tabset>
76+
</div>
77+
<div class="modal-footer">
78+
<button type="button" class="btn btn-default waves-effect" ng-click="vm.cancel()">
79+
@L("Cancel")
80+
</button>
81+
<button type="submit" class="btn btn-primary waves-effect" ng-click="vm.save()" ng-disabled="userCreateForm.$invalid">
82+
@L("Save")
83+
</button>
84+
</div>
85+
</form>

‎src/AbpCompanyName.AbpProjectName.WebSpaAngular/App/Main/views/users/editModal.js‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
(function () {
2+
angular.module('app').controller('app.views.users.editModal', [
3+
'$scope', '$uibModalInstance', 'abp.services.app.user', 'id',
4+
function ($scope, $uibModalInstance, userService, id) {
5+
var vm = this;
6+
7+
vm.user = {
8+
isActive: true
9+
};
10+
11+
vm.roles = [];
12+
13+
var setAssignedRoles = function (user, roles) {
14+
for (var i = 0; i < roles.length; i++) {
15+
var role = roles[i];
16+
role.isAssigned = $.inArray(role.name, user.roles) >= 0;
17+
}
18+
}
19+
20+
var init = function () {
21+
userService.getRoles()
22+
.then(function (result) {
23+
vm.roles = result.data.items;
24+
25+
userService.get({ id: id })
26+
.then(function (result) {
27+
vm.user = result.data;
28+
setAssignedRoles(vm.user, vm.roles);
29+
});
30+
});
31+
}
32+
33+
vm.save = function () {
34+
var assingnedRoles = [];
35+
36+
for (var i = 0; i < vm.roles.length; i++) {
37+
var role = vm.roles[i];
38+
if (!role.isAssigned) {
39+
continue;
40+
}
41+
42+
assingnedRoles.push(role.name);
43+
}
44+
45+
vm.user.roleNames = assingnedRoles;
46+
userService.update(vm.user)
47+
.then(function () {
48+
abp.notify.info(App.localize('SavedSuccessfully'));
49+
$uibModalInstance.close();
50+
});
51+
};
52+
53+
vm.cancel = function () {
54+
$uibModalInstance.dismiss({});
55+
};
56+
57+
init();
58+
}
59+
]);
60+
})();

0 commit comments

Comments
 (0)