buildingproduct-library 0.2.98 → 0.2.99
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/{buildingproduct-library-0.2.98.tgz → buildingproduct-library-0.2.99.tgz} +0 -0
- package/bundles/buildingproduct-library.umd.js +32 -5
- package/bundles/buildingproduct-library.umd.js.map +1 -1
- package/esm2015/lib/custom-order-details/order-detail-grid/order-detail-grid.component.js +29 -2
- package/esm2015/lib/custom-order-details/order-detail-list/order-detail-list.component.js +5 -5
- package/fesm2015/buildingproduct-library.js +32 -5
- package/fesm2015/buildingproduct-library.js.map +1 -1
- package/lib/custom-order-details/order-detail-grid/order-detail-grid.component.d.ts +1 -0
- package/package.json +1 -1
|
Binary file
|
|
@@ -7871,10 +7871,10 @@
|
|
|
7871
7871
|
this.env = sessionStorage.getItem('env');
|
|
7872
7872
|
this.environment = JSON.parse(this.env);
|
|
7873
7873
|
this.getStatusColor = function (cart) {
|
|
7874
|
-
var _a, _b;
|
|
7874
|
+
var _a, _b, _c, _d;
|
|
7875
7875
|
var status = cart === null || cart === void 0 ? void 0 : cart.status;
|
|
7876
|
-
if (cart.consignments && ((_a = cart.consignments) === null || _a === void 0 ? void 0 : _a.length) && ((_b = cart.consignments) === null || _b === void 0 ? void 0 : _b.length) == 1) {
|
|
7877
|
-
status = cart.consignments[0].status;
|
|
7876
|
+
if ((cart === null || cart === void 0 ? void 0 : cart.consignments) && ((_a = cart === null || cart === void 0 ? void 0 : cart.consignments) === null || _a === void 0 ? void 0 : _a.length) && ((_b = cart === null || cart === void 0 ? void 0 : cart.consignments) === null || _b === void 0 ? void 0 : _b.length) == 1) {
|
|
7877
|
+
status = (_d = (_c = cart === null || cart === void 0 ? void 0 : cart.consignments[0]) === null || _c === void 0 ? void 0 : _c.entries[0]) === null || _d === void 0 ? void 0 : _d.status;
|
|
7878
7878
|
}
|
|
7879
7879
|
status = status == 'CREATED'
|
|
7880
7880
|
? '#F3A931'
|
|
@@ -8076,7 +8076,7 @@
|
|
|
8076
8076
|
return OrderDetailListComponent;
|
|
8077
8077
|
}());
|
|
8078
8078
|
OrderDetailListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OrderDetailListComponent, deps: [{ token: CartService }, { token: UserAccountDetailServiceService }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
8079
|
-
OrderDetailListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OrderDetailListComponent, selector: "app-order-detail-list", inputs: { cartDetails: "cartDetails", sortByVal: "sortByVal", orderDate: "orderDate", isCardData: "isCardData" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"loading\" *ngIf=\"showWaitCursor | async\">Loading…</div>\r\n<div class=\"revieworder-table-container py-3\">\r\n <table class=\"w-100 table\">\r\n <tr class=\"revieworder-header-container\">\r\n <th>#</th>\r\n <th class=\"item\">ITEM</th>\r\n <th>JOB REFERENCE</th>\r\n <th>DELIVERY DATE</th>\r\n <th>DELIVERY #</th>\r\n <th>QUANTITY ORDERED</th>\r\n <th>QUANTITY SHIPPED</th>\r\n <th class=\"colHD\">\r\n <div class=\"text-right\">TOTAL PRICE</div>\r\n <span class=\"text-right\">excl GST</span>\r\n </th>\r\n <th>STATUS</th>\r\n </tr>\r\n <ng-container *ngIf=\"cartDetails?.length; else nodata\">\r\n <ng-container *ngFor=\"let cart of cartDetails; let i = index\">\r\n <tr\r\n class=\"revieworder-body-container\"\r\n [ngClass]=\"\r\n !hasColour(cart) && cart?.product?.finishedProduct\r\n ? 'borderNew'\r\n : ''\r\n \"\r\n >\r\n <td>\r\n <ng-container *ngIf=\"cart?.entryNumber?.length > 9; else entryId\">{{\r\n cart.entryNumber\r\n }}</ng-container>\r\n <ng-template #entryId>0{{ cart?.entryNumber + 1 }}</ng-template>\r\n </td>\r\n <td>\r\n <div class=\"row product-image-container\">\r\n <div class=\"col-sm-4 col-lg-2 p-2 product-img\">\r\n <ng-container\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct;\r\n else normalImage\r\n \"\r\n >\r\n <a\r\n data-toggle=\"modal\"\r\n class=\"flashing-expand\"\r\n (click)=\"viewImage($event, cartDetails[i])\"\r\n [attr.data-target]=\"'#imageModal'\"\r\n *ngIf=\"hasImage(cartDetails[i]); else hasPdf\"\r\n >\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </a>\r\n <ng-template #hasPdf>\r\n <a\r\n class=\"flashing-expand flashing-open\"\r\n [href]=\"getPdfLink(cartDetails[i])\"\r\n target=\"_blank\"\r\n >\r\n <img\r\n class=\"pdf-icon\"\r\n src=\"../../../../../assets/images/pdf-icon.svg\"\r\n alt=\"Click to open PDF\"\r\n title=\"Click to open PDF\"\r\n />\r\n </a>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #normalImage>\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </ng-template>\r\n </div>\r\n <div class=\"col-sm-8 col-lg-10\">\r\n <p class=\"reviewproduct-name mb-2\">{{ cart?.product?.name }}</p>\r\n <p class=\"sku-text mb-0\">SKU: {{ cart?.product?.code }}</p>\r\n </div>\r\n </div>\r\n </td>\r\n <td>{{ cart?.jobReference || \"-\" }}</td>\r\n <td>\r\n {{\r\n !cart.consignments ||\r\n (cart.consignments && cart.consignments?.length < 2)\r\n ? (orderDate | date : \"dd/MM/yyyy\")\r\n : \"\"\r\n }}\r\n </td>\r\n <td>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"consignment-number\"\r\n title=\"Consignment Number\"\r\n >\r\n {{\r\n cart.consignments && cart.consignments?.length == 1\r\n ? cart.consignments[0].code\r\n : \"\"\r\n }}\r\n </a>\r\n </td>\r\n <td>\r\n {{ cart?.quantityDouble }} {{ cart?.unit?.code }}<br />\r\n <span *ngIf=\"isOrderPermissions\" class=\"subPrice\"\r\n >@ {{ cart?.basePrice?.formattedValue }}/{{\r\n cart?.basePrice?.unitType\r\n }}</span\r\n >\r\n </td>\r\n <td>\r\n {{\r\n !cart.consignments ||\r\n (cart.consignments && cart.consignments?.length < 2)\r\n ? cart?.quantityDouble\r\n : \"\"\r\n }}\r\n {{\r\n !cart.consignments ||\r\n (cart.consignments && cart.consignments?.length < 2)\r\n ? cart?.unit?.code\r\n : \"\"\r\n }}\r\n </td>\r\n <td>\r\n {{ cart?.totalPrice?.formattedValue || \"-\" }}\r\n <span *ngIf=\"isOrderPermissions\" class=\"d-block\">excl GST</span>\r\n </td>\r\n <td class=\"statusColm\">\r\n <small\r\n *ngIf=\"\r\n !cart.consignments ||\r\n (cart.consignments && cart.consignments?.length < 2)\r\n \"\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color': getStatusColor(cart)\r\n }\"\r\n ></small>\r\n {{\r\n !cart.consignments ||\r\n (cart.consignments && cart.consignments?.length < 2)\r\n ? cart.consignments && cart.consignments?.length == 1\r\n ? cart.consignments[0].statusDisplay\r\n : cart?.statusDisplay\r\n : \"\"\r\n }}\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"cart?.product?.classifications\">\r\n <tr class=\"revieworder-body-container\">\r\n <td colspan=\"9\">\r\n <span *ngIf=\"cart?.product?.classifications[0]?.features\">\r\n {{\r\n getClassifications(cartDetails[i]?.product?.classifications)\r\n }}\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n <tr\r\n class=\"revieworder-body-container\"\r\n *ngIf=\"!cart?.configurationInfos?.length && hasColour(cart)\"\r\n >\r\n <td colspan=\"9\">\r\n <p class=\"colors-paragraph mb-0\">\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{ background: cart?.colour?.hexadecimalCode }\"\r\n ></span>\r\n {{ cart?.colour?.name }}\r\n </p>\r\n </td>\r\n </tr>\r\n <tr\r\n class=\"revieworder-body-container\"\r\n *ngIf=\"\r\n cart?.configurationInfos?.length || cart?.subLineConfigInfos?.length\r\n \"\r\n [ngClass]=\"\r\n (cart?.configurationInfos?.length > 0 ||\r\n cart?.subLineConfigInfos?.length > 0) &&\r\n (!cart?.consignments || cart.consignments?.length < 2)\r\n ? 'borderNew'\r\n : ''\r\n \"\r\n >\r\n <td colspan=\"9\">\r\n <ng-container\r\n *ngIf=\"cart?.configurationInfos?.length; else accessoriesColor\"\r\n >\r\n <p\r\n class=\"colors-paragraph mb-0\"\r\n *ngIf=\"!cart?.product?.flashingProduct; else flashingColour\"\r\n >\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{\r\n background:\r\n cart?.configurationInfos[0]?.configurationValue?.split(\r\n '|'\r\n ) | slice : 2\r\n }\"\r\n ></span>\r\n {{\r\n cart?.configurationInfos[0]?.configurationValue?.split(\"|\")\r\n | slice : 1 : 2\r\n }}\r\n </p>\r\n <ng-template #flashingColour>\r\n <p class=\"colors-paragraph mb-0\">\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{\r\n background: getColourDetails(\r\n cartDetails[i]?.configurationInfos,\r\n 'background'\r\n )\r\n }\"\r\n ></span>\r\n {{\r\n getColourDetails(cartDetails[i]?.configurationInfos, \"name\")\r\n }}\r\n </p>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #accessoriesColor>\r\n <p class=\"colors-paragraph my-2\" *ngIf=\"hasColour(cart)\">\r\n <span\r\n class=\"revieworder-color mr-2\"\r\n [ngStyle]=\"{\r\n background: cart?.colour?.hexadecimalCode\r\n }\"\r\n ></span>\r\n {{ cart?.colour?.name }}\r\n </p>\r\n </ng-template>\r\n <ng-container *ngIf=\"cart?.subLineConfigInfos?.length > 0\">\r\n <p class=\"m-0\">\r\n <a\r\n href=\"javascript:void(0)\"\r\n (click)=\"showHide(i)\"\r\n class=\"see-more-link\"\r\n >\r\n {{ showDetails[i] == true ? \"Hide\" : \"See\" }} more details\r\n </a>\r\n </p>\r\n <div class=\"revieworder-collapse\" *ngIf=\"showDetails[i]\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-6 bundle-details\">\r\n <div class=\"row bundle-details-header\">\r\n <div class=\"col-3\">Quantity</div>\r\n <div class=\"col-3\">Length (LM)</div>\r\n <ng-container\r\n *ngIf=\"cart?.subLineConfigInfos[i]?.bundleName\"\r\n >\r\n <div class=\"col-3\">Bundle</div>\r\n <div class=\"col-3\">Reference</div>\r\n </ng-container>\r\n </div>\r\n <div\r\n class=\"row\"\r\n *ngFor=\"let subLine of cart?.subLineConfigInfos\"\r\n >\r\n <div class=\"col-3\">{{ subLine?.quantity }}</div>\r\n <div class=\"col-3\">\r\n {{ subLine?.length | number : \"0.3-3\" }}\r\n </div>\r\n <ng-container *ngIf=\"subLine?.bundleName\">\r\n <div class=\"col-3\">{{ subLine?.bundleName }}</div>\r\n <div class=\"col-3\">{{ subLine?.reference }}</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n <tr>\r\n <td colspan=\"9\" class=\"p-0\">\r\n <div\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct &&\r\n cartDetails[i]?.productConfiguredInfos\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"let data of cartDetails[i]?.productConfiguredInfos\"\r\n >\r\n <div\r\n class=\"flashing-block\"\r\n *ngIf=\"data?.product?.name?.toLowerCase() == 'flashguard'\"\r\n >\r\n <div class=\"row\">\r\n <div class=\"col-sm-3\">\r\n <h3 class=\"flash-title\">{{ data?.product?.name }}</h3>\r\n <h6 class=\"skuId\">SKU: {{ data?.product?.code }}</h6>\r\n <span *ngIf=\"data?.girth\"\r\n >Girth: +{{ data.girth }}mm\r\n </span>\r\n </div>\r\n <div class=\"offset-sm-3 col-sm-2\">\r\n {{ data?.quantityDouble }} {{ data?.unitType }}\r\n </div>\r\n <div class=\"col-sm-2\">\r\n {{ data?.basePrice?.formattedValue || \"-\"\r\n }}<span *ngIf=\"isOrderPermissions\"\r\n >/{{ data?.unitType }}</span\r\n >\r\n </div>\r\n <div class=\"col-sm-2\">\r\n {{ data?.totalPrice?.formattedValue || \"-\" }}\r\n <span *ngIf=\"isOrderPermissions\" class=\"gst-text\"\r\n >excl GST</span\r\n >\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </td>\r\n </tr>\r\n <ng-container\r\n *ngIf=\"cart?.consignments && cart.consignments.length > 1\"\r\n >\r\n <tr\r\n *ngFor=\"let consignment of cart.consignments; let last = last\"\r\n [ngClass]=\"last ? 'borderNew' : ''\"\r\n >\r\n <td> </td>\r\n <td> </td>\r\n <td> </td>\r\n <td>{{ consignment?.statusDate | date : \"dd/MM/yyyy\" }}</td>\r\n <td>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"consignment-number\"\r\n title=\"Consignment Number\"\r\n >\r\n {{ consignment.code }}\r\n </a>\r\n </td>\r\n <td> </td>\r\n <td>\r\n {{ consignment.entries[0]?.shippedQuantity }}\r\n {{ cart?.unit?.code }}\r\n </td>\r\n <td> </td>\r\n <td class=\"statusColm\">\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n consignment?.status == 'CREATED'\r\n ? '#F3A931'\r\n : consignment?.status == 'APPROVED'\r\n ? '#f26522'\r\n : consignment?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : consignment?.status == 'READY'\r\n ? '#496471'\r\n : consignment?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : consignment?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : consignment?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : consignment?.status == 'CANCELLED'\r\n ? '#000000'\r\n : consignment?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ consignment?.statusDisplay || \"-\" }}\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #nodata>\r\n <tr class=\"revieworder-body-container\">\r\n <td colspan=\"7\" class=\"text-center\">{{ noRecord }}</td>\r\n </tr>\r\n </ng-template>\r\n </table>\r\n</div>\r\n<div\r\n class=\"modal fade\"\r\n id=\"imageModal\"\r\n role=\"dialog\"\r\n aria-labelledby=\"imageModal\"\r\n aria-hidden=\"true\"\r\n #imageModal\r\n>\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <i\r\n class=\"icon-close invite-pop-close\"\r\n #closeInviteModal\r\n data-dismiss=\"modal\"\r\n aria-label=\"Close\"\r\n ></i>\r\n </div>\r\n <div class=\"modal-body\">\r\n <img [src]=\"imageModalSrc\" alt=\"alert\" />\r\n <div *ngIf=\"isFlashingModal\" class=\"flashing-details\">\r\n <app-custom-flashing-image-details\r\n [cartDetails]=\"flashingImageDetails\"\r\n ></app-custom-flashing-image-details>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@media screen and (min-width: 1366px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: 1.063rem;--fontsize17-5: 1.1rem;--fontsize18: 1.125rem;--fontsize18-4: 1.5rem;--fontsize20: 1.25rem;--fontsize21: 1.313rem;--fontsize22: 1.375rem;--fontsize23: 1.438rem;--fontsize24: 1.5rem;--fontsize26: 1.625rem;--fontsize28: 1.75rem;--fontsize30: 1.625rem;--fontsize32: 2rem;--fontsize34: 2.125rem;--fontsize36: 2rem;--fontsize40: 2.25rem;--fontsize46: 2.875rem;--fontsize80: 5rem}}@media screen and (max-width: 1365px) and (min-width: 768px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2.875rem;--fontsize80: 3.5rem}}@media screen and (max-width: 767px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize16-5: .77rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize19: .938rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize26: 1.25rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2rem;--fontsize80: 2.5rem}}@font-face{font-family:icomoon;font-weight:400;src:url(../assets/fonts/icomoon.ttf) format(\"ttf\"),url(../assets/fonts/icomoon.woff) format(\"woff\");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:\"Arial Regular\";src:url(../assets/fonts/arial-webfont.woff) format(\"woff\"),url(../assets/fonts/arial-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Bold\";src:url(../assets/fonts/arialbold-webfont.woff) format(\"woff\"),url(../assets/fonts/arialbold-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Black\";src:url(../assets/fonts/arialblack-webfont.woff) format(\"woff\"),url(../assets/fonts/arialblack-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Reqular\";src:url(../assets/fonts/helveticaneue.woff) format(\"woff\"),url(../assets/fonts/helveticaneue.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Thin\";src:url(../assets/fonts/helveticaneuethin-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuethin-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Medium\";src:url(../assets/fonts/helveticaneuemedium-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuemedium-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}[class*=\" icon-\"],[class^=icon-]{font-family:icomoon!important;font-feature-settings:normal;font-variant:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;text-transform:none;font-display:swap}.icon-right:before{content:\"\\e902\"}.icon-materials:before{content:\"\\e900\"}.icon-natural-lighting:before{content:\"\\e90a\"}.icon-rainwater:before{content:\"\\e901\"}.icon-roofing:before{content:\"\\e90b\"}.icon-flashing{position:relative;display:inline-block;height:32px;text-align:center;width:32px}.icon-flashing:before,.mainnav-link-level-2.show .navTagChild .icon-flashing:before{content:url(../assets/images/icon-flashing-white.svg);height:20px;width:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:15px}li.megamenuSubChild:hover .icon-flashing:before{content:url(../assets/images/icon-flashing-black.svg)}.icon-structural:before{content:\"\\e90c\"}.icon-accessories-old .path1:before{content:\"\\e903\"}.icon-accessories-old .path2:before{margin-left:-1em;content:\"\\e904\"}.icon-accessories-old .path3:before{margin-left:-1em;content:\"\\e905\"}.icon-cladding-old .path1:before{content:\"\\e90d\"}.icon-cladding-old .path2:before{margin-left:-1em;content:\"\\e90e\"}.icon-close:before{content:\"\\e90f\"}.icon-message:before{content:\"\\e910\"}.icon-search .path1:before{content:\"\\e906\"}.icon-search .path2:before{content:\"\\e907\"}.icon-search .path3:before{margin-left:-1.0156em;content:\"\\e908\"}.icon-summary:before{content:\"\\e911\"}.icon-branch:before{content:\"\\e912\"}.icon-delivery:before{content:\"\\e913\"}.icon-downloads:before{content:\"\\e909\"}.icon-drawings:before{content:\"\\e914\"}.icon-full:before{content:\"\\e915\"}.icon-manual:before{content:\"\\e916\"}.icon-payment:before{content:\"\\e917\"}.icon-empty .path1:before{content:\"\\e918\"}.icon-empty .path2:before{margin-left:-1em;content:\"\\e919\"}.icon-empty .path3:before{margin-left:-1em;content:\"\\e91a\"}.icon-product-overview:before{content:\"\\e91b\"}.icon-arrows:before{content:\"\\e91c\"}.icon-selected:before{content:\"\\e91d\"}.icon-accessories:before{content:\"\\e91b\"}.icon-cladding:before{content:\"\\e91e\"}.icon-Triangle:before{content:\"\\e91f\"}.icon-home:before{content:\"\\e920\"}.icon-faq:before{content:\"\\e921\"}.icon-temperature:before{content:\"\\e922\"}body header{font-family:\"Arial Regular\",sans-serif}header{background-color:#1d1d1b;position:sticky;top:0;background-size:100% 25%!important;background-repeat:no-repeat;z-index:10}header .header{max-width:100%;padding:0}header cx-banner cx-media img{margin-top:.7rem;margin-bottom:0}header label{display:inline-flex}header .SiteLinks{height:52px;display:flex;align-items:center;justify-content:space-between;padding-top:5px;padding-bottom:5px}header .SiteLinks cx-paragraph p{color:#fff;font-size:var(--fontsize16);line-height:var(--fontsize16);margin-bottom:0}header .SiteLinks cx-paragraph{font-size:var(--fontsize16)}header .SiteLinks app-account-dropdown,header .SiteLinks app-find-store{width:calc(25% - 25px);max-width:328px;margin-right:25px}header .SiteLinks app-contact-us{width:calc(20% - 25px);max-width:100px;margin-left:auto}header .SiteLinks app-custom-mini-cart{width:10%}header .SiteLinks .preferenceLink{margin-left:auto}header .SiteLinks .preferenceLink cx-generic-link{margin:0}header .SiteLinks .preferenceLink cx-generic-link cx-media img{height:22px;margin:0}header .SiteLogo .storeLogo{position:absolute;z-index:99;left:40px;bottom:10px}header .SiteLogo .homeLogo{max-width:28px;height:28px;position:absolute;z-index:99;bottom:47px}header .NavigationBar{flex:70%;background-color:#b61828;min-height:40px;display:flex;align-items:center;position:relative}header .logoutMenu{margin-top:0!important}header .logoutMenu li{cursor:pointer;background-color:#4c4c4c;color:#fff}header .logoutMenu li:hover{text-decoration:underline;background-color:#4c4c4c}header .MarketingContext{width:100%;margin:auto}.customer-service-icon{cursor:pointer}.helpSupport{width:20rem;border:0;margin-top:.5rem!important;transform:translate(-42%,36px)!important;padding:1rem 1rem 0;background-color:#393939;color:#fff;top:0}.helpSupport .arrow-up{position:absolute;top:-8px;right:44%;width:0;height:0;border-left:15px solid rgba(0,0,0,0);border-right:15px solid rgba(0,0,0,0);border-bottom:15px solid #393939}.helpSupport .contact-us-info .heading{font-family:\"Arial Bold\",sans-serif}.helpSupport .contact-us-info .detail{font-size:var(--fontsize14);line-height:2rem}.helpSupport .contact-us-info .detail .service-icon{height:20px;width:20px;margin-right:10px}.helpSupport .contact-us-info .contactLink a{font-size:var(--fontsize14);text-decoration:underline;text-transform:uppercase}.helpSupport .contact-us-info a{color:#fff;text-decoration:none}.helpSupport .contact-us-info a:hover{text-decoration:underline}.pageTitle{font-family:\"Helvetica Neue Regular\",sans-serif;font-size:var(--fontsize54)}#visualization-container{text-align:center;margin:0 auto}#cds-viewer-container-3d{width:320px;height:200px}#cds-viewer-container-2d{width:320px;height:200px}[aria-label=Close]{cursor:pointer}cx-media.is-missing{background:url(./assets/images/search-noimage.svg);background-size:cover;background-position:center;background-repeat:no-repeat}cx-global-message{position:fixed;top:9rem;width:100%;z-index:13}@media screen and (max-width: 991px){cx-global-message{top:3.75rem}cx-storefront header{background-color:#b61828}cx-storefront header cx-banner cx-media img{margin:auto}cx-storefront header .SiteLogo{width:100%;max-width:211px;margin:auto;padding-left:30px;box-sizing:border-box}cx-storefront header .SiteLogo .storeLogo{position:unset}cx-storefront header .SearchBox{margin:14px 0 10px;width:30px}cx-storefront header .SiteLinks{background-color:transparent;width:110px;margin:auto 25px auto 0}cx-storefront header .SiteLinks app-account-dropdown,cx-storefront header .SiteLinks app-find-store,cx-storefront header .SiteLinks app-contact-us,cx-storefront header .SiteLinks cx-paragraph,cx-storefront header .SiteLinks .preferenceLink{display:none}cx-storefront header .SiteLinks app-custom-mini-cart,cx-storefront header .SiteLinks app-custom-user-account{width:35px}cx-storefront header.is-expanded{overflow-y:auto;position:fixed;bottom:0;top:0;width:calc(100% - 99px)}cx-storefront header.is-expanded .header{background-color:#b61828;margin-left:0;position:relative}cx-storefront header.is-expanded .PreHeader{position:absolute;right:-5px;top:5px}cx-storefront header.is-expanded .SearchBox{display:none}cx-storefront header.is-expanded .SiteLogo{position:absolute;bottom:110px;z-index:9}cx-storefront header.is-expanded .SiteLinks{background-color:#1d1d1b;width:100%;margin:15px auto 15px 0;height:unset;padding:15px;max-width:100%;position:relative;z-index:9;top:60px}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-account-dropdown{width:100%;max-width:100%}cx-storefront header.is-expanded .SiteLinks app-find-store{width:50%;max-width:328px;min-width:328px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-right:15px;margin-left:auto;width:115px;max-width:unset}cx-storefront header.is-expanded .navigation{position:relative;top:45px}cx-storefront header.is-expanded:before{background-color:#0000004d;right:0;content:\"\";position:fixed;z-index:2;top:0;bottom:0;height:100vh;width:99px}cx-storefront header.is-expanded:after{background-color:transparent}}@media screen and (max-width: 576px){cx-storefront header .SiteLogo{max-width:80px}cx-storefront header .SiteLogo .storeLogo{display:none}cx-storefront header .searchBox{height:45px}cx-storefront header.is-expanded{width:100%}cx-storefront header.is-expanded .header,cx-storefront header.is-expanded .navigation{width:100%}cx-storefront header.is-expanded .SiteLogo{bottom:160px;max-width:211px!important}cx-storefront header.is-expanded .SiteLogo .storeLogo{display:block}cx-storefront header.is-expanded .SiteLinks{max-width:100%;width:100%}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-find-store{width:100%;max-width:100%;margin-bottom:10px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-left:0}cx-storefront header.is-expanded .SiteLinks cx-paragraph{margin-left:auto}cx-storefront header.is-expanded:before{display:none}.pageTitle{font-size:28px}}.table{color:#1d1d1b;background:#ffffff}.table td{border:0;vertical-align:top!important}.revieworder-table-container{padding-bottom:15rem}.revieworder-table-container .revieworder-header-container{background:#646363;color:#fff;font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .revieworder-header-container th{vertical-align:middle!important;font-size:var(--fontsize14)}.revieworder-table-container .revieworder-header-container .colHD{width:120px;font-size:var(--fontsize14);display:flex;flex-direction:column;align-self:center;line-height:18px}.revieworder-table-container .revieworder-header-container .colHD span{text-align:right;display:block;font-size:var(--fontsize12)}.revieworder-table-container .revieworder-header-container .item{width:350px}.revieworder-table-container .product-img{width:50px;height:50px;border:1px solid #E0E0E0;min-width:50px}.revieworder-table-container .product-img cx-media{top:-1px}.revieworder-table-container .borderNew{border-bottom:1px solid #E0E0E0}.revieworder-table-container .statusColm{width:140px}.revieworder-table-container .statusColor{display:inline-block;width:12px;height:12px;border-radius:50%}.revieworder-table-container .subPrice{color:#707070}.revieworder-table-container .revieworder-body-container{padding-bottom:1rem}.revieworder-table-container .revieworder-body-container .product-image-container{display:flex}.revieworder-table-container .revieworder-body-container .product-image-container .reviewproduct-image{width:71px;height:71px}.revieworder-table-container .revieworder-body-container .product-image-container .reviewproduct-name{font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .revieworder-body-container .product-image-container .sku-text{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif;color:#6f6f6f}.revieworder-table-container .revieworder-body-container .see-more-link{text-decoration:underline}.revieworder-table-container .revieworder-body-container .see-more-link:hover{color:#d51317}.revieworder-table-container .revieworder-body-container .seemoredetails-link{font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif;text-decoration:underline;cursor:pointer}.revieworder-table-container .revieworder-body-container .seemoredetails-link:hover{color:#b61828}.revieworder-table-container .revieworder-body-container .revieworder-collapse .bundle-details{background:#F6F6F6;border:1px solid #E0E0E0;margin-left:15px;padding:1rem;line-height:2.5rem}.revieworder-table-container .revieworder-body-container .revieworder-collapse .bundle-details .bundle-details-header{font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .colors-paragraph{display:flex;align-items:center}.revieworder-table-container .colors-paragraph .revieworder-color{width:20px;height:20px;border:1px solid #000000;display:inline-flex}.revieworder-table-container .consignment-number{text-decoration:underline;color:#b61828}.revieworder-table-container .consignment-number:hover,.revieworder-table-container .consignment-number:visited{color:#b61828}::ng-deep .flashing-expand{cursor:pointer}::ng-deep .flashing-expand:after{background:url(../../../../assets/images/expand-icon.svg) no-repeat center;z-index:2;width:24px;content:\"\";height:24px;position:absolute;top:0;right:0}::ng-deep .flashing-expand img{max-height:40px;max-width:40px}::ng-deep .flashing-expand.flashing-open:after{background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%0D %3Cg id%3D%22Group_14477%22 data-name%3D%22Group 14477%22 transform%3D%22translate(-5533.5 11452.992)%22%3E%0D %3Cg id%3D%22Group_14476%22 data-name%3D%22Group 14476%22%3E%0D %3Cg id%3D%22Group_14475%22 data-name%3D%22Group 14475%22 transform%3D%22translate(5164.5 -12321.992)%22%3E%0D %3Crect id%3D%22Rectangle_1116%22 data-name%3D%22Rectangle 1116%22 width%3D%2224%22 height%3D%2224%22 transform%3D%22translate(369 869)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11366%22 data-name%3D%22Path 11366%22 d%3D%22M142.587%2C65.954v4.569a1.963%2C1.963%2C0%2C0%2C1-1.839%2C2.068H127.833a1.965%2C1.965%2C0%2C0%2C1-1.839-2.068V58.066A1.963%2C1.963%2C0%2C0%2C1%2C127.833%2C56h4.8a.83.83%2C0%2C1%2C1%2C0%2C1.659h-4.505a.516.516%2C0%2C0%2C0-.472.553V70.378a.521.521%2C0%2C0%2C0%2C.472.553h12.33a.516.516%2C0%2C0%2C0%2C.472-.553V65.954a.83.83%2C0%2C1%2C1%2C1.659%2C0Z%22 transform%3D%22translate(5411.209 -11505.287)%22 fill-rule%3D%22evenodd%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11367%22 data-name%3D%22Path 11367%22 d%3D%22M26.413%2C4.5H21.5a.607.607%2C0%2C0%2C0-.608.608v.009a.607.607%2C0%2C0%2C0%2C.608.608h3.4l-5.091%2C5.126a.608.608%2C0%2C0%2C0%2C.858.862l5.126-5.1v3.4a.607.607%2C0%2C0%2C0%2C.608.608h.009a.607.607%2C0%2C0%2C0%2C.608-.608V5.108A.607.607%2C0%2C0%2C0%2C26.413%2C4.5Z%22 transform%3D%22translate(5526.775 -11453.789)%22%2F%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center}#imageModal.show{display:flex!important;vertical-align:middle!important;align-items:center!important}#imageModal.show .modal-header{justify-content:right;border:none}#imageModal.show .modal-body{vertical-align:middle;margin:0 1rem;overflow:auto;max-height:80vh}#imageModal.show .modal-body img{max-width:100%;max-height:80vh}.flashing-block{background-color:#e8e8e8;padding:12px;border-bottom:1px solid #C6C6C6}.flashing-block .flash-title{font-size:var(--fontsize16);font-family:\"Arial Bold\",sans-serif}.flashing-block .skuId{color:#707070;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.flashing-block .gst-text{display:block;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif}\n"], components: [{ type: i3__namespace.MediaComponent, selector: "cx-media", inputs: ["container", "format", "alt", "role", "loading"], outputs: ["loaded"] }, { type: CustomFlashingImageDetailsComponent, selector: "app-custom-flashing-image-details", inputs: ["cartDetails", "forPdf", "appendixNo"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i5__namespace.AsyncPipe, "date": i5__namespace.DatePipe, "slice": i5__namespace.SlicePipe, "number": i5__namespace.DecimalPipe } });
|
|
8079
|
+
OrderDetailListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OrderDetailListComponent, selector: "app-order-detail-list", inputs: { cartDetails: "cartDetails", sortByVal: "sortByVal", orderDate: "orderDate", isCardData: "isCardData" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"loading\" *ngIf=\"showWaitCursor | async\">Loading…</div>\r\n<div class=\"revieworder-table-container py-3\">\r\n <table class=\"w-100 table\">\r\n <tr class=\"revieworder-header-container\">\r\n <th>#</th>\r\n <th class=\"item\">ITEM</th>\r\n <th>JOB REFERENCE</th>\r\n <th>DELIVERY DATE</th>\r\n <th>DELIVERY #</th>\r\n <th>QUANTITY ORDERED</th>\r\n <th>QUANTITY SHIPPED</th>\r\n <th class=\"colHD\">\r\n <div class=\"text-right\">TOTAL PRICE</div>\r\n <span class=\"text-right\">excl GST</span>\r\n </th>\r\n <th>STATUS</th>\r\n </tr>\r\n <ng-container *ngIf=\"cartDetails?.length; else nodata\">\r\n <ng-container *ngFor=\"let cart of cartDetails; let i = index\">\r\n <tr\r\n class=\"revieworder-body-container\"\r\n [ngClass]=\"\r\n !hasColour(cart) && cart?.product?.finishedProduct\r\n ? 'borderNew'\r\n : ''\r\n \"\r\n >\r\n <td>\r\n <ng-container *ngIf=\"cart?.entryNumber?.length > 9; else entryId\">{{\r\n cart?.entryNumber\r\n }}</ng-container>\r\n <ng-template #entryId>0{{ cart?.entryNumber + 1 }}</ng-template>\r\n </td>\r\n <td>\r\n <div class=\"row product-image-container\">\r\n <div class=\"col-sm-4 col-lg-2 p-2 product-img\">\r\n <ng-container\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct;\r\n else normalImage\r\n \"\r\n >\r\n <a\r\n data-toggle=\"modal\"\r\n class=\"flashing-expand\"\r\n (click)=\"viewImage($event, cartDetails[i])\"\r\n [attr.data-target]=\"'#imageModal'\"\r\n *ngIf=\"hasImage(cartDetails[i]); else hasPdf\"\r\n >\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </a>\r\n <ng-template #hasPdf>\r\n <a\r\n class=\"flashing-expand flashing-open\"\r\n [href]=\"getPdfLink(cartDetails[i])\"\r\n target=\"_blank\"\r\n >\r\n <img\r\n class=\"pdf-icon\"\r\n src=\"../../../../../assets/images/pdf-icon.svg\"\r\n alt=\"Click to open PDF\"\r\n title=\"Click to open PDF\"\r\n />\r\n </a>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #normalImage>\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </ng-template>\r\n </div>\r\n <div class=\"col-sm-8 col-lg-10\">\r\n <p class=\"reviewproduct-name mb-2\">{{ cart?.product?.name }}</p>\r\n <p class=\"sku-text mb-0\">SKU: {{ cart?.product?.code }}</p>\r\n </div>\r\n </div>\r\n </td>\r\n <td>{{ cart?.jobReference || \"-\" }}</td>\r\n <td>\r\n {{\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\r\n ? (orderDate | date : \"dd/MM/yyyy\")\r\n : \"\"\r\n }}\r\n </td>\r\n <td>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"consignment-number\"\r\n title=\"Consignment Number\"\r\n >\r\n {{\r\n cart?.consignments && cart?.consignments?.length == 1\r\n ? cart?.consignments[0].code\r\n : \"\"\r\n }}\r\n </a>\r\n </td>\r\n <td>\r\n {{ cart?.quantityDouble }} {{ cart?.unit?.code }}<br />\r\n <span *ngIf=\"isOrderPermissions\" class=\"subPrice\"\r\n >@ {{ cart?.basePrice?.formattedValue }}/{{\r\n cart?.basePrice?.unitType\r\n }}</span\r\n >\r\n </td>\r\n <td>\r\n {{\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\r\n ? cart?.quantityDouble\r\n : \"\"\r\n }}\r\n {{\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\r\n ? cart?.unit?.code\r\n : \"\"\r\n }}\r\n </td>\r\n <td>\r\n {{ cart?.totalPrice?.formattedValue || \"-\" }}\r\n <span *ngIf=\"isOrderPermissions\" class=\"d-block\">excl GST</span>\r\n </td>\r\n <td class=\"statusColm\">\r\n <small\r\n *ngIf=\"\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\r\n \"\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color': getStatusColor(cart)\r\n }\"\r\n ></small>\r\n {{\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\r\n ? cart?.consignments && cart?.consignments?.length == 1\r\n ? cart?.consignments[0]?.entries[0]?.statusDisplay\r\n : cart?.statusDisplay\r\n : \"\"\r\n }}\r\n </td>\r\n </tr>\r\n <ng-container *ngIf=\"cart?.product?.classifications\">\r\n <tr class=\"revieworder-body-container\">\r\n <td colspan=\"9\">\r\n <span *ngIf=\"cart?.product?.classifications[0]?.features\">\r\n {{\r\n getClassifications(cartDetails[i]?.product?.classifications)\r\n }}\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n <tr\r\n class=\"revieworder-body-container\"\r\n *ngIf=\"!cart?.configurationInfos?.length && hasColour(cart)\"\r\n >\r\n <td colspan=\"9\">\r\n <p class=\"colors-paragraph mb-0\">\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{ background: cart?.colour?.hexadecimalCode }\"\r\n ></span>\r\n {{ cart?.colour?.name }}\r\n </p>\r\n </td>\r\n </tr>\r\n <tr\r\n class=\"revieworder-body-container\"\r\n *ngIf=\"\r\n cart?.configurationInfos?.length || cart?.subLineConfigInfos?.length\r\n \"\r\n [ngClass]=\"\r\n (cart?.configurationInfos?.length > 0 ||\r\n cart?.subLineConfigInfos?.length > 0) &&\r\n (!cart?.consignments || cart?.consignments?.length < 2)\r\n ? 'borderNew'\r\n : ''\r\n \"\r\n >\r\n <td colspan=\"9\">\r\n <ng-container\r\n *ngIf=\"cart?.configurationInfos?.length; else accessoriesColor\"\r\n >\r\n <p\r\n class=\"colors-paragraph mb-0\"\r\n *ngIf=\"!cart?.product?.flashingProduct; else flashingColour\"\r\n >\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{\r\n background:\r\n cart?.configurationInfos[0]?.configurationValue?.split(\r\n '|'\r\n ) | slice : 2\r\n }\"\r\n ></span>\r\n {{\r\n cart?.configurationInfos[0]?.configurationValue?.split(\"|\")\r\n | slice : 1 : 2\r\n }}\r\n </p>\r\n <ng-template #flashingColour>\r\n <p class=\"colors-paragraph mb-0\">\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{\r\n background: getColourDetails(\r\n cartDetails[i]?.configurationInfos,\r\n 'background'\r\n )\r\n }\"\r\n ></span>\r\n {{\r\n getColourDetails(cartDetails[i]?.configurationInfos, \"name\")\r\n }}\r\n </p>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #accessoriesColor>\r\n <p class=\"colors-paragraph my-2\" *ngIf=\"hasColour(cart)\">\r\n <span\r\n class=\"revieworder-color mr-2\"\r\n [ngStyle]=\"{\r\n background: cart?.colour?.hexadecimalCode\r\n }\"\r\n ></span>\r\n {{ cart?.colour?.name }}\r\n </p>\r\n </ng-template>\r\n <ng-container *ngIf=\"cart?.subLineConfigInfos?.length > 0\">\r\n <p class=\"m-0\">\r\n <a\r\n href=\"javascript:void(0)\"\r\n (click)=\"showHide(i)\"\r\n class=\"see-more-link\"\r\n >\r\n {{ showDetails[i] == true ? \"Hide\" : \"See\" }} more details\r\n </a>\r\n </p>\r\n <div class=\"revieworder-collapse\" *ngIf=\"showDetails[i]\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-6 bundle-details\">\r\n <div class=\"row bundle-details-header\">\r\n <div class=\"col-3\">Quantity</div>\r\n <div class=\"col-3\">Length (LM)</div>\r\n <ng-container\r\n *ngIf=\"cart?.subLineConfigInfos[i]?.bundleName\"\r\n >\r\n <div class=\"col-3\">Bundle</div>\r\n <div class=\"col-3\">Reference</div>\r\n </ng-container>\r\n </div>\r\n <div\r\n class=\"row\"\r\n *ngFor=\"let subLine of cart?.subLineConfigInfos\"\r\n >\r\n <div class=\"col-3\">{{ subLine?.quantity }}</div>\r\n <div class=\"col-3\">\r\n {{ subLine?.length | number : \"0.3-3\" }}\r\n </div>\r\n <ng-container *ngIf=\"subLine?.bundleName\">\r\n <div class=\"col-3\">{{ subLine?.bundleName }}</div>\r\n <div class=\"col-3\">{{ subLine?.reference }}</div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n <tr>\r\n <td colspan=\"9\" class=\"p-0\">\r\n <div\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct &&\r\n cartDetails[i]?.productConfiguredInfos\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"let data of cartDetails[i]?.productConfiguredInfos\"\r\n >\r\n <div\r\n class=\"flashing-block\"\r\n *ngIf=\"data?.product?.name?.toLowerCase() == 'flashguard'\"\r\n >\r\n <div class=\"row\">\r\n <div class=\"col-sm-3\">\r\n <h3 class=\"flash-title\">{{ data?.product?.name }}</h3>\r\n <h6 class=\"skuId\">SKU: {{ data?.product?.code }}</h6>\r\n <span *ngIf=\"data?.girth\"\r\n >Girth: +{{ data.girth }}mm\r\n </span>\r\n </div>\r\n <div class=\"offset-sm-3 col-sm-2\">\r\n {{ data?.quantityDouble }} {{ data?.unitType }}\r\n </div>\r\n <div class=\"col-sm-2\">\r\n {{ data?.basePrice?.formattedValue || \"-\"\r\n }}<span *ngIf=\"isOrderPermissions\"\r\n >/{{ data?.unitType }}</span\r\n >\r\n </div>\r\n <div class=\"col-sm-2\">\r\n {{ data?.totalPrice?.formattedValue || \"-\" }}\r\n <span *ngIf=\"isOrderPermissions\" class=\"gst-text\"\r\n >excl GST</span\r\n >\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </td>\r\n </tr>\r\n <ng-container\r\n *ngIf=\"cart?.consignments && cart?.consignments.length > 1\"\r\n >\r\n <tr\r\n *ngFor=\"let consignment of cart?.consignments; let last = last\"\r\n [ngClass]=\"last ? 'borderNew' : ''\"\r\n >\r\n <td> </td>\r\n <td> </td>\r\n <td> </td>\r\n <td>{{ consignment?.statusDate | date : \"dd/MM/yyyy\" }}</td>\r\n <td>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"consignment-number\"\r\n title=\"Consignment Number\"\r\n >\r\n {{ consignment.code }}\r\n </a>\r\n </td>\r\n <td> </td>\r\n <td>\r\n {{ consignment.entries[0]?.shippedQuantity }}\r\n {{ cart?.unit?.code }}\r\n </td>\r\n <td> </td>\r\n <td class=\"statusColm\">\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n consignment?.entries[0]?.status == 'CREATED'\r\n ? '#F3A931'\r\n : consignment?.entries[0]?.status == 'APPROVED'\r\n ? '#f26522'\r\n : consignment?.entries[0]?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : consignment?.entries[0]?.status == 'READY'\r\n ? '#496471'\r\n : consignment?.entries[0]?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : consignment?.entries[0]?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : consignment?.entries[0]?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : consignment?.entries[0]?.status == 'CANCELLED'\r\n ? '#000000'\r\n : consignment?.entries[0]?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ consignment?.entries[0]?.statusDisplay || \"-\" }}\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #nodata>\r\n <tr class=\"revieworder-body-container\">\r\n <td colspan=\"7\" class=\"text-center\">{{ noRecord }}</td>\r\n </tr>\r\n </ng-template>\r\n </table>\r\n</div>\r\n<div\r\n class=\"modal fade\"\r\n id=\"imageModal\"\r\n role=\"dialog\"\r\n aria-labelledby=\"imageModal\"\r\n aria-hidden=\"true\"\r\n #imageModal\r\n>\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <i\r\n class=\"icon-close invite-pop-close\"\r\n #closeInviteModal\r\n data-dismiss=\"modal\"\r\n aria-label=\"Close\"\r\n ></i>\r\n </div>\r\n <div class=\"modal-body\">\r\n <img [src]=\"imageModalSrc\" alt=\"alert\" />\r\n <div *ngIf=\"isFlashingModal\" class=\"flashing-details\">\r\n <app-custom-flashing-image-details\r\n [cartDetails]=\"flashingImageDetails\"\r\n ></app-custom-flashing-image-details>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@media screen and (min-width: 1366px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: 1.063rem;--fontsize17-5: 1.1rem;--fontsize18: 1.125rem;--fontsize18-4: 1.5rem;--fontsize20: 1.25rem;--fontsize21: 1.313rem;--fontsize22: 1.375rem;--fontsize23: 1.438rem;--fontsize24: 1.5rem;--fontsize26: 1.625rem;--fontsize28: 1.75rem;--fontsize30: 1.625rem;--fontsize32: 2rem;--fontsize34: 2.125rem;--fontsize36: 2rem;--fontsize40: 2.25rem;--fontsize46: 2.875rem;--fontsize80: 5rem}}@media screen and (max-width: 1365px) and (min-width: 768px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2.875rem;--fontsize80: 3.5rem}}@media screen and (max-width: 767px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize16-5: .77rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize19: .938rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize26: 1.25rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2rem;--fontsize80: 2.5rem}}@font-face{font-family:icomoon;font-weight:400;src:url(../assets/fonts/icomoon.ttf) format(\"ttf\"),url(../assets/fonts/icomoon.woff) format(\"woff\");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:\"Arial Regular\";src:url(../assets/fonts/arial-webfont.woff) format(\"woff\"),url(../assets/fonts/arial-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Bold\";src:url(../assets/fonts/arialbold-webfont.woff) format(\"woff\"),url(../assets/fonts/arialbold-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Black\";src:url(../assets/fonts/arialblack-webfont.woff) format(\"woff\"),url(../assets/fonts/arialblack-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Reqular\";src:url(../assets/fonts/helveticaneue.woff) format(\"woff\"),url(../assets/fonts/helveticaneue.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Thin\";src:url(../assets/fonts/helveticaneuethin-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuethin-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Medium\";src:url(../assets/fonts/helveticaneuemedium-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuemedium-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}[class*=\" icon-\"],[class^=icon-]{font-family:icomoon!important;font-feature-settings:normal;font-variant:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;text-transform:none;font-display:swap}.icon-right:before{content:\"\\e902\"}.icon-materials:before{content:\"\\e900\"}.icon-natural-lighting:before{content:\"\\e90a\"}.icon-rainwater:before{content:\"\\e901\"}.icon-roofing:before{content:\"\\e90b\"}.icon-flashing{position:relative;display:inline-block;height:32px;text-align:center;width:32px}.icon-flashing:before,.mainnav-link-level-2.show .navTagChild .icon-flashing:before{content:url(../assets/images/icon-flashing-white.svg);height:20px;width:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:15px}li.megamenuSubChild:hover .icon-flashing:before{content:url(../assets/images/icon-flashing-black.svg)}.icon-structural:before{content:\"\\e90c\"}.icon-accessories-old .path1:before{content:\"\\e903\"}.icon-accessories-old .path2:before{margin-left:-1em;content:\"\\e904\"}.icon-accessories-old .path3:before{margin-left:-1em;content:\"\\e905\"}.icon-cladding-old .path1:before{content:\"\\e90d\"}.icon-cladding-old .path2:before{margin-left:-1em;content:\"\\e90e\"}.icon-close:before{content:\"\\e90f\"}.icon-message:before{content:\"\\e910\"}.icon-search .path1:before{content:\"\\e906\"}.icon-search .path2:before{content:\"\\e907\"}.icon-search .path3:before{margin-left:-1.0156em;content:\"\\e908\"}.icon-summary:before{content:\"\\e911\"}.icon-branch:before{content:\"\\e912\"}.icon-delivery:before{content:\"\\e913\"}.icon-downloads:before{content:\"\\e909\"}.icon-drawings:before{content:\"\\e914\"}.icon-full:before{content:\"\\e915\"}.icon-manual:before{content:\"\\e916\"}.icon-payment:before{content:\"\\e917\"}.icon-empty .path1:before{content:\"\\e918\"}.icon-empty .path2:before{margin-left:-1em;content:\"\\e919\"}.icon-empty .path3:before{margin-left:-1em;content:\"\\e91a\"}.icon-product-overview:before{content:\"\\e91b\"}.icon-arrows:before{content:\"\\e91c\"}.icon-selected:before{content:\"\\e91d\"}.icon-accessories:before{content:\"\\e91b\"}.icon-cladding:before{content:\"\\e91e\"}.icon-Triangle:before{content:\"\\e91f\"}.icon-home:before{content:\"\\e920\"}.icon-faq:before{content:\"\\e921\"}.icon-temperature:before{content:\"\\e922\"}body header{font-family:\"Arial Regular\",sans-serif}header{background-color:#1d1d1b;position:sticky;top:0;background-size:100% 25%!important;background-repeat:no-repeat;z-index:10}header .header{max-width:100%;padding:0}header cx-banner cx-media img{margin-top:.7rem;margin-bottom:0}header label{display:inline-flex}header .SiteLinks{height:52px;display:flex;align-items:center;justify-content:space-between;padding-top:5px;padding-bottom:5px}header .SiteLinks cx-paragraph p{color:#fff;font-size:var(--fontsize16);line-height:var(--fontsize16);margin-bottom:0}header .SiteLinks cx-paragraph{font-size:var(--fontsize16)}header .SiteLinks app-account-dropdown,header .SiteLinks app-find-store{width:calc(25% - 25px);max-width:328px;margin-right:25px}header .SiteLinks app-contact-us{width:calc(20% - 25px);max-width:100px;margin-left:auto}header .SiteLinks app-custom-mini-cart{width:10%}header .SiteLinks .preferenceLink{margin-left:auto}header .SiteLinks .preferenceLink cx-generic-link{margin:0}header .SiteLinks .preferenceLink cx-generic-link cx-media img{height:22px;margin:0}header .SiteLogo .storeLogo{position:absolute;z-index:99;left:40px;bottom:10px}header .SiteLogo .homeLogo{max-width:28px;height:28px;position:absolute;z-index:99;bottom:47px}header .NavigationBar{flex:70%;background-color:#b61828;min-height:40px;display:flex;align-items:center;position:relative}header .logoutMenu{margin-top:0!important}header .logoutMenu li{cursor:pointer;background-color:#4c4c4c;color:#fff}header .logoutMenu li:hover{text-decoration:underline;background-color:#4c4c4c}header .MarketingContext{width:100%;margin:auto}.customer-service-icon{cursor:pointer}.helpSupport{width:20rem;border:0;margin-top:.5rem!important;transform:translate(-42%,36px)!important;padding:1rem 1rem 0;background-color:#393939;color:#fff;top:0}.helpSupport .arrow-up{position:absolute;top:-8px;right:44%;width:0;height:0;border-left:15px solid rgba(0,0,0,0);border-right:15px solid rgba(0,0,0,0);border-bottom:15px solid #393939}.helpSupport .contact-us-info .heading{font-family:\"Arial Bold\",sans-serif}.helpSupport .contact-us-info .detail{font-size:var(--fontsize14);line-height:2rem}.helpSupport .contact-us-info .detail .service-icon{height:20px;width:20px;margin-right:10px}.helpSupport .contact-us-info .contactLink a{font-size:var(--fontsize14);text-decoration:underline;text-transform:uppercase}.helpSupport .contact-us-info a{color:#fff;text-decoration:none}.helpSupport .contact-us-info a:hover{text-decoration:underline}.pageTitle{font-family:\"Helvetica Neue Regular\",sans-serif;font-size:var(--fontsize54)}#visualization-container{text-align:center;margin:0 auto}#cds-viewer-container-3d{width:320px;height:200px}#cds-viewer-container-2d{width:320px;height:200px}[aria-label=Close]{cursor:pointer}cx-media.is-missing{background:url(./assets/images/search-noimage.svg);background-size:cover;background-position:center;background-repeat:no-repeat}cx-global-message{position:fixed;top:9rem;width:100%;z-index:13}@media screen and (max-width: 991px){cx-global-message{top:3.75rem}cx-storefront header{background-color:#b61828}cx-storefront header cx-banner cx-media img{margin:auto}cx-storefront header .SiteLogo{width:100%;max-width:211px;margin:auto;padding-left:30px;box-sizing:border-box}cx-storefront header .SiteLogo .storeLogo{position:unset}cx-storefront header .SearchBox{margin:14px 0 10px;width:30px}cx-storefront header .SiteLinks{background-color:transparent;width:110px;margin:auto 25px auto 0}cx-storefront header .SiteLinks app-account-dropdown,cx-storefront header .SiteLinks app-find-store,cx-storefront header .SiteLinks app-contact-us,cx-storefront header .SiteLinks cx-paragraph,cx-storefront header .SiteLinks .preferenceLink{display:none}cx-storefront header .SiteLinks app-custom-mini-cart,cx-storefront header .SiteLinks app-custom-user-account{width:35px}cx-storefront header.is-expanded{overflow-y:auto;position:fixed;bottom:0;top:0;width:calc(100% - 99px)}cx-storefront header.is-expanded .header{background-color:#b61828;margin-left:0;position:relative}cx-storefront header.is-expanded .PreHeader{position:absolute;right:-5px;top:5px}cx-storefront header.is-expanded .SearchBox{display:none}cx-storefront header.is-expanded .SiteLogo{position:absolute;bottom:110px;z-index:9}cx-storefront header.is-expanded .SiteLinks{background-color:#1d1d1b;width:100%;margin:15px auto 15px 0;height:unset;padding:15px;max-width:100%;position:relative;z-index:9;top:60px}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-account-dropdown{width:100%;max-width:100%}cx-storefront header.is-expanded .SiteLinks app-find-store{width:50%;max-width:328px;min-width:328px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-right:15px;margin-left:auto;width:115px;max-width:unset}cx-storefront header.is-expanded .navigation{position:relative;top:45px}cx-storefront header.is-expanded:before{background-color:#0000004d;right:0;content:\"\";position:fixed;z-index:2;top:0;bottom:0;height:100vh;width:99px}cx-storefront header.is-expanded:after{background-color:transparent}}@media screen and (max-width: 576px){cx-storefront header .SiteLogo{max-width:80px}cx-storefront header .SiteLogo .storeLogo{display:none}cx-storefront header .searchBox{height:45px}cx-storefront header.is-expanded{width:100%}cx-storefront header.is-expanded .header,cx-storefront header.is-expanded .navigation{width:100%}cx-storefront header.is-expanded .SiteLogo{bottom:160px;max-width:211px!important}cx-storefront header.is-expanded .SiteLogo .storeLogo{display:block}cx-storefront header.is-expanded .SiteLinks{max-width:100%;width:100%}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-find-store{width:100%;max-width:100%;margin-bottom:10px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-left:0}cx-storefront header.is-expanded .SiteLinks cx-paragraph{margin-left:auto}cx-storefront header.is-expanded:before{display:none}.pageTitle{font-size:28px}}.table{color:#1d1d1b;background:#ffffff}.table td{border:0;vertical-align:top!important}.revieworder-table-container{padding-bottom:15rem}.revieworder-table-container .revieworder-header-container{background:#646363;color:#fff;font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .revieworder-header-container th{vertical-align:middle!important;font-size:var(--fontsize14)}.revieworder-table-container .revieworder-header-container .colHD{width:120px;font-size:var(--fontsize14);display:flex;flex-direction:column;align-self:center;line-height:18px}.revieworder-table-container .revieworder-header-container .colHD span{text-align:right;display:block;font-size:var(--fontsize12)}.revieworder-table-container .revieworder-header-container .item{width:350px}.revieworder-table-container .product-img{width:50px;height:50px;border:1px solid #E0E0E0;min-width:50px}.revieworder-table-container .product-img cx-media{top:-1px}.revieworder-table-container .borderNew{border-bottom:1px solid #E0E0E0}.revieworder-table-container .statusColm{width:140px}.revieworder-table-container .statusColor{display:inline-block;width:12px;height:12px;border-radius:50%}.revieworder-table-container .subPrice{color:#707070}.revieworder-table-container .revieworder-body-container{padding-bottom:1rem}.revieworder-table-container .revieworder-body-container .product-image-container{display:flex}.revieworder-table-container .revieworder-body-container .product-image-container .reviewproduct-image{width:71px;height:71px}.revieworder-table-container .revieworder-body-container .product-image-container .reviewproduct-name{font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .revieworder-body-container .product-image-container .sku-text{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif;color:#6f6f6f}.revieworder-table-container .revieworder-body-container .see-more-link{text-decoration:underline}.revieworder-table-container .revieworder-body-container .see-more-link:hover{color:#d51317}.revieworder-table-container .revieworder-body-container .seemoredetails-link{font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif;text-decoration:underline;cursor:pointer}.revieworder-table-container .revieworder-body-container .seemoredetails-link:hover{color:#b61828}.revieworder-table-container .revieworder-body-container .revieworder-collapse .bundle-details{background:#F6F6F6;border:1px solid #E0E0E0;margin-left:15px;padding:1rem;line-height:2.5rem}.revieworder-table-container .revieworder-body-container .revieworder-collapse .bundle-details .bundle-details-header{font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .colors-paragraph{display:flex;align-items:center}.revieworder-table-container .colors-paragraph .revieworder-color{width:20px;height:20px;border:1px solid #000000;display:inline-flex}.revieworder-table-container .consignment-number{text-decoration:underline;color:#b61828}.revieworder-table-container .consignment-number:hover,.revieworder-table-container .consignment-number:visited{color:#b61828}::ng-deep .flashing-expand{cursor:pointer}::ng-deep .flashing-expand:after{background:url(../../../../assets/images/expand-icon.svg) no-repeat center;z-index:2;width:24px;content:\"\";height:24px;position:absolute;top:0;right:0}::ng-deep .flashing-expand img{max-height:40px;max-width:40px}::ng-deep .flashing-expand.flashing-open:after{background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%0D %3Cg id%3D%22Group_14477%22 data-name%3D%22Group 14477%22 transform%3D%22translate(-5533.5 11452.992)%22%3E%0D %3Cg id%3D%22Group_14476%22 data-name%3D%22Group 14476%22%3E%0D %3Cg id%3D%22Group_14475%22 data-name%3D%22Group 14475%22 transform%3D%22translate(5164.5 -12321.992)%22%3E%0D %3Crect id%3D%22Rectangle_1116%22 data-name%3D%22Rectangle 1116%22 width%3D%2224%22 height%3D%2224%22 transform%3D%22translate(369 869)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11366%22 data-name%3D%22Path 11366%22 d%3D%22M142.587%2C65.954v4.569a1.963%2C1.963%2C0%2C0%2C1-1.839%2C2.068H127.833a1.965%2C1.965%2C0%2C0%2C1-1.839-2.068V58.066A1.963%2C1.963%2C0%2C0%2C1%2C127.833%2C56h4.8a.83.83%2C0%2C1%2C1%2C0%2C1.659h-4.505a.516.516%2C0%2C0%2C0-.472.553V70.378a.521.521%2C0%2C0%2C0%2C.472.553h12.33a.516.516%2C0%2C0%2C0%2C.472-.553V65.954a.83.83%2C0%2C1%2C1%2C1.659%2C0Z%22 transform%3D%22translate(5411.209 -11505.287)%22 fill-rule%3D%22evenodd%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11367%22 data-name%3D%22Path 11367%22 d%3D%22M26.413%2C4.5H21.5a.607.607%2C0%2C0%2C0-.608.608v.009a.607.607%2C0%2C0%2C0%2C.608.608h3.4l-5.091%2C5.126a.608.608%2C0%2C0%2C0%2C.858.862l5.126-5.1v3.4a.607.607%2C0%2C0%2C0%2C.608.608h.009a.607.607%2C0%2C0%2C0%2C.608-.608V5.108A.607.607%2C0%2C0%2C0%2C26.413%2C4.5Z%22 transform%3D%22translate(5526.775 -11453.789)%22%2F%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center}#imageModal.show{display:flex!important;vertical-align:middle!important;align-items:center!important}#imageModal.show .modal-header{justify-content:right;border:none}#imageModal.show .modal-body{vertical-align:middle;margin:0 1rem;overflow:auto;max-height:80vh}#imageModal.show .modal-body img{max-width:100%;max-height:80vh}.flashing-block{background-color:#e8e8e8;padding:12px;border-bottom:1px solid #C6C6C6}.flashing-block .flash-title{font-size:var(--fontsize16);font-family:\"Arial Bold\",sans-serif}.flashing-block .skuId{color:#707070;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.flashing-block .gst-text{display:block;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif}\n"], components: [{ type: i3__namespace.MediaComponent, selector: "cx-media", inputs: ["container", "format", "alt", "role", "loading"], outputs: ["loaded"] }, { type: CustomFlashingImageDetailsComponent, selector: "app-custom-flashing-image-details", inputs: ["cartDetails", "forPdf", "appendixNo"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i5__namespace.AsyncPipe, "date": i5__namespace.DatePipe, "slice": i5__namespace.SlicePipe, "number": i5__namespace.DecimalPipe } });
|
|
8080
8080
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OrderDetailListComponent, decorators: [{
|
|
8081
8081
|
type: i0.Component,
|
|
8082
8082
|
args: [{
|
|
@@ -8107,6 +8107,33 @@
|
|
|
8107
8107
|
this.isFlashingModal = false;
|
|
8108
8108
|
this.env = sessionStorage.getItem('env');
|
|
8109
8109
|
this.environment = JSON.parse(this.env);
|
|
8110
|
+
this.getStatusColor = function (cart) {
|
|
8111
|
+
var _a, _b, _c, _d;
|
|
8112
|
+
var status = cart === null || cart === void 0 ? void 0 : cart.status;
|
|
8113
|
+
if ((cart === null || cart === void 0 ? void 0 : cart.consignments) && ((_a = cart === null || cart === void 0 ? void 0 : cart.consignments) === null || _a === void 0 ? void 0 : _a.length) && ((_b = cart === null || cart === void 0 ? void 0 : cart.consignments) === null || _b === void 0 ? void 0 : _b.length) == 1) {
|
|
8114
|
+
status = (_d = (_c = cart === null || cart === void 0 ? void 0 : cart.consignments[0]) === null || _c === void 0 ? void 0 : _c.entries[0]) === null || _d === void 0 ? void 0 : _d.status;
|
|
8115
|
+
}
|
|
8116
|
+
status = status == 'CREATED'
|
|
8117
|
+
? '#F3A931'
|
|
8118
|
+
: status == 'APPROVED'
|
|
8119
|
+
? '#f26522'
|
|
8120
|
+
: status == 'PROCESSING'
|
|
8121
|
+
? '#75578A'
|
|
8122
|
+
: status == 'READY'
|
|
8123
|
+
? '#496471'
|
|
8124
|
+
: status == 'DELIVERING'
|
|
8125
|
+
? '#00ACBD'
|
|
8126
|
+
: status == 'COMPLETED'
|
|
8127
|
+
? '#8DC440'
|
|
8128
|
+
: status == 'RETURNED'
|
|
8129
|
+
? '#8DC440'
|
|
8130
|
+
: status == 'CANCELLED'
|
|
8131
|
+
? '#000000'
|
|
8132
|
+
: status == 'DESPATCHED'
|
|
8133
|
+
? '#4081c4'
|
|
8134
|
+
: '';
|
|
8135
|
+
return status;
|
|
8136
|
+
};
|
|
8110
8137
|
}
|
|
8111
8138
|
OrderDetailGridComponent.prototype.ngOnInit = function () {
|
|
8112
8139
|
return __awaiter(this, void 0, void 0, function () {
|
|
@@ -8283,7 +8310,7 @@
|
|
|
8283
8310
|
return OrderDetailGridComponent;
|
|
8284
8311
|
}());
|
|
8285
8312
|
OrderDetailGridComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OrderDetailGridComponent, deps: [{ token: CartService }, { token: UserAccountDetailServiceService }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
8286
|
-
OrderDetailGridComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OrderDetailGridComponent, selector: "app-order-detail-grid", inputs: { sortByVal: "sortByVal", cartDetails: "cartDetails", orderDate: "orderDate", isCardData: "isCardData" }, viewQueries: [{ propertyName: "masonry", first: true, predicate: i6.NgxMasonryComponent, descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"loading\" *ngIf=\"showWaitCursor | async\">Loading…</div>\r\n<div class=\"py-3\">\r\n <ngx-masonry class=\"row\" *ngIf=\"cartDetails?.length; else nodata\">\r\n <div\r\n class=\"col-lg-3 col-sm-6\"\r\n ngxMasonryItem\r\n *ngFor=\"let cart of cartDetails; let i = index\"\r\n >\r\n <div class=\"cart-grid-tile\">\r\n <div class=\"grid-tile-top position-relative\">\r\n <div class=\"d-flex justify-content-between align-items-center mb-3\">\r\n <span class=\"sku-code\">SKU:{{ cart?.product?.code }}</span>\r\n </div>\r\n <div class=\"row flex-nowrap\">\r\n <div class=\"col-md-4 product-img\">\r\n <ng-container\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct;\r\n else normalImage\r\n \"\r\n >\r\n <a\r\n data-toggle=\"modal\"\r\n class=\"flashing-expand\"\r\n (click)=\"viewImage($event, cartDetails[i])\"\r\n [attr.data-target]=\"'#imageModal'\"\r\n *ngIf=\"hasImage(cartDetails[i]); else hasPdf\"\r\n >\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </a>\r\n <ng-template #hasPdf>\r\n <a\r\n class=\"flashing-expand flashing-open\"\r\n [href]=\"getPdfLink(cartDetails[i])\"\r\n target=\"_blank\"\r\n >\r\n <img\r\n class=\"pdf-icon\"\r\n src=\"../../../../../assets/images/pdf-icon.svg\"\r\n alt=\"Click to open PDF\"\r\n title=\"Click to open PDF\"\r\n />\r\n </a>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #normalImage>\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </ng-template>\r\n </div>\r\n <div class=\"col-md-8\">\r\n <h4 class=\"productName\">{{ cart?.product?.name }}</h4>\r\n </div>\r\n </div>\r\n <span class=\"expandBtn\" (click)=\"arrowHideShow(i)\">\r\n <ng-container *ngIf=\"arrowUpDown[i] == true; else arrowUp\">\r\n <i class=\"fas fa-chevron-up\"></i>\r\n </ng-container>\r\n <ng-template #arrowUp>\r\n <i class=\"fas fa-chevron-down\"></i>\r\n </ng-template>\r\n </span>\r\n </div>\r\n <ng-container *ngIf=\"arrowUpDown[i]\">\r\n <div class=\"grid-tile-middle\">\r\n <ng-container *ngIf=\"cart?.product?.classifications\">\r\n <p class=\"mt-1 mb-4 attribute\">\r\n <span *ngIf=\"cart?.product?.classifications[0]?.features\">\r\n {{\r\n getClassifications(cartDetails[i]?.product?.classifications)\r\n }}\r\n </span>\r\n </p>\r\n </ng-container>\r\n <ng-container *ngIf=\"cart?.subLineConfigInfos?.length > 0\">\r\n <a\r\n href=\"javascript:void(0)\"\r\n (click)=\"showHide(i)\"\r\n class=\"see-more-link\"\r\n >\r\n {{ showDetails[i] == true ? \"Hide\" : \"See\" }} more details\r\n </a>\r\n <div *ngIf=\"showDetails[i]\">\r\n <ng-container>\r\n <table class=\"no-border cart-details-table w-100\">\r\n <tr>\r\n <th>Quantity</th>\r\n <th>Length (LM)</th>\r\n <th *ngIf=\"cart?.subLineConfigInfos[i]?.bundleName\">\r\n Bundle\r\n </th>\r\n </tr>\r\n <tr *ngFor=\"let subLine of cart?.subLineConfigInfos\">\r\n <td>{{ subLine?.quantity }}</td>\r\n <td>{{ subLine?.length | number : \"0.3-3\" }}</td>\r\n <td *ngIf=\"subLine?.bundleName\">\r\n {{ subLine?.bundleName }}<br />{{ subLine?.reference }}\r\n </td>\r\n </tr>\r\n </table>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"col-sm-12 mt-3\">\r\n <div class=\"row border-bottom\">\r\n <ul class=\"col-12 orderInfo\"> \r\n <!-- <li>\r\n <label>Qty Shipped:</label>\r\n <span class=\"InfoText\">-</span>\r\n </li> -->\r\n <li *ngIf=\"cart.consignments && cart.consignments?.length == 1\">\r\n <label>Delivery #:</label>\r\n <span class=\"InfoText\">\r\n <a href=\"javascript:void(0)\" class=\"consignment-number\" title=\"Consignment Number\">{{cart.consignments[0].code}} </a>\r\n </span>\r\n </li>\r\n <li>\r\n <label>Delivery Date:</label>\r\n <span class=\"InfoText\">\r\n {{ orderDate | date : \"dd/MM/yyyy\" }}</span\r\n >\r\n </li>\r\n <li>\r\n <label>Status:</label>\r\n <span class=\"InfoText\">\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n cart?.status == 'CREATED'\r\n ? '#F3A931'\r\n : cart?.status == 'APPROVED'\r\n ? '#f26522'\r\n : cart?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : cart?.status == 'READY'\r\n ? '#496471'\r\n : cart?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : cart?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : cart?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : cart?.status == 'CANCELLED'\r\n ? '#000000'\r\n : cart?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ cart?.statusDisplay || \"-\" }}</span\r\n >\r\n </li>\r\n </ul>\r\n </div>\r\n <ng-container\r\n *ngIf=\"cart?.consignments && cart.consignments.length > 1\"\r\n >\r\n <div *ngFor=\"let consignment of cart.consignments\" class=\"row mt-3 border-bottom\">\r\n <ul class=\"col-12 orderInfo\">\r\n <li>\r\n <label>Qty Shipped:</label>\r\n <span class=\"InfoText\">{{ consignment.entries[0]?.shippedQuantity }} {{ cart?.unit?.code }}</span>\r\n </li>\r\n <li>\r\n <label>Delivery #:</label>\r\n <span class=\"InfoText\">\r\n <a href=\"javascript:void(0)\" class=\"consignment-number\" title=\"Consignment Number\">{{ consignment.code }}</a>\r\n </span>\r\n </li>\r\n <li>\r\n <label>Delivery Date:</label>\r\n <span class=\"InfoText\">\r\n {{ consignment.statusDate | date : \"dd/MM/yyyy\" }}</span\r\n >\r\n </li>\r\n <li>\r\n <label>Status:</label>\r\n <span class=\"InfoText\">\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n consignment?.status == 'CREATED'\r\n ? '#F3A931'\r\n : consignment?.status == 'APPROVED'\r\n ? '#f26522'\r\n : consignment?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : consignment?.status == 'READY'\r\n ? '#496471'\r\n : consignment?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : consignment?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : consignment?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : consignment?.status == 'CANCELLED'\r\n ? '#000000'\r\n : consignment?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ consignment?.statusDisplay || \"-\" }}</span\r\n >\r\n </li>\r\n </ul>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"grid-tile-bottom\">\r\n <div class=\"row\">\r\n <div class=\"col-7 border-right\">\r\n <div class=\"total-qty\">\r\n <div>\r\n <p class=\"m-0\">{{ cart?.jobReference || \"-\" }}</p>\r\n <ng-container\r\n *ngIf=\"\r\n cart?.configurationInfos?.length;\r\n else accessoriesColor\r\n \"\r\n >\r\n <p\r\n class=\"colors-paragraph mb-0\"\r\n *ngIf=\"\r\n !cart?.product?.flashingProduct;\r\n else flashingColour\r\n \"\r\n >\r\n <span\r\n class=\"revieworder-color mr-2\"\r\n [ngStyle]=\"{\r\n background:\r\n cart?.configurationInfos[0]?.configurationValue?.split(\r\n '|'\r\n ) | slice : 2\r\n }\"\r\n ></span>\r\n {{\r\n cart?.configurationInfos[0]?.configurationValue?.split(\r\n \"|\"\r\n ) | slice : 1 : 2\r\n }}\r\n </p>\r\n <ng-template #flashingColour>\r\n <p class=\"colors-paragraph mb-0\">\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{\r\n background: getColourDetails(\r\n cartDetails[i]?.configurationInfos,\r\n 'background'\r\n )\r\n }\"\r\n ></span>\r\n {{\r\n getColourDetails(\r\n cartDetails[i]?.configurationInfos,\r\n \"name\"\r\n )\r\n }}\r\n </p>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #accessoriesColor>\r\n <p class=\"colors-paragraph my-2\" *ngIf=\"hasColour(cart)\">\r\n <span\r\n class=\"revieworder-color mr-2\"\r\n [ngStyle]=\"{\r\n background: cart?.colour?.hexadecimalCode\r\n }\"\r\n ></span>\r\n {{ cart?.colour?.name }}\r\n </p>\r\n </ng-template>\r\n </div>\r\n <span\r\n >Total Qty: {{ cart?.quantityDouble }}\r\n {{ cart?.unit?.code }}</span\r\n ><br />\r\n <span *ngIf=\"isOrderPermissions\" class=\"subPrice\"\r\n >@ {{ cart?.basePrice?.formattedValue }}/{{\r\n cart?.basePrice?.unitType\r\n }}</span\r\n >\r\n </div>\r\n </div>\r\n <div class=\"col-5 px-0 d-flex flex-column\">\r\n <div class=\"total-amount text-right py-3 px-2\">\r\n <h4>{{ cart?.totalPrice?.formattedValue || \"-\" }}</h4>\r\n <span *ngIf=\"isOrderPermissions\">excl GST</span>\r\n </div>\r\n <div class=\"text-left py-3 px-2\">\r\n <span\r\n *ngIf=\"cart.consignments && cart.consignments?.length == 1\"\r\n class=\"InfoText\"\r\n >\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n cart.consignments[0]?.status == 'CREATED'\r\n ? '#F3A931'\r\n : cart.consignments[0]?.status == 'APPROVED'\r\n ? '#f26522'\r\n : cart.consignments[0]?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : cart.consignments[0]?.status == 'READY'\r\n ? '#496471'\r\n : cart.consignments[0]?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : cart.consignments[0]?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : cart.consignments[0]?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : cart.consignments[0]?.status == 'CANCELLED'\r\n ? '#000000'\r\n : cart.consignments[0]?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{\r\n cart.consignments[0]?.statusDisplay\r\n ? cart.consignments[0].statusDisplay\r\n : cart?.statusDisplay\r\n }}</span\r\n >\r\n <span\r\n *ngIf=\"\r\n !cart.consignments ||\r\n cart.consignments?.length > 1 ||\r\n cart.consignments?.length == 0\r\n \"\r\n class=\"InfoText\"\r\n >\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n cart == 'CREATED'\r\n ? '#F3A931'\r\n : cart == 'APPROVED'\r\n ? '#f26522'\r\n : cart == 'PROCESSING'\r\n ? '#75578A'\r\n : cart == 'READY'\r\n ? '#496471'\r\n : cart == 'DELIVERING'\r\n ? '#00ACBD'\r\n : cart == 'COMPLETED'\r\n ? '#8DC440'\r\n : cart == 'RETURNED'\r\n ? '#8DC440'\r\n : cart == 'CANCELLED'\r\n ? '#000000'\r\n : cart == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ cart?.statusDisplay ? cart?.statusDisplay : \"-\" }}</span\r\n >\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct &&\r\n cartDetails[i]?.productConfiguredInfos\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"let data of cartDetails[i]?.productConfiguredInfos\"\r\n >\r\n <div\r\n class=\"flashing-block\"\r\n *ngIf=\"data?.product?.name?.toLowerCase() == 'flashguard'\"\r\n >\r\n <div class=\"grid-tile-top\">\r\n <div>\r\n <h6 class=\"skuId\">SKU: {{ data?.product?.code }}</h6>\r\n <h3 class=\"flash-title\">{{ data?.product?.name }}</h3>\r\n <span *ngIf=\"data?.girth\">Girth: +{{ data?.girth }}mm</span>\r\n </div>\r\n </div>\r\n <div class=\"grid-tile-bottom\">\r\n <div class=\"row\">\r\n <div\r\n class=\"col-md-6 col-6 d-flex align-items-center border-right\"\r\n >\r\n <div class=\"total-qty\">\r\n <div>\r\n Total Qty: {{ data?.quantityDouble }}\r\n {{ data?.unitType }}\r\n </div>\r\n <span *ngIf=\"isOrderPermissions\"\r\n >@{{ data?.basePrice?.formattedValue }}/{{\r\n data?.unitType\r\n }}</span\r\n >\r\n </div>\r\n </div>\r\n <div\r\n class=\"col-md-6 col-6 d-flex justify-content-end align-items-center text-right\"\r\n >\r\n <div class=\"total-amount text-right\">\r\n <h4>{{ data?.totalPrice?.formattedValue || \"-\" }}</h4>\r\n <span *ngIf=\"isOrderPermissions\">excl GST</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ngx-masonry>\r\n <ng-template #nodata>\r\n <div class=\"col-sm-12\">\r\n <p class=\"text-center\">{{ noRecord }}</p>\r\n </div>\r\n </ng-template>\r\n</div>\r\n\r\n<div\r\n class=\"modal fade\"\r\n id=\"imageModal\"\r\n role=\"dialog\"\r\n aria-labelledby=\"imageModal\"\r\n aria-hidden=\"true\"\r\n #imageModal\r\n>\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <i\r\n class=\"icon-close invite-pop-close\"\r\n #closeInviteModal\r\n data-dismiss=\"modal\"\r\n aria-label=\"Close\"\r\n ></i>\r\n </div>\r\n <div class=\"modal-body\">\r\n <img [src]=\"imageModalSrc\" alt=\"alert\" />\r\n <div *ngIf=\"isFlashingModal\" class=\"flashing-details\">\r\n <app-custom-flashing-image-details\r\n [cartDetails]=\"flashingImageDetails\"\r\n ></app-custom-flashing-image-details>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@media screen and (min-width: 1366px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: 1.063rem;--fontsize17-5: 1.1rem;--fontsize18: 1.125rem;--fontsize18-4: 1.5rem;--fontsize20: 1.25rem;--fontsize21: 1.313rem;--fontsize22: 1.375rem;--fontsize23: 1.438rem;--fontsize24: 1.5rem;--fontsize26: 1.625rem;--fontsize28: 1.75rem;--fontsize30: 1.625rem;--fontsize32: 2rem;--fontsize34: 2.125rem;--fontsize36: 2rem;--fontsize40: 2.25rem;--fontsize46: 2.875rem;--fontsize80: 5rem}}@media screen and (max-width: 1365px) and (min-width: 768px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2.875rem;--fontsize80: 3.5rem}}@media screen and (max-width: 767px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize16-5: .77rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize19: .938rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize26: 1.25rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2rem;--fontsize80: 2.5rem}}@font-face{font-family:icomoon;font-weight:400;src:url(../assets/fonts/icomoon.ttf) format(\"ttf\"),url(../assets/fonts/icomoon.woff) format(\"woff\");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:\"Arial Regular\";src:url(../assets/fonts/arial-webfont.woff) format(\"woff\"),url(../assets/fonts/arial-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Bold\";src:url(../assets/fonts/arialbold-webfont.woff) format(\"woff\"),url(../assets/fonts/arialbold-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Black\";src:url(../assets/fonts/arialblack-webfont.woff) format(\"woff\"),url(../assets/fonts/arialblack-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Reqular\";src:url(../assets/fonts/helveticaneue.woff) format(\"woff\"),url(../assets/fonts/helveticaneue.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Thin\";src:url(../assets/fonts/helveticaneuethin-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuethin-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Medium\";src:url(../assets/fonts/helveticaneuemedium-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuemedium-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}[class*=\" icon-\"],[class^=icon-]{font-family:icomoon!important;font-feature-settings:normal;font-variant:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;text-transform:none;font-display:swap}.icon-right:before{content:\"\\e902\"}.icon-materials:before{content:\"\\e900\"}.icon-natural-lighting:before{content:\"\\e90a\"}.icon-rainwater:before{content:\"\\e901\"}.icon-roofing:before{content:\"\\e90b\"}.icon-flashing{position:relative;display:inline-block;height:32px;text-align:center;width:32px}.icon-flashing:before,.mainnav-link-level-2.show .navTagChild .icon-flashing:before{content:url(../assets/images/icon-flashing-white.svg);height:20px;width:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:15px}li.megamenuSubChild:hover .icon-flashing:before{content:url(../assets/images/icon-flashing-black.svg)}.icon-structural:before{content:\"\\e90c\"}.icon-accessories-old .path1:before{content:\"\\e903\"}.icon-accessories-old .path2:before{margin-left:-1em;content:\"\\e904\"}.icon-accessories-old .path3:before{margin-left:-1em;content:\"\\e905\"}.icon-cladding-old .path1:before{content:\"\\e90d\"}.icon-cladding-old .path2:before{margin-left:-1em;content:\"\\e90e\"}.icon-close:before{content:\"\\e90f\"}.icon-message:before{content:\"\\e910\"}.icon-search .path1:before{content:\"\\e906\"}.icon-search .path2:before{content:\"\\e907\"}.icon-search .path3:before{margin-left:-1.0156em;content:\"\\e908\"}.icon-summary:before{content:\"\\e911\"}.icon-branch:before{content:\"\\e912\"}.icon-delivery:before{content:\"\\e913\"}.icon-downloads:before{content:\"\\e909\"}.icon-drawings:before{content:\"\\e914\"}.icon-full:before{content:\"\\e915\"}.icon-manual:before{content:\"\\e916\"}.icon-payment:before{content:\"\\e917\"}.icon-empty .path1:before{content:\"\\e918\"}.icon-empty .path2:before{margin-left:-1em;content:\"\\e919\"}.icon-empty .path3:before{margin-left:-1em;content:\"\\e91a\"}.icon-product-overview:before{content:\"\\e91b\"}.icon-arrows:before{content:\"\\e91c\"}.icon-selected:before{content:\"\\e91d\"}.icon-accessories:before{content:\"\\e91b\"}.icon-cladding:before{content:\"\\e91e\"}.icon-Triangle:before{content:\"\\e91f\"}.icon-home:before{content:\"\\e920\"}.icon-faq:before{content:\"\\e921\"}.icon-temperature:before{content:\"\\e922\"}body header{font-family:\"Arial Regular\",sans-serif}header{background-color:#1d1d1b;position:sticky;top:0;background-size:100% 25%!important;background-repeat:no-repeat;z-index:10}header .header{max-width:100%;padding:0}header cx-banner cx-media img{margin-top:.7rem;margin-bottom:0}header label{display:inline-flex}header .SiteLinks{height:52px;display:flex;align-items:center;justify-content:space-between;padding-top:5px;padding-bottom:5px}header .SiteLinks cx-paragraph p{color:#fff;font-size:var(--fontsize16);line-height:var(--fontsize16);margin-bottom:0}header .SiteLinks cx-paragraph{font-size:var(--fontsize16)}header .SiteLinks app-account-dropdown,header .SiteLinks app-find-store{width:calc(25% - 25px);max-width:328px;margin-right:25px}header .SiteLinks app-contact-us{width:calc(20% - 25px);max-width:100px;margin-left:auto}header .SiteLinks app-custom-mini-cart{width:10%}header .SiteLinks .preferenceLink{margin-left:auto}header .SiteLinks .preferenceLink cx-generic-link{margin:0}header .SiteLinks .preferenceLink cx-generic-link cx-media img{height:22px;margin:0}header .SiteLogo .storeLogo{position:absolute;z-index:99;left:40px;bottom:10px}header .SiteLogo .homeLogo{max-width:28px;height:28px;position:absolute;z-index:99;bottom:47px}header .NavigationBar{flex:70%;background-color:#b61828;min-height:40px;display:flex;align-items:center;position:relative}header .logoutMenu{margin-top:0!important}header .logoutMenu li{cursor:pointer;background-color:#4c4c4c;color:#fff}header .logoutMenu li:hover{text-decoration:underline;background-color:#4c4c4c}header .MarketingContext{width:100%;margin:auto}.customer-service-icon{cursor:pointer}.helpSupport{width:20rem;border:0;margin-top:.5rem!important;transform:translate(-42%,36px)!important;padding:1rem 1rem 0;background-color:#393939;color:#fff;top:0}.helpSupport .arrow-up{position:absolute;top:-8px;right:44%;width:0;height:0;border-left:15px solid rgba(0,0,0,0);border-right:15px solid rgba(0,0,0,0);border-bottom:15px solid #393939}.helpSupport .contact-us-info .heading{font-family:\"Arial Bold\",sans-serif}.helpSupport .contact-us-info .detail{font-size:var(--fontsize14);line-height:2rem}.helpSupport .contact-us-info .detail .service-icon{height:20px;width:20px;margin-right:10px}.helpSupport .contact-us-info .contactLink a{font-size:var(--fontsize14);text-decoration:underline;text-transform:uppercase}.helpSupport .contact-us-info a{color:#fff;text-decoration:none}.helpSupport .contact-us-info a:hover{text-decoration:underline}.pageTitle{font-family:\"Helvetica Neue Regular\",sans-serif;font-size:var(--fontsize54)}#visualization-container{text-align:center;margin:0 auto}#cds-viewer-container-3d{width:320px;height:200px}#cds-viewer-container-2d{width:320px;height:200px}[aria-label=Close]{cursor:pointer}cx-media.is-missing{background:url(./assets/images/search-noimage.svg);background-size:cover;background-position:center;background-repeat:no-repeat}cx-global-message{position:fixed;top:9rem;width:100%;z-index:13}@media screen and (max-width: 991px){cx-global-message{top:3.75rem}cx-storefront header{background-color:#b61828}cx-storefront header cx-banner cx-media img{margin:auto}cx-storefront header .SiteLogo{width:100%;max-width:211px;margin:auto;padding-left:30px;box-sizing:border-box}cx-storefront header .SiteLogo .storeLogo{position:unset}cx-storefront header .SearchBox{margin:14px 0 10px;width:30px}cx-storefront header .SiteLinks{background-color:transparent;width:110px;margin:auto 25px auto 0}cx-storefront header .SiteLinks app-account-dropdown,cx-storefront header .SiteLinks app-find-store,cx-storefront header .SiteLinks app-contact-us,cx-storefront header .SiteLinks cx-paragraph,cx-storefront header .SiteLinks .preferenceLink{display:none}cx-storefront header .SiteLinks app-custom-mini-cart,cx-storefront header .SiteLinks app-custom-user-account{width:35px}cx-storefront header.is-expanded{overflow-y:auto;position:fixed;bottom:0;top:0;width:calc(100% - 99px)}cx-storefront header.is-expanded .header{background-color:#b61828;margin-left:0;position:relative}cx-storefront header.is-expanded .PreHeader{position:absolute;right:-5px;top:5px}cx-storefront header.is-expanded .SearchBox{display:none}cx-storefront header.is-expanded .SiteLogo{position:absolute;bottom:110px;z-index:9}cx-storefront header.is-expanded .SiteLinks{background-color:#1d1d1b;width:100%;margin:15px auto 15px 0;height:unset;padding:15px;max-width:100%;position:relative;z-index:9;top:60px}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-account-dropdown{width:100%;max-width:100%}cx-storefront header.is-expanded .SiteLinks app-find-store{width:50%;max-width:328px;min-width:328px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-right:15px;margin-left:auto;width:115px;max-width:unset}cx-storefront header.is-expanded .navigation{position:relative;top:45px}cx-storefront header.is-expanded:before{background-color:#0000004d;right:0;content:\"\";position:fixed;z-index:2;top:0;bottom:0;height:100vh;width:99px}cx-storefront header.is-expanded:after{background-color:transparent}}@media screen and (max-width: 576px){cx-storefront header .SiteLogo{max-width:80px}cx-storefront header .SiteLogo .storeLogo{display:none}cx-storefront header .searchBox{height:45px}cx-storefront header.is-expanded{width:100%}cx-storefront header.is-expanded .header,cx-storefront header.is-expanded .navigation{width:100%}cx-storefront header.is-expanded .SiteLogo{bottom:160px;max-width:211px!important}cx-storefront header.is-expanded .SiteLogo .storeLogo{display:block}cx-storefront header.is-expanded .SiteLinks{max-width:100%;width:100%}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-find-store{width:100%;max-width:100%;margin-bottom:10px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-left:0}cx-storefront header.is-expanded .SiteLinks cx-paragraph{margin-left:auto}cx-storefront header.is-expanded:before{display:none}.pageTitle{font-size:28px}}.cart-grid-tile{border:1px solid #E0E0E0;margin-bottom:20px;color:#1d1d1b}.cart-grid-tile .grid-tile-top{background-color:#e8e8e8;border:1px solid #E0E0E0;padding:15px;color:#1d1d1b}.cart-grid-tile .grid-tile-top .sku-code{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif;color:#707070}.cart-grid-tile .grid-tile-top .prod-img{width:70px;height:70px;background-color:#fff}.cart-grid-tile .grid-tile-top .delete-icon{cursor:pointer}.cart-grid-tile .grid-tile-top h4{margin-left:6px;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.cart-grid-tile .border-bottom{border-bottom:1px solid #E0E0E0}.cart-grid-tile .grid-tile-middle{background-color:#fff;padding:15px;border-bottom:1px solid #E0E0E0}.cart-grid-tile .grid-tile-middle .see-more-link{text-decoration:underline}.cart-grid-tile .grid-tile-middle .see-more-link:hover{color:#d51317}.cart-grid-tile .grid-tile-middle .custom-input-field{width:100%;border:1px solid #E0E0E0;height:40px;margin-bottom:15px;padding-left:15px}.cart-grid-tile .grid-tile-middle .color-block{width:20px;height:20px;border:1px solid #E0E0E0}.cart-grid-tile .grid-tile-middle .more-color{cursor:pointer;color:#b61828;margin-left:10px;-webkit-text-decoration-line:underline;text-decoration-line:underline;text-underline-offset:4px;-webkit-text-decoration-style:dashed;text-decoration-style:dashed;position:relative}.cart-grid-tile .grid-tile-middle .more-detail{text-decoration:underline;cursor:pointer;margin-bottom:0}.cart-grid-tile .grid-tile-middle a{color:#262626;text-decoration:underline;cursor:pointer}.cart-grid-tile .grid-tile-middle a:hover{color:#262626}.cart-grid-tile .expandBtn{z-index:9;cursor:pointer;position:absolute;background-color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;bottom:-24px;left:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);box-shadow:0 0 6px #00000026;-webkit-box-shadow:0px 0px 6px rgba(0,0,0,.15);-moz-box-shadow:0px 0px 6px rgba(0,0,0,.15)}.cart-grid-tile .subPrice{color:#707070}.cart-grid-tile .grid-tile-bottom{background-color:#fff;padding:0 15px;border-top:1px solid #E0E0E0}.cart-grid-tile .grid-tile-bottom .total-qty{color:#1d1d1b;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif;padding:15px 0}.cart-grid-tile .grid-tile-bottom .total-amount{color:#1d1d1b;border-bottom:1px solid #E0E0E0}.cart-grid-tile .grid-tile-bottom .total-amount h4{font-size:var(--fontsize20);margin-bottom:0}.cart-grid-tile .grid-tile-bottom .total-amount span{font-size:var(--fontsize14)}.cart-grid-tile .cart-grid-tile .product-img{width:50px;height:50px;min-width:70px;text-align:center}.cart-grid-tile .cart-grid-tile .product-img cx-media{top:-5px;border:1px solid #C6C6C6}.cart-grid-tile .consignment-number{text-decoration:underline;color:#b61828}.cart-grid-tile .consignment-number:hover,.cart-grid-tile .consignment-number:visited{color:#b61828}.bundling{text-align:right;top:20px;margin-bottom:15px}.bundling span.text{display:inline-block;position:relative;top:-12px;font-size:var(--fontsize14)}.switch{position:relative;display:inline-block;width:50px;margin-top:-4px;height:22px}.switch input{opacity:0;width:0;height:0}.switch input:not(:checked)+.slider:after{content:\"NO\";right:6px;position:absolute;color:#fff;top:3px;font-size:var(--fontsize12);font-family:\"Arial Bold\",sans-serif}.switch input:checked+.slider{background-color:#b61828}.switch input:checked+.slider:before{transform:translate(26px);left:5px}.switch input:checked+.slider:after{content:\"YES\";left:5px;position:absolute;color:#fff;top:3px;font-size:var(--fontsize12);font-family:\"Arial Bold\",sans-serif}.switch input:focus+.slider{box-shadow:0 0 1px #2196f3}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#a6a6a5;transition:.4s}.slider:before{position:absolute;content:\"\";height:16px;width:16px;top:3px;left:3px;bottom:3px;background-color:#fff;transition:.4s}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.cart-details-table th{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.add-more-btn{background:none;border:none}.add-more-btn .add-more{position:relative;background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2219%22 height%3D%2219%22 viewBox%3D%220 0 19 19%22%3E%0D %3Cpath id%3D%22Icon_awesome-plus-circle%22 data-name%3D%22Icon awesome-plus-circle%22 d%3D%22M10.063.563a9.5%2C9.5%2C0%2C1%2C0%2C9.5%2C9.5A9.5%2C9.5%2C0%2C0%2C0%2C10.063.563Zm5.516%2C10.573a.461.461%2C0%2C0%2C1-.46.46H11.595v3.524a.461.461%2C0%2C0%2C1-.46.46H8.99a.461.461%2C0%2C0%2C1-.46-.46V11.595H5.006a.461.461%2C0%2C0%2C1-.46-.46V8.99a.461.461%2C0%2C0%2C1%2C.46-.46H8.53V5.006a.461.461%2C0%2C0%2C1%2C.46-.46h2.145a.461.461%2C0%2C0%2C1%2C.46.46V8.53h3.524a.461.461%2C0%2C0%2C1%2C.46.46Z%22 transform%3D%22translate(-0.563 -0.563)%22%2F%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center;width:20px;height:20px;display:inline-block;top:4px}.colours .colour{padding:0 15px;position:relative}.colours .colour .checkbox{display:none}.colours .colour .colour-title{position:absolute;bottom:-48px;width:40px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:var(--fontsize14);text-align:center;cursor:grabbing}.colours .colour.selected{border:1px solid #000000}.colours .colour.selected .checkbox{position:absolute;background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2217.186%22 height%3D%2217.186%22 viewBox%3D%220 0 17.186 17.186%22%3E%0D %3Cg id%3D%22Group_12857%22 data-name%3D%22Group 12857%22 transform%3D%22translate(0.25 0.25)%22%3E%0D %3Ccircle id%3D%22Ellipse_14%22 data-name%3D%22Ellipse 14%22 cx%3D%228.316%22 cy%3D%228.316%22 r%3D%228.316%22 transform%3D%22translate(0 0.039)%22%2F%3E%0D %3Cpath id%3D%22Icon_ionic-md-checkmark-circle%22 data-name%3D%22Icon ionic-md-checkmark-circle%22 d%3D%22M11.718%2C3.375a8.343%2C8.343%2C0%2C1%2C0%2C8.343%2C8.343A8.367%2C8.367%2C0%2C0%2C0%2C11.718%2C3.375ZM10.005%2C16.166%2C5.729%2C11.89l1.2-1.2%2C3.08%2C3.08%2C6.5-6.5%2C1.2%2C1.2Z%22 transform%3D%22translate(-3.375 -3.375)%22 fill%3D%22%23fff%22%2F%3E%0D %3Cpath id%3D%22Icon_ionic-md-checkmark-circle_-_Outline%22 data-name%3D%22Icon ionic-md-checkmark-circle - Outline%22 d%3D%22M11.718%2C3.125a8.583%2C8.583%2C0%2C0%2C1%2C6.069%2C14.662A8.583%2C8.583%2C0%2C1%2C1%2C5.649%2C5.649%2C8.532%2C8.532%2C0%2C0%2C1%2C11.718%2C3.125Zm0%2C16.686A8.117%2C8.117%2C0%2C1%2C0%2C6%2C17.433%2C8.035%2C8.035%2C0%2C0%2C0%2C11.718%2C19.811ZM16.511%2C6.916l1.553%2C1.553-8.059%2C8.05L5.376%2C11.89l1.553-1.553%2C3.08%2C3.08Zm.846%2C1.553-.846-.846-6.5%2C6.5-3.08-3.08-.846.846%2C3.922%2C3.922Z%22 transform%3D%22translate(-3.375 -3.375)%22%2F%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center;width:20px;height:20px;display:inline-block;top:10px;left:10px}.colours .colour.main{box-sizing:border-box;width:40px;height:40px;display:inline-block;padding:0;border:1px solid #C6C6C6}.colours_container{width:320px;height:auto;position:absolute;z-index:1}.colors-paragraph{display:flex;align-items:center}.colors-paragraph .revieworder-color{width:20px;height:20px;border:1px solid #000000;display:inline-flex}.orderInfo li{display:flex}.orderInfo li label{font-family:\"Arial Bold\",sans-serif;width:50%}.orderInfo li .InfoText{display:inline-block;padding-left:10px;width:50%}.productImg{width:71px;height:71px}.productName{line-height:20px}.statusColor{display:inline-block;width:12px;height:12px;border-radius:50%}.attribute{font-size:14px}::ng-deep .flashing-expand{cursor:pointer}::ng-deep .flashing-expand:after{background:url(../../../../assets/images/expand-icon.svg) no-repeat center;z-index:2;width:24px;content:\"\";height:24px;position:absolute;top:0;right:0}::ng-deep .flashing-expand img{max-height:55px;max-width:60px;background:#ffffff}::ng-deep .flashing-expand.flashing-open:after{background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%0D %3Cg id%3D%22Group_14477%22 data-name%3D%22Group 14477%22 transform%3D%22translate(-5533.5 11452.992)%22%3E%0D %3Cg id%3D%22Group_14476%22 data-name%3D%22Group 14476%22%3E%0D %3Cg id%3D%22Group_14475%22 data-name%3D%22Group 14475%22 transform%3D%22translate(5164.5 -12321.992)%22%3E%0D %3Crect id%3D%22Rectangle_1116%22 data-name%3D%22Rectangle 1116%22 width%3D%2224%22 height%3D%2224%22 transform%3D%22translate(369 869)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11366%22 data-name%3D%22Path 11366%22 d%3D%22M142.587%2C65.954v4.569a1.963%2C1.963%2C0%2C0%2C1-1.839%2C2.068H127.833a1.965%2C1.965%2C0%2C0%2C1-1.839-2.068V58.066A1.963%2C1.963%2C0%2C0%2C1%2C127.833%2C56h4.8a.83.83%2C0%2C1%2C1%2C0%2C1.659h-4.505a.516.516%2C0%2C0%2C0-.472.553V70.378a.521.521%2C0%2C0%2C0%2C.472.553h12.33a.516.516%2C0%2C0%2C0%2C.472-.553V65.954a.83.83%2C0%2C1%2C1%2C1.659%2C0Z%22 transform%3D%22translate(5411.209 -11505.287)%22 fill-rule%3D%22evenodd%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11367%22 data-name%3D%22Path 11367%22 d%3D%22M26.413%2C4.5H21.5a.607.607%2C0%2C0%2C0-.608.608v.009a.607.607%2C0%2C0%2C0%2C.608.608h3.4l-5.091%2C5.126a.608.608%2C0%2C0%2C0%2C.858.862l5.126-5.1v3.4a.607.607%2C0%2C0%2C0%2C.608.608h.009a.607.607%2C0%2C0%2C0%2C.608-.608V5.108A.607.607%2C0%2C0%2C0%2C26.413%2C4.5Z%22 transform%3D%22translate(5526.775 -11453.789)%22%2F%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center}#imageModal.show{display:flex!important;vertical-align:middle!important;align-items:center!important}#imageModal.show .modal-header{justify-content:right;border:none}#imageModal.show .modal-body{vertical-align:middle;margin:0 1rem;overflow:auto;max-height:80vh}#imageModal.show .modal-body img{max-width:100%;max-height:80vh}.flashing-block{background-color:#e8e8e8}.flashing-block .flash-title{font-size:var(--fontsize16);font-family:\"Arial Bold\",sans-serif}.flashing-block .skuId{color:#707070;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.flashing-block .gst-text{display:block;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif}.flashing-block .total-amount{border-bottom:none!important}@media screen and (max-width: 767px){.cart-grid-tile .grid-tile-top h4{margin-top:10px;margin-left:0}.productImg{width:100%;height:100%}.total-qty span,.total-amount span{font-size:1rem}.total-qty h4,.total-amount h4{font-size:1.25rem!important}}\n"], components: [{ type: i6__namespace.NgxMasonryComponent, selector: "[ngx-masonry], ngx-masonry", inputs: ["updateLayout", "ordered", "options"], outputs: ["layoutComplete", "removeComplete", "itemsLoaded"] }, { type: i3__namespace.MediaComponent, selector: "cx-media", inputs: ["container", "format", "alt", "role", "loading"], outputs: ["loaded"] }, { type: CustomFlashingImageDetailsComponent, selector: "app-custom-flashing-image-details", inputs: ["cartDetails", "forPdf", "appendixNo"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgxMasonryDirective, selector: "[ngxMasonryItem], ngxMasonryItem", inputs: ["prepend"] }, { type: i5__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i5__namespace.AsyncPipe, "number": i5__namespace.DecimalPipe, "date": i5__namespace.DatePipe, "slice": i5__namespace.SlicePipe } });
|
|
8313
|
+
OrderDetailGridComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OrderDetailGridComponent, selector: "app-order-detail-grid", inputs: { sortByVal: "sortByVal", cartDetails: "cartDetails", orderDate: "orderDate", isCardData: "isCardData" }, viewQueries: [{ propertyName: "masonry", first: true, predicate: i6.NgxMasonryComponent, descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"loading\" *ngIf=\"showWaitCursor | async\">Loading…</div>\r\n<div class=\"py-3\">\r\n <ngx-masonry class=\"row\" *ngIf=\"cartDetails?.length; else nodata\">\r\n <div\r\n class=\"col-lg-3 col-sm-6\"\r\n ngxMasonryItem\r\n *ngFor=\"let cart of cartDetails; let i = index\"\r\n >\r\n <div class=\"cart-grid-tile\">\r\n <div class=\"grid-tile-top position-relative\">\r\n <div class=\"d-flex justify-content-between align-items-center mb-3\">\r\n <span class=\"sku-code\">SKU:{{ cart?.product?.code }}</span>\r\n </div>\r\n <div class=\"row flex-nowrap\">\r\n <div class=\"col-md-4 product-img\">\r\n <ng-container\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct;\r\n else normalImage\r\n \"\r\n >\r\n <a\r\n data-toggle=\"modal\"\r\n class=\"flashing-expand\"\r\n (click)=\"viewImage($event, cartDetails[i])\"\r\n [attr.data-target]=\"'#imageModal'\"\r\n *ngIf=\"hasImage(cartDetails[i]); else hasPdf\"\r\n >\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </a>\r\n <ng-template #hasPdf>\r\n <a\r\n class=\"flashing-expand flashing-open\"\r\n [href]=\"getPdfLink(cartDetails[i])\"\r\n target=\"_blank\"\r\n >\r\n <img\r\n class=\"pdf-icon\"\r\n src=\"../../../../../assets/images/pdf-icon.svg\"\r\n alt=\"Click to open PDF\"\r\n title=\"Click to open PDF\"\r\n />\r\n </a>\r\n </ng-template>\r\n </ng-container>\r\n <ng-template #normalImage>\r\n <cx-media\r\n [container]=\"getImageDetails(cartDetails[i])\"\r\n format=\"cartIcon\"\r\n role=\"presentation\"\r\n ></cx-media>\r\n </ng-template>\r\n </div>\r\n <div class=\"col-md-8\">\r\n <h4 class=\"productName\">{{ cart?.product?.name }}</h4>\r\n </div>\r\n </div>\r\n <span class=\"expandBtn\" (click)=\"arrowHideShow(i)\">\r\n <ng-container *ngIf=\"arrowUpDown[i] == true; else arrowUp\">\r\n <i class=\"fas fa-chevron-up\"></i>\r\n </ng-container>\r\n <ng-template #arrowUp>\r\n <i class=\"fas fa-chevron-down\"></i>\r\n </ng-template>\r\n </span>\r\n </div>\r\n <ng-container *ngIf=\"arrowUpDown[i]\">\r\n <div class=\"grid-tile-middle\">\r\n <ng-container *ngIf=\"cart?.product?.classifications\">\r\n <p class=\"mt-1 mb-4 attribute\">\r\n <span *ngIf=\"cart?.product?.classifications[0]?.features\">\r\n {{\r\n getClassifications(cartDetails[i]?.product?.classifications)\r\n }}\r\n </span>\r\n </p>\r\n </ng-container>\r\n <ng-container *ngIf=\"cart?.subLineConfigInfos?.length > 0\">\r\n <a\r\n href=\"javascript:void(0)\"\r\n (click)=\"showHide(i)\"\r\n class=\"see-more-link\"\r\n >\r\n {{ showDetails[i] == true ? \"Hide\" : \"See\" }} more details\r\n </a>\r\n <div *ngIf=\"showDetails[i]\">\r\n <ng-container>\r\n <table class=\"no-border cart-details-table w-100\">\r\n <tr>\r\n <th>Quantity</th>\r\n <th>Length (LM)</th>\r\n <th *ngIf=\"cart?.subLineConfigInfos[i]?.bundleName\">\r\n Bundle\r\n </th>\r\n </tr>\r\n <tr *ngFor=\"let subLine of cart?.subLineConfigInfos\">\r\n <td>{{ subLine?.quantity }}</td>\r\n <td>{{ subLine?.length | number : \"0.3-3\" }}</td>\r\n <td *ngIf=\"subLine?.bundleName\">\r\n {{ subLine?.bundleName }}<br />{{ subLine?.reference }}\r\n </td>\r\n </tr>\r\n </table>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"col-sm-12 mt-3\">\r\n <div class=\"row border-bottom\">\r\n <ul class=\"col-12 orderInfo\"> \r\n <!-- <li>\r\n <label>Qty Shipped:</label>\r\n <span class=\"InfoText\">-</span>\r\n </li> -->\r\n <li *ngIf=\"cart?.consignments && cart?.consignments?.length == 1\">\r\n <label>Delivery #:</label>\r\n <span class=\"InfoText\">\r\n <a href=\"javascript:void(0)\" class=\"consignment-number\" title=\"Consignment Number\">{{cart?.consignments[0].code}} </a>\r\n </span>\r\n </li>\r\n <li>\r\n <label>Delivery Date:</label>\r\n <span class=\"InfoText\">\r\n {{ orderDate | date : \"dd/MM/yyyy\" }}</span\r\n >\r\n </li>\r\n <li\r\n *ngIf=\"\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\"\r\n >\r\n <label>Status:</label>\r\n <span class=\"InfoText\">\r\n <small\r\n *ngIf=\"\r\n !cart?.consignments || \r\n (cart?.consignments && cart?.consignments?.length < 2)\"\r\n class=\"statusColor\"\r\n [ngStyle]=\"{'background-color': getStatusColor(cart)}\"\r\n ></small>\r\n {{\r\n !cart?.consignments ||\r\n (cart?.consignments && cart?.consignments?.length < 2)\r\n ? cart?.consignments && cart?.consignments?.length == 1\r\n ? cart?.consignments[0]?.entries[0]?.statusDisplay\r\n : cart?.statusDisplay\r\n : \"\"\r\n }}\r\n </span\r\n >\r\n </li>\r\n </ul>\r\n </div>\r\n <ng-container\r\n *ngIf=\"cart?.consignments && cart?.consignments.length > 1\"\r\n >\r\n <div *ngFor=\"let consignment of cart?.consignments\" class=\"row mt-3 border-bottom\">\r\n <ul class=\"col-12 orderInfo\">\r\n <li>\r\n <label>Qty Shipped:</label>\r\n <span class=\"InfoText\">{{ consignment.entries[0]?.shippedQuantity }} {{ cart?.unit?.code }}</span>\r\n </li>\r\n <li>\r\n <label>Delivery #:</label>\r\n <span class=\"InfoText\">\r\n <a href=\"javascript:void(0)\" class=\"consignment-number\" title=\"Consignment Number\">{{ consignment.code }}</a>\r\n </span>\r\n </li>\r\n <li>\r\n <label>Delivery Date:</label>\r\n <span class=\"InfoText\">\r\n {{ consignment.statusDate | date : \"dd/MM/yyyy\" }}</span\r\n >\r\n </li>\r\n <li>\r\n <label>Status:</label>\r\n <span class=\"InfoText\">\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n consignment?.entries[0]?.status == 'CREATED'\r\n ? '#F3A931'\r\n : consignment?.entries[0]?.status == 'APPROVED'\r\n ? '#f26522'\r\n : consignment?.entries[0]?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : consignment?.entries[0]?.status == 'READY'\r\n ? '#496471'\r\n : consignment?.entries[0]?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : consignment?.entries[0]?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : consignment?.entries[0]?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : consignment?.entries[0]?.status == 'CANCELLED'\r\n ? '#000000'\r\n : consignment?.entries[0]?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ consignment?.entries[0]?.statusDisplay || \"-\" }}</span\r\n >\r\n </li>\r\n </ul>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <div class=\"grid-tile-bottom\">\r\n <div class=\"row\">\r\n <div class=\"col-7 border-right\">\r\n <div class=\"total-qty\">\r\n <div>\r\n <p class=\"m-0\">{{ cart?.jobReference || \"-\" }}</p>\r\n <ng-container\r\n *ngIf=\"\r\n cart?.configurationInfos?.length;\r\n else accessoriesColor\r\n \"\r\n >\r\n <p\r\n class=\"colors-paragraph mb-0\"\r\n *ngIf=\"\r\n !cart?.product?.flashingProduct;\r\n else flashingColour\r\n \"\r\n >\r\n <span\r\n class=\"revieworder-color mr-2\"\r\n [ngStyle]=\"{\r\n background:\r\n cart?.configurationInfos[0]?.configurationValue?.split(\r\n '|'\r\n ) | slice : 2\r\n }\"\r\n ></span>\r\n {{\r\n cart?.configurationInfos[0]?.configurationValue?.split(\r\n \"|\"\r\n ) | slice : 1 : 2\r\n }}\r\n </p>\r\n <ng-template #flashingColour>\r\n <p class=\"colors-paragraph mb-0\">\r\n <span\r\n class=\"revieworder-color mr-3\"\r\n [ngStyle]=\"{\r\n background: getColourDetails(\r\n cartDetails[i]?.configurationInfos,\r\n 'background'\r\n )\r\n }\"\r\n ></span>\r\n {{\r\n getColourDetails(\r\n cartDetails[i]?.configurationInfos,\r\n \"name\"\r\n )\r\n }}\r\n </p>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #accessoriesColor>\r\n <p class=\"colors-paragraph my-2\" *ngIf=\"hasColour(cart)\">\r\n <span\r\n class=\"revieworder-color mr-2\"\r\n [ngStyle]=\"{\r\n background: cart?.colour?.hexadecimalCode\r\n }\"\r\n ></span>\r\n {{ cart?.colour?.name }}\r\n </p>\r\n </ng-template>\r\n </div>\r\n <span\r\n >Total Qty: {{ cart?.quantityDouble }}\r\n {{ cart?.unit?.code }}</span\r\n ><br />\r\n <span *ngIf=\"isOrderPermissions\" class=\"subPrice\"\r\n >@ {{ cart?.basePrice?.formattedValue }}/{{\r\n cart?.basePrice?.unitType\r\n }}</span\r\n >\r\n </div>\r\n </div>\r\n <div class=\"col-5 px-0 d-flex flex-column\">\r\n <div class=\"total-amount text-right py-3 px-2\">\r\n <h4>{{ cart?.totalPrice?.formattedValue || \"-\" }}</h4>\r\n <span *ngIf=\"isOrderPermissions\">excl GST</span>\r\n </div>\r\n <div class=\"text-left py-3 px-2\">\r\n <span\r\n *ngIf=\"cart?.consignments && cart?.consignments?.length == 1\"\r\n class=\"InfoText\"\r\n >\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n cart?.consignments[0]?.entries[0]?.status == 'CREATED'\r\n ? '#F3A931'\r\n : cart?.consignments[0]?.entries[0]?.status == 'APPROVED'\r\n ? '#f26522'\r\n : cart?.consignments[0]?.entries[0]?.status == 'PROCESSING'\r\n ? '#75578A'\r\n : cart?.consignments[0]?.entries[0]?.status == 'READY'\r\n ? '#496471'\r\n : cart?.consignments[0]?.entries[0]?.status == 'DELIVERING'\r\n ? '#00ACBD'\r\n : cart?.consignments[0]?.entries[0]?.status == 'COMPLETED'\r\n ? '#8DC440'\r\n : cart?.consignments[0]?.entries[0]?.status == 'RETURNED'\r\n ? '#8DC440'\r\n : cart?.consignments[0]?.entries[0]?.status == 'CANCELLED'\r\n ? '#000000'\r\n : cart?.consignments[0]?.entries[0]?.status == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{\r\n cart?.consignments[0]?.entries[0]?.statusDisplay\r\n ? cart?.consignments[0]?.entries[0]?.statusDisplay\r\n : cart?.statusDisplay\r\n }}</span\r\n >\r\n <span\r\n *ngIf=\"\r\n !cart?.consignments ||\r\n cart?.consignments?.length > 1 ||\r\n cart?.consignments?.length == 0\r\n \"\r\n class=\"InfoText\"\r\n >\r\n <small\r\n class=\"statusColor\"\r\n [ngStyle]=\"{\r\n 'background-color':\r\n cart == 'CREATED'\r\n ? '#F3A931'\r\n : cart == 'APPROVED'\r\n ? '#f26522'\r\n : cart == 'PROCESSING'\r\n ? '#75578A'\r\n : cart == 'READY'\r\n ? '#496471'\r\n : cart == 'DELIVERING'\r\n ? '#00ACBD'\r\n : cart == 'COMPLETED'\r\n ? '#8DC440'\r\n : cart == 'RETURNED'\r\n ? '#8DC440'\r\n : cart == 'CANCELLED'\r\n ? '#000000'\r\n : cart == 'DESPATCHED'\r\n ? '#4081c4'\r\n : ''\r\n }\"\r\n ></small>\r\n {{ cart?.consignments?.entries[0]?.statusDisplay || \"-\" }}\r\n</span\r\n >\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"\r\n cartDetails[i]?.product?.flashingProduct &&\r\n cartDetails[i]?.productConfiguredInfos\r\n \"\r\n >\r\n <ng-container\r\n *ngFor=\"let data of cartDetails[i]?.productConfiguredInfos\"\r\n >\r\n <div\r\n class=\"flashing-block\"\r\n *ngIf=\"data?.product?.name?.toLowerCase() == 'flashguard'\"\r\n >\r\n <div class=\"grid-tile-top\">\r\n <div>\r\n <h6 class=\"skuId\">SKU: {{ data?.product?.code }}</h6>\r\n <h3 class=\"flash-title\">{{ data?.product?.name }}</h3>\r\n <span *ngIf=\"data?.girth\">Girth: +{{ data?.girth }}mm</span>\r\n </div>\r\n </div>\r\n <div class=\"grid-tile-bottom\">\r\n <div class=\"row\">\r\n <div\r\n class=\"col-md-6 col-6 d-flex align-items-center border-right\"\r\n >\r\n <div class=\"total-qty\">\r\n <div>\r\n Total Qty: {{ data?.quantityDouble }}\r\n {{ data?.unitType }}\r\n </div>\r\n <span *ngIf=\"isOrderPermissions\"\r\n >@{{ data?.basePrice?.formattedValue }}/{{\r\n data?.unitType\r\n }}</span\r\n >\r\n </div>\r\n </div>\r\n <div\r\n class=\"col-md-6 col-6 d-flex justify-content-end align-items-center text-right\"\r\n >\r\n <div class=\"total-amount text-right\">\r\n <h4>{{ data?.totalPrice?.formattedValue || \"-\" }}</h4>\r\n <span *ngIf=\"isOrderPermissions\">excl GST</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ngx-masonry>\r\n <ng-template #nodata>\r\n <div class=\"col-sm-12\">\r\n <p class=\"text-center\">{{ noRecord }}</p>\r\n </div>\r\n </ng-template>\r\n</div>\r\n\r\n<div\r\n class=\"modal fade\"\r\n id=\"imageModal\"\r\n role=\"dialog\"\r\n aria-labelledby=\"imageModal\"\r\n aria-hidden=\"true\"\r\n #imageModal\r\n>\r\n <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-header\">\r\n <i\r\n class=\"icon-close invite-pop-close\"\r\n #closeInviteModal\r\n data-dismiss=\"modal\"\r\n aria-label=\"Close\"\r\n ></i>\r\n </div>\r\n <div class=\"modal-body\">\r\n <img [src]=\"imageModalSrc\" alt=\"alert\" />\r\n <div *ngIf=\"isFlashingModal\" class=\"flashing-details\">\r\n <app-custom-flashing-image-details\r\n [cartDetails]=\"flashingImageDetails\"\r\n ></app-custom-flashing-image-details>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@media screen and (min-width: 1366px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: 1.063rem;--fontsize17-5: 1.1rem;--fontsize18: 1.125rem;--fontsize18-4: 1.5rem;--fontsize20: 1.25rem;--fontsize21: 1.313rem;--fontsize22: 1.375rem;--fontsize23: 1.438rem;--fontsize24: 1.5rem;--fontsize26: 1.625rem;--fontsize28: 1.75rem;--fontsize30: 1.625rem;--fontsize32: 2rem;--fontsize34: 2.125rem;--fontsize36: 2rem;--fontsize40: 2.25rem;--fontsize46: 2.875rem;--fontsize80: 5rem}}@media screen and (max-width: 1365px) and (min-width: 768px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2.875rem;--fontsize80: 3.5rem}}@media screen and (max-width: 767px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize16-5: .77rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize19: .938rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize26: 1.25rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2rem;--fontsize80: 2.5rem}}@font-face{font-family:icomoon;font-weight:400;src:url(../assets/fonts/icomoon.ttf) format(\"ttf\"),url(../assets/fonts/icomoon.woff) format(\"woff\");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:\"Arial Regular\";src:url(../assets/fonts/arial-webfont.woff) format(\"woff\"),url(../assets/fonts/arial-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Bold\";src:url(../assets/fonts/arialbold-webfont.woff) format(\"woff\"),url(../assets/fonts/arialbold-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Black\";src:url(../assets/fonts/arialblack-webfont.woff) format(\"woff\"),url(../assets/fonts/arialblack-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Reqular\";src:url(../assets/fonts/helveticaneue.woff) format(\"woff\"),url(../assets/fonts/helveticaneue.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Thin\";src:url(../assets/fonts/helveticaneuethin-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuethin-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Medium\";src:url(../assets/fonts/helveticaneuemedium-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuemedium-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}[class*=\" icon-\"],[class^=icon-]{font-family:icomoon!important;font-feature-settings:normal;font-variant:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;text-transform:none;font-display:swap}.icon-right:before{content:\"\\e902\"}.icon-materials:before{content:\"\\e900\"}.icon-natural-lighting:before{content:\"\\e90a\"}.icon-rainwater:before{content:\"\\e901\"}.icon-roofing:before{content:\"\\e90b\"}.icon-flashing{position:relative;display:inline-block;height:32px;text-align:center;width:32px}.icon-flashing:before,.mainnav-link-level-2.show .navTagChild .icon-flashing:before{content:url(../assets/images/icon-flashing-white.svg);height:20px;width:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:15px}li.megamenuSubChild:hover .icon-flashing:before{content:url(../assets/images/icon-flashing-black.svg)}.icon-structural:before{content:\"\\e90c\"}.icon-accessories-old .path1:before{content:\"\\e903\"}.icon-accessories-old .path2:before{margin-left:-1em;content:\"\\e904\"}.icon-accessories-old .path3:before{margin-left:-1em;content:\"\\e905\"}.icon-cladding-old .path1:before{content:\"\\e90d\"}.icon-cladding-old .path2:before{margin-left:-1em;content:\"\\e90e\"}.icon-close:before{content:\"\\e90f\"}.icon-message:before{content:\"\\e910\"}.icon-search .path1:before{content:\"\\e906\"}.icon-search .path2:before{content:\"\\e907\"}.icon-search .path3:before{margin-left:-1.0156em;content:\"\\e908\"}.icon-summary:before{content:\"\\e911\"}.icon-branch:before{content:\"\\e912\"}.icon-delivery:before{content:\"\\e913\"}.icon-downloads:before{content:\"\\e909\"}.icon-drawings:before{content:\"\\e914\"}.icon-full:before{content:\"\\e915\"}.icon-manual:before{content:\"\\e916\"}.icon-payment:before{content:\"\\e917\"}.icon-empty .path1:before{content:\"\\e918\"}.icon-empty .path2:before{margin-left:-1em;content:\"\\e919\"}.icon-empty .path3:before{margin-left:-1em;content:\"\\e91a\"}.icon-product-overview:before{content:\"\\e91b\"}.icon-arrows:before{content:\"\\e91c\"}.icon-selected:before{content:\"\\e91d\"}.icon-accessories:before{content:\"\\e91b\"}.icon-cladding:before{content:\"\\e91e\"}.icon-Triangle:before{content:\"\\e91f\"}.icon-home:before{content:\"\\e920\"}.icon-faq:before{content:\"\\e921\"}.icon-temperature:before{content:\"\\e922\"}body header{font-family:\"Arial Regular\",sans-serif}header{background-color:#1d1d1b;position:sticky;top:0;background-size:100% 25%!important;background-repeat:no-repeat;z-index:10}header .header{max-width:100%;padding:0}header cx-banner cx-media img{margin-top:.7rem;margin-bottom:0}header label{display:inline-flex}header .SiteLinks{height:52px;display:flex;align-items:center;justify-content:space-between;padding-top:5px;padding-bottom:5px}header .SiteLinks cx-paragraph p{color:#fff;font-size:var(--fontsize16);line-height:var(--fontsize16);margin-bottom:0}header .SiteLinks cx-paragraph{font-size:var(--fontsize16)}header .SiteLinks app-account-dropdown,header .SiteLinks app-find-store{width:calc(25% - 25px);max-width:328px;margin-right:25px}header .SiteLinks app-contact-us{width:calc(20% - 25px);max-width:100px;margin-left:auto}header .SiteLinks app-custom-mini-cart{width:10%}header .SiteLinks .preferenceLink{margin-left:auto}header .SiteLinks .preferenceLink cx-generic-link{margin:0}header .SiteLinks .preferenceLink cx-generic-link cx-media img{height:22px;margin:0}header .SiteLogo .storeLogo{position:absolute;z-index:99;left:40px;bottom:10px}header .SiteLogo .homeLogo{max-width:28px;height:28px;position:absolute;z-index:99;bottom:47px}header .NavigationBar{flex:70%;background-color:#b61828;min-height:40px;display:flex;align-items:center;position:relative}header .logoutMenu{margin-top:0!important}header .logoutMenu li{cursor:pointer;background-color:#4c4c4c;color:#fff}header .logoutMenu li:hover{text-decoration:underline;background-color:#4c4c4c}header .MarketingContext{width:100%;margin:auto}.customer-service-icon{cursor:pointer}.helpSupport{width:20rem;border:0;margin-top:.5rem!important;transform:translate(-42%,36px)!important;padding:1rem 1rem 0;background-color:#393939;color:#fff;top:0}.helpSupport .arrow-up{position:absolute;top:-8px;right:44%;width:0;height:0;border-left:15px solid rgba(0,0,0,0);border-right:15px solid rgba(0,0,0,0);border-bottom:15px solid #393939}.helpSupport .contact-us-info .heading{font-family:\"Arial Bold\",sans-serif}.helpSupport .contact-us-info .detail{font-size:var(--fontsize14);line-height:2rem}.helpSupport .contact-us-info .detail .service-icon{height:20px;width:20px;margin-right:10px}.helpSupport .contact-us-info .contactLink a{font-size:var(--fontsize14);text-decoration:underline;text-transform:uppercase}.helpSupport .contact-us-info a{color:#fff;text-decoration:none}.helpSupport .contact-us-info a:hover{text-decoration:underline}.pageTitle{font-family:\"Helvetica Neue Regular\",sans-serif;font-size:var(--fontsize54)}#visualization-container{text-align:center;margin:0 auto}#cds-viewer-container-3d{width:320px;height:200px}#cds-viewer-container-2d{width:320px;height:200px}[aria-label=Close]{cursor:pointer}cx-media.is-missing{background:url(./assets/images/search-noimage.svg);background-size:cover;background-position:center;background-repeat:no-repeat}cx-global-message{position:fixed;top:9rem;width:100%;z-index:13}@media screen and (max-width: 991px){cx-global-message{top:3.75rem}cx-storefront header{background-color:#b61828}cx-storefront header cx-banner cx-media img{margin:auto}cx-storefront header .SiteLogo{width:100%;max-width:211px;margin:auto;padding-left:30px;box-sizing:border-box}cx-storefront header .SiteLogo .storeLogo{position:unset}cx-storefront header .SearchBox{margin:14px 0 10px;width:30px}cx-storefront header .SiteLinks{background-color:transparent;width:110px;margin:auto 25px auto 0}cx-storefront header .SiteLinks app-account-dropdown,cx-storefront header .SiteLinks app-find-store,cx-storefront header .SiteLinks app-contact-us,cx-storefront header .SiteLinks cx-paragraph,cx-storefront header .SiteLinks .preferenceLink{display:none}cx-storefront header .SiteLinks app-custom-mini-cart,cx-storefront header .SiteLinks app-custom-user-account{width:35px}cx-storefront header.is-expanded{overflow-y:auto;position:fixed;bottom:0;top:0;width:calc(100% - 99px)}cx-storefront header.is-expanded .header{background-color:#b61828;margin-left:0;position:relative}cx-storefront header.is-expanded .PreHeader{position:absolute;right:-5px;top:5px}cx-storefront header.is-expanded .SearchBox{display:none}cx-storefront header.is-expanded .SiteLogo{position:absolute;bottom:110px;z-index:9}cx-storefront header.is-expanded .SiteLinks{background-color:#1d1d1b;width:100%;margin:15px auto 15px 0;height:unset;padding:15px;max-width:100%;position:relative;z-index:9;top:60px}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-account-dropdown{width:100%;max-width:100%}cx-storefront header.is-expanded .SiteLinks app-find-store{width:50%;max-width:328px;min-width:328px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-right:15px;margin-left:auto;width:115px;max-width:unset}cx-storefront header.is-expanded .navigation{position:relative;top:45px}cx-storefront header.is-expanded:before{background-color:#0000004d;right:0;content:\"\";position:fixed;z-index:2;top:0;bottom:0;height:100vh;width:99px}cx-storefront header.is-expanded:after{background-color:transparent}}@media screen and (max-width: 576px){cx-storefront header .SiteLogo{max-width:80px}cx-storefront header .SiteLogo .storeLogo{display:none}cx-storefront header .searchBox{height:45px}cx-storefront header.is-expanded{width:100%}cx-storefront header.is-expanded .header,cx-storefront header.is-expanded .navigation{width:100%}cx-storefront header.is-expanded .SiteLogo{bottom:160px;max-width:211px!important}cx-storefront header.is-expanded .SiteLogo .storeLogo{display:block}cx-storefront header.is-expanded .SiteLinks{max-width:100%;width:100%}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-find-store{width:100%;max-width:100%;margin-bottom:10px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-left:0}cx-storefront header.is-expanded .SiteLinks cx-paragraph{margin-left:auto}cx-storefront header.is-expanded:before{display:none}.pageTitle{font-size:28px}}.cart-grid-tile{border:1px solid #E0E0E0;margin-bottom:20px;color:#1d1d1b}.cart-grid-tile .grid-tile-top{background-color:#e8e8e8;border:1px solid #E0E0E0;padding:15px;color:#1d1d1b}.cart-grid-tile .grid-tile-top .sku-code{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif;color:#707070}.cart-grid-tile .grid-tile-top .prod-img{width:70px;height:70px;background-color:#fff}.cart-grid-tile .grid-tile-top .delete-icon{cursor:pointer}.cart-grid-tile .grid-tile-top h4{margin-left:6px;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.cart-grid-tile .border-bottom{border-bottom:1px solid #E0E0E0}.cart-grid-tile .grid-tile-middle{background-color:#fff;padding:15px;border-bottom:1px solid #E0E0E0}.cart-grid-tile .grid-tile-middle .see-more-link{text-decoration:underline}.cart-grid-tile .grid-tile-middle .see-more-link:hover{color:#d51317}.cart-grid-tile .grid-tile-middle .custom-input-field{width:100%;border:1px solid #E0E0E0;height:40px;margin-bottom:15px;padding-left:15px}.cart-grid-tile .grid-tile-middle .color-block{width:20px;height:20px;border:1px solid #E0E0E0}.cart-grid-tile .grid-tile-middle .more-color{cursor:pointer;color:#b61828;margin-left:10px;-webkit-text-decoration-line:underline;text-decoration-line:underline;text-underline-offset:4px;-webkit-text-decoration-style:dashed;text-decoration-style:dashed;position:relative}.cart-grid-tile .grid-tile-middle .more-detail{text-decoration:underline;cursor:pointer;margin-bottom:0}.cart-grid-tile .grid-tile-middle a{color:#262626;text-decoration:underline;cursor:pointer}.cart-grid-tile .grid-tile-middle a:hover{color:#262626}.cart-grid-tile .expandBtn{z-index:9;cursor:pointer;position:absolute;background-color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;bottom:-24px;left:50%;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);box-shadow:0 0 6px #00000026;-webkit-box-shadow:0px 0px 6px rgba(0,0,0,.15);-moz-box-shadow:0px 0px 6px rgba(0,0,0,.15)}.cart-grid-tile .subPrice{color:#707070}.cart-grid-tile .grid-tile-bottom{background-color:#fff;padding:0 15px;border-top:1px solid #E0E0E0}.cart-grid-tile .grid-tile-bottom .total-qty{color:#1d1d1b;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif;padding:15px 0}.cart-grid-tile .grid-tile-bottom .total-amount{color:#1d1d1b;border-bottom:1px solid #E0E0E0}.cart-grid-tile .grid-tile-bottom .total-amount h4{font-size:var(--fontsize20);margin-bottom:0}.cart-grid-tile .grid-tile-bottom .total-amount span{font-size:var(--fontsize14)}.cart-grid-tile .cart-grid-tile .product-img{width:50px;height:50px;min-width:70px;text-align:center}.cart-grid-tile .cart-grid-tile .product-img cx-media{top:-5px;border:1px solid #C6C6C6}.cart-grid-tile .consignment-number{text-decoration:underline;color:#b61828}.cart-grid-tile .consignment-number:hover,.cart-grid-tile .consignment-number:visited{color:#b61828}.bundling{text-align:right;top:20px;margin-bottom:15px}.bundling span.text{display:inline-block;position:relative;top:-12px;font-size:var(--fontsize14)}.switch{position:relative;display:inline-block;width:50px;margin-top:-4px;height:22px}.switch input{opacity:0;width:0;height:0}.switch input:not(:checked)+.slider:after{content:\"NO\";right:6px;position:absolute;color:#fff;top:3px;font-size:var(--fontsize12);font-family:\"Arial Bold\",sans-serif}.switch input:checked+.slider{background-color:#b61828}.switch input:checked+.slider:before{transform:translate(26px);left:5px}.switch input:checked+.slider:after{content:\"YES\";left:5px;position:absolute;color:#fff;top:3px;font-size:var(--fontsize12);font-family:\"Arial Bold\",sans-serif}.switch input:focus+.slider{box-shadow:0 0 1px #2196f3}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#a6a6a5;transition:.4s}.slider:before{position:absolute;content:\"\";height:16px;width:16px;top:3px;left:3px;bottom:3px;background-color:#fff;transition:.4s}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.cart-details-table th{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.add-more-btn{background:none;border:none}.add-more-btn .add-more{position:relative;background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2219%22 height%3D%2219%22 viewBox%3D%220 0 19 19%22%3E%0D %3Cpath id%3D%22Icon_awesome-plus-circle%22 data-name%3D%22Icon awesome-plus-circle%22 d%3D%22M10.063.563a9.5%2C9.5%2C0%2C1%2C0%2C9.5%2C9.5A9.5%2C9.5%2C0%2C0%2C0%2C10.063.563Zm5.516%2C10.573a.461.461%2C0%2C0%2C1-.46.46H11.595v3.524a.461.461%2C0%2C0%2C1-.46.46H8.99a.461.461%2C0%2C0%2C1-.46-.46V11.595H5.006a.461.461%2C0%2C0%2C1-.46-.46V8.99a.461.461%2C0%2C0%2C1%2C.46-.46H8.53V5.006a.461.461%2C0%2C0%2C1%2C.46-.46h2.145a.461.461%2C0%2C0%2C1%2C.46.46V8.53h3.524a.461.461%2C0%2C0%2C1%2C.46.46Z%22 transform%3D%22translate(-0.563 -0.563)%22%2F%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center;width:20px;height:20px;display:inline-block;top:4px}.colours .colour{padding:0 15px;position:relative}.colours .colour .checkbox{display:none}.colours .colour .colour-title{position:absolute;bottom:-48px;width:40px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:var(--fontsize14);text-align:center;cursor:grabbing}.colours .colour.selected{border:1px solid #000000}.colours .colour.selected .checkbox{position:absolute;background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2217.186%22 height%3D%2217.186%22 viewBox%3D%220 0 17.186 17.186%22%3E%0D %3Cg id%3D%22Group_12857%22 data-name%3D%22Group 12857%22 transform%3D%22translate(0.25 0.25)%22%3E%0D %3Ccircle id%3D%22Ellipse_14%22 data-name%3D%22Ellipse 14%22 cx%3D%228.316%22 cy%3D%228.316%22 r%3D%228.316%22 transform%3D%22translate(0 0.039)%22%2F%3E%0D %3Cpath id%3D%22Icon_ionic-md-checkmark-circle%22 data-name%3D%22Icon ionic-md-checkmark-circle%22 d%3D%22M11.718%2C3.375a8.343%2C8.343%2C0%2C1%2C0%2C8.343%2C8.343A8.367%2C8.367%2C0%2C0%2C0%2C11.718%2C3.375ZM10.005%2C16.166%2C5.729%2C11.89l1.2-1.2%2C3.08%2C3.08%2C6.5-6.5%2C1.2%2C1.2Z%22 transform%3D%22translate(-3.375 -3.375)%22 fill%3D%22%23fff%22%2F%3E%0D %3Cpath id%3D%22Icon_ionic-md-checkmark-circle_-_Outline%22 data-name%3D%22Icon ionic-md-checkmark-circle - Outline%22 d%3D%22M11.718%2C3.125a8.583%2C8.583%2C0%2C0%2C1%2C6.069%2C14.662A8.583%2C8.583%2C0%2C1%2C1%2C5.649%2C5.649%2C8.532%2C8.532%2C0%2C0%2C1%2C11.718%2C3.125Zm0%2C16.686A8.117%2C8.117%2C0%2C1%2C0%2C6%2C17.433%2C8.035%2C8.035%2C0%2C0%2C0%2C11.718%2C19.811ZM16.511%2C6.916l1.553%2C1.553-8.059%2C8.05L5.376%2C11.89l1.553-1.553%2C3.08%2C3.08Zm.846%2C1.553-.846-.846-6.5%2C6.5-3.08-3.08-.846.846%2C3.922%2C3.922Z%22 transform%3D%22translate(-3.375 -3.375)%22%2F%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center;width:20px;height:20px;display:inline-block;top:10px;left:10px}.colours .colour.main{box-sizing:border-box;width:40px;height:40px;display:inline-block;padding:0;border:1px solid #C6C6C6}.colours_container{width:320px;height:auto;position:absolute;z-index:1}.colors-paragraph{display:flex;align-items:center}.colors-paragraph .revieworder-color{width:20px;height:20px;border:1px solid #000000;display:inline-flex}.orderInfo li{display:flex}.orderInfo li label{font-family:\"Arial Bold\",sans-serif;width:50%}.orderInfo li .InfoText{display:inline-block;padding-left:10px;width:50%}.productImg{width:71px;height:71px}.productName{line-height:20px}.statusColor{display:inline-block;width:12px;height:12px;border-radius:50%}.attribute{font-size:14px}::ng-deep .flashing-expand{cursor:pointer}::ng-deep .flashing-expand:after{background:url(../../../../assets/images/expand-icon.svg) no-repeat center;z-index:2;width:24px;content:\"\";height:24px;position:absolute;top:0;right:0}::ng-deep .flashing-expand img{max-height:55px;max-width:60px;background:#ffffff}::ng-deep .flashing-expand.flashing-open:after{background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22%3E%0D %3Cg id%3D%22Group_14477%22 data-name%3D%22Group 14477%22 transform%3D%22translate(-5533.5 11452.992)%22%3E%0D %3Cg id%3D%22Group_14476%22 data-name%3D%22Group 14476%22%3E%0D %3Cg id%3D%22Group_14475%22 data-name%3D%22Group 14475%22 transform%3D%22translate(5164.5 -12321.992)%22%3E%0D %3Crect id%3D%22Rectangle_1116%22 data-name%3D%22Rectangle 1116%22 width%3D%2224%22 height%3D%2224%22 transform%3D%22translate(369 869)%22 fill%3D%22%23fff%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11366%22 data-name%3D%22Path 11366%22 d%3D%22M142.587%2C65.954v4.569a1.963%2C1.963%2C0%2C0%2C1-1.839%2C2.068H127.833a1.965%2C1.965%2C0%2C0%2C1-1.839-2.068V58.066A1.963%2C1.963%2C0%2C0%2C1%2C127.833%2C56h4.8a.83.83%2C0%2C1%2C1%2C0%2C1.659h-4.505a.516.516%2C0%2C0%2C0-.472.553V70.378a.521.521%2C0%2C0%2C0%2C.472.553h12.33a.516.516%2C0%2C0%2C0%2C.472-.553V65.954a.83.83%2C0%2C1%2C1%2C1.659%2C0Z%22 transform%3D%22translate(5411.209 -11505.287)%22 fill-rule%3D%22evenodd%22%2F%3E%0D %3C%2Fg%3E%0D %3Cpath id%3D%22Path_11367%22 data-name%3D%22Path 11367%22 d%3D%22M26.413%2C4.5H21.5a.607.607%2C0%2C0%2C0-.608.608v.009a.607.607%2C0%2C0%2C0%2C.608.608h3.4l-5.091%2C5.126a.608.608%2C0%2C0%2C0%2C.858.862l5.126-5.1v3.4a.607.607%2C0%2C0%2C0%2C.608.608h.009a.607.607%2C0%2C0%2C0%2C.608-.608V5.108A.607.607%2C0%2C0%2C0%2C26.413%2C4.5Z%22 transform%3D%22translate(5526.775 -11453.789)%22%2F%3E%0D %3C%2Fg%3E%0D%3C%2Fsvg%3E%0D\") no-repeat center}#imageModal.show{display:flex!important;vertical-align:middle!important;align-items:center!important}#imageModal.show .modal-header{justify-content:right;border:none}#imageModal.show .modal-body{vertical-align:middle;margin:0 1rem;overflow:auto;max-height:80vh}#imageModal.show .modal-body img{max-width:100%;max-height:80vh}.flashing-block{background-color:#e8e8e8}.flashing-block .flash-title{font-size:var(--fontsize16);font-family:\"Arial Bold\",sans-serif}.flashing-block .skuId{color:#707070;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.flashing-block .gst-text{display:block;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif}.flashing-block .total-amount{border-bottom:none!important}@media screen and (max-width: 767px){.cart-grid-tile .grid-tile-top h4{margin-top:10px;margin-left:0}.productImg{width:100%;height:100%}.total-qty span,.total-amount span{font-size:1rem}.total-qty h4,.total-amount h4{font-size:1.25rem!important}}\n"], components: [{ type: i6__namespace.NgxMasonryComponent, selector: "[ngx-masonry], ngx-masonry", inputs: ["updateLayout", "ordered", "options"], outputs: ["layoutComplete", "removeComplete", "itemsLoaded"] }, { type: i3__namespace.MediaComponent, selector: "cx-media", inputs: ["container", "format", "alt", "role", "loading"], outputs: ["loaded"] }, { type: CustomFlashingImageDetailsComponent, selector: "app-custom-flashing-image-details", inputs: ["cartDetails", "forPdf", "appendixNo"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgxMasonryDirective, selector: "[ngxMasonryItem], ngxMasonryItem", inputs: ["prepend"] }, { type: i5__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i5__namespace.AsyncPipe, "number": i5__namespace.DecimalPipe, "date": i5__namespace.DatePipe, "slice": i5__namespace.SlicePipe } });
|
|
8287
8314
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: OrderDetailGridComponent, decorators: [{
|
|
8288
8315
|
type: i0.Component,
|
|
8289
8316
|
args: [{
|