change profile Image

MOHEMM-Q3-DEV-LATEST
ashwaq 6 years ago
parent ad56814966
commit c52ee53b99

@ -7,7 +7,9 @@
<div class="header-div">
<div class="centerDiv">
<p class="TxtPlace">{{ts.trPK('home','hello')}}, {{User_name_Emp}}</p>
<div> <img src="{{user_image}}" class="profileImg"></div>
<!-- <div> <img src="{{user_image}}" class="profileImg"></div> -->
<div><img class="profileImg" [src]="user_image"></div>
</div>
</div>
@ -53,7 +55,7 @@
<p class="companyTxt">{{CompanyImageDescription}}</p>
</div>
<div class="menuFooter">
<div> <img src="../assets/imgs/HMG.png" class="CompanyImg"></div>
<div> <img src="../assets/imgs/CS.png" class="CompanyImg"></div>
<p class="companyTxt">{{companyDesc}}</p>
</div>
</ion-content>

@ -9,6 +9,7 @@ import { KeyboardService } from "./hmg-common/services/keyboard/keyboard.service
import { SMSCheckResponse } from "src/app/hmg-common/services/authentication/models/smscheck.response";
import { LazyLoadingService } from "./hmg-common/services/lazy-loading/lazy-loading.service";
import { DomSanitizer } from '@angular/platform-browser';
@Component({
selector: "app-root",
@ -21,10 +22,10 @@ export class AppComponent implements OnInit, AfterViewInit {
start: any = false;
menuList: any = [];
User_name_Emp: string = "";
user_image: string = "../assets/imgs/profile.png";
user_image: any = "../assets/imgs/profile.png";
menuSide: string = "left";
notBadge: number;
companyUrl: string = "../assets/imgs/HMG.png";
companyUrl: string = "../assets/imgs/CS.png";
companyDesc: string = "Powered By Cloud Solutions";
public direction = "ltr";
constructor(
@ -36,7 +37,17 @@ export class AppComponent implements OnInit, AfterViewInit {
private keyboardService: KeyboardService,
private menu: MenuController,
private authService: AuthenticationService,
) {}
private sanitizer: DomSanitizer,
) {
this.events.subscribe("img-change", displayImg => {
console.log("app compont: "+displayImg);
//this.user_image = "data:image/png;base64"+displayImg;
this.user_image = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+displayImg);
});
}
ngOnInit() {
this.initializeApp();
}
@ -63,7 +74,7 @@ export class AppComponent implements OnInit, AfterViewInit {
if (user) {
this.companyUrl = user.CompanyImageURL
? user.CompanyImageURL
: "../assets/imgs/HMG.png";
: "../assets/imgs/CS.png";
this.companyDesc = user.CompanyImageDescription
? user.CompanyImageDescription

@ -11,8 +11,10 @@ import { AppRoutingModule } from './app-routing.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ZBar } from '@ionic-native/zbar/ngx';
import { Geolocation } from '@ionic-native/geolocation/ngx';
import {Camera,CameraOptions,PictureSourceType} from'@ionic-native/Camera/ngx';
import { FilePath } from "@ionic-native/file-path/ngx";
import { File } from "@ionic-native/file/ngx";
import { Base64 } from "@ionic-native/base64/ngx";
@NgModule({
declarations: [AppComponent],
entryComponents: [],
@ -30,6 +32,10 @@ import { Geolocation } from '@ionic-native/geolocation/ngx';
SplashScreen,
ZBar,
Geolocation,
Camera,
File,
FilePath,
Base64,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]

@ -2,7 +2,7 @@
<ion-grid class="customGrid">
<ion-row>
<ion-col class="colPad">
<img class="centerDiv" src="../assets/imgs/HMG.png" />
<img class="centerDiv" src="../assets/imgs/CS.png" />
</ion-col>
</ion-row>
<ion-row>

@ -11,7 +11,7 @@
<ion-grid>
<ion-row>
<ion-col class="colPad">
<ion-img class="centerDiv" src="../assets/imgs/HMG.png"></ion-img>
<ion-img class="centerDiv" src="../assets/imgs/CS.png"></ion-img>
</ion-col>
</ion-row>
<ion-row>

@ -94,7 +94,9 @@ import { ReplacementListComponent } from '../vacation-rule/replacement-list/repl
import { FileSelectDirective } from 'ng2-file-upload';
import { PdfViewerModule } from 'ng2-pdf-viewer';
import { WorkListAttachViewComponent } from '../notification/work-list-attach-view/work-list-attach-view.component';
import {Camera,CameraOptions, PictureSourceType} from '@ionic-native/Camera/ngx';
import {File} from '@ionic-native/file/ngx';
import {FileUploderProfileComponent} from './ui/file-uploder-profile/file-uploder-profile.component'
@NgModule({
imports: [
CommonModule,
@ -157,7 +159,8 @@ import { WorkListAttachViewComponent } from '../notification/work-list-attach-vi
PaymentComponent,
ReplacementListComponent,
FileSelectDirective,
WorkListAttachViewComponent
WorkListAttachViewComponent,
FileUploderProfileComponent
],
exports: [
NumberRangeComponent,
@ -207,7 +210,8 @@ import { WorkListAttachViewComponent } from '../notification/work-list-attach-vi
PaymentComponent,
ReplacementListComponent,
FileSelectDirective,
WorkListAttachViewComponent
WorkListAttachViewComponent,
FileUploderProfileComponent
],
providers: [
ConnectorService,
@ -245,7 +249,9 @@ import { WorkListAttachViewComponent } from '../notification/work-list-attach-vi
InAppBrowser,
RateService,
PaymentService,
MenuService
MenuService,
Camera,
File
]
})
export class HmgCommonModule { }

@ -115,8 +115,9 @@ export class AuthenticationService {
}
public setPublicFields(request: Request): Request {
request.VersionID = 1.1;
request.Channel = 33;
console.log("setPublicFields :" + request);
request.VersionID = 1.4;
request.Channel = 31;
request.LanguageID = TranslatorService.getCurrentLanguageCode();
//request.IPAdress = '10.10.10.10';
//request.SessionID = "any thing"; // ??? required for not authorized login funny
@ -193,7 +194,7 @@ export class AuthenticationService {
public login(request: LoginRequest, onError: any, errorLabel: string): Observable<Response> {
this.setPublicFields(request);
request.P_APP_VERSION="HMG";
request.P_APP_VERSION="CS";
return this.con.post(AuthenticationService.login, request, onError, errorLabel);
}
@ -448,7 +449,7 @@ export class AuthenticationService {
public checkUserAuthentication(request: CheckUserAuthenticationRequest, onError: any, errorLabel: string)
: Observable<CheckUserAuthenticationResponse> {
this.setPublicFields(request);
request.P_APP_VERSION="HMG";
request.P_APP_VERSION="CS";
return this.con.post(AuthenticationService.userChecking, request, onError, errorLabel);
}

@ -2,6 +2,7 @@ import { PatientUserModel } from './PatientUserModel';
import { TestBed } from '@angular/core/testing';
export class AuthenticatedUser extends PatientUserModel {
public static SHARED_DATA = 'user-info';
TokenID:string;
ACTUAL_TERMINATION_DATE: string;
ASSIGNMENT_END_DATE: string;
@ -75,6 +76,7 @@ USER_STATUS: string;
P_SESSION_ID:number;
MobileNumber:string;
LogInTokenID:string;
CompanyImageDescription: string
CompanyImageURL: string
CompanyImageDescription: string;
CompanyImageURL: string;
}

@ -77,6 +77,8 @@ export class CommonService {
private progressLoaders: any[] = [];
private loadingProgress: any;
public updateImage:boolean=false;
public setUpdateImg:any;
constructor(
public nav: NavController,
public router: Router,
@ -998,6 +1000,10 @@ export class CommonService {
public openMySubordinatePage() {
this.nav.navigateForward(["/my-subordinate/home"]);
}
public openChangeImagePage() {
this.nav.navigateForward(["/profile/profileImg"]);
}
public reload(url: string, from: string) {
console.log("force reload called from:" + from);
// window.location.reload();
@ -1178,4 +1184,21 @@ export class CommonService {
}
return FormatedDate;
}
public setUpdateImage (image){
console.log("setUpdateImage");
this.setUpdateImg=image;
this.updateImage=true;
}
public getUpdateImage(){
console.log("getUpdateImage");
const objImg={
img: this.setUpdateImg,
status: this.updateImage
}
return objImg;
}
}

@ -18,9 +18,11 @@ export class ConnectorService {
public static retryTimes = 0;
public static timeOut = 30 * 1000;
// public static host = 'http://10.50.100.113:6060/'; // development service
//public static host = 'http://10.50.100.198:4444/'; // production service
//public static host = 'https://uat.hmgwebservices.com/';
public static host = 'https://hmgwebservices.com/';
public static host = 'https://uat.hmgwebservices.com/';
//public static host = 'https://hmgwebservices.com/';
// public static host = 'http://10.50.100.198:6060/';
// public static host = 'http://10.50.100.113:6060/'; // development service
/* public static host = 'http://10.50.100.198:6060/';

@ -0,0 +1,18 @@
<div class="centerDiv changeImgBtn">
<ion-button class="btnImge" color="customnavy" ion-button (click)="openFile()" expand="block" fill="outline">
<!-- <ion-icon class="changeIcon" name="camera" ></ion-icon> -->
{{'userProfile,changeImg' | translate}}
</ion-button>
</div>
<div *ngIf="data" class="uploader-icons">
<ion-item lines="none">
<p slot="start"> <img [src]="attachmentImg" /> {{data.name}}</p>
<p slot="end"><img [src]="deleteImg" (click)="deleteFiles(i)"></p>
</ion-item>
</div>

@ -0,0 +1,20 @@
//test
.changeImgBtn{
margin: 0;
position: absolute;
top: 80%;
left: 53%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.btnImge{
button{
border-color:transparent !important;
}
}
//test
.changeIcon{
background: #19a163;
width: 15px;
height: 15px;
}

@ -0,0 +1,27 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FileUploderProfileComponent } from './file-uploder-profile.component';
describe('FileUploderProfileComponent', () => {
let component: FileUploderProfileComponent;
let fixture: ComponentFixture<FileUploderProfileComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ FileUploderProfileComponent ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(FileUploderProfileComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,169 @@
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { ActionSheetController,Events, NavController } from '@ionic/angular';
import {CameraOptions,Camera,PictureSourceType} from '@ionic-native/Camera/ngx';
// import { FileChooser } from '@ionic-native/file-chooser';
import { FilePath } from "@ionic-native/file-path/ngx";
import { File } from "@ionic-native/file/ngx";
import { TranslatorService } from '../../services/translator/translator.service';
import { Base64 } from "@ionic-native/base64/ngx";
// import { Chooser } from '@ionic-native/chooser';
@Component({
selector: 'app-file-uploder-profile',
templateUrl: './file-uploder-profile.component.html',
styleUrls: ['./file-uploder-profile.component.scss'],
})
export class FileUploderProfileComponent implements OnInit {
@Input() multiupload = false;
@Input() attachmentname = 'attachment-loader';
public attachmentData: string;
@Input() maxFileSize = 10 * 1024 * 1024;
@Output() fileSelected = new EventEmitter();
@Output() onimgLoad = new EventEmitter();
public image: string;
public attachmentImg = 'assets/icon/attachment.png';
public deleteImg = 'assets/icon/delete.png';
public selectedImage:any;
public nativePath: any;
public errorMsg:any;
public allowdType: any = ["jpg", "jpeg", "png"];
constructor(
public cameraController:Camera,
public actionSheetCtrl:ActionSheetController,
public event:Events,
public nav: NavController,
private filePath: FilePath,
// public FileChooser:FileChooser,
private file: File,
public ts: TranslatorService,
public base64:Base64,
// private chooser: Chooser
) { }
ngOnInit() {
}
@Input() set src(src: string) {
this.image = src;
}
get src(): string {
return this.image;
}
//open the presentsheet
//selected attach
//need convert
//insert or display
async openFile(){
const actionSheet = await this.actionSheetCtrl.create({
header: 'Change Profile Photo',
buttons: [{
text: 'Delete Current Image',
role: 'destructive',
icon: 'trash',
handler: () => {
console.log('Delete clicked');
}
}, {
text: 'Take Photo',
icon: 'camera',
handler: () => {
console.log('Take Photo');
this.takePicture(this.cameraController.PictureSourceType.CAMERA);
}
}, {
text: 'Choose from Library',
icon: 'images',
handler: () => {
console.log('Favorite clicked');
this.takePicture(this.cameraController.PictureSourceType.PHOTOLIBRARY);
}
}, {
text: 'Cancel',
icon: 'close',
role: 'cancel',
handler: () => {
console.log('Cancel clicked');
}
}]
});
await actionSheet.present();
}
public takePicture(sourceType: PictureSourceType) {
console.log("sourceType: "+sourceType);
const options: CameraOptions = {
quality: 50,
destinationType: this.cameraController.DestinationType.DATA_URL,
encodingType: this.cameraController.EncodingType.JPEG,
sourceType: sourceType,
correctOrientation:true,
targetWidth: 512,
targetHeight: 512
};
this.cameraController.getPicture(options).then(imageData => {
const data = "data:image/jpeg;base64," + imageData;
this.event.publish('Image', {message:"hello"});
this.selectedImage = "data:image/jpeg;base64, " + imageData;
this.onimgLoad.emit(this.selectedImage);
});
}
public deleteCurrent(){
// send empty image
//this.onimgLoad.emit("");
}
readFile(fileUrl: any) {
this.filePath.resolveNativePath(fileUrl).then(filePathResult => {
this.nativePath = filePathResult;
this.file.resolveLocalFilesystemUrl(this.nativePath).then(entry => {
entry.getMetadata(metadata => {
if (metadata.size <= this.maxFileSize) {
this.errorMsg = null;
this.encodeFiles(entry);
} else {
this.errorMsg = this.ts.trPK("general", "large-file");
}
});
});
});
}
encodeFiles(entry) {
this.base64.encodeFile(this.nativePath).then(
(base64File: string) => {
const type = this.nativePath.substr(
this.nativePath.lastIndexOf(".") + 1
);
console.log("base64File 1" + base64File);
if (this.allowdType.includes(type.toLowerCase())) {
} else {
this.attachmentData = null;
this.errorMsg = this.ts.trPK("general", "not-supported");
}
},
err => {
console.log(err);
}
);
}
}

@ -8,7 +8,7 @@
<ion-grid>
<ion-row>
<ion-col class="colPad">
<ion-img class="centerDiv" src="../assets/imgs/HMG.png"></ion-img>
<ion-img class="centerDiv" src="../assets/imgs/CS.png"></ion-img>
</ion-col>
</ion-row>
<ion-row>

@ -13,7 +13,24 @@
</button>
<div class="centerDiv homeBox" (click)="openPersonalInfo()">
<p class="TxtPlace">{{ts.trPK('home','hello')}}, {{userData.EMPLOYEE_DISPLAY_NAME}}</p>
<div class="profileDiv"><ion-img class="profileImg" src="{{user_image}}"></ion-img></div>
<div class="profileDiv">
<!-- <ion-img class="profileImg" src="{{user_image}}"></ion-img> -->
<img class="profileImg" [src]="user_image">
</div>
</div>
<div class="changeImgBtn">
<button ion-button icon-only menuToggle class="menubutton" (click)="changeImage()">
<ion-icon class="changeIcon" name="camera"></ion-icon></button>
<!-- <app-file-uploder-profile >
</app-file-uploder-profile>
-->
<!-- <file-uploader (fileSelected)="attachmentSelected($event)" [maxFileSize]="maxFileSize" [multiupload]="false"></file-uploader> -->
</div>
</div>

@ -98,4 +98,19 @@ top: 40px;
-moz-box-shadow: none;
border: 2px solid var(--gray);
min-width: auto;
}
}
//test
.changeImgBtn{
margin: 0;
position: absolute;
top: 80%;
left: 53%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
//test
.changeIcon{
background: #19a163;
width: 15px;
height: 15px;
}

@ -1,7 +1,7 @@
import { EitService } from "./../eit/services/eit.service";
import { Component, OnInit } from "@angular/core";
import { TranslatorService } from "src/app/hmg-common/services/translator/translator.service";
import { MenuController, Events } from "@ionic/angular";
import { MenuController, Events, ActionSheetController } from "@ionic/angular";
import { AuthenticationService } from "src/app/hmg-common/services/authentication/authentication.service";
import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/models/authenticated-user";
import { MenuService } from "src/app/hmg-common/services/menu/menuservice.service";
@ -15,7 +15,15 @@ import { attendanceSwipeScannerRequest } from "./models/attendanceSwipe.Request"
import { Response } from "src/app/hmg-common/services/models/response";
import { AttendanceService } from "./services/attendance.services";
import { LoginRequest } from "../hmg-common/services/authentication/models/login.request";
import {FileUploaderComponent} from '../hmg-common/ui/file-uploader/file-uploader.component'
import { Camera, CameraOptions,PictureSourceType} from "@ionic-native/Camera/ngx";
//import { FileChooser } from "@ionic-native/file-chooser/ngx";
import { File } from "@ionic-native/file/ngx";
import { DomSanitizer } from '@angular/platform-browser';
//import { FilePath } from "@ionic-native/file-path/ngx";
//import { Base64 } from "@ionic-native/base64/ngx";
import {FileUploderProfileComponent} from '../hmg-common/ui/file-uploder-profile/file-uploder-profile.component'
import { SharedDataService } from '../hmg-common/services/shared-data-service/shared-data.service';
@Component({
selector: "app-home",
templateUrl: "./home.page.html",
@ -31,6 +39,9 @@ export class HomePage implements OnInit {
lat: any;
longt: any;
deviceID: string;
public maxFileSize =10 * 1024 * 1024;
public fileUploder :FileUploaderComponent;
// public fileUploderProfile:FileUploderProfileComponent
constructor(
public ts: TranslatorService,
public menu: MenuController,
@ -43,9 +54,25 @@ export class HomePage implements OnInit {
private geolocation: Geolocation,
private attendance_service: AttendanceService,
private eitService: EitService,
private barcodeScanner: BarcodeScanner
) { }
private barcodeScanner: BarcodeScanner,
public actionSheetCtrl: ActionSheetController,
private cameraController: Camera,
public sharedData: SharedDataService,
private sanitizer: DomSanitizer,
//private transfer: Transfer,
private file: File,
//private filePath: FilePath
) {
this.events.subscribe("img-change", displayImg => {
// this.user_image = "data:image/jpeg;base64"+displayImg;
// alert("home app: ");
this.user_image = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+displayImg);
console.log("html saved img: "+this.user_image);
});
}
ngOnInit() {
this.getUserDetails();
this.getMenu();
@ -65,6 +92,8 @@ export class HomePage implements OnInit {
console.log("Error getting location", error);
});
this.getCount();
}
setServicesPrivilage(){
@ -109,6 +138,8 @@ export class HomePage implements OnInit {
// }
ionViewDidLoad() {
this.getUserDetails();
console.log("getUserDetails");
this.geolocation
.getCurrentPosition()
.then(resp => {
@ -134,6 +165,8 @@ export class HomePage implements OnInit {
if (user) {
this.events.publish("setMenu");
this.userData = user;
//set User Info
this.sharedData.setSharedData(this.userData, AuthenticatedUser.SHARED_DATA);
this.user_image = user.EMPLOYEE_IMAGE
? "data:image/png;base64," + user.EMPLOYEE_IMAGE
: this.user_image;
@ -161,6 +194,11 @@ export class HomePage implements OnInit {
private accrualBalance() {
this.common.openAccuralPage();
}
private changeImage() {
this.common.openChangeImagePage();
}
public getMeunDetails(index) {
let item = this.menuList[index];
let selMenu: MenuResponse = new MenuResponse();

@ -3,6 +3,8 @@ import { CommonService } from "src/app/hmg-common/services/common/common.service
import { TranslatorService } from "src/app/hmg-common/services/translator/translator.service";
import { AuthenticationService } from "src/app/hmg-common/services/authentication/authentication.service";
import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/models/authenticated-user";
import { Events } from "@ionic/angular";
import { DomSanitizer } from '@angular/platform-browser';
@Component({
selector: "app-home",
templateUrl: "./home.component.html",
@ -10,12 +12,28 @@ import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/mo
})
export class HomeComponent implements OnInit {
personalInfo: any;
imageSrc: string = "../assets/imgs/profile.png";
setImage:any;
imageSrc: any = "../assets/imgs/profile.png";
constructor(
public ts: TranslatorService,
public cs: CommonService,
public authService: AuthenticationService
) {}
public authService: AuthenticationService,
private events: Events,
private sanitizer: DomSanitizer,
) {
this.events.subscribe("img-change", displayImg => {
// alert("1 - profile home : "+displayImg);
//this.user_image = "data:image/png;base64"+displayImg;
this.setImage = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+displayImg);
this.imageSrc = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+displayImg);
});
}
ngOnInit() {
this.getProfile();
@ -26,12 +44,19 @@ export class HomeComponent implements OnInit {
.subscribe((user: AuthenticatedUser) => {
if (user) {
this.personalInfo = user;
if(this.cs.getUpdateImage().status){
// this.imageSrc = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+this.cs.getUpdateImage().img);
this.imageSrc = "data:image/png;base64,"+this.cs.getUpdateImage().img;
// alert("this.imageSrc"+ this.imageSrc);
}else{
this.imageSrc = user.EMPLOYEE_IMAGE
? "data:image/png;base64," + user.EMPLOYEE_IMAGE
: this.imageSrc;
console.log(user);
} else {
console.log(user);
console.log("2-"+user);
}
}
else {
console.log("3-"+user);
}
});
}

@ -0,0 +1,33 @@
<ion-header>
<ion-toolbar class="header-toolbar">
<ion-buttons slot="start">
<ion-back-button color="light" class="btnBack" defaultHref="/home"></ion-back-button>
</ion-buttons>
<ion-title color="light" > {{ts.trPK('userProfile','title')}}</ion-title>
<ion-buttons slot="end">
<button style="color: white !important;" class="headerBtn" *ngIf="saveChange != ''" (click)="updateImageProfile();" >
{{ts.trPK('general','save')}}
</button>
</ion-buttons>
</ion-toolbar>
</ion-header>
<ion-content padding>
<div class="profileDiv">
<!-- <ion-img class="imgCircle" src="{{src}}"></ion-img> -->
<!-- <ion-img class="imgCircle" src="../assets/imgs/HMG.png"></ion-img> -->
<ion-img style="width: 60%" [src]="src" class="imgCircle" ></ion-img>
</div>
<page-trailer [small]="true"></page-trailer>
<!-- <ion-footer> -->
<div class="centerDiv">
<app-file-uploder-profile (onimgLoad)="showImg($event)"></app-file-uploder-profile>
</div>
<!-- </ion-footer> -->
</ion-content>

@ -0,0 +1,47 @@
// .imgCircle{
// height: 30vh;
// width: 30vh;
// margin: auto;
// display: block;
// // background: red;
// overflow: hidden;
// background: transparent;
// border-radius: 50% !important;
// }
.imgCircle{
// width: 90px;
// height: 90px;
// display: inline-flex;
// overflow: hidden;
// background: transparent;
// -webkit-border-radius:50% !important;
// -moz-border-radius:50% !important;
// border-radius: 50% !important;
// // margin:0 auto 40px;
position: relative;
width: 600px;
height: 600px;
margin: auto;
display: block;
// background: red;
overflow: hidden;
background: transparent;
border-radius: 50% !important;
color:#fff;
background-color: rgba(0,0,0,0.1);
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
img{
-webkit-border-radius:50% !important;
-moz-border-radius:50% !important;
border-radius: 50% !important;
height: auto !important;
width: 70% !important;
}
//box-shadow: 0px 0px 0px 10px #8c8c8c;
}

@ -0,0 +1,27 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ProfileImageComponent } from './profile-image.component';
describe('ProfileImageComponent', () => {
let component: ProfileImageComponent;
let fixture: ComponentFixture<ProfileImageComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ProfileImageComponent ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ProfileImageComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,87 @@
import { Component, OnInit } from '@angular/core';
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
import { AuthenticatedUser } from "src/app/hmg-common/services/authentication/models/authenticated-user";
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
import { Events } from '@ionic/angular';
import {ProfileService} from '../service/profile.service'
import { DomSanitizer } from '@angular/platform-browser';
@Component({
selector: 'app-profile-image',
templateUrl: './profile-image.component.html',
styleUrls: ['./profile-image.component.scss'],
})
export class ProfileImageComponent implements OnInit {
public userData:AuthenticatedUser;
//public src ="../assets/imgs/HMG.png";
public src :any ="";
public oldImage="";
public displayImg="";
public saveChange:any="";
public setImage:any;
// public Imge:"C:\Users\ashwaq.jaafar\Desktop\mohemmionic5\Mohem\src\assets\imgs\HMG.png";
constructor(
public common:CommonService,
public ts: TranslatorService,
public event:Events,
public profileService:ProfileService,
private sanitizer: DomSanitizer,
) {
this.userData =this.common.sharedService.getSharedData(AuthenticatedUser.SHARED_DATA,false);
this.event.subscribe("img-change", displayImg => {
// this.user_image = "data:image/jpeg;base64"+displayImg;
console.log("change profile photo" +displayImg);
this.src = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+displayImg);
});
}
showImg(event){
console.log("selected profile "+event);
this.saveChange=event;
this.src=event;
}
ngOnInit() {
// get passing image
console.log("ngOnInit change profile");
if(this.common.getUpdateImage().status){
// this.imageSrc = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+this.cs.getUpdateImage().img);
this.src = "data:image/png;base64,"+this.common.getUpdateImage().img;
console.log("this.imageSrc"+ this.src);
}else{
this.src= "data:image/png;base64," + this.userData.EMPLOYEE_IMAGE;
this.oldImage =this.src;
}
}
updateImageProfile(){
console.log("update");
const srcImge=this.src.split(',')[1];
this.displayImg=srcImge
console.log("gallery srcImge" + srcImge);
const body = {
P_IMAGE: srcImge,
};
this.profileService.updateImageProfile(body).subscribe((result:any) =>
{ this.handleUpdateImageProfileResult(result);
}
)
}
handleUpdateImageProfileResult(result) {
if (this.common.validResponse(result)) {
this.common.setUpdateImage(this.displayImg);
this.event.publish('img-change', this.displayImg);
let msg: string = this.ts.trPK("userProfile", "successChange");
this.common.presentAlert(msg);
this.common.back();
} // valid it
}// End handleWorkListButtonsResult
}

@ -2,11 +2,13 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { HmgCommonModule } from '../hmg-common/hmg-common.module';
import { IonicModule } from '@ionic/angular';
import { ProfilePage } from './profile.page';
import { HomeComponent } from './home/home.component';
import {ProfileImageComponent} from './profile-image/profile-image.component'
const routes: Routes = [
{
path: '',
@ -17,6 +19,16 @@ const routes: Routes = [
component: HomeComponent
}
],
},
{
path: '',
component: ProfilePage,
children: [
{
path: 'profileImg',
component: ProfileImageComponent
}
],
}
];
@ -25,8 +37,9 @@ const routes: Routes = [
CommonModule,
FormsModule,
IonicModule,
HmgCommonModule,
RouterModule.forChild(routes)
],
declarations: [ProfilePage , HomeComponent]
declarations: [ProfilePage , HomeComponent,ProfileImageComponent]
})
export class ProfilePageModule {}

@ -0,0 +1,27 @@
import { Injectable } from '@angular/core';
import { Observable } from "rxjs";
import { ConnectorService } from 'src/app/hmg-common/services/connector/connector.service';
import { AuthenticationService } from "src/app/hmg-common/services/authentication/authentication.service";
@Injectable({
providedIn: 'root'
})
export class ProfileService {
public static updateEmpImage ="Services/ERP.svc/REST/UPDATE_EMPLOYEE_IMAGE";
constructor(
public api: ConnectorService,
public authService: AuthenticationService
) {}
public updateImageProfile( updateImgRequest: any,onError?: any,errorLabel?: string
): Observable<any> {
console.log("services");
const request = updateImgRequest;
this.authService.authenticateRequest(request);
return this.api.post(
ProfileService.updateEmpImage,
request,
onError,
errorLabel
);
}
}

@ -864,6 +864,14 @@
"category": {
"en": "Category",
"ar": "الفئة"
},
"changeImg":{
"en":"Change Profile Photo",
"ar":"تغيير الصورة"
},
"successChange":{
"en":"Profile Photo changed successfully ",
"ar": "تم تغيير الصورة الشخصية بنجاح"
}
},
"changePassword": {

Loading…
Cancel
Save