Commit e21ccbaa authored by alish's avatar alish
Browse files

feat: init remove products of order

parent 764a075f

packages/shop-mobile-ionic/src/app/components/order/order.component.html

+6 −1
Original line number Diff line number Diff line
@@ -44,10 +44,15 @@ 
<div class="hr"></div>



<div (click)="goToOrder()" class="order-body">

	<div class="product-container" *ngFor="let product of order.products">

	<div

		class="product-container"

		[ngClass]="product.price == 0 ? 'deleted-product' : ''"

		*ngFor="let product of order.products"

	>

		<e-cu-order-product

			[orderProduct]="product"

			[showDetailsButton]="showDetailsButton"

			(remove)="removeProduct(order._id, $event)"

		></e-cu-order-product>

	</div>

</div>

packages/shop-mobile-ionic/src/app/components/order/order.component.scss

+23 −0
Original line number Diff line number Diff line
@@ -59,8 +59,25 @@ 
	width: 100%;

}



@keyframes product-fade-out {

	50% {

		opacity: 0.2;

		margin-right: calc(100% + 15px);

		margin-left: calc(-100% + 15px);

	}

	100% {

		margin-right: calc(100% + 15px);

		margin-left: calc(-100% + 15px);

		width: 0;

		height: 0;

		padding: 0;

	}

}



.order-body {

	padding: 15px;

	display: flex;

	flex-direction: column;



	.product-container {

		padding-bottom: 15px;
@@ -68,5 +85,11 @@ 
		&:last-of-type {

			padding-bottom: 0;

		}



		&.deleted-product {

			animation-name: product-fade-out;

			animation-duration: 1s;

			animation-fill-mode: both;

		}

	}

}

packages/shop-mobile-ionic/src/app/components/order/order.component.ts

+23 −1
Original line number Diff line number Diff line
@@ -3,6 +3,8 @@ import { 
	Component,

	Input,

	Inject,

	EventEmitter,

	Output,

} from '@angular/core';

import { Store } from '../../services/store.service';

import OrderStatus from '@modules/server.common/enums/OrderStatus';
@@ -20,6 +22,7 @@ import { DOCUMENT } from '@angular/common'; 
import DeliveryType from '@modules/server.common/enums/DeliveryType';

import { NavController } from '@ionic/angular';

import { environment } from 'environments/environment';

import { OrderRouter } from '@modules/client.common.angular2/routers/order-router.service';



@Component({

	selector: 'e-cu-order',
@@ -36,11 +39,16 @@ import { environment } from 'environments/environment'; 
	]*/

})

export class OrderComponent {

	deletedProductId: string;



	@Input()

	order: Order;

	@Input()

	showDetailsButton: boolean = false;



	@Output()

	orderChange = new EventEmitter<Order>();



	get id() {

		return this.order.id;

	}
@@ -120,7 +128,8 @@ export class OrderComponent { 
	constructor(

		@Inject(DOCUMENT) public document: Document,

		private readonly store: Store,

		public navCtrl: NavController

		public navCtrl: NavController,

		private orderRouter: OrderRouter

	) {}



	goToOrder() {
@@ -135,6 +144,19 @@ export class OrderComponent { 
		}

	}



	async removeProduct(orderId, orderProduct) {

		await this.orderRouter.removeProducts(orderId, [

			orderProduct.product._id,

		]);



		const productIndex = this.order.products.findIndex(

			(p) => p.id == orderProduct.id

		);

		this.order.products[productIndex].price = 0;

		this.deletedProductId = orderProduct._id;

		this.orderChange.emit(this.order);

	}



	private _millisToMinutes(ms) {

		const minutes = Math.floor(ms / 60000);

		const seconds = ((ms % 60000) / 1000).toFixed(0);

packages/shop-mobile-ionic/src/app/components/order/product/product.component.html

+13 −1
Original line number Diff line number Diff line 
<div class="container">

	<div class="test">

	<div class="container-row">

		<section class="product-image">

			<ion-img [src]="image.url" [ngClass]="imageClass"></ion-img>

		</section>
@@ -35,4 +35,16 @@ 
	>

		${{ price }}

	</section>



	<section

		class="product-remove"

		[ngClass]="{

			ltr: document.documentElement.dir === 'rtl',

			rtl: document.documentElement.dir !== 'rtl',

			'product-remove-out': isRemove

		}"

		(click)="onRemove()"

	>

		<i class="fa fa-trash"></i>

	</section>

</div>

packages/shop-mobile-ionic/src/app/components/order/product/product.component.scss

+18 −1
Original line number Diff line number Diff line 
@import '~@ever-platform/common-angular/src/scss/everbie.common';



.product-image {

	padding-left: 1px;

	padding-right: 10px;
@@ -70,6 +72,19 @@ 
	right: 0px;

}



.product-remove {

	position: absolute;

	bottom: 15px;

	font-size: 18px;

	display: flex;

	color: $assertive-lighted;



	&-out {

		opacity: 0;

		transition: 0.2s all ease-in-out;

	}

}



.rtl {

	text-align: right;

}
@@ -104,11 +119,13 @@ 
	position: relative;

	padding: 0 !important;



	.test {

	&-row {

		font-size: 0.8em;

		display: flex;

		align-items: center;

		justify-content: space-around;

		padding-bottom: 15px;

		border-bottom: 1px solid #ccc;



		width: 100%;

	}