kham/familytree
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

check in display image using api now

Browse Source
This commit is contained in:
Kham Vilaythong
2025-09-10 11:15:56 +10:00
parent 6cea606cc2
commit ff45c461a5
23 changed files with 335 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
UI/src/app/person/family.orga.ts
+4 -8
View File
@@ -5,9 +5,7 @@ import { OrganizationChartModule } from 'primeng/organizationchart';
import { take } from 'rxjs/operators';
import { Subscription } from 'rxjs';
import { Router } from '@angular/router';
import { PersonService } from './person.service';
import { AuthenticationService } from '../user-services';
import { TableModule } from 'primeng/table';
import { FormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
@@ -41,15 +39,13 @@ export class FamilyOrga implements OnInit, OnDestroy{
familyList:Person[] = [];
msg ="[Person organise component]";
private messageService = inject(MessageService);
public ref = inject(DynamicDialogRef);
public config = inject(DynamicDialogConfig);
/*
private store: Store<appValidationState>
*/
constructor(
public dialogService: DialogService,
private personService: PersonService,
public ref: DynamicDialogRef, public config: DynamicDialogConfig,
) {}
private personService = inject(PersonService);
public dialogService = inject(DialogService);
ngOnInit(): void
{
UI/src/app/person/familylist.ts
+24 -19
View File
@@ -38,25 +38,25 @@ export class FamilyList implements OnInit, OnDestroy{
//private cd = inject(ChangeDetectorRef);
items: MenuItem[] | undefined;
selectedPerson!: Person;
firstname = '';
email = '';
lastname = '';
_id = -10;
selectId = -1;
loading = false;
familyList = signal<Person[]>([]);
msg ="[Person component]";
@ViewChild(Table) dt2!: Table;
@ViewChild('rowmenu') popMenu?: Menu;
private messageService = inject(MessageService);
public dialogService= inject( DialogService);
firstname = '';
email = '';
lastname = '';
_id = -10;
selectId = -1;
loading = false;
familyList = signal<Person[]>([]);
msg ="[Person component]";
@ViewChild(Table) dt2!: Table;
@ViewChild('rowmenu') popMenu?: Menu;
private messageService = inject(MessageService);
public dialogService= inject( DialogService);
private personService= inject( PersonService);
private confirmationService = inject(ConfirmationService);
private cd = inject(ChangeDetectorRef);
private cdr = inject(ChangeDetectorRef);
private authenticationService= inject( AuthenticationService);
private router= inject( Router);
constructor() {}
getSearchCiteria(): StaffSearch {
getSearchCiteria(): StaffSearch {
let criteria:StaffSearch = {
email: this.email,
firstName: this.firstname,
@@ -182,7 +182,7 @@ export class FamilyList implements OnInit, OnDestroy{
console.log("the person from load", this.familyList());
this.loading = false;
this.cd.detectChanges();
this.cdr.detectChanges();
},
error: e => {
const message = e || e.message;
@@ -250,6 +250,7 @@ export class FamilyList implements OnInit, OnDestroy{
const nlist = this.familyList().filter(d => d.id !== id);
this.familyList.set(nlist);
this.cdr.detectChanges();
},
error: e => console.error(e)
});
@@ -311,19 +312,21 @@ export class FamilyList implements OnInit, OnDestroy{
}
updateList(item: Person) :void {
const idx = this.familyList().findIndex( x => x.id == item.id);
const list = this.familyList();
const idx = list.findIndex( x => x.id === item.id);
if (item.fatherId && item.fatherId > 0)
item.fatherName = this.getName(item.fatherId);
if (item.motherId && item.motherId > 0)
item.motherName = this.getName(item.motherId);
if (idx < 0)
{
const olist = [... this.familyList(), item];
const olist = [... list, item];
this.familyList.set(olist);
}
else
{
const oitem = this.familyList()[idx];
const oitem = list[idx];
oitem.firstName = item.firstName;
oitem.lastName = item.lastName;
oitem.address = item.address;
@@ -335,7 +338,9 @@ export class FamilyList implements OnInit, OnDestroy{
oitem.motherId = item.motherId;
oitem.fatherName = item.fatherName;
oitem.motherName = item.motherName;
this.familyList.set(list);
}
this.cdr.markForCheck();
}
UI/src/app/person/person.edit.html
+10 -5
View File
@@ -53,11 +53,15 @@
<div>
<div class="field col-12 md:col-6 sm:col-8">
<div class="shadow-md rounded-xl border-gray-100 border-1 p-4">
@if (adminuserForm.value.image != "" && adminuserForm.value.image != null)
{
<div class="ml-6 file-upload">
<a href="{{hostsite}}/{{adminuserForm.value.image}}" target="_blank" class="text-blue-400">View Attachment
</a>
<!--a href="{{hostsite}}/{{adminuserForm.value.image}}" target="_blank" class="text-blue-400">View Attachment
</a-->
<button pButton type="button" icon="pi pi-image"
class ="p-ripple p-button p-button-raised p-button-text p-button-warn p-component"
pTooltip="view Image" (click)="doViewImage(adminuserForm.value.image)"></button>
<button pButton type="button" icon="pi pi-times" pTooltip="remove attach file"
class="p-button-rounded p-button-text text-red-500 p-button-raised ml-2"
(click)="deleteFile()"></button>
@@ -65,7 +69,7 @@
}
@else
{
<div class="ml-6">
<div class="ml-6 ">
<input type="file" class="file-input" (change)="onFileSelected($event)" #fileUpload>
<div class="file-upload">
<label>{{ adminuserForm.value.image || "No attachment file uploaded yet."}}</label>
@@ -75,11 +79,12 @@
</div>
</div>
}
</div>
</div>
</div>
<div class="mt-2 w-full">
<p-button class="flex justify-end mr-2" icon="pi pi-user" label="Add Partner"
severity="warn" (onClick)="addPartner()"/>
<p-button class="flex justify-end mr-2" icon="pi pi-user" [raised]="true" severity="info" label="Add Partner"
(onClick)="addPartner()"/>
<div class="shadow rounded mt-2 mb-2">
<p-table [value]="partners()">
<ng-template #header>
UI/src/app/person/person.edit.ts
+32 -8
View File
@@ -17,7 +17,8 @@ import moment from 'moment';
import { HttpEvent } from '@angular/common/http';
import { TableModule } from 'primeng/table';
import { Pickperson } from '../pickperson/pickperson';
import { ImageDisplayComponent } from '../pickperson/image.display';
import { TooltipModule } from 'primeng/tooltip';
export interface FileUploadEvent {
originalEvent: HttpEvent<any>;
@@ -30,7 +31,8 @@ export interface FileUploadHandlerEvent {
@Component({
templateUrl: 'person.edit.html',
selector: 'person-edit',
imports:[ButtonModule,TableModule,ReactiveFormsModule,SelectModule,CheckboxModule, InputTextModule,DatePickerModule],
imports:[ButtonModule,TableModule,ReactiveFormsModule,TooltipModule,
SelectModule,CheckboxModule, InputTextModule,DatePickerModule],
styleUrls: ['person.edit.css'],
providers: [DialogService]
@@ -233,8 +235,7 @@ populateSex(): void {
name:"Male",
status:'M'
};
this.sexList.push(item);
this.sexList.push(item);
}
ngOnInit():void {
@@ -275,10 +276,33 @@ ngOnInit():void {
// this for disable submit button
get isFieldsChange() {
const chan = this.isChange || !this.adminuserForm.valid; // this disable so need true valid = true not
//console.log(this.msg + 'is fields change', chan);
console.log(this.msg + 'is fields change', chan);
return chan;
}
}
doViewImage(imageName:string): void {
const ref = this.dialogService.open(ImageDisplayComponent, {
data: {
imageName,
},
header: 'View Image',
draggable: true,
width: '70%',
modal:true,
maximizable: true
});
ref.onClose.subscribe((item: Person) => {
if (item) {
//console.log("after close ward edit", item);
this.messageService.add({severity:'success', summary: 'Select', detail: item.firstName!});
//update the current list
}
});
}
assignValue(item:Person): void {
this._id = item.id;
this.fileName = item.image!;
@@ -537,7 +561,7 @@ showPickPerson(title:string, callback:(id: Person) => void) :void {
},
header: title,
width: '80%',
draggable: true,
maximizable: true
});
UI/src/app/person/person.service.ts
+7
View File
@@ -77,6 +77,13 @@ 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>> {
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.FileUploadUrl + "/DownloadFile";
const data = {
fileName: imageName
};
return this.http.post<ResultModel<string>>(baseUrl, data);
}
deleteUploadFile(data: any): Observable<ResultModel<number>> {
//data ={filename};
const baseUrl = this.appSetting.appSetting.baseUrl + "/" + ConfigureUrl.personUrl + "/DeleteUploadFile";