File: /var/www/vhost/disk-apps/pwa.sports-crowd.com/src/app/pages/item-detail/item-detail.ts
import { Component, OnInit, ViewChild } from "@angular/core";
import { ModalController, AlertController, IonRouterOutlet, IonInfiniteScroll } from "@ionic/angular";
import { DomSanitizer, SafeStyle } from "@angular/platform-browser";
import { StorageService } from '../../services/storage.service';
import { Router } from "@angular/router";
import { TranslateService } from "@ngx-translate/core";
import { FiltersPage } from "../filters/filters";
import { HomeService } from "../../services/home.service";
import { CartService } from "../../services/cart.service";
import { CityService } from "../../services/city.service";
import { UtilsService } from "../../services/utils.service";
@Component({
selector: "page-item-detail",
templateUrl: "item-detail.html",
styleUrls: ["./item-detail.scss"],
})
export class ItemDetailPage implements OnInit {
@ViewChild(IonInfiniteScroll) infiniteScroll: IonInfiniteScroll;
category: any;
listSubcategories: any;
backgroundImg: SafeStyle;
subCategorySegment: string;
offset = 0;
take = 10;
infoSubcategory: any;
listProductsSubcategory: {} = [];
listProducts: any = [];
searchProduct = "";
listProductsChanged: number = 0;
activeInfinite: any;
valueOrder: string = "order";
orderSorting: string = "ASC";
discountCategory: any = [];
emptySettingsSlide: any;
constructor(
public modalCtrl: ModalController,
private sanitizer: DomSanitizer,
private storage: StorageService,
public homeProvider: HomeService,
public cityProvider: CityService,
public cartProvider: CartService,
public utilsService: UtilsService,
public alertCtrl: AlertController,
private translate: TranslateService,
private routerOutlet: IonRouterOutlet,
private router: Router
) {
this.category = this.homeProvider._currentCategory;
if (this.category) {
this.backgroundImg = this.sanitizer.bypassSecurityTrustStyle("url(" + cityProvider._urlGallery + "categories/" + this.category.image + ")");
this.subCategorySegment = this.category.name;
}
}
ngOnInit() {
this.emptySettingsSlide = {
showImage: false,
urlImage: "",
showText: true,
text: this.translate.instant("NO_PRODUCTS"),
};
this.loadData();
}
async loadData() {
await this.storage.get("token").then(async (token) => {
if (token) {
await this.utilsService.presentLoading(this.translate.instant("all.loading")).then(async () => {
(await this.homeProvider.listSubcategories(this.category.id, token.access_token)).subscribe(
(resp) => {
this.utilsService.dismissLoading();
if (resp["status"] == "success") {
this.listSubcategories = resp["subcategories"];
this.discountCategory = resp["discountCategory"];
if (this.discountCategory && this.cartProvider.validateDateDiscount(this.discountCategory)) {
this.showAlertDiscountCategory(this.discountCategory, this.category.name);
}
this.infoSubcategory = this.listSubcategories.find((subcategory: any) => subcategory.name === this.category.name);
if (!this.infoSubcategory && this.listSubcategories.length)
this.infoSubcategory = this.listSubcategories[0];
this.getListProductsSubcategories(this.infoSubcategory.id, this.offset, this.take, this.valueOrder, this.orderSorting);
}
},
(error) => {
this.utilsService.dismissLoading();
console.log("error listSubcategories: ", error);
}
);
});
}
});
}
toggleInfiniteScroll() {
this.infiniteScroll.disabled = !this.infiniteScroll.disabled;
}
showAlertDiscountCategory(discount, category_name) {
let subTitle = "";
if (discount.apply_value) {
if (discount.percentage_discount) {
subTitle =
"Por compras superiores a $" +
discount.value_for_win +
" en la categoría " +
category_name +
" o en cualquiera de sus subcategorías obtendrás un " +
discount.percentage_discount +
"% de descuento en cada producto.";
} else {
subTitle =
"Por compras superiores a $" +
discount.value_for_win +
" en la categoría " +
category_name +
" o en cualquiera de sus subcategorías obtendrás $" +
discount.price_discount +
" pesos de descuento en cada producto.";
}
} else {
if (discount.percentage_discount) {
subTitle =
"Por compras superiores a $" +
discount.value_for_win +
" en la categoría " +
category_name +
" o en cualquiera de sus subcategorías obtendrás un " +
discount.percentage_discount +
"% de descuento en el valor del domicilio.";
} else {
subTitle =
"Por compras superiores a $" +
discount.value_for_win +
" en la categoría " +
category_name +
" o en cualquiera de sus subcategorías obtendrás $" +
discount.price_discount +
" pesos de descuento en el valor del domicilio.";
}
}
this.alertDiscount(subTitle);
}
async alertDiscount(subTitle) {
const alert = await this.alertCtrl.create({
header: "¡ Descuento Activo !",
message: subTitle,
buttons: ["OK"],
});
await alert.present();
}
getListProductsSubcategories(subcategory_id, offset, take, valueOrder, orderSorting, infiniteScroll?) {
this.storage.get("token").then((token) => {
if (token) {
this.utilsService.presentLoading(this.translate.instant("all.loading")).then(async () => {
(await this.homeProvider.listProductsSubcategory(subcategory_id, offset, take, valueOrder, orderSorting, this.cartProvider.storeType, token.access_token)).subscribe(
(data) => {
if ((data["status"] = "success")) {
for (let i = 0; i < data["listProducts"].length; i++) {
let product = data["listProducts"][i];
product.category = this.category;
this.listProducts.push(product);
}
this.utilsService.dismissLoading();
if (infiniteScroll) {
infiniteScroll.target.complete();
if (this.offset > this.listProducts.length && !this.infiniteScroll.disabled) {
this.toggleInfiniteScroll();
}
}
}
},
(error) => {
console.log("error getListProductsSubcategories: ", error);
this.utilsService.dismissLoading();
}
);
});
}
});
}
moreProducts(infiniteScroll) {
this.offset += 10;
if (this.searchProduct != "") {
this.getProductsFilter(this.searchProduct.trim(), this.infoSubcategory.id, this.offset, this.take, infiniteScroll);
} else {
this.getListProductsSubcategories(this.infoSubcategory.id, this.offset, this.take, this.valueOrder, this.orderSorting, infiniteScroll);
}
}
changedSubcategory(e) {
if (e.detail.value) {
this.listProducts = [];
this.offset = 0;
this.subCategorySegment = e.detail.value;
this.infoSubcategory = this.listSubcategories.find((subcategory) => subcategory.name == this.subCategorySegment);
if (this.activeInfinite) {
this.activeInfinite.enable(true);
}
this.getListProductsSubcategories(this.infoSubcategory.id, this.offset, this.take, this.valueOrder, this.orderSorting);
}
}
getProductsFilter(valueSearch, subCategory_id, offset, take, infiniteScroll?) {
this.storage.get("token").then((token) => {
if (token) {
this.utilsService.presentLoading(this.translate.instant("all.loading")).then(async () => {
(await this.homeProvider.getProductsSubcategoryFilter(valueSearch, subCategory_id, offset, take, this.cartProvider.storeType, token.access_token)).subscribe(
(data) => {
if ((data["status"] = "success")) {
for (let i = 0; i < data["listProducts"].length; i++) {
this.listProducts.push(data["listProducts"][i].products[0]);
// if (data["listProducts"][i].products[0].percentage_discount > 0 || data["listProducts"][i].products[0].flash_price > 0) {
// this.listProductsChanged++;
// }
}
this.utilsService.dismissLoading();
if (infiniteScroll) {
infiniteScroll.complete();
this.activeInfinite = infiniteScroll;
}
if (infiniteScroll && this.offset > this.listProducts.length) {
infiniteScroll.enable(false);
} else if (infiniteScroll) {
this.activeInfinite.enable(true);
}
}
},
(error) => {
console.log("error getProductsFilter: ", error);
this.utilsService.dismissLoading();
}
);
});
}
});
}
openModalTrends() {
if (this.cartProvider.storeType == "main") {
this.router.navigate(["/app/tabs/shop/trends"]);
} else {
this.router.navigate(["/shop/" + this.cartProvider.storeType + "/trends"]);
}
}
async modalFilters(filterOrder) {
const modal = await this.modalCtrl.create({
component: FiltersPage,
swipeToClose: true,
presentingElement: this.routerOutlet.nativeEl,
componentProps: { filterOrder },
});
await modal.present();
const { data } = await modal.onWillDismiss();
if (data.status) {
if (data.valueOrder == "order") {
this.valueOrder = "order";
this.orderSorting = "ASC";
}
if (data.valueOrder == "lowerPrice") {
this.valueOrder = "price";
this.orderSorting = "ASC";
}
if (data.valueOrder == "higherPrice") {
this.valueOrder = "price";
this.orderSorting = "DESC";
}
this.listProducts = [];
this.offset = 0;
if (this.activeInfinite) {
this.activeInfinite.enable(true);
}
this.getListProductsSubcategories(this.infoSubcategory.id, this.offset, this.take, this.valueOrder, this.orderSorting);
}
}
openModalOrderProducts() {
let filterOrder;
if (this.valueOrder == "order") {
filterOrder = this.valueOrder;
}
if (this.valueOrder == "price" && this.orderSorting == "ASC") {
filterOrder = "lowerPrice";
}
if (this.valueOrder == "price" && this.orderSorting == "DESC") {
filterOrder = "higherPrice";
}
this.modalFilters(filterOrder);
}
goToCart() {
if (this.cartProvider.storeType == "main") {
this.router.navigate(["/app/tabs/shop/cart"]);
} else {
this.router.navigate(["/shop/" + this.cartProvider.storeType + "/cart"]);
}
}
goBack() {
this.routerOutlet.pop();
}
}