Sineedge/sparqsineedge
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

User profile and Mat Field Width UI

Browse Source
This commit is contained in:
saravanakumarkandasami 2018-11-08 18:08:39 +05:30
parent 6f9f9d173e
commit 3487cf012a
6 changed files with 105 additions and 194 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ng6-seed/src/app/layouts/admin/admin-layout.component.ts
View File

@ -64,7 +64,7 @@ export class AdminLayoutComponent implements OnInit, OnDestroy {
}
let users= {
'userid':this.currentUser.userid,
'entityid':this.currentUser.fk_entity_id,
'entityid':this.currentUser.fk_entity_type_id,
'profilepic':this.currentUser.profilepic
}
this.users.getprofilepic(users).subscribe(res=>{

4
ng6-seed/src/app/settings/entity/entity-edit/entity.edit.component.html
View File

@ -193,13 +193,13 @@
<div>
<div fxLayout="row wrap" fxLayout.xs="column" fxLayoutGap="2%" fxLayoutAlign="center center">
<div fxFlex="30%">
<mat-form-field class="ml-xs">
<mat-form-field class="ml-xs" style="width:100%">
<input matInput placeholder="Entity Full Name" formControlName="full_name">
<mat-error *ngIf="submitted && f.full_name.hasError('required')" class="mat-text-warn">You must Include Entity Full Name.</mat-error>
</mat-form-field>
</div>
<div fxFlex="30%">
<mat-form-field class="ml-xs">
<mat-form-field class="ml-xs" style="width:100%">
<input matInput placeholder="Entity Short Name" formControlName="short_name">
<mat-error *ngIf="submitted && f.short_name.hasError('required')" class="mat-text-warn">You must Include Entity Short Name.</mat-error>
</mat-form-field>

5
ng6-seed/src/app/settings/users/register/register.component.html
View File

@ -149,17 +149,12 @@
</mat-form-field>
</div>
</mat-card-content>
</mat-card>
</div>
</div>
</mat-card-content>
<hr>
<mat-card-actions style="text-align:right;">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Reset" matTooltipPosition="above" type="reset"><mat-icon>settings_backup_restore</mat-icon></button>

3
ng6-seed/src/app/settings/users/register/register.component.scss
View File

@ -8,4 +8,7 @@
.hoverdp:hover mat-icon{
display:block;
}
mat-form-field {
width:20%;
}

133
ng6-seed/src/app/settings/users/user-profile/user-profile-component.html
View File

@ -1,130 +1,43 @@
<mat-card>
<mat-card-content>
<div class="user-profile relative">
<div class="profile-cover">
</div>
<div class="">
<!-- <div fxLayout="row" fxLayoutWrap="wrap" class="profile-w">
<div fxFlex.gt-sm="25" fxFlex.gt-xs="25" fxFlex="20">
</div>
<div fxFlex.gt-sm="50" fxFlex.gt-xs="50" fxFlex="80" class="user-links">
<ul class="profile-menu">
<li><a href="">Tweets<span class="block text-lg-center">217</span></a></li>
<li><a href="">Followings<span class="block text-lg-center">89</span></a></li>
<li><a href="">Followers<span class="block text-lg-center">78,6790</span></a></li>
<li><a href="">Likes<span class="block text-lg-center">7</span></a></li>
<li><a href="">Moments<span class="block text-lg-center">0</span></a></li>
</ul>
</div>
<div fxFlex.gt-sm="25" fxFlex.gt-xs="25" fxFlex="100" class="align-self-center">
<button type="button" class="UserActions-editButton edit-button EdgeButton EdgeButton--tertiary" data-scribe-element="profile_edit_button">
<span class="button-text">Edit profile</span>
</button>
</div>
</div> -->
<div fxLayout="row" fxLayoutWrap="wrap">
<div fxFlex.gt-sm="25" fxFlex.gt-xs="50" fxFlex="100" class="relative">
<div class="profile-avatar" style="margin-left: 39%;margin-top:-12%;">
<img [src]="profileurl ||''" width="200" height="200" alt="user">
<img [src]="profileurl || 'https://image.ibb.co/mGjZB9/usernew.png'" width="200" height="200" alt="user">
</div>
<div class="profile-info">
<!-- <h3 class="profile-name"><strong>{{userDetails.user_full_name}}</strong></h3>
<span class="user-name">{{userDetails.email}}</span>
<span class="user-name">{{userDetails.mobile_no}}</span>
<span class="pro-des">
</span>
<span><i class="fa fa-map-marker"></i> {{userDetails.addressline1}} {{userDetails.addressline2}}</span>
<span><i class="fa fa-calendar"></i>{{userDetails.addressline3}} {{userDetails.state_name}} - {{userDetails.pincode}}</span>
<span>{{userDetails.createdon | date:'dd MMM yyyy'}}</span> -->
</div>
<div fxLayout="row wrap" fxFlex.gt-sm="100" fxFlex.gt-xs="100" fxFlex="100">
<div fxFlex.gt-sm="50" fxFlex.gt-xs="50" fxFlex="50" class="align-self-center pt-1" >
<div fxLayout="row">
<div class="pl-1 pr-1 profile-i" fxFlex.xs="85" fxFlex.sm="85" fxFlex.md="85" fxFlex.lg="85" fxFlex.xl="85">
<p> {{userDetails.user_first_name}} {{userDetails.user_last_name}}</p>
<p>{{userDetails.role_name}}</p>
<p> {{userDetails.email}}</p>
<p> {{userDetails.mobile_no}}</p>
<p> {{userDetails.city_name}} ,{{userDetails.state_name}} </p>
</div>
</div>
<div fxFlex.gt-sm="50" fxFlex.gt-xs="50" fxFlex="100" class="mt-1">
<div class="profile-content">
<div class="profile-head">
<div fxFlex.gt-sm="25" fxFlex.gt-xs="25" fxFlexOffset="100" fxFlex="100" class="align-self-center">
</div>
<div fxFlex.gt-sm="50" fxFlex.gt-xs="50" fxFlex="50" class="align-self-center pt-1">
<button type="button" class="UserActions-editButton edit-button EdgeButton EdgeButton--tertiary" data-scribe-element="profile_edit_button" (click)="changePassword()">
<span class="button-text">Change Password</span>
</button>
<button type="button" class="UserActions-editButton edit-button EdgeButton EdgeButton--tertiary" data-scribe-element="profile_edit_button" (click)="editprofile()">
<span class="button-text">Edit profile</span>
<span class="button-text">Edit Profile</span>
</button>
</div>
<hr>
</div>
<div class="profile-cont">
<ul class="pl-0">
<li>
<div fxLayout="row">
<div fxFlex.xs="15" fxFlex.sm="15" fxFlex.md="15" fxFlex.lg="15" fxFlex.xl="15"> <img class="profile-thumb" [src]="profileurl ||''" width="80" height="80" alt="user">
</div>
<div class="pl-1 pr-1 profile-i" fxFlex.xs="85" fxFlex.sm="85" fxFlex.md="85" fxFlex.lg="85" fxFlex.xl="85">
<div>
<span class="post-profile-head">{{userDetails.user_full_name}}</span>
<span class="twitter-uname"><i class="fa fa-email"></i> {{userDetails.email}}</span><br/>
<span class="time">{{userDetails.createdon | date:'dd MMM yyyy'}}</span>
<p><i class="fa fa-mobile"></i> {{userDetails.mobile_no}}</p>
<p>{{userDetails.addressline1}} {{userDetails.addressline2}} <br/>
{{userDetails.addressline3}} - {{userDetails.pincode}} {{userDetails.state_name}}
</p>
</div>
<!-- <div class="profile-action"><a href=""><i class="fa fa-retweet"></i></a><a href=""><i class="fa fa-comment-o"></i></a><a href=""><i class="fa fa-heart-o"></i></a></div> -->
</div>
</div>
</li>
<!-- <li>
<div fxLayout="row">
<div fxFlex.xs="15" fxFlex.sm="15" fxFlex.md="15" fxFlex.lg="15" fxFlex.xl="15"> <img class="profile-thumb" src="../../../assets/images/test3.jpg" width="80" height="80" alt="user">
</div>
<div class="pl-1 pr-1 profile-i" fxFlex.xs="85" fxFlex.sm="85" fxFlex.md="85" fxFlex.lg="85" fxFlex.xl="85">
<div>
<span class="post-profile-head">Jane Doe</span>
<span class="twitter-uname">@JaneDoe</span>
<span class="time">Sep 11, 2017</span>
<p>
“Tomorrow belongs to those who can hear it coming.” - David Bowie
</p>
</div>
<div class="profile-action"><a href=""><i class="fa fa-retweet"></i></a><a href=""><i class="fa fa-comment-o"></i></a><a href=""><i class="fa fa-heart-o"></i></a></div>
</div>
</div>
</li>
<li>
<div fxLayout="row">
<div fxFlex.xs="15" fxFlex.sm="15" fxFlex.md="15" fxFlex.lg="15" fxFlex.xl="15"> <img class="profile-thumb" src="../../../assets/images/test3.jpg" width="80" height="80" alt="user">
</div>
<div class="pl-1 pr-1 profile-i" fxFlex.xs="85" fxFlex.sm="85" fxFlex.md="85" fxFlex.lg="85" fxFlex.xl="85">
<div>
<span class="post-profile-head">Jane Doe</span>
<span class="twitter-uname">@JaneDoe</span>
<span class="time">Sep 13, 2017</span>
<p>our recent work</p>
</div>
<div class="img-wrp" fxLayout="row" fxLayoutWrap="space-around">
<div fxFlex.gt-sm="50" fxFlex.gt-xs="50" fxFlex="100">
<div class="thumb-border">
<img src="../../../assets/images/blog-1.jpg" alt="user">
</div>
</div>
<div fxFlex.gt-sm="50" fxFlex.gt-xs="50" fxFlex="100">
<div class="thumb-border">
<img src="../../../assets/images/blog-2.jpg" alt="user">
</div>
</div>
</div>
<div class="profile-action"><a href=""><i class="fa fa-retweet"></i></a><a href=""><i class="fa fa-comment-o"></i></a><a href=""><i class="fa fa-heart-o"></i></a></div>
</div>
</div>
</li> -->
</ul>
</div>
</div>
</div>
<div fxFlex.gt-sm="25" fxFlex.gt-xs="50" fxFlex="100" class="align-self-center">
</div>
</div>
</div>
</div>
</div>
</div>
</mat-card-content>
</mat-card>

6
ng6-seed/src/app/settings/users/user-profile/user-profile.component.ts
View File

@ -68,7 +68,7 @@ export class UserProfileComponent implements OnInit {
getprofilepic(){
let users= {
'userid':this.userDetails.userid,
'entityid':this.userDetails.fk_entity_id,
'entityid':this.userDetails.fk_entity_type_id,
'profilepic':this.userDetails.profilepic
}
this.users.getprofilepic(users).subscribe(res=>{
@ -85,7 +85,7 @@ export class UserProfileComponent implements OnInit {
@Component({
selector: 'app-jazz-dialog',
template: `
<h5 class="mt-0">New Password Change.</h5>
<h5 class="mt-0">Change Password</h5>
<mat-form-field>
<input matInput placeholder="Old Password" [(ngModel)]="pass.oldPassword" type="password" style="width: 100%;">
@ -106,7 +106,7 @@ export class UserProfileComponent implements OnInit {
<br>
<button mat-raised-button class="mat-green" type="submit" (click)="dialogRef.close(pass)">Submit</button>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Submit" matTooltipPosition="above" type="submit" (click)="dialogRef.close(pass)"><mat-icon>save</mat-icon></button>
`