put in new ui and backend store image to table

This commit is contained in:
2026-09-20 14:32:59 +10:00
parent 75b49be476
commit 3d83e95613
13 changed files with 194 additions and 55 deletions
+2 -1
View File
@@ -16,7 +16,7 @@
<th>Id</th>
<th pSortableColumn="description">Description<p-sortIcon field="description"></p-sortIcon>
</th>
<th>Photo Type</th>
<th>Action</th>
</tr>
@@ -25,6 +25,7 @@
<tr>
<td>{{item.id}}</td>
<td >{{item.photo}}</td>
<td>{{item.photoType}}</td>
<td>
<button pButton type="button" icon="pi pi-times"
+1 -1
View File
@@ -128,7 +128,7 @@ doRemove(id: number): void {
}
else
{
const deletepersonPhoto$ = this.personService.deletePersonPhotoFile(id);
const deletepersonPhoto$ = this.personService.deletePersonPhotoFileById(id);
this.subscription.add(deletepersonPhoto$.subscribe(
{
next: x => {
+4 -1
View File
@@ -15,7 +15,10 @@ export enum mState {
Modified = 1,
New =2,
};
export enum enumPhoto {
Profile = 1,
Other = 2
}
export enum userRole {
Normal = 1,
Admin = 2,
+14 -9
View File
@@ -6,7 +6,7 @@ import { FormControl, ReactiveFormsModule, UntypedFormBuilder, Validators } from
import { Subject, Subscription} from 'rxjs';
import { ConfirmationService, MessageService } from 'primeng/api';
import { DatePickerModule } from 'primeng/datepicker';
import { Code, RelationShipView, Person, mState, RelationShip, PersonPhotoDto} from '../models';
import { Code, RelationShipView, Person, mState, RelationShip, PersonPhotoDto, enumPhoto } from '../models';
import { AppSettingService, LookupService, Utils } from '../shares';
import { PersonService } from './person.service';
import { ButtonModule } from 'primeng/button';
@@ -22,6 +22,7 @@ import { TooltipModule } from 'primeng/tooltip';
import { AutoFocusModule } from 'primeng/autofocus';
import { DomSanitizer } from '@angular/platform-browser';
import { PhotoList } from '../attachphoto/photolist';
import { InputNumberDesignTokens } from '@primeuix/themes/types/inputnumber';
export interface FileUploadEvent {
originalEvent: HttpEvent<any>;
@@ -190,9 +191,9 @@ doDeleteFile(): void {
this.profileFile = null;
}
doDeleteImage(fileName:string) : void {
const familyId = this.adminuserForm.value.id;
const data = { fileName, familyId };
const delete$ = this.personService.deleteUploadFile(data);
const personId = this.adminuserForm.value.id;
const photoType = enumPhoto.Profile;
const delete$ = this.personService.deletePersonPhotoFile(personId, photoType);
this.subscription.add(delete$.subscribe(
{
next: x => {
@@ -358,7 +359,7 @@ assignValue(item:Person): void {
}
if (item.image && item.image.length > 0)
{
this.loadImage(item.image);
this.loadImage(item.image, item.id, enumPhoto.Profile);
}
// disable use false//true for not disable.
this.subChanged$.next(true);
@@ -367,8 +368,10 @@ assignValue(item:Person): void {
// convenience getter for easy access in form fields
get f() { return this.adminuserForm.controls;}
loadImage(fileName: string| null): void {
const download = this.personService.downloadFile(fileName!);
loadImage(fileName: string | null,
personId: number, photoType: number): void {
if (fileName) {
const download = this.personService.downloadPersonPhoto64(fileName, personId, photoType);
this.subscription.add(download.subscribe({
next: x => {
if (x.statusCode == 1)
@@ -384,8 +387,10 @@ assignValue(item:Person): void {
},
error: e => console.error("error in download image", e)
}));
}
displayIamge64(baseImage: string): void
}
}
displayIamge64(baseImage: string): void
{
const changeUrl = (this.sanitizer.bypassSecurityTrustResourceUrl(baseImage) as any).changingThisBreaksApplicationSecurity;
console.log('this is bypassSecurityTrustResourceUrl', changeUrl);
+36 -9
View File
@@ -77,33 +77,60 @@ export class PersonService {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.personUrl + "/UploadImage";
return this.http.post<ResultModel<string>>(baseUrl, data);
}
downloadFile(imageName: string): Observable<ResultModel<string>> {
downloadFile_dontusethis(imageName: string, personId: number,
photoType: number): Observable<ResultModel<string>> {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DownloadFile";
const data = {
fileName: imageName
fileName: imageName,
id: personId,
photoType
};
return this.http.post<ResultModel<string>>(baseUrl, data);
}
deleteUploadFile(data: any): Observable<ResultModel<number>> {
deleteUploadFile_dotnotuse(data: any): Observable<ResultModel<number>> {
//data ={filename};
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.personUrl + "/DeleteUploadFile";
return this.http.post<ResultModel<number>>(baseUrl, data);
}
deletePersonPhotoFile(id: number): Observable<ResultModel<number>> {
const data ={id, fileName:''};
deletePersonPhotoFile(personId: number, photoType: number): Observable<ResultModel<number>> {
const data = {
id: personId,
fileName: '',
photoType
};
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DeletePersonPhoto";
return this.http.post<ResultModel<number>>(baseUrl, data);
}
deletePersonPhotoFileById(id: number): Observable<ResultModel<number>> {
const data = {
id
};
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DeletePersonPhotoById";
return this.http.post<ResultModel<number>>(baseUrl, data);
}
savePersonPhotoList(data:FormData): Observable<ResultModel<number>> {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/SavePersonPhoto";
return this.http.post<ResultModel<number>>(baseUrl, data);
}
downloadPersonPhoto(id: number): Observable<ResultModel<string>> {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DownloadPersonPhoto";
downloadPersonPhoto64(imageName: string, personId: number,
photoType: number): Observable<ResultModel<string>> {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DownloadPersonPhoto64";
const data = {
id,
fileName: ''
id: personId,
photoType,
fileName: imageName
};
return this.http.post<ResultModel<string>>(baseUrl, data);
}
downloadPersonPhoto(imageName: string, personId: number,
photoType: number): Observable<any> {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DownloadPersonPhoto";
const data = {
id: personId,
photoType,
fileName: imageName
};
return this.http.post<any>(baseUrl, data);
}
}
+6 -4
View File
@@ -27,12 +27,14 @@ export class ImageDisplayComponent implements OnInit, OnDestroy {
ngOnInit(): void {
const imageName = this.config.data.imageName;
this.loadImage(imageName);
const imageName = this.config.data.imageName;
const personId = this.config.data.personId;
const photoType = this.config.data.photyType;
this.loadImage(imageName, personId, photoType);
}
loadImage(fileName: string| null): void {
const download = this.personService.downloadFile(fileName!);
loadImage(fileName: string | null, personId: number, photoType: number): void {
const download = this.personService.downloadPersonPhoto(fileName!, personId, photoType);
this.subscription.add(download.subscribe({
next: x => {
if (x.statusCode == 1)