simpo-component-library 3.6.279 → 3.6.281
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/ecommerce/sections/cart/cart.component.mjs +26 -40
- package/fesm2022/simpo-component-library.mjs +25 -39
- package/fesm2022/simpo-component-library.mjs.map +1 -1
- package/package.json +1 -1
- package/simpo-component-library-3.6.281.tgz +0 -0
- package/simpo-component-library-3.6.279.tgz +0 -0
|
@@ -7956,8 +7956,8 @@ class CartComponent extends BaseSection {
|
|
|
7956
7956
|
if (param && param['checkout'])
|
|
7957
7957
|
this.currentTab = "ADDRESS";
|
|
7958
7958
|
});
|
|
7959
|
-
this.getIndexDBData();
|
|
7960
7959
|
this.getTrialCart();
|
|
7960
|
+
this.getIndexDBData();
|
|
7961
7961
|
this.getSchemeDetails();
|
|
7962
7962
|
this.getEcommerceConfigs();
|
|
7963
7963
|
this.styles = this.data?.styles;
|
|
@@ -8010,10 +8010,11 @@ class CartComponent extends BaseSection {
|
|
|
8010
8010
|
});
|
|
8011
8011
|
}
|
|
8012
8012
|
updateUserCart() {
|
|
8013
|
+
debugger;
|
|
8013
8014
|
const deliveryOption = JSON.parse(localStorage.getItem("deliveryOptions") ?? "{}");
|
|
8014
8015
|
this.userDetails = this.storageService.getUser();
|
|
8015
8016
|
this.cartInfo.userDetails = {
|
|
8016
|
-
"userId":
|
|
8017
|
+
"userId": this.userDetails?.userId,
|
|
8017
8018
|
"userName": this.userDetails?.contact.name,
|
|
8018
8019
|
"mobile": this.userDetails?.contact.mobile,
|
|
8019
8020
|
"email": this.userDetails?.contact.email,
|
|
@@ -8038,24 +8039,23 @@ class CartComponent extends BaseSection {
|
|
|
8038
8039
|
this.cartInfo.billdetails.couponCode = localStorage.getItem("couponCode");
|
|
8039
8040
|
const restResponse = this.restService.addItemToDB(this.cartInfo).toPromise();
|
|
8040
8041
|
restResponse.then((response) => {
|
|
8041
|
-
|
|
8042
|
-
this.cartInfo.billdetails.
|
|
8043
|
-
this.cartInfo.billdetails.
|
|
8044
|
-
this.cartInfo.billdetails.
|
|
8045
|
-
this.cartInfo.
|
|
8046
|
-
// this.cartInfo.totalAmount = response?.data?.totalAmount ?? 0;
|
|
8042
|
+
this.cartInfo.billdetails.totalGrossValue = 0;
|
|
8043
|
+
this.cartInfo.billdetails.totalTax = 0;
|
|
8044
|
+
this.cartInfo.billdetails.deliveryCharges = 0;
|
|
8045
|
+
this.cartInfo.billdetails.totalNetValue = 0;
|
|
8046
|
+
this.cartInfo.totalAmount = 0;
|
|
8047
8047
|
this.USER_CART_ITEMS = cartData.target.result;
|
|
8048
|
-
|
|
8049
|
-
|
|
8050
|
-
|
|
8051
|
-
|
|
8052
|
-
|
|
8053
|
-
|
|
8048
|
+
this.USER_CART_ITEMS.forEach((item) => {
|
|
8049
|
+
this.cartInfo.billdetails.totalNetValue += (item.discountedPrice * (item.quantity ?? 1));
|
|
8050
|
+
this.cartInfo.billdetails.totalTax += (item.quantity * (item.itemTax ?? 0));
|
|
8051
|
+
});
|
|
8052
|
+
this.cartInfo.billdetails.deliveryCharges = (deliveryOption?.minOrderAmount > this.cartInfo.billdetails.totalGrossValue) ? 0 : (deliveryOption?.deliveryCharges ?? 0);
|
|
8053
|
+
this.cartInfo.billdetails.totalGrossValue = this.cartInfo.billdetails.totalNetValue + this.getTaxAmount();
|
|
8054
8054
|
this.cartInfo.orderedItems = this.USER_CART_ITEMS;
|
|
8055
8055
|
this.cartInfo.billdetails.discountAmount = response?.data?.billdetails?.discountAmount ?? 0;
|
|
8056
8056
|
this.cartInfo.billdetails.totalTaxAfterDiscount = response?.data?.billdetails?.totalTaxAfterDiscount ?? 0;
|
|
8057
|
-
this.cartInfo.totalAmount =
|
|
8058
|
-
this.storageService.addAllProductsToCart(this.cartInfo.orderedItems)
|
|
8057
|
+
this.cartInfo.totalAmount = this.cartInfo.billdetails.totalGrossValue + this.cartInfo.billdetails.deliveryCharges + this.cartInfo.billdetails.discountAmount;
|
|
8058
|
+
// this.storageService.addAllProductsToCart(this.cartInfo.orderedItems)
|
|
8059
8059
|
this.responseData = this.cartInfo;
|
|
8060
8060
|
});
|
|
8061
8061
|
};
|
|
@@ -8076,13 +8076,12 @@ class CartComponent extends BaseSection {
|
|
|
8076
8076
|
this.cartInfo.billdetails.totalNetValue = 0;
|
|
8077
8077
|
this.cartInfo.totalAmount = 0;
|
|
8078
8078
|
this.USER_CART_ITEMS.forEach((item) => {
|
|
8079
|
-
this.cartInfo.billdetails.
|
|
8079
|
+
this.cartInfo.billdetails.totalNetValue += (item.discountedPrice * (item.quantity ?? 1));
|
|
8080
8080
|
this.cartInfo.billdetails.totalTax += (item.quantity * (item.itemTax ?? 0));
|
|
8081
8081
|
});
|
|
8082
8082
|
this.cartInfo.billdetails.deliveryCharges = (deliveryOption?.minOrderAmount > this.cartInfo.billdetails.totalGrossValue) ? 0 : (deliveryOption?.deliveryCharges ?? 0);
|
|
8083
|
-
this.cartInfo.billdetails.
|
|
8084
|
-
this.cartInfo.totalAmount = this.cartInfo.billdetails.
|
|
8085
|
-
+this.cartInfo.billdetails.deliveryCharges;
|
|
8083
|
+
this.cartInfo.billdetails.totalGrossValue = this.cartInfo.billdetails.totalNetValue + this.cartInfo.billdetails.totalTax;
|
|
8084
|
+
this.cartInfo.totalAmount = this.cartInfo.billdetails.finalPrice ?? this.cartInfo.billdetails.totalGrossValue + this.cartInfo.billdetails.deliveryCharges;
|
|
8086
8085
|
this.cartInfo.orderedItems = this.USER_CART_ITEMS;
|
|
8087
8086
|
this.responseData = this.cartInfo;
|
|
8088
8087
|
this.restService.addItemToDB(this.responseData).subscribe((response) => {
|
|
@@ -8103,20 +8102,6 @@ class CartComponent extends BaseSection {
|
|
|
8103
8102
|
? this.userDetails?.addressDetailsList[this.selectedAddressIdx]
|
|
8104
8103
|
: this.userDetails?.addressDetailsList?.[0];
|
|
8105
8104
|
}
|
|
8106
|
-
// updateUserCart2() {
|
|
8107
|
-
// const deliveryOption = JSON.parse(localStorage.getItem("deliveryOptions") ?? "{}");
|
|
8108
|
-
// this.userDetails = this.storageService.getUser() as User;
|
|
8109
|
-
// this.cartInfo.userDetails = {
|
|
8110
|
-
// "userId": this.userDetails?.userId,
|
|
8111
|
-
// "userName": this.userDetails?.contact.name,
|
|
8112
|
-
// "mobile": this.userDetails?.contact.mobile,
|
|
8113
|
-
// "email": this.userDetails?.contact.email,
|
|
8114
|
-
// }
|
|
8115
|
-
// this.restService.getUserItems(this.userDetails.userId, "CART").subscribe((response: any) => {
|
|
8116
|
-
// const tempUserCart = response?.data?.[0]?.orderedItems ?? [];
|
|
8117
|
-
// this.mergeOrderItems(tempUserCart);
|
|
8118
|
-
// })
|
|
8119
|
-
// }
|
|
8120
8105
|
get stylesLayout() {
|
|
8121
8106
|
return { ...this.styles?.layout };
|
|
8122
8107
|
}
|
|
@@ -8169,6 +8154,7 @@ class CartComponent extends BaseSection {
|
|
|
8169
8154
|
}
|
|
8170
8155
|
getIndexDBData() {
|
|
8171
8156
|
this.storageService.getUserCart().then((cartResponse) => {
|
|
8157
|
+
debugger;
|
|
8172
8158
|
const deliveryOption = JSON.parse(localStorage.getItem("deliveryOptions") ?? "{}");
|
|
8173
8159
|
this.cartInfo.billdetails.totalGrossValue = 0;
|
|
8174
8160
|
this.cartInfo.billdetails.totalTax = 0;
|
|
@@ -8178,13 +8164,13 @@ class CartComponent extends BaseSection {
|
|
|
8178
8164
|
cartResponse.onsuccess = (cartData) => {
|
|
8179
8165
|
this.USER_CART_ITEMS = cartData.target.result;
|
|
8180
8166
|
this.USER_CART_ITEMS.forEach((item) => {
|
|
8181
|
-
this.cartInfo.billdetails.
|
|
8167
|
+
this.cartInfo.billdetails.totalNetValue += (item.discountedPrice * (item.quantity ?? 1));
|
|
8182
8168
|
this.cartInfo.billdetails.totalTax += (item.quantity * (item.itemTax ?? 0));
|
|
8183
8169
|
});
|
|
8184
8170
|
this.cartInfo.billdetails.totalTaxAfterDiscount = cartData.billdetails?.totalTaxAfterDiscount ?? 0;
|
|
8185
8171
|
this.cartInfo.billdetails.deliveryCharges = (deliveryOption?.minOrderAmount > this.cartInfo.billdetails.totalGrossValue) ? 0 : (deliveryOption?.deliveryCharges ?? 0);
|
|
8186
|
-
this.cartInfo.billdetails.
|
|
8187
|
-
this.cartInfo.totalAmount = this.cartInfo.billdetails.
|
|
8172
|
+
this.cartInfo.billdetails.totalGrossValue = this.cartInfo.billdetails.totalNetValue + this.getTaxAmount();
|
|
8173
|
+
this.cartInfo.totalAmount = this.cartInfo.billdetails.totalGrossValue + this.cartInfo.billdetails.deliveryCharges + this.cartInfo.billdetails.discountAmount;
|
|
8188
8174
|
this.cartInfo.orderedItems = this.USER_CART_ITEMS;
|
|
8189
8175
|
if (this.storageService.getUser())
|
|
8190
8176
|
this.updateUserCart();
|
|
@@ -8634,7 +8620,7 @@ class CartComponent extends BaseSection {
|
|
|
8634
8620
|
return window?.location?.origin?.includes('caratlane') || window?.location?.origin?.includes('orra');
|
|
8635
8621
|
}
|
|
8636
8622
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CartComponent, deps: [{ token: EventsService }, { token: CartService }, { token: i2$2.Router }, { token: RestService }, { token: i1$1.MatDialog }, { token: StorageServiceService }, { token: i4$1.MessageService }, { token: i8$2.MatBottomSheet }, { token: i2$2.ActivatedRoute }, { token: MAT_DIALOG_DATA, optional: true }, { token: i1$1.MatDialogRef, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8637
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CartComponent, isStandalone: true, selector: "simpo-cart", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete", customClass: "customClass" }, providers: [MessageService], viewQueries: [{ propertyName: "d2", first: true, predicate: ["d2"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isLoading\">\r\n <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n <ng-container *ngIf=\"data\">\r\n <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline isActive\">Address</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n </div>\r\n <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n <div class=\"cart-tabs\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\r\n <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n <div [ngClass]=\"{'selected-cart-tab': cartType==='TRIAL'}\" (click)=\"cartType='TRIAL'\">Trial Cart\r\n ({{trialCartItem?.length ?? 0}})</div>\r\n </div>\r\n </div>\r\n <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\">\r\n <ng-container>\r\n <!-- <div class=\"left-panel\">\r\n <div class=\"my-bag\">\r\n My Bag <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n </div>\r\n <div class=\"cart-items box-shadow\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <div class=\"item-parent d-flex\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"product-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n alt=\"\" (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"col-md-6 h-100\" [style.width.px]=\"isMobile ? '200' : ''\" style=\"margin-left: px;\">\r\n <div class=\"lh-23\">\r\n <div class=\"item-name trim-text heading-large\">{{item.itemName}}</div>\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice ?? item.sellingPrice) | number:\r\n '1.0-2'}}\r\n </div>\r\n <ng-container *ngIf=\"item.itemVariant\">\r\n <div class=\"d-flex align-items-center\"\r\n *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">\r\n <strong class=\"fw-bold\">{{ varient }} : </strong>\r\n {{ item.itemVariant.properties[varient] | uppercase }}\r\n </div>\r\n </ng-container>\r\n <div class=\"item-quantity\">\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4 position-relative\" style=\"margin-left: auto; width: 0px; \">\r\n <div class=\"item-price\"><span [innerHTML]='currency'></span> {{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n <div>\r\n <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\"\r\n [style.right.px]=\"isMobile ? '5' : '0'\">delete</mat-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n </ng-container>\r\n </div>\r\n </div> -->\r\n <!-- <div class=\"right-panel\">\r\n <div class=\"coupons box-shadow\" (click)=\"openDialog(CouponList)\">\r\n <ng-container *ngIf=\"!responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Apply Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" style=\"font-weight: 600;\">Apply</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" (click)=\"removeCoupon($event)\">Remove</div>\r\n </ng-container>\r\n </div>\r\n <div class=\"price-details box-shadow\">\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Price</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span>\r\n {{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Tax</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span> {{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <div class=\"price-type\">Delivery Charge</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span> {{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <div class=\"price-type\">Discount Amount</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span>\r\n {{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</div>\r\n </div>\r\n <hr>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n <div class=\"price-value\" style=\"font-weight: 600;\"><span [innerHtml]='currency'></span>\r\n {{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) | number:\r\n '1.0-2'}}</div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"button-parent\">\r\n <ng-container>\r\n <button class=\"btn mobile-fixed\" (click)=\"!edit ? proceedToCheckout() : ''\" [appButtonEditor]=\"edit ?? false\"\r\n simpoButtonDirective [buttonStyle]=\"getButtonStyle(0)\" [buttonId]=\"getButtonId(0)\"\r\n [sectionId]=\"data?.id\" [id]=\"data?.id+getButtonId(0)\">{{data?.action?.buttons?.[0]?.content?.label ??\r\n 'Checkout\r\n Cart'}}\r\n </button>\r\n <button class=\"btn\" (click)=\"!edit ? proceedToListPage() : ''\" [appButtonEditor]=\"edit ?? false\" simpoButtonDirective\r\n [buttonStyle]=\"getButtonStyle(1)\" [buttonId]=\"getButtonId(1)\" [sectionId]=\"data?.id\"\r\n [id]=\"data?.id+getButtonId(1)\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </ng-container>\r\n </div>\r\n\r\n </div> -->\r\n <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"cartType === 'TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"(trialCartItem?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <!-- <ng-container *ngTemplateOutlet=\"CARTPAGE\"></ng-container> -->\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && cartType==='TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"TRIAL_CART\">\r\n </ng-container>\r\n </ng-container> -->\r\n </div>\r\n <div class=\"d-flex checkoutPage\"\r\n *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n </ng-container>\r\n </div>\r\n\r\n\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n [isEcommerce]=\"true\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"!data\">\r\n <section class=\"cart-window\">\r\n <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n <div class=\"d-flex align-items-center\">\r\n <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n <span>Your Cart</span>\r\n </div>\r\n <div class=\"saving\"></div>\r\n </div>\r\n <div class=\"offers\">\r\n <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n <span>Avail Offers / Coupons</span>\r\n </div>\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </div>\r\n <div class=\"small-items\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n <div class=\"small-item\">\r\n <div class=\"d-flex\" style=\"gap: 5px;\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"small-product-img\"\r\n [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n <div class=\"small-item-quantity\">\r\n <span class=\"cursor\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\">+</span>\r\n </div>\r\n <div class=\"small-item-price\">\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice) | number: '1.0-2'}}\r\n </div>\r\n <!-- <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n </div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"fotter-sec\">\r\n <div class=\"delivery-add d-flex\">\r\n <mat-icon>home</mat-icon>\r\n <div class=\"address\">Tetsting</div>\r\n </div>\r\n <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n </div>\r\n </section>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n width: '100%',\r\n height: '40vh',\r\n 'border-radius': '10px',\r\n 'position': 'relative',\r\n 'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n <section class=\"coupons-listing-section\">\r\n <div class=\"coupon-heading\">\r\n <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n </div>\r\n <div class=\"header-text\">Apply Coupon</div>\r\n </div>\r\n <!-- <div class=\"coupon-search-sec\">\r\n <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n </div> -->\r\n <div class=\"coupon-listing\">\r\n <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n <div class=\"coupon-details\"\r\n [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\">\r\n <div class=\"details__coupon-heading\">\r\n <div class=\"coupon-brief\">\r\n <div class=\"coupon-brief__left-sec\">\r\n <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n {{ couponDetails.couponCode | uppercase }}</div>\r\n <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n </div>\r\n <div class=\"coupon-brief__right-sec\">\r\n <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n </div> -->\r\n </div>\r\n <ng-container *ngIf=\"couponDetails.status\">\r\n <div class=\"details-divider\"></div>\r\n <ul class=\"details__coupon-terms\">\r\n <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n </ul>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #showEmptyScreen>\r\n <div class=\"empty-screen-container\">\r\n <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n <div class=\"empty-screen__secondary-text\">\r\n Looks like there are no coupons at the moment\r\n </div>\r\n <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n </div>\r\n </ng-template>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n <div class=\"container\">\r\n <div class=\"main-content\">\r\n <div class=\"promo-banner\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\"\r\n *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"promo-text\">\r\n <h3>See It Before You Buy It</h3>\r\n <p>Experience our designs in detail via video call</p>\r\n </div>\r\n <button class=\"see-live-btn\" (click)=\"scheduleVideoCall(responseData?.orderedItems)\">\r\n \uD83D\uDCF9 SEE IT LIVE\r\n </button>\r\n </div>\r\n\r\n <div class=\"cart-items\">\r\n <ng-container\r\n *ngTemplateOutlet=\"CARTITEM;context:{data: cartType === 'SHOPPING' ? responseData?.orderedItems : trialCartItem}\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div class=\"sidebar\">\r\n <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"cartType != 'TRIAL' && getUrl()\">\r\n <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n <div class=\"toogle-switch\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"select_matured_text w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n Select Matured Scheme\r\n </div> -->\r\n <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectedRedemption\">\r\n Selected Scheme\r\n <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n scheme-5000/M <span>Change</span></div>\r\n <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n </div>\r\n <div class=\"coupon-section\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" *ngIf=\"cartType === 'SHOPPING'\"\r\n (click)=\"openDialog(CouponList)\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"coupon-left\">\r\n <div class=\"coupon-icon\">%</div>\r\n <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply Coupon</span>\r\n <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon Applied</span>\r\n </div>\r\n <span *ngIf=\"!responseData.billdetails?.couponId\">\u25B6</span>\r\n <span *ngIf=\"responseData.billdetails?.couponId\"\r\n (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n </div>\r\n\r\n <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n <div class=\"delivery-header\">\r\n <mat-icon>gps_fixed</mat-icon>\r\n <span *ngIf=\"cartType === 'SHOPPING'\">Delivering to</span>\r\n <span *ngIf=\"cartType === 'TRIAL'\">Trial Location at</span>\r\n <span class=\"pincode\">{{pincode}}</span>\r\n <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n </div>\r\n </div>\r\n\r\n <div class=\"summary-section\">\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Price</span>\r\n <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalGrossValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Tax</span>\r\n <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\"\r\n *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span class=\"summary-label\">Delivery Charge</span>\r\n <span class=\"summary-value\">\u20B9{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount \">\r\n <span class=\"summary-label\">Discount Amount</span>\r\n <span class=\"summary-value savings\"> \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Coupon Discount</span>\r\n <span class=\"summary-value apply-coupon\">Apply Coupon</span>\r\n </div> -->\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Shipping (Standard)</span>\r\n <span class=\"summary-value free\">Free</span>\r\n </div> -->\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B9{{ responseData?.totalAmount }}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Free Trial</span>\r\n <span class=\"summary-value savings\">\u20B90</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Service Charge</span>\r\n <span class=\"summary-value savings\">Free</span>\r\n </div>\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B90 </span>\r\n </div>\r\n </div>\r\n <button class=\"place-order-btn\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n <button class=\"place-order-btn mt-0\" (click)=\"proceedToCheckout()\" simpoButtonDirective\r\n *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n Cart'}}</button>\r\n <button class=\"place-order-btn mt-0\" simpoButtonDirective *ngIf=\"cartType === 'TRIAL'\"\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\" (click)=\"bookAppointment()\">BOOK\r\n APPOINTMENT</button>\r\n\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n <div class=\"checkout-left-panel\">\r\n <div class=\"checkout-main-content\">\r\n <!-- <div class=\"delivery-options\">\r\n <div class=\"delivery-option active\">\r\n <div class=\"delivery-icon\"></div>\r\n HOME DELIVERY\r\n </div>\r\n <div class=\"delivery-option\">\r\n <div class=\"delivery-icon\"></div>\r\n STORE PICK-UP\r\n </div>\r\n </div> -->\r\n\r\n <div class=\"section-title\">Shipping Address</div>\r\n\r\n <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n <div class=\"address-info\">\r\n <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n {{defaultAddress?.stateName}}</div>\r\n <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n <mat-icon>add</mat-icon>\r\n </div>\r\n\r\n <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n <div class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective *ngIf=\"defaultAddress\"\r\n [buttonStyle]=\"data?.action?.buttons?.[2]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [backgroundInfo]=\"styles?.background\">\r\n {{data?.action?.buttons?.[2]?.content?.label ?? 'Procced To Payment'}}\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"checkout-right-panel\">\r\n <div class=\"order-summary\">\r\n <div class=\"summary-title\">Order Summary</div>\r\n\r\n <div class=\"checkout-product\">\r\n <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n alt=\"\">\r\n <div class=\"product-details\">\r\n <div class=\"product-name\">{{item.itemName}}</div>\r\n <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n <div class=\"product-price\">\u20B9{{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"price-breakdown\">\r\n <div class=\"price-row\">\r\n <span>Total Price</span>\r\n <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\">\r\n <span>Total Tax</span>\r\n <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n\r\n <div class=\"price-row discount\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <span>Coupon Discount</span>\r\n <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span>Delivery Charge</span>\r\n <span>{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row total\">\r\n <span>TOTAL AMOUNT</span>\r\n <span>\u20B9{{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) -\r\n (cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n <div class=\"cart-item\" *ngFor=\"let item of products\">\r\n <div class=\"item-image\">\r\n <!-- <div class=\"earring-icon\">\uD83E\uDD8B</div> -->\r\n <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B9{{item.sellingPrice | number: '1.0-2'}}</span>\r\n <span class=\"original-price\" *ngIf=\"item.value - item.discountedPrice > 2\">\u20B9{{item.value | number:\r\n '1.0-2'}}</span>\r\n <span class=\"discount\" *ngIf=\"item.value - item.discountedPrice > 2\">Save \u20B9{{item.value -\r\n item.sellingPrice | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <select name=\"\" id=\"\" (change)=\"changeQuantity($event, item)\" [(ngModel)]=\"item.quantity\">\r\n <option [value]=\"value\" *ngFor=\"let value of quantity\">{{value}}</option>\r\n </select>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"item.itemVariant\">\r\n <span *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">{{ varient }}: {{\r\n item.itemVariant.properties[varient] | uppercase }}</span>\r\n </div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'TRIAL'\">Available to try from tomorrow</div>\r\n <div class=\"pickup-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 6 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\" (click)=\"removeItem(item)\">\u2715</button>\r\n </div>\r\n\r\n <!-- <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div>\r\n\r\n <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div> -->\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n <div class=\"empty-cart-container d-flex flex-column\">\r\n <div class=\"cart-image\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n </div>\r\n <div class=\"cart-text content-side\">\r\n <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n <div class=\"d-flex justify-content-center\"\r\n [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\"></simpo-text-editor>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <button class=\"place-order-btn w-25 mx-auto\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n <div class=\"modal-body\">\r\n <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n <label for=\"individual\" class=\"scheme-card\">\r\n <div class=\"scheme-info d-flex gap-1\">\r\n <div class=\"form-check-radio\">\r\n <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n </div>\r\n <div class=\"right-side\">\r\n <div class=\"scheme-name\">\r\n <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n </div>\r\n <div class=\"scheme-details\">\r\n <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n </div>\r\n <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n </div>\r\n </div>\r\n </label>\r\n </div>\r\n <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n </div>\r\n </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;background:#f9f9fa;box-shadow:#9999994d 2px 2px 6px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.container{max-width:1200px;margin:0 auto;padding:24px;display:flex;gap:24px}.main-content{background:#fff;border-radius:12px;width:66%}.promo-banner{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;box-shadow:#9999994d 2px 2px 6px;border-radius:5px}.promo-text h3{font-size:.9rem!important;margin-bottom:4px}.promo-text p{font-size:1rem;font-size:.9rem!important;margin-bottom:0!important}.see-live-btn{background:#fff;border:1px solid #000;color:#000;padding:8px 16px;border-radius:6px;font-size:12px!important;cursor:pointer;align-items:center;width:max-content!important}.cart-items{padding:20px}.cart-item{display:flex;gap:16px;padding:20px 0;border-bottom:2px solid white;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:24%;height:154px;border-radius:8px;object-fit:cover;background:#fff;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-size:.9rem;font-weight:500;color:#111827;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px;margin-bottom:8px}.current-price{font-size:1rem;font-weight:600;color:#111827}.original-price{font-size:1rem;color:#9ca3af;text-decoration:line-through}.discount{background:#fef3c7;color:#d97706;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:34%}.coupon-section{border-radius:12px;padding:10px 15px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;background:#8b5cf6;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.coupon-text{color:#000;font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:12px;padding:20px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.summary-label{color:#6b7280;font-size:14px;font-weight:700}.summary-value{font-size:14px;color:#111827}.savings{color:#10b981}.apply-coupon{color:#8b5cf6;cursor:pointer}.free{color:#10b981}.total-row{border-top:2px solid white;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px;color:#111827}.total-value{font-weight:700;font-size:18px;color:#111827}.place-order-btn{width:100%;background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;width:max-content;border-radius:10px}.cart-tabs div{padding:7px 10px;cursor:pointer}.selected-cart-tab{background:#fff;margin:2px;border-radius:10px;color:#000!important}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.cart-items{padding:10px}.item-image{width:86px;height:86px}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i4.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i4.DecimalPipe, name: "number" }, { kind: "pipe", type: i4.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i4.DatePipe, name: "date" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: i7$1.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground", "scrollValue"] }, { kind: "ngmodule", type: MatBottomSheetModule }, { kind: "directive", type:
|
|
8623
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CartComponent, isStandalone: true, selector: "simpo-cart", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete", customClass: "customClass" }, providers: [MessageService], viewQueries: [{ propertyName: "d2", first: true, predicate: ["d2"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isLoading\">\r\n <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n <ng-container *ngIf=\"data\">\r\n <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline isActive\">Address</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n </div>\r\n <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n <div class=\"cart-tabs\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\r\n <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n <div [ngClass]=\"{'selected-cart-tab': cartType==='TRIAL'}\" (click)=\"cartType='TRIAL'\">Trial Cart\r\n ({{trialCartItem?.length ?? 0}})</div>\r\n </div>\r\n </div>\r\n <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\">\r\n <ng-container>\r\n <!-- <div class=\"left-panel\">\r\n <div class=\"my-bag\">\r\n My Bag <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n </div>\r\n <div class=\"cart-items box-shadow\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <div class=\"item-parent d-flex\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"product-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n alt=\"\" (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"col-md-6 h-100\" [style.width.px]=\"isMobile ? '200' : ''\" style=\"margin-left: px;\">\r\n <div class=\"lh-23\">\r\n <div class=\"item-name trim-text heading-large\">{{item.itemName}}</div>\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice ?? item.sellingPrice) | number:\r\n '1.0-2'}}\r\n </div>\r\n <ng-container *ngIf=\"item.itemVariant\">\r\n <div class=\"d-flex align-items-center\"\r\n *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">\r\n <strong class=\"fw-bold\">{{ varient }} : </strong>\r\n {{ item.itemVariant.properties[varient] | uppercase }}\r\n </div>\r\n </ng-container>\r\n <div class=\"item-quantity\">\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4 position-relative\" style=\"margin-left: auto; width: 0px; \">\r\n <div class=\"item-price\"><span [innerHTML]='currency'></span> {{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n <div>\r\n <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\"\r\n [style.right.px]=\"isMobile ? '5' : '0'\">delete</mat-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n </ng-container>\r\n </div>\r\n </div> -->\r\n <!-- <div class=\"right-panel\">\r\n <div class=\"coupons box-shadow\" (click)=\"openDialog(CouponList)\">\r\n <ng-container *ngIf=\"!responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Apply Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" style=\"font-weight: 600;\">Apply</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" (click)=\"removeCoupon($event)\">Remove</div>\r\n </ng-container>\r\n </div>\r\n <div class=\"price-details box-shadow\">\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Price</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span>\r\n {{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Tax</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span> {{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <div class=\"price-type\">Delivery Charge</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span> {{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <div class=\"price-type\">Discount Amount</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span>\r\n {{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</div>\r\n </div>\r\n <hr>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n <div class=\"price-value\" style=\"font-weight: 600;\"><span [innerHtml]='currency'></span>\r\n {{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) | number:\r\n '1.0-2'}}</div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"button-parent\">\r\n <ng-container>\r\n <button class=\"btn mobile-fixed\" (click)=\"!edit ? proceedToCheckout() : ''\" [appButtonEditor]=\"edit ?? false\"\r\n simpoButtonDirective [buttonStyle]=\"getButtonStyle(0)\" [buttonId]=\"getButtonId(0)\"\r\n [sectionId]=\"data?.id\" [id]=\"data?.id+getButtonId(0)\">{{data?.action?.buttons?.[0]?.content?.label ??\r\n 'Checkout\r\n Cart'}}\r\n </button>\r\n <button class=\"btn\" (click)=\"!edit ? proceedToListPage() : ''\" [appButtonEditor]=\"edit ?? false\" simpoButtonDirective\r\n [buttonStyle]=\"getButtonStyle(1)\" [buttonId]=\"getButtonId(1)\" [sectionId]=\"data?.id\"\r\n [id]=\"data?.id+getButtonId(1)\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </ng-container>\r\n </div>\r\n\r\n </div> -->\r\n <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"cartType === 'TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"(trialCartItem?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <!-- <ng-container *ngTemplateOutlet=\"CARTPAGE\"></ng-container> -->\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && cartType==='TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"TRIAL_CART\">\r\n </ng-container>\r\n </ng-container> -->\r\n </div>\r\n <div class=\"d-flex checkoutPage\"\r\n *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n </ng-container>\r\n </div>\r\n\r\n\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n [isEcommerce]=\"true\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"!data\">\r\n <section class=\"cart-window\">\r\n <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n <div class=\"d-flex align-items-center\">\r\n <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n <span>Your Cart</span>\r\n </div>\r\n <div class=\"saving\"></div>\r\n </div>\r\n <div class=\"offers\">\r\n <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n <span>Avail Offers / Coupons</span>\r\n </div>\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </div>\r\n <div class=\"small-items\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n <div class=\"small-item\">\r\n <div class=\"d-flex\" style=\"gap: 5px;\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"small-product-img\"\r\n [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n <div class=\"small-item-quantity\">\r\n <span class=\"cursor\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\">+</span>\r\n </div>\r\n <div class=\"small-item-price\">\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice) | number: '1.0-2'}}\r\n </div>\r\n <!-- <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n </div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"fotter-sec\">\r\n <div class=\"delivery-add d-flex\">\r\n <mat-icon>home</mat-icon>\r\n <div class=\"address\">Tetsting</div>\r\n </div>\r\n <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n </div>\r\n </section>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n width: '100%',\r\n height: '40vh',\r\n 'border-radius': '10px',\r\n 'position': 'relative',\r\n 'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n <section class=\"coupons-listing-section\">\r\n <div class=\"coupon-heading\">\r\n <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n </div>\r\n <div class=\"header-text\">Apply Coupon</div>\r\n </div>\r\n <!-- <div class=\"coupon-search-sec\">\r\n <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n </div> -->\r\n <div class=\"coupon-listing\">\r\n <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n <div class=\"coupon-details\"\r\n [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\">\r\n <div class=\"details__coupon-heading\">\r\n <div class=\"coupon-brief\">\r\n <div class=\"coupon-brief__left-sec\">\r\n <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n {{ couponDetails.couponCode | uppercase }}</div>\r\n <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n </div>\r\n <div class=\"coupon-brief__right-sec\">\r\n <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n </div> -->\r\n </div>\r\n <ng-container *ngIf=\"couponDetails.status\">\r\n <div class=\"details-divider\"></div>\r\n <ul class=\"details__coupon-terms\">\r\n <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n </ul>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #showEmptyScreen>\r\n <div class=\"empty-screen-container\">\r\n <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n <div class=\"empty-screen__secondary-text\">\r\n Looks like there are no coupons at the moment\r\n </div>\r\n <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n </div>\r\n </ng-template>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n <div class=\"container\">\r\n <div class=\"main-content\">\r\n <div class=\"promo-banner\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\"\r\n *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"promo-text\">\r\n <h3>See It Before You Buy It</h3>\r\n <p>Experience our designs in detail via video call</p>\r\n </div>\r\n <button class=\"see-live-btn\" (click)=\"scheduleVideoCall(responseData?.orderedItems)\">\r\n \uD83D\uDCF9 SEE IT LIVE\r\n </button>\r\n </div>\r\n\r\n <div class=\"cart-items\">\r\n <ng-container\r\n *ngTemplateOutlet=\"CARTITEM;context:{data: cartType === 'SHOPPING' ? responseData?.orderedItems : trialCartItem}\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div class=\"sidebar\">\r\n <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"cartType != 'TRIAL' && getUrl()\">\r\n <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n <div class=\"toogle-switch\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"select_matured_text w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n Select Matured Scheme\r\n </div> -->\r\n <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectedRedemption\">\r\n Selected Scheme\r\n <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n scheme-5000/M <span>Change</span></div>\r\n <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n </div>\r\n <div class=\"coupon-section\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" *ngIf=\"cartType === 'SHOPPING'\"\r\n (click)=\"openDialog(CouponList)\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"coupon-left\">\r\n <div class=\"coupon-icon\">%</div>\r\n <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply Coupon</span>\r\n <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon Applied</span>\r\n </div>\r\n <span *ngIf=\"!responseData.billdetails?.couponId\">\u25B6</span>\r\n <span *ngIf=\"responseData.billdetails?.couponId\"\r\n (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n </div>\r\n\r\n <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n <div class=\"delivery-header\">\r\n <mat-icon>gps_fixed</mat-icon>\r\n <span *ngIf=\"cartType === 'SHOPPING'\">Delivering to</span>\r\n <span *ngIf=\"cartType === 'TRIAL'\">Trial Location at</span>\r\n <span class=\"pincode\">{{pincode}}</span>\r\n <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n </div>\r\n </div>\r\n\r\n <div class=\"summary-section\">\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Price</span>\r\n <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Tax</span>\r\n <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\"\r\n *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span class=\"summary-label\">Delivery Charge</span>\r\n <span class=\"summary-value\">\u20B9{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount \">\r\n <span class=\"summary-label\">Discount Amount</span>\r\n <span class=\"summary-value savings\"> \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Coupon Discount</span>\r\n <span class=\"summary-value apply-coupon\">Apply Coupon</span>\r\n </div> -->\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Shipping (Standard)</span>\r\n <span class=\"summary-value free\">Free</span>\r\n </div> -->\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B9{{ responseData?.totalAmount }}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Free Trial</span>\r\n <span class=\"summary-value savings\">\u20B90</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Service Charge</span>\r\n <span class=\"summary-value savings\">Free</span>\r\n </div>\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B90 </span>\r\n </div>\r\n </div>\r\n <button class=\"place-order-btn\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n <button class=\"place-order-btn mt-0\" (click)=\"proceedToCheckout()\" simpoButtonDirective\r\n *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n Cart'}}</button>\r\n <button class=\"place-order-btn mt-0\" simpoButtonDirective *ngIf=\"cartType === 'TRIAL'\"\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\" (click)=\"bookAppointment()\">BOOK\r\n APPOINTMENT</button>\r\n\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n <div class=\"checkout-left-panel\">\r\n <div class=\"checkout-main-content\">\r\n <!-- <div class=\"delivery-options\">\r\n <div class=\"delivery-option active\">\r\n <div class=\"delivery-icon\"></div>\r\n HOME DELIVERY\r\n </div>\r\n <div class=\"delivery-option\">\r\n <div class=\"delivery-icon\"></div>\r\n STORE PICK-UP\r\n </div>\r\n </div> -->\r\n\r\n <div class=\"section-title\">Shipping Address</div>\r\n\r\n <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n <div class=\"address-info\">\r\n <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n {{defaultAddress?.stateName}}</div>\r\n <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n <mat-icon>add</mat-icon>\r\n </div>\r\n\r\n <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n <div class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective *ngIf=\"defaultAddress\"\r\n [buttonStyle]=\"data?.action?.buttons?.[2]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [backgroundInfo]=\"styles?.background\">\r\n {{data?.action?.buttons?.[2]?.content?.label ?? 'Procced To Payment'}}\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"checkout-right-panel\">\r\n <div class=\"order-summary\">\r\n <div class=\"summary-title\">Order Summary</div>\r\n\r\n <div class=\"checkout-product\">\r\n <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n alt=\"\">\r\n <div class=\"product-details\">\r\n <div class=\"product-name\">{{item.itemName}}</div>\r\n <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n <div class=\"product-price\">\u20B9{{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"price-breakdown\">\r\n <div class=\"price-row\">\r\n <span>Total Price</span>\r\n <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\">\r\n <span>Total Tax</span>\r\n <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n\r\n <div class=\"price-row discount\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <span>Coupon Discount</span>\r\n <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span>Delivery Charge</span>\r\n <span>{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row total\">\r\n <span>TOTAL AMOUNT</span>\r\n <span>\u20B9{{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) -\r\n (cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n <div class=\"cart-item\" *ngFor=\"let item of products\">\r\n <div class=\"item-image\">\r\n <!-- <div class=\"earring-icon\">\uD83E\uDD8B</div> -->\r\n <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B9{{item.sellingPrice | number: '1.0-2'}}</span>\r\n <span class=\"original-price\" *ngIf=\"item.value - item.discountedPrice > 2\">\u20B9{{item.value | number:\r\n '1.0-2'}}</span>\r\n <span class=\"discount\" *ngIf=\"item.value - item.discountedPrice > 2\">Save \u20B9{{item.value -\r\n item.sellingPrice | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <select name=\"\" id=\"\" (change)=\"changeQuantity($event, item)\" [(ngModel)]=\"item.quantity\">\r\n <option [value]=\"value\" *ngFor=\"let value of quantity\">{{value}}</option>\r\n </select>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"item.itemVariant\">\r\n <span *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">{{ varient }}: {{\r\n item.itemVariant.properties[varient] | uppercase }}</span>\r\n </div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'TRIAL'\">Available to try from tomorrow</div>\r\n <div class=\"pickup-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 6 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\" (click)=\"removeItem(item)\">\u2715</button>\r\n </div>\r\n\r\n <!-- <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div>\r\n\r\n <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div> -->\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n <div class=\"empty-cart-container d-flex flex-column\">\r\n <div class=\"cart-image\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n </div>\r\n <div class=\"cart-text content-side\">\r\n <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n <div class=\"d-flex justify-content-center\"\r\n [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\"></simpo-text-editor>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <button class=\"place-order-btn w-25 mx-auto\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n <div class=\"modal-body\">\r\n <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n <label for=\"individual\" class=\"scheme-card\">\r\n <div class=\"scheme-info d-flex gap-1\">\r\n <div class=\"form-check-radio\">\r\n <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n </div>\r\n <div class=\"right-side\">\r\n <div class=\"scheme-name\">\r\n <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n </div>\r\n <div class=\"scheme-details\">\r\n <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n </div>\r\n <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n </div>\r\n </div>\r\n </label>\r\n </div>\r\n <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n </div>\r\n </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;background:#f9f9fa;box-shadow:#9999994d 2px 2px 6px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.container{max-width:1200px;margin:0 auto;padding:24px;display:flex;gap:24px}.main-content{background:#fff;border-radius:12px;width:66%}.promo-banner{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;box-shadow:#9999994d 2px 2px 6px;border-radius:5px}.promo-text h3{font-size:.9rem!important;margin-bottom:4px}.promo-text p{font-size:1rem;font-size:.9rem!important;margin-bottom:0!important}.see-live-btn{background:#fff;border:1px solid #000;color:#000;padding:8px 16px;border-radius:6px;font-size:12px!important;cursor:pointer;align-items:center;width:max-content!important}.cart-items{padding:20px}.cart-item{display:flex;gap:16px;padding:20px 0;border-bottom:2px solid white;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:24%;height:154px;border-radius:8px;object-fit:cover;background:#fff;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-size:.9rem;font-weight:500;color:#111827;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px;margin-bottom:8px}.current-price{font-size:1rem;font-weight:600;color:#111827}.original-price{font-size:1rem;color:#9ca3af;text-decoration:line-through}.discount{background:#fef3c7;color:#d97706;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:34%}.coupon-section{border-radius:12px;padding:10px 15px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;background:#8b5cf6;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.coupon-text{color:#000;font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:12px;padding:20px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.summary-label{color:#6b7280;font-size:14px;font-weight:700}.summary-value{font-size:14px;color:#111827}.savings{color:#10b981}.apply-coupon{color:#8b5cf6;cursor:pointer}.free{color:#10b981}.total-row{border-top:2px solid white;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px;color:#111827}.total-value{font-weight:700;font-size:18px;color:#111827}.place-order-btn{width:100%;background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;width:max-content;border-radius:10px}.cart-tabs div{padding:7px 10px;cursor:pointer}.selected-cart-tab{background:#fff;margin:2px;border-radius:10px;color:#000!important}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.cart-items{padding:10px}.item-image{width:86px;height:86px}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i4.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i4.DecimalPipe, name: "number" }, { kind: "pipe", type: i4.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i4.DatePipe, name: "date" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: i7$1.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground", "scrollValue"] }, { kind: "ngmodule", type: MatBottomSheetModule }, { kind: "directive", type:
|
|
8638
8624
|
//DIRECTIVE
|
|
8639
8625
|
ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color", "scrollValue", "backgroundInfo"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i11$1.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "component", type: TextEditorComponent, selector: "simpo-text-editor", inputs: ["value", "editable", "sectionId", "label"], outputs: ["valueChange"] }, { kind: "directive", type: ImageEditorDirective, selector: "[appImageEditor]", inputs: ["appImageEditor", "imageData", "sectionId", "showIcon", "iconData"] }, { kind: "directive", type: SpacingHorizontalDirective, selector: "[spacingHorizontal]", inputs: ["spacingHorizontal", "isHeader"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "directive", type: ButtonEditorDirective, selector: "button[appButtonEditor]", inputs: ["appButtonEditor", "buttonData", "buttonStyle", "backgroundInfo", "sectionId", "buttonId"] }, { kind: "directive", type: ColorDirective, selector: "[simpoColor]", inputs: ["simpoColor"] }] }); }
|
|
8640
8626
|
}
|
|
@@ -8662,7 +8648,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
8662
8648
|
MatIconModule,
|
|
8663
8649
|
ButtonEditorDirective,
|
|
8664
8650
|
ColorDirective
|
|
8665
|
-
], providers: [MessageService], template: "<ng-container *ngIf=\"!isLoading\">\r\n <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n <ng-container *ngIf=\"data\">\r\n <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline isActive\">Address</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n </div>\r\n <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n <div class=\"cart-tabs\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\r\n <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n <div [ngClass]=\"{'selected-cart-tab': cartType==='TRIAL'}\" (click)=\"cartType='TRIAL'\">Trial Cart\r\n ({{trialCartItem?.length ?? 0}})</div>\r\n </div>\r\n </div>\r\n <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\">\r\n <ng-container>\r\n <!-- <div class=\"left-panel\">\r\n <div class=\"my-bag\">\r\n My Bag <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n </div>\r\n <div class=\"cart-items box-shadow\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <div class=\"item-parent d-flex\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"product-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n alt=\"\" (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"col-md-6 h-100\" [style.width.px]=\"isMobile ? '200' : ''\" style=\"margin-left: px;\">\r\n <div class=\"lh-23\">\r\n <div class=\"item-name trim-text heading-large\">{{item.itemName}}</div>\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice ?? item.sellingPrice) | number:\r\n '1.0-2'}}\r\n </div>\r\n <ng-container *ngIf=\"item.itemVariant\">\r\n <div class=\"d-flex align-items-center\"\r\n *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">\r\n <strong class=\"fw-bold\">{{ varient }} : </strong>\r\n {{ item.itemVariant.properties[varient] | uppercase }}\r\n </div>\r\n </ng-container>\r\n <div class=\"item-quantity\">\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4 position-relative\" style=\"margin-left: auto; width: 0px; \">\r\n <div class=\"item-price\"><span [innerHTML]='currency'></span> {{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n <div>\r\n <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\"\r\n [style.right.px]=\"isMobile ? '5' : '0'\">delete</mat-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n </ng-container>\r\n </div>\r\n </div> -->\r\n <!-- <div class=\"right-panel\">\r\n <div class=\"coupons box-shadow\" (click)=\"openDialog(CouponList)\">\r\n <ng-container *ngIf=\"!responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Apply Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" style=\"font-weight: 600;\">Apply</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" (click)=\"removeCoupon($event)\">Remove</div>\r\n </ng-container>\r\n </div>\r\n <div class=\"price-details box-shadow\">\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Price</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span>\r\n {{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Tax</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span> {{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <div class=\"price-type\">Delivery Charge</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span> {{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <div class=\"price-type\">Discount Amount</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span>\r\n {{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</div>\r\n </div>\r\n <hr>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n <div class=\"price-value\" style=\"font-weight: 600;\"><span [innerHtml]='currency'></span>\r\n {{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) | number:\r\n '1.0-2'}}</div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"button-parent\">\r\n <ng-container>\r\n <button class=\"btn mobile-fixed\" (click)=\"!edit ? proceedToCheckout() : ''\" [appButtonEditor]=\"edit ?? false\"\r\n simpoButtonDirective [buttonStyle]=\"getButtonStyle(0)\" [buttonId]=\"getButtonId(0)\"\r\n [sectionId]=\"data?.id\" [id]=\"data?.id+getButtonId(0)\">{{data?.action?.buttons?.[0]?.content?.label ??\r\n 'Checkout\r\n Cart'}}\r\n </button>\r\n <button class=\"btn\" (click)=\"!edit ? proceedToListPage() : ''\" [appButtonEditor]=\"edit ?? false\" simpoButtonDirective\r\n [buttonStyle]=\"getButtonStyle(1)\" [buttonId]=\"getButtonId(1)\" [sectionId]=\"data?.id\"\r\n [id]=\"data?.id+getButtonId(1)\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </ng-container>\r\n </div>\r\n\r\n </div> -->\r\n <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"cartType === 'TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"(trialCartItem?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <!-- <ng-container *ngTemplateOutlet=\"CARTPAGE\"></ng-container> -->\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && cartType==='TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"TRIAL_CART\">\r\n </ng-container>\r\n </ng-container> -->\r\n </div>\r\n <div class=\"d-flex checkoutPage\"\r\n *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n </ng-container>\r\n </div>\r\n\r\n\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n [isEcommerce]=\"true\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"!data\">\r\n <section class=\"cart-window\">\r\n <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n <div class=\"d-flex align-items-center\">\r\n <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n <span>Your Cart</span>\r\n </div>\r\n <div class=\"saving\"></div>\r\n </div>\r\n <div class=\"offers\">\r\n <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n <span>Avail Offers / Coupons</span>\r\n </div>\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </div>\r\n <div class=\"small-items\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n <div class=\"small-item\">\r\n <div class=\"d-flex\" style=\"gap: 5px;\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"small-product-img\"\r\n [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n <div class=\"small-item-quantity\">\r\n <span class=\"cursor\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\">+</span>\r\n </div>\r\n <div class=\"small-item-price\">\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice) | number: '1.0-2'}}\r\n </div>\r\n <!-- <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n </div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"fotter-sec\">\r\n <div class=\"delivery-add d-flex\">\r\n <mat-icon>home</mat-icon>\r\n <div class=\"address\">Tetsting</div>\r\n </div>\r\n <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n </div>\r\n </section>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n width: '100%',\r\n height: '40vh',\r\n 'border-radius': '10px',\r\n 'position': 'relative',\r\n 'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n <section class=\"coupons-listing-section\">\r\n <div class=\"coupon-heading\">\r\n <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n </div>\r\n <div class=\"header-text\">Apply Coupon</div>\r\n </div>\r\n <!-- <div class=\"coupon-search-sec\">\r\n <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n </div> -->\r\n <div class=\"coupon-listing\">\r\n <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n <div class=\"coupon-details\"\r\n [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\">\r\n <div class=\"details__coupon-heading\">\r\n <div class=\"coupon-brief\">\r\n <div class=\"coupon-brief__left-sec\">\r\n <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n {{ couponDetails.couponCode | uppercase }}</div>\r\n <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n </div>\r\n <div class=\"coupon-brief__right-sec\">\r\n <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n </div> -->\r\n </div>\r\n <ng-container *ngIf=\"couponDetails.status\">\r\n <div class=\"details-divider\"></div>\r\n <ul class=\"details__coupon-terms\">\r\n <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n </ul>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #showEmptyScreen>\r\n <div class=\"empty-screen-container\">\r\n <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n <div class=\"empty-screen__secondary-text\">\r\n Looks like there are no coupons at the moment\r\n </div>\r\n <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n </div>\r\n </ng-template>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n <div class=\"container\">\r\n <div class=\"main-content\">\r\n <div class=\"promo-banner\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\"\r\n *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"promo-text\">\r\n <h3>See It Before You Buy It</h3>\r\n <p>Experience our designs in detail via video call</p>\r\n </div>\r\n <button class=\"see-live-btn\" (click)=\"scheduleVideoCall(responseData?.orderedItems)\">\r\n \uD83D\uDCF9 SEE IT LIVE\r\n </button>\r\n </div>\r\n\r\n <div class=\"cart-items\">\r\n <ng-container\r\n *ngTemplateOutlet=\"CARTITEM;context:{data: cartType === 'SHOPPING' ? responseData?.orderedItems : trialCartItem}\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div class=\"sidebar\">\r\n <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"cartType != 'TRIAL' && getUrl()\">\r\n <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n <div class=\"toogle-switch\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"select_matured_text w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n Select Matured Scheme\r\n </div> -->\r\n <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectedRedemption\">\r\n Selected Scheme\r\n <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n scheme-5000/M <span>Change</span></div>\r\n <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n </div>\r\n <div class=\"coupon-section\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" *ngIf=\"cartType === 'SHOPPING'\"\r\n (click)=\"openDialog(CouponList)\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"coupon-left\">\r\n <div class=\"coupon-icon\">%</div>\r\n <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply Coupon</span>\r\n <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon Applied</span>\r\n </div>\r\n <span *ngIf=\"!responseData.billdetails?.couponId\">\u25B6</span>\r\n <span *ngIf=\"responseData.billdetails?.couponId\"\r\n (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n </div>\r\n\r\n <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n <div class=\"delivery-header\">\r\n <mat-icon>gps_fixed</mat-icon>\r\n <span *ngIf=\"cartType === 'SHOPPING'\">Delivering to</span>\r\n <span *ngIf=\"cartType === 'TRIAL'\">Trial Location at</span>\r\n <span class=\"pincode\">{{pincode}}</span>\r\n <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n </div>\r\n </div>\r\n\r\n <div class=\"summary-section\">\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Price</span>\r\n <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalGrossValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Tax</span>\r\n <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\"\r\n *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span class=\"summary-label\">Delivery Charge</span>\r\n <span class=\"summary-value\">\u20B9{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount \">\r\n <span class=\"summary-label\">Discount Amount</span>\r\n <span class=\"summary-value savings\"> \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Coupon Discount</span>\r\n <span class=\"summary-value apply-coupon\">Apply Coupon</span>\r\n </div> -->\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Shipping (Standard)</span>\r\n <span class=\"summary-value free\">Free</span>\r\n </div> -->\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B9{{ responseData?.totalAmount }}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Free Trial</span>\r\n <span class=\"summary-value savings\">\u20B90</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Service Charge</span>\r\n <span class=\"summary-value savings\">Free</span>\r\n </div>\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B90 </span>\r\n </div>\r\n </div>\r\n <button class=\"place-order-btn\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n <button class=\"place-order-btn mt-0\" (click)=\"proceedToCheckout()\" simpoButtonDirective\r\n *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n Cart'}}</button>\r\n <button class=\"place-order-btn mt-0\" simpoButtonDirective *ngIf=\"cartType === 'TRIAL'\"\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\" (click)=\"bookAppointment()\">BOOK\r\n APPOINTMENT</button>\r\n\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n <div class=\"checkout-left-panel\">\r\n <div class=\"checkout-main-content\">\r\n <!-- <div class=\"delivery-options\">\r\n <div class=\"delivery-option active\">\r\n <div class=\"delivery-icon\"></div>\r\n HOME DELIVERY\r\n </div>\r\n <div class=\"delivery-option\">\r\n <div class=\"delivery-icon\"></div>\r\n STORE PICK-UP\r\n </div>\r\n </div> -->\r\n\r\n <div class=\"section-title\">Shipping Address</div>\r\n\r\n <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n <div class=\"address-info\">\r\n <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n {{defaultAddress?.stateName}}</div>\r\n <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n <mat-icon>add</mat-icon>\r\n </div>\r\n\r\n <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n <div class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective *ngIf=\"defaultAddress\"\r\n [buttonStyle]=\"data?.action?.buttons?.[2]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [backgroundInfo]=\"styles?.background\">\r\n {{data?.action?.buttons?.[2]?.content?.label ?? 'Procced To Payment'}}\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"checkout-right-panel\">\r\n <div class=\"order-summary\">\r\n <div class=\"summary-title\">Order Summary</div>\r\n\r\n <div class=\"checkout-product\">\r\n <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n alt=\"\">\r\n <div class=\"product-details\">\r\n <div class=\"product-name\">{{item.itemName}}</div>\r\n <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n <div class=\"product-price\">\u20B9{{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"price-breakdown\">\r\n <div class=\"price-row\">\r\n <span>Total Price</span>\r\n <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\">\r\n <span>Total Tax</span>\r\n <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n\r\n <div class=\"price-row discount\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <span>Coupon Discount</span>\r\n <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span>Delivery Charge</span>\r\n <span>{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row total\">\r\n <span>TOTAL AMOUNT</span>\r\n <span>\u20B9{{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) -\r\n (cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n <div class=\"cart-item\" *ngFor=\"let item of products\">\r\n <div class=\"item-image\">\r\n <!-- <div class=\"earring-icon\">\uD83E\uDD8B</div> -->\r\n <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B9{{item.sellingPrice | number: '1.0-2'}}</span>\r\n <span class=\"original-price\" *ngIf=\"item.value - item.discountedPrice > 2\">\u20B9{{item.value | number:\r\n '1.0-2'}}</span>\r\n <span class=\"discount\" *ngIf=\"item.value - item.discountedPrice > 2\">Save \u20B9{{item.value -\r\n item.sellingPrice | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <select name=\"\" id=\"\" (change)=\"changeQuantity($event, item)\" [(ngModel)]=\"item.quantity\">\r\n <option [value]=\"value\" *ngFor=\"let value of quantity\">{{value}}</option>\r\n </select>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"item.itemVariant\">\r\n <span *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">{{ varient }}: {{\r\n item.itemVariant.properties[varient] | uppercase }}</span>\r\n </div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'TRIAL'\">Available to try from tomorrow</div>\r\n <div class=\"pickup-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 6 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\" (click)=\"removeItem(item)\">\u2715</button>\r\n </div>\r\n\r\n <!-- <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div>\r\n\r\n <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div> -->\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n <div class=\"empty-cart-container d-flex flex-column\">\r\n <div class=\"cart-image\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n </div>\r\n <div class=\"cart-text content-side\">\r\n <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n <div class=\"d-flex justify-content-center\"\r\n [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\"></simpo-text-editor>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <button class=\"place-order-btn w-25 mx-auto\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n <div class=\"modal-body\">\r\n <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n <label for=\"individual\" class=\"scheme-card\">\r\n <div class=\"scheme-info d-flex gap-1\">\r\n <div class=\"form-check-radio\">\r\n <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n </div>\r\n <div class=\"right-side\">\r\n <div class=\"scheme-name\">\r\n <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n </div>\r\n <div class=\"scheme-details\">\r\n <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n </div>\r\n <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n </div>\r\n </div>\r\n </label>\r\n </div>\r\n <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n </div>\r\n </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;background:#f9f9fa;box-shadow:#9999994d 2px 2px 6px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.container{max-width:1200px;margin:0 auto;padding:24px;display:flex;gap:24px}.main-content{background:#fff;border-radius:12px;width:66%}.promo-banner{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;box-shadow:#9999994d 2px 2px 6px;border-radius:5px}.promo-text h3{font-size:.9rem!important;margin-bottom:4px}.promo-text p{font-size:1rem;font-size:.9rem!important;margin-bottom:0!important}.see-live-btn{background:#fff;border:1px solid #000;color:#000;padding:8px 16px;border-radius:6px;font-size:12px!important;cursor:pointer;align-items:center;width:max-content!important}.cart-items{padding:20px}.cart-item{display:flex;gap:16px;padding:20px 0;border-bottom:2px solid white;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:24%;height:154px;border-radius:8px;object-fit:cover;background:#fff;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-size:.9rem;font-weight:500;color:#111827;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px;margin-bottom:8px}.current-price{font-size:1rem;font-weight:600;color:#111827}.original-price{font-size:1rem;color:#9ca3af;text-decoration:line-through}.discount{background:#fef3c7;color:#d97706;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:34%}.coupon-section{border-radius:12px;padding:10px 15px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;background:#8b5cf6;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.coupon-text{color:#000;font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:12px;padding:20px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.summary-label{color:#6b7280;font-size:14px;font-weight:700}.summary-value{font-size:14px;color:#111827}.savings{color:#10b981}.apply-coupon{color:#8b5cf6;cursor:pointer}.free{color:#10b981}.total-row{border-top:2px solid white;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px;color:#111827}.total-value{font-weight:700;font-size:18px;color:#111827}.place-order-btn{width:100%;background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;width:max-content;border-radius:10px}.cart-tabs div{padding:7px 10px;cursor:pointer}.selected-cart-tab{background:#fff;margin:2px;border-radius:10px;color:#000!important}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.cart-items{padding:10px}.item-image{width:86px;height:86px}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}\n"] }]
|
|
8651
|
+
], providers: [MessageService], template: "<ng-container *ngIf=\"!isLoading\">\r\n <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n <ng-container *ngIf=\"data\">\r\n <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline isActive\">Address</span>\r\n <div class=\"bar\"></div>\r\n <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n </div>\r\n <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n <div class=\"cart-tabs\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\r\n <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n <div [ngClass]=\"{'selected-cart-tab': cartType==='TRIAL'}\" (click)=\"cartType='TRIAL'\">Trial Cart\r\n ({{trialCartItem?.length ?? 0}})</div>\r\n </div>\r\n </div>\r\n <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\">\r\n <ng-container>\r\n <!-- <div class=\"left-panel\">\r\n <div class=\"my-bag\">\r\n My Bag <span>({{responseData?.orderedItems?.length}} Items)</span>\r\n </div>\r\n <div class=\"cart-items box-shadow\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <div class=\"item-parent d-flex\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"product-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n alt=\"\" (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"col-md-6 h-100\" [style.width.px]=\"isMobile ? '200' : ''\" style=\"margin-left: px;\">\r\n <div class=\"lh-23\">\r\n <div class=\"item-name trim-text heading-large\">{{item.itemName}}</div>\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice ?? item.sellingPrice) | number:\r\n '1.0-2'}}\r\n </div>\r\n <ng-container *ngIf=\"item.itemVariant\">\r\n <div class=\"d-flex align-items-center\"\r\n *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">\r\n <strong class=\"fw-bold\">{{ varient }} : </strong>\r\n {{ item.itemVariant.properties[varient] | uppercase }}\r\n </div>\r\n </ng-container>\r\n <div class=\"item-quantity\">\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'SUBSTRACT')\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\" (click)=\"addToCart(item, 'ADD')\">+</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-md-4 position-relative\" style=\"margin-left: auto; width: 0px; \">\r\n <div class=\"item-price\"><span [innerHTML]='currency'></span> {{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n <div>\r\n <mat-icon class=\"delete-item\" (click)=\"removeItem(item)\"\r\n [style.right.px]=\"isMobile ? '5' : '0'\">delete</mat-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <hr *ngIf=\"responseData?.orderedItems?.length != (idx +1)\">\r\n </ng-container>\r\n </div>\r\n </div> -->\r\n <!-- <div class=\"right-panel\">\r\n <div class=\"coupons box-shadow\" (click)=\"openDialog(CouponList)\">\r\n <ng-container *ngIf=\"!responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Apply Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" style=\"font-weight: 600;\">Apply</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"responseData.billdetails?.couponId\">\r\n <div class=\"d-flex flex-column\">\r\n <span style=\"font-weight: 600;\">Coupon</span>\r\n <span style=\"font-size: 13px;\">Save more with coupon and offers</span>\r\n </div>\r\n <div [style.color]=\"styles?.background?.accentColor\" (click)=\"removeCoupon($event)\">Remove</div>\r\n </ng-container>\r\n </div>\r\n <div class=\"price-details box-shadow\">\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Price</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span>\r\n {{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\">Total Tax</div>\r\n <div class=\"price-value\"><span [innerHTML]='currency'></span> {{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <div class=\"price-type\">Delivery Charge</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span> {{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</div>\r\n </div>\r\n <div class=\"price-parent-block\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <div class=\"price-type\">Discount Amount</div>\r\n <div class=\"price-value\"><span [innerHtml]='currency'></span>\r\n {{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</div>\r\n </div>\r\n <hr>\r\n <div class=\"price-parent-block\">\r\n <div class=\"price-type\" style=\"color: black;font-weight: 600;\">Total Amount</div>\r\n <div class=\"price-value\" style=\"font-weight: 600;\"><span [innerHtml]='currency'></span>\r\n {{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) | number:\r\n '1.0-2'}}</div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"button-parent\">\r\n <ng-container>\r\n <button class=\"btn mobile-fixed\" (click)=\"!edit ? proceedToCheckout() : ''\" [appButtonEditor]=\"edit ?? false\"\r\n simpoButtonDirective [buttonStyle]=\"getButtonStyle(0)\" [buttonId]=\"getButtonId(0)\"\r\n [sectionId]=\"data?.id\" [id]=\"data?.id+getButtonId(0)\">{{data?.action?.buttons?.[0]?.content?.label ??\r\n 'Checkout\r\n Cart'}}\r\n </button>\r\n <button class=\"btn\" (click)=\"!edit ? proceedToListPage() : ''\" [appButtonEditor]=\"edit ?? false\" simpoButtonDirective\r\n [buttonStyle]=\"getButtonStyle(1)\" [buttonId]=\"getButtonId(1)\" [sectionId]=\"data?.id\"\r\n [id]=\"data?.id+getButtonId(1)\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </ng-container>\r\n </div>\r\n\r\n </div> -->\r\n <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"cartType === 'TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"(trialCartItem?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n </ng-container>\r\n <!-- <ng-container *ngTemplateOutlet=\"CARTPAGE\"></ng-container> -->\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && cartType==='TRIAL'\">\r\n <ng-container *ngTemplateOutlet=\"TRIAL_CART\">\r\n </ng-container>\r\n </ng-container> -->\r\n </div>\r\n <div class=\"d-flex checkoutPage\"\r\n *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n </ng-container>\r\n </div>\r\n\r\n\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n [isEcommerce]=\"true\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n\r\n </section>\r\n </ng-container>\r\n <ng-container *ngIf=\"!data\">\r\n <section class=\"cart-window\">\r\n <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n <div class=\"d-flex align-items-center\">\r\n <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n <span>Your Cart</span>\r\n </div>\r\n <div class=\"saving\"></div>\r\n </div>\r\n <div class=\"offers\">\r\n <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n <span>Avail Offers / Coupons</span>\r\n </div>\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </div>\r\n <div class=\"small-items\">\r\n <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n <div class=\"small-item\">\r\n <div class=\"d-flex\" style=\"gap: 5px;\">\r\n <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n class=\"small-product-img\"\r\n [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n <div class=\"small-item-quantity\">\r\n <span class=\"cursor\">-</span>\r\n <span>{{item.quantity}}</span>\r\n <span class=\"cursor\">+</span>\r\n </div>\r\n <div class=\"small-item-price\">\r\n <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.discountedPrice) | number: '1.0-2'}}\r\n </div>\r\n <!-- <div class=\"price-with-tax\">\r\n <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n </div> -->\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"fotter-sec\">\r\n <div class=\"delivery-add d-flex\">\r\n <mat-icon>home</mat-icon>\r\n <div class=\"address\">Tetsting</div>\r\n </div>\r\n <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n </div>\r\n </section>\r\n </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n width: '100%',\r\n height: '40vh',\r\n 'border-radius': '10px',\r\n 'position': 'relative',\r\n 'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n <section class=\"coupons-listing-section\">\r\n <div class=\"coupon-heading\">\r\n <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n </div>\r\n <div class=\"header-text\">Apply Coupon</div>\r\n </div>\r\n <!-- <div class=\"coupon-search-sec\">\r\n <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n </div> -->\r\n <div class=\"coupon-listing\">\r\n <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n <div class=\"coupon-details\"\r\n [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\">\r\n <div class=\"details__coupon-heading\">\r\n <div class=\"coupon-brief\">\r\n <div class=\"coupon-brief__left-sec\">\r\n <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n {{ couponDetails.couponCode | uppercase }}</div>\r\n <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n </div>\r\n <div class=\"coupon-brief__right-sec\">\r\n <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n </div> -->\r\n </div>\r\n <ng-container *ngIf=\"couponDetails.status\">\r\n <div class=\"details-divider\"></div>\r\n <ul class=\"details__coupon-terms\">\r\n <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n </ul>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #showEmptyScreen>\r\n <div class=\"empty-screen-container\">\r\n <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n <div class=\"empty-screen__secondary-text\">\r\n Looks like there are no coupons at the moment\r\n </div>\r\n <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n </div>\r\n </ng-template>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n <div class=\"container\">\r\n <div class=\"main-content\">\r\n <div class=\"promo-banner\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\"\r\n *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"promo-text\">\r\n <h3>See It Before You Buy It</h3>\r\n <p>Experience our designs in detail via video call</p>\r\n </div>\r\n <button class=\"see-live-btn\" (click)=\"scheduleVideoCall(responseData?.orderedItems)\">\r\n \uD83D\uDCF9 SEE IT LIVE\r\n </button>\r\n </div>\r\n\r\n <div class=\"cart-items\">\r\n <ng-container\r\n *ngTemplateOutlet=\"CARTITEM;context:{data: cartType === 'SHOPPING' ? responseData?.orderedItems : trialCartItem}\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div class=\"sidebar\">\r\n <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"cartType != 'TRIAL' && getUrl()\">\r\n <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n <div class=\"toogle-switch\">\r\n <div class=\"form-check form-switch\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"select_matured_text w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n Select Matured Scheme\r\n </div> -->\r\n <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n *ngIf=\"selectedRedemption\">\r\n Selected Scheme\r\n <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n scheme-5000/M <span>Change</span></div>\r\n <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n </div>\r\n </div> -->\r\n </div>\r\n <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n </div>\r\n <div class=\"coupon-section\" [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" *ngIf=\"cartType === 'SHOPPING'\"\r\n (click)=\"openDialog(CouponList)\" [simpoColor]=\"styles?.background?.color\">\r\n <div class=\"coupon-left\">\r\n <div class=\"coupon-icon\">%</div>\r\n <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply Coupon</span>\r\n <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon Applied</span>\r\n </div>\r\n <span *ngIf=\"!responseData.billdetails?.couponId\">\u25B6</span>\r\n <span *ngIf=\"responseData.billdetails?.couponId\"\r\n (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n </div>\r\n\r\n <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n <div class=\"delivery-header\">\r\n <mat-icon>gps_fixed</mat-icon>\r\n <span *ngIf=\"cartType === 'SHOPPING'\">Delivering to</span>\r\n <span *ngIf=\"cartType === 'TRIAL'\">Trial Location at</span>\r\n <span class=\"pincode\">{{pincode}}</span>\r\n <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n </div>\r\n </div>\r\n\r\n <div class=\"summary-section\">\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Price</span>\r\n <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Total Tax</span>\r\n <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\"\r\n *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span class=\"summary-label\">Delivery Charge</span>\r\n <span class=\"summary-value\">\u20B9{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount \">\r\n <span class=\"summary-label\">Discount Amount</span>\r\n <span class=\"summary-value savings\"> \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Coupon Discount</span>\r\n <span class=\"summary-value apply-coupon\">Apply Coupon</span>\r\n </div> -->\r\n <!-- <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"summary-label\">Shipping (Standard)</span>\r\n <span class=\"summary-value free\">Free</span>\r\n </div> -->\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B9{{ responseData?.totalAmount }}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Free Trial</span>\r\n <span class=\"summary-value savings\">\u20B90</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"summary-label\">Service Charge</span>\r\n <span class=\"summary-value savings\">Free</span>\r\n </div>\r\n <div class=\"summary-row total-row\" *ngIf=\"cartType === 'TRIAL'\">\r\n <span class=\"total-label\">Total Cost</span>\r\n <span class=\"total-value\">\u20B90 </span>\r\n </div>\r\n </div>\r\n <button class=\"place-order-btn\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n <button class=\"place-order-btn mt-0\" (click)=\"proceedToCheckout()\" simpoButtonDirective\r\n *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n Cart'}}</button>\r\n <button class=\"place-order-btn mt-0\" simpoButtonDirective *ngIf=\"cartType === 'TRIAL'\"\r\n [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\" (click)=\"bookAppointment()\">BOOK\r\n APPOINTMENT</button>\r\n\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n <div class=\"checkout-left-panel\">\r\n <div class=\"checkout-main-content\">\r\n <!-- <div class=\"delivery-options\">\r\n <div class=\"delivery-option active\">\r\n <div class=\"delivery-icon\"></div>\r\n HOME DELIVERY\r\n </div>\r\n <div class=\"delivery-option\">\r\n <div class=\"delivery-icon\"></div>\r\n STORE PICK-UP\r\n </div>\r\n </div> -->\r\n\r\n <div class=\"section-title\">Shipping Address</div>\r\n\r\n <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n <div class=\"address-info\">\r\n <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n {{defaultAddress?.stateName}}</div>\r\n <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n <mat-icon>add</mat-icon>\r\n </div>\r\n\r\n <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n <div class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective *ngIf=\"defaultAddress\"\r\n [buttonStyle]=\"data?.action?.buttons?.[2]?.styles\"\r\n [color]=\"data?.styles?.background?.accentColor\" [backgroundInfo]=\"styles?.background\">\r\n {{data?.action?.buttons?.[2]?.content?.label ?? 'Procced To Payment'}}\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <div class=\"checkout-right-panel\">\r\n <div class=\"order-summary\">\r\n <div class=\"summary-title\">Order Summary</div>\r\n\r\n <div class=\"checkout-product\">\r\n <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n alt=\"\">\r\n <div class=\"product-details\">\r\n <div class=\"product-name\">{{item.itemName}}</div>\r\n <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n <div class=\"product-price\">\u20B9{{((item.discountedPrice ??\r\n item.sellingPrice) * item.quantity) | number: '1.0-2'}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <div class=\"price-breakdown\">\r\n <div class=\"price-row\">\r\n <span>Total Price</span>\r\n <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n ?? 0) | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\">\r\n <span>Total Tax</span>\r\n <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n number:\r\n '1.0-2'}}</span>\r\n </div>\r\n <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n <span class=\"summary-label\">Redeem Amount</span>\r\n <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n\r\n <div class=\"price-row discount\"\r\n *ngIf=\"responseData?.billdetails?.discountAmount && subIndustryName != 'Ecommerce Jewellery'\">\r\n <span>Coupon Discount</span>\r\n <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row\"\r\n *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n <span>Delivery Charge</span>\r\n <span>{{responseData.billdetails.deliveryCharges\r\n |\r\n number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"price-row total\">\r\n <span>TOTAL AMOUNT</span>\r\n <span>\u20B9{{((responseData?.totalAmount ?? 0) - (responseData?.billdetails?.discountAmount ?? 0)) -\r\n (cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n '1.0-2'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n <div class=\"cart-item\" *ngFor=\"let item of products\">\r\n <div class=\"item-image\">\r\n <!-- <div class=\"earring-icon\">\uD83E\uDD8B</div> -->\r\n <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n (click)=\"goToProductDetails(item)\">\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B9{{item.sellingPrice | number: '1.0-2'}}</span>\r\n <span class=\"original-price\" *ngIf=\"item.value - item.discountedPrice > 2\">\u20B9{{item.value | number:\r\n '1.0-2'}}</span>\r\n <span class=\"discount\" *ngIf=\"item.value - item.discountedPrice > 2\">Save \u20B9{{item.value -\r\n item.sellingPrice | number: '1.0-2'}}</span>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"cartType === 'SHOPPING'\">\r\n <select name=\"\" id=\"\" (change)=\"changeQuantity($event, item)\" [(ngModel)]=\"item.quantity\">\r\n <option [value]=\"value\" *ngFor=\"let value of quantity\">{{value}}</option>\r\n </select>\r\n </div>\r\n <div class=\"item-options\" *ngIf=\"item.itemVariant\">\r\n <span *ngFor=\"let varient of getKeys(item.itemVariant.properties)\">{{ varient }}: {{\r\n item.itemVariant.properties[varient] | uppercase }}</span>\r\n </div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"delivery-info\" *ngIf=\"cartType === 'TRIAL'\">Available to try from tomorrow</div>\r\n <div class=\"pickup-info\" *ngIf=\"cartType === 'SHOPPING' && getUrl()\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 6 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\" (click)=\"removeItem(item)\">\u2715</button>\r\n </div>\r\n\r\n <!-- <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div>\r\n\r\n <div class=\"cart-item\">\r\n <div class=\"item-image\">\r\n <div class=\"chain-icon\">\uD83D\uDD17</div>\r\n </div>\r\n <div class=\"item-details\">\r\n <h3 class=\"item-title\">Lucid Cable Gold Chain</h3>\r\n <div class=\"item-price\">\r\n <span class=\"current-price\">\u20B921,163</span>\r\n </div>\r\n <div class=\"item-options\">\r\n <span>Length: 16</span>\r\n <span>Size: XXL</span>\r\n <span>Color: Black</span>\r\n </div>\r\n <div class=\"delivery-info\">Delivery by - Tomorrow 6PM-9PM</div>\r\n <div class=\"pickup-info\">\r\n <span class=\"pickup-text\">\uD83D\uDCCD Pickup today from 4 Stores nearby</span>\r\n <span>\u25B6</span>\r\n </div>\r\n </div>\r\n <button class=\"remove-btn\">\u2715</button>\r\n </div> -->\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n <div class=\"empty-cart-container d-flex flex-column\">\r\n <div class=\"cart-image\">\r\n <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n </div>\r\n <div class=\"cart-text content-side\">\r\n <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n <div class=\"d-flex justify-content-center\"\r\n [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\"></simpo-text-editor>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <button class=\"place-order-btn w-25 mx-auto\" (click)=\"proceedToListPage()\" simpoButtonDirective\r\n [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n Shopping'}}</button>\r\n </div>\r\n </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n <div class=\"modal-body\">\r\n <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n <label for=\"individual\" class=\"scheme-card\">\r\n <div class=\"scheme-info d-flex gap-1\">\r\n <div class=\"form-check-radio\">\r\n <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n </div>\r\n <div class=\"right-side\">\r\n <div class=\"scheme-name\">\r\n <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n </div>\r\n <div class=\"scheme-details\">\r\n <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n </div>\r\n <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n </div>\r\n </div>\r\n </label>\r\n </div>\r\n <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n </div>\r\n </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{padding:10px;margin-top:10px;margin-bottom:15px;border-radius:5px;background:#f9f9fa;box-shadow:#9999994d 2px 2px 6px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.cursor{cursor:pointer}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;margin-left:auto;margin-right:auto;width:30%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.container{max-width:1200px;margin:0 auto;padding:24px;display:flex;gap:24px}.main-content{background:#fff;border-radius:12px;width:66%}.promo-banner{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;box-shadow:#9999994d 2px 2px 6px;border-radius:5px}.promo-text h3{font-size:.9rem!important;margin-bottom:4px}.promo-text p{font-size:1rem;font-size:.9rem!important;margin-bottom:0!important}.see-live-btn{background:#fff;border:1px solid #000;color:#000;padding:8px 16px;border-radius:6px;font-size:12px!important;cursor:pointer;align-items:center;width:max-content!important}.cart-items{padding:20px}.cart-item{display:flex;gap:16px;padding:20px 0;border-bottom:2px solid white;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:24%;height:154px;border-radius:8px;object-fit:cover;background:#fff;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-size:.9rem;font-weight:500;color:#111827;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px;margin-bottom:8px}.current-price{font-size:1rem;font-weight:600;color:#111827}.original-price{font-size:1rem;color:#9ca3af;text-decoration:line-through}.discount{background:#fef3c7;color:#d97706;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:34%}.coupon-section{border-radius:12px;padding:10px 15px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer;box-shadow:#b2b2ca80 2px 2px 6px}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;background:#8b5cf6;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.coupon-text{color:#000;font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:12px;padding:20px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.summary-label{color:#6b7280;font-size:14px;font-weight:700}.summary-value{font-size:14px;color:#111827}.savings{color:#10b981}.apply-coupon{color:#8b5cf6;cursor:pointer}.free{color:#10b981}.total-row{border-top:2px solid white;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px;color:#111827}.total-value{font-weight:700;font-size:18px;color:#111827}.place-order-btn{width:100%;background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;width:max-content;border-radius:10px}.cart-tabs div{padding:7px 10px;cursor:pointer}.selected-cart-tab{background:#fff;margin:2px;border-radius:10px;color:#000!important}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.cart-items{padding:10px}.item-image{width:86px;height:86px}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}\n"] }]
|
|
8666
8652
|
}], ctorParameters: () => [{ type: EventsService }, { type: CartService }, { type: i2$2.Router }, { type: RestService }, { type: i1$1.MatDialog }, { type: StorageServiceService }, { type: i4$1.MessageService }, { type: i8$2.MatBottomSheet }, { type: i2$2.ActivatedRoute }, { type: undefined, decorators: [{
|
|
8667
8653
|
type: Optional
|
|
8668
8654
|
}, {
|