ng-easycommerce-v18 0.0.1 → 0.0.3

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-ec.component.ts

@@ -1,103 +0,0 @@
-import { AsyncPipe } from '@angular/common';
-import { Component, inject, OnInit } from '@angular/core';
-import { CheckoutService, PaymentService } from '../../../ec-services';
-import { TranslateModule } from '@ngx-translate/core';
-import { BehaviorSubject } from 'rxjs';
-import { LoadingInlineEcComponent } from '../../widgets-ec';
-import { MpRedirectEcComponent, OfflineEcComponent } from './payment-methods';
-import { BankTransferEcComponent } from './payment-methods/bank-transfer-ec/bank-transfer-ec.component';
-
-@Component({
-	selector: 'app-payment-ec',
-	standalone: true,
-	templateUrl: './payment-ec.component.html',
-	styleUrls: ['./payment-ec.component.scss'],
-	imports: [AsyncPipe,
-		TranslateModule,
-		LoadingInlineEcComponent,
-		MpRedirectEcComponent,
-		BankTransferEcComponent,
-		OfflineEcComponent
-	]
-})
-export class PaymentEcComponent implements OnInit {
-
-	private _paymentService: PaymentService = inject(PaymentService)
-	private _checkoutService: CheckoutService = inject(CheckoutService)
-
-	private _methodDataSubject = new BehaviorSubject<any>(null);
-	private _loadingSubject = new BehaviorSubject<boolean>(false);
-
-	public methods$ = this._paymentService.methods$;
-	public loading$ = this._loadingSubject.asObservable();
-	public methodData$ = this._methodDataSubject.asObservable();
-
-	public loadingInternal: boolean = false;
-
-	constructor() { }
-
-	ngOnInit() {
-	}
-	setActive($event: any) {
-		const parent = $event.target.parentElement.children;
-		for (const button of parent) {
-			if (button.classList.contains('active')) {
-				button.classList.remove('active')
-			}
-		}
-		$event.target.classList.add("active")
-	}
-	async setMethod(method: any) {
-		this._methodDataSubject.next(null);
-		let result = await this._paymentService.putPayment(method.code);
-		this._methodDataSubject.next(method);
-	}
-
-	//Funciones para chequear el metodo de pago.
-	isRedirectRedsys = (code: string) => !!code?.toLowerCase().includes('redsys_redirect')
-	isRedirectCecaBank = (code: string) => !!code?.toLowerCase().includes('ceca_bank_redirect')
-	isMP = (code: string) => {
-		const lowerCode = code?.toLowerCase() || '';
-		return lowerCode.includes('mercado_pago') && !lowerCode.includes('credit');
-	}
-	isMPTarjetaDeCredito = (code: string) => !!code?.toLowerCase().includes('credit')
-	isMethodOffline = (code: string) => !!code?.toLowerCase().includes('offline')
-	isPeyPalExpress = (code: string) => {
-		const lowerCode = code?.toLowerCase() || '';
-		return lowerCode.includes('paypal') && lowerCode.includes('express');
-	}
-	isMobbex = (code: string) => !!code?.toLowerCase().includes('mobbex')
-	isBancard = (code: string) => !!code?.toLowerCase().includes('bancard')
-	isDecidir = (code: string) => !!code?.toLowerCase().includes('decidir')
-	isCulqi = (code: string) => !!code?.toLowerCase().includes('culqi')
-	isBankTransfer = (code: string) => !!code?.toLowerCase().includes('bank_transfer')
-	isCatastro = (code: string) => !!code?.toLowerCase().includes('catastro')
-	isBamboo = (code: string) => !!code?.toLowerCase().includes('bamboo')
-
-	allData(): any {
-		throw new Error('Method not implemented.');
-	}
-	emitResult = async () => {
-		this._paymentService.setPayment(this._methodDataSubject.getValue())
-		this.setLoading(false)
-		this.next()
-	}
-
-	public setLoading = (estado = true) => {
-		this._loadingSubject.next(estado);
-		return true;
-	}
-
-	public verifyValidate = ($event:any) => {
-		this.setLoading(true)
-		setTimeout(() => this.emitResult(), 1000);
-	}
-
-	public next = () => {
-		this._checkoutService.next()
-	}
-
-	public goBack = () => {
-		this._checkoutService.back()
-	}
-}

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-methods/bank-transfer-ec/bank-transfer-ec.component.html

@@ -1,28 +0,0 @@
-<div class="row px-0 description-cont">
-
-  @for(line of method.description.split('\r\n');track $index; let i=$index){
-    <p [id]="'faqs-'+i" [class]="'qt px-5 m-0 line-'+i">{{ line }}</p>
-  }
-</div>
-@if(method.instructions){
-  <hr />
-  <div class="row px-0 instructions-cont mb-1">
-  <h5 class="instructions-title">{{ ('instructions' | translate) }}</h5>
-  @for(line of method.instructions.split('\r\n'); track $index; let i=$index){
-    <p [class]="'px-5 m-0 instructions-text line-'+i ">{{ line }}</p>
-  }
-</div>
-}
-
-<div class="end-button">
-  <button class="btn btn-outline-primary" (click)="setLoading() && verifyValidate()">{{
-    ('pay-with-transfer'
-    | translate) }}</button>
-</div>
-<!-- @if(loading$ | async; as loading){
-  @if(loading){
-  <div class="mt-2">
-    <app-loading-inline-ec></app-loading-inline-ec>
-  </div>
-  }
-} -->

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-methods/bank-transfer-ec/bank-transfer-ec.component.ts

@@ -1,26 +0,0 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import { LoadingFullEcComponent, LoadingInlineEcComponent } from '../../../../widgets-ec';
-import { TranslateModule } from '@ngx-translate/core';
-import { AsyncPipe } from '@angular/common';
-
-@Component({
-	selector: 'app-bank-transfer-ec',
-	standalone: true,
-	templateUrl: './bank-transfer-ec.component.html',
-	styleUrls: ['./bank-transfer-ec.component.scss'],
-	imports: [LoadingInlineEcComponent, TranslateModule, AsyncPipe],
-})
-export class BankTransferEcComponent implements OnInit {
-	
-	@Input({
-		required: true,
-	}) method: any;
-	@Input() verifyValidate:any;
-	@Input() setLoading:any;
-	
-	constructor() { }
-
-	ngOnInit() {
-	}
-
-}

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-methods/mp-redirect-ec/mp-redirect-ec.component.html

@@ -1,33 +0,0 @@
-<div class="text-center">
-	@if(url){
-		@if(!loading){
-			<button (click)="iniciar()" class="btn btn-outline-primary rounded-0 comprar mt-3">Pagar</button>
-		} @else {
-			<div class="d-flex flex-column jusitfy-content-center align-items-center mt-2">
-				<h3>Procesando el pago por mercado pago</h3>
-				<h5>Recuerde hacer click en "Volver al sitio" desde mercado pago para finalizar la compra.</h5>
-				<app-loading-full-ec></app-loading-full-ec>
-			</div>
-			<div class="container-fluid">
-				<div class="row">
-					<div class="col-5">
-						<hr>
-					</div>
-					<div class="col-2 text-center">
-						<label for="">o</label>
-					</div>
-					<div class="col-5">
-						<hr>
-					</div>
-				</div>
-			</div>
-			<div class="d-flex flex-column jusitfy-content-center align-items-center mt-2">
-				<button (click)="clickClose()" class="btn btn-outline-secondary rounded-0 comprar">Cancelar pago</button>
-			</div>
-		}
-	} @else{
-	<div class="d-flex flex-column jusitfy-content-center align-items-center mt-2">
-		<app-loading-full-ec></app-loading-full-ec>
-	</div>
-	}
-</div>

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-methods/mp-redirect-ec/mp-redirect-ec.component.ts

@@ -1,116 +0,0 @@
-import { Component, EventEmitter, inject, Input, OnInit, Output } from '@angular/core';
-import { PaymentService, ToastService } from '../../../../../ec-services';
-import { LoadingFullEcComponent } from '../../../../widgets-ec';
-
-@Component({
-	selector: 'app-mp-redirect-ec',
-	standalone: true,
-	templateUrl: './mp-redirect-ec.component.html',
-	styleUrls: ['./mp-redirect-ec.component.scss'],
-	imports: [LoadingFullEcComponent]
-})
-export class MpRedirectEcComponent implements OnInit {
-
-	private _paymentService: PaymentService = inject(PaymentService)
-	private _toastService: ToastService = inject(ToastService)
-
-	@Input() method = null;
-	@Input() total_amount = 0;
-	@Input() allData: any;
-	@Output() ready = new EventEmitter();
-
-	protected preference: any;
-
-	public loading = false;
-	public url: any;
-	public closeModal = ''
-	public ventana: any;
-
-	constructor() { }
-
-	ngOnInit() {
-		this.getPreference()
-	}
-	clickClose = () => {
-		/*  this.closeModal = 'cancel'
-		 this.ventana?.close() */
-	}
-
-	iniciar = () => {
-		this.closeModal = ''
-		this.clearStorageState()
-		this.ventana = window.open(this.url)
-		this.callState()
-	}
-
-	callState = () => {
-        let state = this.closeModal != '' ? this.closeModal : localStorage.getItem('state')
-        !state && this.ventana.closed && (state = 'cancel')
-        this.loading = true
-        state && console.log(state);
-        if (state) {
-            this.loading = false
-            localStorage.removeItem('state')
-            if (state == 'success') {
-                this.ventana?.close()
-                this.ready.emit(true)
-                return   
-            }
-            if (state == 'pending') {
-                this.ventana?.close()
-                this.ready.emit(true)
-                return
-            }
-            if (state == 'failure') {
-                this.ventana?.close()
-                this.processError('')
-                return   
-            }
-            if (state == 'cancel') {
-                this.ventana?.close()
-                this.processError('Se cancelo el pago con mercado pago')
-                return   
-            }
-            this.ventana?.close()
-            this.processError('')
-            return  
-        }
-        setTimeout(() => {
-            this.callState()
-        }, 5000);    
-        
-    }
-	processError = (err:any) => {
-        this._toastService.show(err != '' ? err : 'payment-error');
-        console.log("ERROR ENVIO BACK  ", err);
-    }
-	clearStorageState = () => {
-        sessionStorage.removeItem('state')
-        localStorage.removeItem('state')
-    }
-
-	getPreference = () =>
-		this._paymentService.getPreference(this.allData).then(
-			res => {	
-				this.preference = res;
-				this.url = this.preference.init_point
-				this.renderMP(this.preference);
-			},
-			err => this.setError('operation-error')
-		);
-	setError = (message:any) => {
-		//this.error = message;
-	}
-	renderMP = (preference: any) => {
-		window.addEventListener("message", (event) => {
-			if (event.origin !== 'https://www.mercadopago.com.ar' || !event.data.type) {
-				return;
-			}
-			let dataType = event.data.type;
-			if (dataType === 'submit') {
-				const paymentData = event.data.value;
-				return;
-			}
-		});
-	}
-}

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-methods/offline-ec/offline-ec.component.html

@@ -1,13 +0,0 @@
-<p id="faqs" class="qt px-5">{{ method.description }}</p>
-<p class="px-5">{{ method.instructions }}</p>
-<div class="end-button">
-	<button class="btn comprar" (click)="setLoading() && verifyValidate()">{{
-		('pay-with-offline'| translate) }}</button>
-</div>
-<!-- @if(loading$ | async; as loading){
-  @if(loading){
-  <div class="mt-2">
-    <app-loading-inline-ec></app-loading-inline-ec>
-  </div>
-  }
-} -->

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/payment-ec/payment-methods/offline-ec/offline-ec.component.ts

@@ -1,26 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { LoadingInlineEcComponent } from '../../../../widgets-ec';
-import { TranslateModule } from '@ngx-translate/core';
-
-@Component({
-	selector: 'app-offline-ec',
-	standalone: true,
-	templateUrl: './offline-ec.component.html',
-	styleUrls: ['./offline-ec.component.scss'],
-	imports: [
-		LoadingInlineEcComponent,
-		TranslateModule
-	]
-})
-export class OfflineEcComponent implements OnInit {
-	@Input({
-		required: true,
-	}) method: any;
-	@Input() verifyValidate: any;
-	@Input() setLoading: any;
-	constructor() { }
-
-	ngOnInit() {
-	}
-
-}

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/shipment-ec/shipment-ec.component.html

@@ -1,111 +0,0 @@
-<div class="container-fluid">
-	<div class="col-12">
-		<div class="card text-center">
-			<div class="card-header text-dark">
-				<h4>{{ 'select-method' | translate }}</h4>
-				@if(methods$ | async; as methods){
-					<div class="btn-toolbar justify-content-center" role="toolbar" aria-label="Envios toolbar">
-						<div class="" role="group" aria-label="Grupo botones envio">
-							<div class="d-flex align-content-start justify-content-center flex-wrap">
-								@for(method of filterMethods(methods); track $index){
-								<button [disabled]="buttonsDisabled" type="button"
-									class="btn btn-outline-secondary mx-1 mb-1"
-									(click)="setMethod(method); setActive($event)">
-									{{ method.name | translate }}
-								</button>
-								}
-							</div>
-
-
-						</div>
-					</div>
-				}@else {
-					<div class="d-flex flex-row w-100 justify-content-center mt-2">
-						<h5 class="text-secondary">{{'no-shipment-methods'|translate}}</h5>
-					</div>
-				}
-			</div>
-			<div class="card-body">
-				@if(moreInfoInMethod && methodSelect && methodSelect.description){
-                <div class="row justify-content-center mb-2">
-                    <div class="col-12 col-md-6 col-lg-4 d-flex flex-column mb-2" [id]="methodSelect.code">
-                      @for(line of methodSelect.description.split('\r\n'); track $index; let i=$index){
-                        <span [id]="methodSelect.code+'-'+i" [class]="'line-'+i">{{line}}</span>
-					  }
-                    </div>
-                </div>}
-				@if(costs$ | async; as costs){
-<!-- 				 @if(costs){ -->
-                <div class="row justify-content-center">
-                    @if(!loadingInternal){
-						@for(cost of costs; track $index; let y = $index){
-                        <div class="col-auto text-dark">
-							@if(cost.contracts.length > 0){
-								@if(costs.length > 1){
-									<span><b>{{ cost.name | translate }}</b></span>
-									<hr />
-								}@else{
-									<span><b>{{ methodSelect.name | translate }}</b></span>
-									<hr />
-								}
-								@for(contract of cost.contracts; track $index; let i = $index){
-                                <div class="option">
-                                    <div class="form-check current-contract">
-                                        <input class="form-check-input" [checked]="(y === 0 && i === 0) ? true : contract.selected" type="radio" name="card" [id]="cost.name + i"
-                                            value="dark" (click)="verifyValidate(costs,cost.name, contract)">
-                                        <label class="form-check-label" [for]="cost.name + i" aria-label="Dark grey">
-                                            @if(validName(contract.name)){
-											<span
-                                                [class]="(cost.name == 'home_delivery') ? 'shipment-contractname home_delivery' : 'shipment-contractname' ">
-												{{ contract.name | translate }}
-											</span>}
-											@if(contract.computed){
-												<span><br class="shipment-contractname">{{ contract.computed | translate }}
-													<br class="shipment-contractname">
-												</span>
-											}
-											@if(contract.detail){
-                                            <div class="contract-detail">
-												@for(line of contract.detail.split(' - '); track $index; let i = $index){
-                                                <div [class]="'contrat-item-'+i">
-                                                    @if(i == 0){<span><b>{{ line }}</b></span>}
-                                                    @if(i > 0){<span class="inside-detail">{{ line }}</span>}
-                                                </div>
-												}
-                                            </div>
-											}
-											@if(contract.price > 0){
-                                            <span [class]="'inside-detail ' + ( costos?.amount == 0 ? ' free ' : '') ">
-                                                @if(!contract.computed){<br class="shipment-contractname">}
-                                                {{ ('price'|translate) + ': ' + (contract.price | ecCurrencySymbol) }}</span>
-											}
-                                            <br>
-                                        </label>
-                                    </div>
-                                </div>
-								}
-                            
-							}
-                        </div>
-						}
-                    }@else {
-						<app-loading-full-ec></app-loading-full-ec>
-					}
-                </div>
-				}
-				
-            </div>
-
-		</div>
-		<div class="row d-flex flex-row">
-			<div class="col-12 d-flex justify-content-between">
-				<button class="btn btn-primary text-white" (click)="goBack()">{{'back'|translate}}</button>
-				<button type="submit" (click)="next()" class="btn btn-primary text-white">{{(isLastOne
-					? 'finish-checkout' :'ready-form') | translate}}
-					<!-- {{(allready_data ? 'update' : (isLastOne ? 'finish-checkout' : 'ready-form')) | translate}}  -->
-				</button>
-			</div>
-		</div>
-	</div>
-
-</div>

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/shipment-ec/shipment-ec.component.ts

@@ -1,111 +0,0 @@
-import { afterNextRender, Component, inject, OnInit } from '@angular/core';
-import { TranslateModule } from '@ngx-translate/core';
-import { LoadingFullEcComponent } from '../../widgets-ec';
-import { AsyncPipe, JsonPipe } from '@angular/common';
-import { CheckoutService, ShipmentService } from '../../../ec-services';
-import { EcCurrencySymbolPipe } from '../../../ec-pipe';
-import { Observable } from 'rxjs';
-
-@Component({
-	selector: 'app-shipment-ec',
-	standalone: true,
-	templateUrl: './shipment-ec.component.html',
-	styleUrls: ['./shipment-ec.component.scss'],
-	imports: [LoadingFullEcComponent, TranslateModule, AsyncPipe, EcCurrencySymbolPipe, JsonPipe]
-})
-export class ShipmentEcComponent implements OnInit {
-
-	private _shipmentService: ShipmentService = inject(ShipmentService)
-	private _checkoutService: CheckoutService = inject(CheckoutService)
-
-	public methods$ = this._shipmentService.methods$;
-	public isLastStep$ = this._checkoutService.isLastStep$;
-
-	private _hiddenMethods: string[] = ['UPS']
-	public buttonsDisabled: boolean = false
-	public methodSelect: any;
-	public loadingInternal: boolean = false
-	public moreInfoInMethod: boolean = false;
-	public costos: any = null
-	public costs$: Observable<any[]> = this._shipmentService.costs$;
-	public isLastOne: boolean = false;
-	public enabledConfirmButton: boolean = false
-	
-	constructor() {
-		this.isLastStep$.subscribe(res => this.isLastOne = res);
-	}
-
-	ngOnInit() {
-		this._shipmentService.getShipmentMethods();
-		this._checkoutService.associatedData$.subscribe(data => {
-			console.log(data)
-			this.costos = data && data.find((value: any) => value.type == "shipment") || null
-		})
-		this.moreInfoInMethod = true //ShipmentService.moreInfoInMethod;
-	}
-
-	filterMethods(methods: any) {
-		return methods.filter((method: any) => !this._hiddenMethods.includes(method.name))
-	}
-
-	setMethod(method: any) {
-		this.methodSelect = method;
-		this.loadingInternal = true;
-
-		// Deshabilitar todos los botones
-		this.buttonsDisabled = true;
-
-		//     setTimeout(() => {
-		this._shipmentService.setMethod(method.code).then(res => {
-			this.loadingInternal = false;
-
-			// Habilitar todos los botones
-			this.buttonsDisabled = false;
-		}).catch(error => {
-			// En caso de error, también habilitar los botones
-			this.loadingInternal = false;
-			this.buttonsDisabled = false;
-			console.error("Error:", error);
-		});
-	}
-
-	setActive(e: any) {
-		const parent = e.target.parentElement.children;
-		for (const button of parent) {
-			if (button.classList.contains('active')) {
-				button.classList.remove('active')
-			}
-		}
-		e.target.classList.add("active")
-	}
-
-	validName(name: any) {
-		return isNaN(name);
-	}
-	emitResult = (method_name: string, contract_data: any) => {
-		
-		contract_data = {
-			...contract_data,
-			shipping_method_contract: method_name + '_' + contract_data.name,
-			shipping_method_branch_code: method_name == "branch_delivery" ? contract_data.sucursal_id : contract_data.name,
-		}
-		//console.log("emitResult", contract_data);
-		this._shipmentService.setContract(contract_data);
-	}
-	verifyValidate(costs: any[], contract: any, data: any) {
-		try {
-			costs.forEach((cost: any) => cost.contracts.forEach((co: any) => co.selected = false))
-			costs.find((cost: any) => cost.name == contract).contracts.find((contra: any) => contra.name == data.name).selected = true
-		} catch (error) {
-			console.log("error al buscar contrato", error);
-		}
-		this.emitResult(contract, data);
-	}
-
-	goBack() {
-		this._checkoutService.back();
-	}
-	next() {
-		this._checkoutService.next()
-	}
-}

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/step-container-ec/step-container-ec.component.html

@@ -1,33 +0,0 @@
-<div>
-    @for(step of steps; track $index; let x=$index){
-        <div [id]="'test-l-'+step.priority" class="content">
-         <!-- <app-step-ec [step_id]="step.step" [id_step]="x+1" [previousStep]="steps[x-1] ? steps[x-1].name : step.name"  [nextStep]="steps[x+1] ? next : endCheckout" [goBack]="goBack" [lastStep]="steps[x+1] ? false : true">
-         </app-step-ec>   -->
-            @switch (step.name) {
-                @case ('address') {
-                    @if(step.state == 'ready') {
-                    <app-dataform-ec />
-                    }
-                }
-                @case ('payment') {
-                    @if(step.state == 'ready') {
-                    <app-payment-ec />
-                    }
-                }
-                @case ('shipment') {
-                    @if(step.state == 'ready') {
-                    <app-shipment-ec />
-                    }
-                }
-            }
-        </div>
-    }
-    <!-- <div class="row d-flex flex-row">
-        <div class="col-6 d-flex justify-content-start">
-            <button type="button" class="btn btn-primary text-white" (click)="back()">Anterior</button>
-        </div>
-        <div class="col-6 d-flex justify-content-end">
-            <button type="button" class="btn btn-primary text-white" (click)="next()">Siguiente</button>
-        </div>
-    </div> -->
-</div>

package/projects/ng-easycommerce/src/lib/ec-components/checkout-ec/step-container-ec/step-container-ec.component.ts

@@ -1,39 +0,0 @@
-import { Component, inject, Input } from '@angular/core';
-import { IStep } from '../../../interfaces';
-import { CheckoutService } from '../../../ec-services';
-import { Step } from '../../../classes';
-import { DataformEcComponent } from '../dataform-ec/dataform-ec.component';
-import { ShipmentEcComponent } from '../shipment-ec/shipment-ec.component';
-import { PaymentEcComponent } from '../payment-ec/payment-ec.component';
-
-@Component({
-	selector: 'app-step-container-ec',
-	standalone: true,
-	imports: [
-		DataformEcComponent,
-		ShipmentEcComponent,
-		PaymentEcComponent
-	],
-	templateUrl: './step-container-ec.component.html',
-	styleUrl: './step-container-ec.component.scss'
-})
-export class StepContainerEcComponent {
-	private _checkoutService: CheckoutService = inject(CheckoutService);
-
-	@Input({
-		required: true,
-	}) steps!: Step[];
-	
-	constructor(){
-		console.log('step-container-ec');
-	}
-
-	next(){
-		this._checkoutService.next()
-	}
-
-	back() {
-		this._checkoutService.back()
-	}
-
-}