sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-31 09:37:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

[HIMA-59] - added result count to the search result state

Browse Source
This commit is contained in:
Peter Skrlj
2019-02-13 13:25:51 +01:00
parent aa8388f69b
commit 70be56750e
4 changed files with 143 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/app/components/process-tab/process-tab.component.ts
View File

@@ -14,6 +14,7 @@ import { Breadcrumb } from '../../core/models/breadcrumb.model';
import { ProcessDeleteDialogComponent } from 'src/app/modules/process/process-delete-dialog/process-delete-dialog.component';
import { ProcessState } from 'src/app/core/store/state/process.state';
import { Observable } from 'rxjs';
import { take } from 'rxjs/operators';
@Component({
selector: 'app-process-tab',
@@ -24,20 +25,19 @@ export class ProcessTabComponent implements OnInit {
@Input() process: Process;
@Input() processes: Array<Process>;
@Select(ProcessState.getProcessCount) processCount: Observable<number>;
@ViewChild('deleteporcessdialog') processDeleteDialogComponent: ProcessDeleteDialogComponent;
@ViewChild('deleteporcessdialog')
processDeleteDialogComponent: ProcessDeleteDialogComponent;
cartCount = 0;
constructor(private store: Store, private router: Router) {}
deleteProcess(process: Process) {
this.store.dispatch(new DeleteProcess(process));
this.processCount.subscribe(
(count: number) => {
if (count < 1) {
this.router.navigate(['/dashboard']);
}
this.processCount.pipe(take(1)).subscribe((count: number) => {
if (count < 1) {
this.router.navigate(['/dashboard']);
}
);
});
}
openDeleteConfirmationDialog() {

33
src/app/components/search-results/search-results.component.ts
View File

@@ -10,8 +10,7 @@ import {
filter,
take,
debounceTime,
distinctUntilChanged,
switchMap
distinctUntilKeyChanged
} from 'rxjs/operators';
import { Select, Store } from '@ngxs/store';
import { ItemDTO } from 'dist/cat-service/lib/dtos';
@@ -49,7 +48,6 @@ export class SearchResultsComponent implements OnInit {
constructor(
private store: Store,
private router: Router,
private productMapping: ProductMapping,
private productService: ProductService
) {}
@@ -82,30 +80,15 @@ export class SearchResultsComponent implements OnInit {
loadCurrentSearch() {
this.store
.select(state => state.processes)
.subscribe((data: any) => {
const process = data.processes.find(t => t.selected === true);
if (process) {
this.currentSearch = process.search;
}
});
}
onScroll() {
this.store.dispatch(new AllowProductLoad());
this.skip = this.skip + 5;
const search = { ...this.currentSearch, firstLoad: false, skip: this.skip };
this.store.dispatch(new GetProducts(search));
this.store.dispatch(new AddSearch(search));
}
loadProducts() {
this.products$
.select(ProcessState.getCurrentProcess)
.pipe(
filter(f => Array.isArray(f)),
map(items => items.map(item => this.productMapping.fromItemDTO(item)))
filter(p => !!p),
distinctUntilKeyChanged('id')
)
.subscribe(data => (this.products = data));
.subscribe(process => {
this.currentSearch = process.search;
this.updateSearch();
});
}
}

77
src/app/core/store/state/process.state.ts
View File

@@ -76,7 +76,7 @@ export class ProcessState {
if (currenProcces[0]) {
return currenProcces[0];
} else {
return [];
return null;
}
}
@@ -387,7 +387,8 @@ export class ProcessState {
const currentProcess = this.updateBreadcrumbForCurrentProcess(
getCurrentProcess(state.processes),
payload.query,
'/search-results#start');
'/search-results#start'
);
if (
currentProcess.search === payload &&
currentProcess.itemsDTO &&
@@ -425,10 +426,12 @@ export class ProcessState {
}
}
@Action(SetProducts, { cancelUncompleted: true })
setProducts(ctx: StateContext<ProcessStateModel>, { payload, search }: SetProducts) {
setProducts(
ctx: StateContext<ProcessStateModel>,
{ payload, search }: SetProducts
) {
const state = ctx.getState();
const currentProcess = getCurrentProcess(state.processes);
ctx.patchState({
...state,
processes: this.changeProducResultsForCurrentProcess(
@@ -517,11 +520,26 @@ export class ProcessState {
): Process[] {
const newProcessState = processes.map(process => {
if (process.selected === true) {
return { ...this.updateBreadcrumbForCurrentProcess(process, search, '/search-results#start'), itemsDTO: items, loading: false };
return {
...this.updateBreadcrumbForCurrentProcess(
process,
search,
'/search-results#start',
items.length
),
itemsDTO: items,
loading: false
};
}
return { ...this.updateBreadcrumbForCurrentProcess(process, search, '/search-results#start') };
return {
...this.updateBreadcrumbForCurrentProcess(
process,
search,
'/search-results#start'
)
};
});
return newProcessState;
return newProcessState;
}
extendProducResultsForCurrentProcess(
@@ -583,7 +601,13 @@ export class ProcessState {
...state,
processes: state.processes.map(process => {
if (process.selected === true) {
return { ...this.updateBreadcrumbForCurrentProcess(process, payload.name, payload.path) };
return {
...this.updateBreadcrumbForCurrentProcess(
process,
payload.name,
payload.path
)
};
}
return { ...process };
})
@@ -600,41 +624,62 @@ export class ProcessState {
...state,
processes: state.processes.map(process => {
if (process.selected === true) {
return { ...this.updateBreadcrumbForCurrentProcess(process, payload.name, payload.path) };
return {
...this.updateBreadcrumbForCurrentProcess(
process,
payload.name,
payload.path
)
};
}
return { ...process };
})
});
}
updateBreadcrumbForCurrentProcess(process: Process, payload: string, path: string): Process {
updateBreadcrumbForCurrentProcess(
process: Process,
payload: string,
path: string,
hits?: number
): Process {
const hitsMessage = +!!hits ? ` (${hits} Ergebnisse)` : '';
const breadcrumbName = payload + hitsMessage;
const breadcrumbExist = process.breadcrumbs.filter(
(breadcrumb: Breadcrumb) => breadcrumb.name === payload
(breadcrumb: Breadcrumb) =>
breadcrumb.name === breadcrumbName || breadcrumb.name === payload
);
if (breadcrumbExist.length > 0) {
return process;
}
const updatedBreadcrumbs = process.breadcrumbs.map(
(breadcrumb: Breadcrumb) => {
if (breadcrumb.path === path || breadcrumb.path.substring(0, 16) === path.substring(0, 16)) {
return { name: payload, path: path };
if (
breadcrumb.path === path ||
breadcrumb.path.substring(0, 16) === path.substring(0, 16)
) {
return {
name: breadcrumbName,
path: path
};
}
return breadcrumb;
}
);
if (!updatedBreadcrumbs.find(b => b.name === payload)) {
if (!updatedBreadcrumbs.find(b => b.name === breadcrumbName)) {
return <Process>{
...process,
breadcrumbs: [
...process.breadcrumbs,
{
name: payload,
name: breadcrumbName,
path: path
}
]
};
}
return <Process>{
return <Process>{
...process,
breadcrumbs: [...updatedBreadcrumbs]
};

101
src/app/modules/cart/components/cart-review/cart-review.component.ts
View File

@@ -5,7 +5,10 @@ import { Store, Select } from '@ngxs/store';
import { Observable } from 'rxjs';
import { ProcessState } from '../../../../core/store/state/process.state';
import { User } from '../../../../core/models/user.model';
import { ChangeCurrentRoute, AddBreadcrumb } from '../../../../core/store/actions/process.actions';
import {
ChangeCurrentRoute,
AddBreadcrumb
} from '../../../../core/store/actions/process.actions';
import { Breadcrumb } from '../../../../core/models/breadcrumb.model';
import { CatImageService } from 'cat-service';
import { Cart } from '../../../../core/models/cart.model';
@@ -31,7 +34,7 @@ export class CartReviewComponent implements OnInit {
items = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
possibleItems = [1, 2, 3, 4];
books: BookData[] = [];
currentNumberOfItems = 1;
displayItemsNumber = 0;
currentPrice = '';
@@ -45,7 +48,7 @@ export class CartReviewComponent implements OnInit {
private fb: FormBuilder,
private router: Router,
private catImageService: CatImageService
) { }
) {}
ngOnInit() {
this.invoiceForm = this.buildInvoiceForm(this.fb);
@@ -54,9 +57,17 @@ export class CartReviewComponent implements OnInit {
if (user) {
this.processUserData(user);
} else {
this.setInputData('invoice_addrees', 'Karl Schneier I Kazmairstraße 34, 80339 München', this.invoiceForm);
this.setInputData(
'invoice_addrees',
'Karl Schneier I Kazmairstraße 34, 80339 München',
this.invoiceForm
);
this.setInputData('notification_type', 'Email', this.invoiceForm);
this.setInputData('delivery_addrees', 'Karl Schneier I Kazmairstraße 34, 80339 München', this.deliveryForm);
this.setInputData(
'delivery_addrees',
'Karl Schneier I Kazmairstraße 34, 80339 München',
this.deliveryForm
);
}
});
@@ -70,35 +81,51 @@ export class CartReviewComponent implements OnInit {
private processCartData(cart: Cart[]) {
let totalSum = 0;
let totalQuantity = 0;
cart.forEach(async(bookInCart: Cart) => {
cart.forEach(async (bookInCart: Cart) => {
totalSum += bookInCart.book.av[0].price.value.value * bookInCart.quantity;
totalQuantity += bookInCart.quantity;
const currency = bookInCart.book.av[0].price.value.currency;
const formatedPrice = (+Math.round(bookInCart.book.av[0].price.value.value * 100) / 100).toFixed(2).toLocaleString().replace('.', ',');
await this.catImageService.getImageUrl(bookInCart.book.pr.ean).subscribe((url: string) => {
this.books.push(
{
const formatedPrice = (
+Math.round(bookInCart.book.av[0].price.value.value * 100) / 100
)
.toFixed(2)
.toLocaleString()
.replace('.', ',');
await this.catImageService
.getImageUrl(bookInCart.book.pr.ean)
.subscribe((url: string) => {
this.books.push({
book: bookInCart.book,
quantity: bookInCart.quantity,
currency: currency,
price: formatedPrice,
imgUrl: url
}
);
});
})
});
});
});
this.displayItemsNumber = totalQuantity;
this.currentPoints = totalQuantity * points;
this.booksTotalSum = totalSum;
this.booksTotalSumString = (+Math.round(totalSum * 100) / 100).toFixed(2).toLocaleString().replace('.', ',');
this.booksTotalSumString = (+Math.round(totalSum * 100) / 100)
.toFixed(2)
.toLocaleString()
.replace('.', ',');
}
private processUserData(user: User) {
this.user = user;
const invoiceAddress = `${user.invoice_address.street} ${user.invoice_address.zip} ${user.invoice_address.city}`;
const deliveryAddress = `${user.delivery_addres.street} ${user.delivery_addres.zip} ${user.delivery_addres.city}`;
this.setInputData('invoice_addrees', invoiceAddress ? invoiceAddress : deliveryAddress, this.invoiceForm);
const invoiceAddress = `${user.invoice_address.street} ${
user.invoice_address.zip
} ${user.invoice_address.city}`;
const deliveryAddress = `${user.delivery_addres.street} ${
user.delivery_addres.zip
} ${user.delivery_addres.city}`;
this.setInputData(
'invoice_addrees',
invoiceAddress ? invoiceAddress : deliveryAddress,
this.invoiceForm
);
this.setInputData('notification_type', 'Email', this.invoiceForm);
this.setInputData('delivery_addrees', deliveryAddress, this.deliveryForm);
}
@@ -108,8 +135,8 @@ export class CartReviewComponent implements OnInit {
const newBread: Breadcrumb = {
name: 'Kundendetails',
path: 'customer-edit/' + this.user.id
}
};
this.store.dispatch(new AddBreadcrumb(newBread));
const currentRoute = 'customer-edit/' + this.user.id;
this.store.dispatch(new ChangeCurrentRoute(currentRoute));
@@ -117,7 +144,7 @@ export class CartReviewComponent implements OnInit {
}
}
setNumberOfItems (numberOfItems: number, id: number, book: BookData) {
setNumberOfItems(numberOfItems: number, id: number, book: BookData) {
const updatedBooks = this.books.map((bookToUpdate: BookData) => {
if (bookToUpdate.book.id === book.book.id) {
bookToUpdate.quantity = numberOfItems;
@@ -142,7 +169,10 @@ export class CartReviewComponent implements OnInit {
this.displayItemsNumber = totalQuantity;
this.booksTotalSum = totalSum;
this.booksTotalSumString = (+Math.round(totalSum * 100) / 100).toFixed(2).toLocaleString().replace('.', ',');
this.booksTotalSumString = (+Math.round(totalSum * 100) / 100)
.toFixed(2)
.toLocaleString()
.replace('.', ',');
this.currentPoints = totalQuantity * points;
}
@@ -154,7 +184,7 @@ export class CartReviewComponent implements OnInit {
let text = document.getElementById('drop_txt_' + i);
let icon = document.getElementById('drop_img_' + i);
if(text && text.classList.contains('dropdown-selected-text-active')) {
if (text && text.classList.contains('dropdown-selected-text-active')) {
text.classList.remove('dropdown-selected-text-active');
icon.classList.remove('open-icon');
icon.classList.add('close-icon');
@@ -165,15 +195,14 @@ export class CartReviewComponent implements OnInit {
icon.classList.add('open-icon');
ele.style.display = 'none';
}
}
}
const ele = document.getElementById('drop_' + id);
const text = document.getElementById('drop_txt_' + id);
const icon = document.getElementById('drop_img_' + id);
if(text.classList.contains('dropdown-selected-text-active')) {
if (text.classList.contains('dropdown-selected-text-active')) {
text.classList.remove('dropdown-selected-text-active');
} else {
text.classList.add('dropdown-selected-text-active');
@@ -182,11 +211,11 @@ export class CartReviewComponent implements OnInit {
if (!ele.style.display || ele.style.display === 'none') {
// open
var rect = icon.getBoundingClientRect();
ele.style.top = (rect.top + 33) + 'px';
ele.style.left = (rect.left - 30) + 'px';
ele.style.top = rect.top + 33 + 'px';
ele.style.left = rect.left - 30 + 'px';
ele.style.display = 'flex';
icon.classList.remove('open-icon');
icon.classList.add('close-icon');
icon.classList.add('close-icon');
} else {
icon.classList.remove('close-icon');
icon.classList.add('open-icon');
@@ -198,25 +227,29 @@ export class CartReviewComponent implements OnInit {
this.payMethodDialog.openDialog();
}
private setInputData (field: string, val: string, form: FormGroup) {
private setInputData(field: string, val: string, form: FormGroup) {
form.get(field).patchValue(val);
form.get(field).disable();
}
get f() { return this.invoiceForm.controls; }
get f() {
return this.invoiceForm.controls;
}
get deliveryF() { return this.deliveryForm.controls; }
get deliveryF() {
return this.deliveryForm.controls;
}
private buildInvoiceForm(fb: FormBuilder) {
return fb.group({
invoice_addrees: ['', Validators.required],
notification_type: ['', Validators.required],
notification_type: ['', Validators.required]
});
}
private buildDeliveryForm(fb: FormBuilder) {
return fb.group({
delivery_addrees: ['', Validators.required],
delivery_addrees: ['', Validators.required]
});
}
}