@rolatech/angular-order 0.0.1

package/fesm2022/rolatech-angular-order.mjs

@@ -0,0 +1,912 @@
+import * as i0 from '@angular/core';
+import { Pipe, input, computed, Component, inject, ViewEncapsulation, output, model, Renderer2, viewChild } from '@angular/core';
+import { Title } from '@angular/platform-browser';
+import * as i1 from '@angular/router';
+import { ActivatedRoute, RouterModule, RouterLink } from '@angular/router';
+import { ImagePlaceholderComponent, ThumbnailComponent, ContainerComponent, TabsComponent, TabComponent, ToolbarComponent, ListComponent, EmptyComponent, FilterComponent, AngularComponentsModule, BaseComponent, SpinnerComponent } from '@rolatech/angular-components';
+import { OrderService, ProductService, NavigationService, FulfillmentService } from '@rolatech/angular-services';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule, MatIcon } from '@angular/material/icon';
+import { sumBy } from 'lodash';
+import { CourseType, CourseService } from '@rolatech/angular-course';
+import { FixedPipe, AngularCommonModule, ShippingAddressPipe } from '@rolatech/angular-common';
+import * as i1$1 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import { KeyValuePipe, CommonModule, NgClass } from '@angular/common';
+import * as i2$1 from '@angular/material/form-field';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i7 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import * as i6 from '@angular/material/core';
+import { MatOptionModule } from '@angular/material/core';
+import * as i3$1 from '@angular/material/input';
+import { MatInputModule } from '@angular/material/input';
+import * as i3 from '@angular/forms';
+import { FormsModule, FormBuilder, Validators, ReactiveFormsModule } from '@angular/forms';
+import { trigger, state, style, transition, animate } from '@angular/animations';
+import moment from 'moment';
+import * as QRCode from 'qrcode';
+import * as i1$2 from '@angular/material/paginator';
+import { MatPaginatorModule } from '@angular/material/paginator';
+import * as i2$2 from '@angular/material/menu';
+import { MatMenuModule } from '@angular/material/menu';
+import { TextFieldModule } from '@angular/cdk/text-field';
+
+var OrderStatus;
+(function (OrderStatus) {
+    OrderStatus["CREATED"] = "\u5F85\u4ED8\u6B3E";
+    OrderStatus["PAID"] = "\u5DF2\u652F\u4ED8";
+    OrderStatus["PARTIAL_PAID"] = "\u5B9A\u91D1\u5DF2\u652F\u4ED8";
+    OrderStatus["COMPLETED"] = "\u5DF2\u5B8C\u6210";
+    OrderStatus["CLOSED"] = "\u4EA4\u6613\u5173\u95ED";
+    OrderStatus["CANCELED"] = "\u4EA4\u6613\u53D6\u6D88";
+    OrderStatus["REFUNDED"] = "\u5DF2\u9000\u6B3E";
+    OrderStatus["RETURN_REQUESTED"] = "\u9000\u6B3E\u5904\u7406\u4E2D";
+})(OrderStatus || (OrderStatus = {}));
+var OrderFulfillmentStatus;
+(function (OrderFulfillmentStatus) {
+    OrderFulfillmentStatus["UNFULFILLED"] = "\u672A\u53D1\u8D27";
+    OrderFulfillmentStatus["FULFILLED"] = "\u5DF2\u53D1\u8D27";
+    OrderFulfillmentStatus["PARTIALLY_FULFILLED"] = "\u90E8\u5206\u53D1\u8D27";
+    OrderFulfillmentStatus["ON_HOLD"] = "\u7B49\u5F85\u53D1\u8D27";
+})(OrderFulfillmentStatus || (OrderFulfillmentStatus = {}));
+var OrderPaymentStatus;
+(function (OrderPaymentStatus) {
+    OrderPaymentStatus["CREATED"] = "\u5F85\u4ED8\u6B3E";
+    OrderPaymentStatus["PAID"] = "\u5DF2\u652F\u4ED8";
+    OrderPaymentStatus["PARTIAL_PAID"] = "\u5B9A\u91D1\u5DF2\u652F\u4ED8";
+    OrderPaymentStatus["COMPLETED"] = "\u5DF2\u5B8C\u6210";
+    OrderPaymentStatus["CLOSED"] = "\u4EA4\u6613\u5173\u95ED";
+    OrderPaymentStatus["CANCELED"] = "\u4EA4\u6613\u53D6\u6D88";
+    OrderPaymentStatus["REFUNDED"] = "\u5DF2\u9000\u6B3E";
+    OrderPaymentStatus["RETURN_REQUESTED"] = "\u9000\u6B3E\u5904\u7406\u4E2D";
+})(OrderPaymentStatus || (OrderPaymentStatus = {}));
+var OrderType;
+(function (OrderType) {
+    OrderType["COURSE"] = "\u8BFE\u7A0B";
+    OrderType["PRODUCT"] = "\u5546\u54C1";
+    OrderType["SERVICE"] = "\u670D\u52A1";
+    OrderType["BOOKING"] = "\u9884\u5B9A";
+    OrderType["OTTHER"] = "\u5176\u4ED6";
+})(OrderType || (OrderType = {}));
+var OrderReturnStatus;
+(function (OrderReturnStatus) {
+    OrderReturnStatus[OrderReturnStatus["CREATED"] = '等待审核'] = "CREATED";
+    OrderReturnStatus[OrderReturnStatus["CANCELED"] = '用户取消'] = "CANCELED";
+    OrderReturnStatus[OrderReturnStatus["APPROVED"] = '已通过'] = "APPROVED";
+    OrderReturnStatus[OrderReturnStatus["REJECTED"] = '已拒绝'] = "REJECTED";
+    OrderReturnStatus[OrderReturnStatus["PROCESSING"] = '平台处理中'] = "PROCESSING";
+    OrderReturnStatus[OrderReturnStatus["RETURNED"] = '已退款'] = "RETURNED";
+})(OrderReturnStatus || (OrderReturnStatus = {}));
+var OrderItemStatus;
+(function (OrderItemStatus) {
+    OrderItemStatus[OrderItemStatus["CREATED"] = '创建'] = "CREATED";
+    OrderItemStatus[OrderItemStatus["CANCELED"] = '已取消'] = "CANCELED";
+    OrderItemStatus[OrderItemStatus["CLOSED"] = '已关闭'] = "CLOSED";
+    OrderItemStatus[OrderItemStatus["RETURN_REQUESTED"] = '等待审核'] = "RETURN_REQUESTED";
+    OrderItemStatus[OrderItemStatus["RETURN_APPROVED"] = '商家同意退款'] = "RETURN_APPROVED";
+    OrderItemStatus[OrderItemStatus["RETURN_REJECTED"] = '商家拒绝退款'] = "RETURN_REJECTED";
+    OrderItemStatus[OrderItemStatus["RETURN_PROCESSING"] = '退款处理中'] = "RETURN_PROCESSING";
+    OrderItemStatus[OrderItemStatus["REFUNDED"] = '已退款'] = "REFUNDED";
+})(OrderItemStatus || (OrderItemStatus = {}));
+var OrderTimelineStatus;
+(function (OrderTimelineStatus) {
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_CREATE"] = '交易创建'] = "ORDER_CREATE";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_CLOSED"] = '交易关闭'] = "ORDER_CLOSED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_CANCELED"] = '交易取消'] = "ORDER_CANCELED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_PAID"] = '订单已支付'] = "ORDER_PAID";
+    OrderTimelineStatus["ORDER_PARTIAL_PAID"] = "\u5B9A\u91D1\u5DF2\u652F\u4ED8";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_REFUNDED"] = '订单已退款'] = "ORDER_REFUNDED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_COMPLETED"] = '订单已完成'] = "ORDER_COMPLETED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_RETURN_REQUESTED"] = '退款申请'] = "ORDER_RETURN_REQUESTED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_RETURN_APPROVED"] = '商家同意退款'] = "ORDER_RETURN_APPROVED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_RETURN_REJECTED"] = '商家拒绝退款'] = "ORDER_RETURN_REJECTED";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_RETURN_PROCESSING"] = '退款处理中'] = "ORDER_RETURN_PROCESSING";
+    OrderTimelineStatus[OrderTimelineStatus["ORDER_RETURN_REFUNDED"] = '退款处理完成，已入账'] = "ORDER_RETURN_REFUNDED";
+})(OrderTimelineStatus || (OrderTimelineStatus = {}));
+var OrderPayoutStatus;
+(function (OrderPayoutStatus) {
+    OrderPayoutStatus[OrderPayoutStatus["CREATED"] = '创建'] = "CREATED";
+    OrderPayoutStatus[OrderPayoutStatus["PENDING"] = '处理中'] = "PENDING";
+    OrderPayoutStatus[OrderPayoutStatus["PAID"] = '已支付'] = "PAID";
+    OrderPayoutStatus[OrderPayoutStatus["CANCELED"] = '已取消'] = "CANCELED";
+    OrderPayoutStatus[OrderPayoutStatus["FAILED"] = '失败'] = "FAILED";
+})(OrderPayoutStatus || (OrderPayoutStatus = {}));
+var OrderPayoutType;
+(function (OrderPayoutType) {
+    OrderPayoutType[OrderPayoutType["BANK"] = '银行转账'] = "BANK";
+    OrderPayoutType[OrderPayoutType["CARD"] = '银行卡'] = "CARD";
+    OrderPayoutType[OrderPayoutType["WECHAT"] = '微信零钱'] = "WECHAT";
+})(OrderPayoutType || (OrderPayoutType = {}));
+var PaymentStatus;
+(function (PaymentStatus) {
+    PaymentStatus["PENDING"] = "\u5F85\u652F\u4ED8";
+    PaymentStatus["CANCELED"] = "\u5B9A\u91D1";
+    PaymentStatus["COMPLETED"] = "\u5B8C\u6210";
+    PaymentStatus["FAILED"] = "\u5931\u8D25";
+    PaymentStatus["REFUNDED"] = "\u5DF2\u9000\u6B3E";
+    PaymentStatus["EXPIRED"] = "\u5C3E\u6B3E";
+})(PaymentStatus || (PaymentStatus = {}));
+var PaymentType;
+(function (PaymentType) {
+    PaymentType["FIXED"] = "\u56FA\u5B9A";
+    PaymentType["DEPOSIT"] = "\u5B9A\u91D1";
+    PaymentType["FINAL"] = "\u5C3E\u6B3E";
+})(PaymentType || (PaymentType = {}));
+
+class OrderItemOptionsFormatPipe {
+    constructor() {
+        this.courseType = CourseType;
+    }
+    transform(items, type) {
+        if (!items) {
+            return;
+        }
+        let result = '';
+        items.forEach((item, index) => {
+            const tmp = index === items.length - 1 ? '' : ', ';
+            result += item.name ? item.value + tmp : item.name + tmp;
+        });
+        return type?.toString() === 'PRODUCT' ? result : this.courseType[result];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderItemOptionsFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.0.3", ngImport: i0, type: OrderItemOptionsFormatPipe, isStandalone: true, name: "orderItemoptions" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderItemOptionsFormatPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'orderItemoptions',
+                }]
+        }] });
+
+class OrderItemComponent {
+    constructor() {
+        this.order = input.required();
+        this.status = OrderStatus;
+        this.total = computed(() => {
+            return (this.order().total / 100).toFixed(2);
+        });
+        this.quantity = computed(() => sumBy(this.order().items, (item) => item.quantity));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderItemComponent, isStandalone: true, selector: "rolatech-order-item", inputs: { order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n  <div class=\"flex justify-between w-full mb-2\">\n    <span>\u8BA2\u5355\u53F7: {{ order().orderNo }}</span>\n    <span class=\"font-medium text-sm\">{{ status[order().status] }}</span>\n  </div>\n  <div>\n    @if (order().items; as items) {\n      @if (items.length > 1) {\n      } @else {}\n      <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n        @for (item of items; track $index) {\n          <div class=\"flex flex-row py-2\">\n            @if (item.media) {\n              <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n                @defer (on viewport()) {\n                  <rolatech-thumbnail [src]=\"item.media[0].url + '!w400'\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n                } @placeholder {\n                  <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n                }\n              </div>\n            } @else {\n              <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n                <rolatech-image-placeholder></rolatech-image-placeholder>\n              </div>\n            }\n            <div class=\"flex w-full justify-between\">\n              <div class=\"flex justify-between w-full\">\n                <div>\n                  <div>{{ item.name }}</div>\n                  @if (item.options) {\n                    <div class=\"text-sm text-[--rt-text-secondary] mt-2\">\n                      {{ item.options | orderItemoptions: order().type }}\n                    </div>\n                  }\n                </div>\n                <div class=\"text-right\">\n                  <div class=\"text-sm\">\u00A5{{ item.total | fixed }}</div>\n                  <div class=\"text-sm mt-2\">x{{ item.quantity }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n</div>\n<hr />\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "pipe", type: OrderItemOptionsFormatPipe, name: "orderItemoptions" }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-item', imports: [MatIconModule, ThumbnailComponent, ImagePlaceholderComponent, OrderItemOptionsFormatPipe, FixedPipe], template: "<div class=\"flex flex-col hover:bg-[--rt-raised-background] cursor-pointer p-3\">\n  <div class=\"flex justify-between w-full mb-2\">\n    <span>\u8BA2\u5355\u53F7: {{ order().orderNo }}</span>\n    <span class=\"font-medium text-sm\">{{ status[order().status] }}</span>\n  </div>\n  <div>\n    @if (order().items; as items) {\n      @if (items.length > 1) {\n      } @else {}\n      <div class=\"flex flex-col overflow-x-scroll scrollbar-hide\">\n        @for (item of items; track $index) {\n          <div class=\"flex flex-row py-2\">\n            @if (item.media) {\n              <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n                @defer (on viewport()) {\n                  <rolatech-thumbnail [src]=\"item.media[0].url + '!w400'\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n                } @placeholder {\n                  <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n                }\n              </div>\n            } @else {\n              <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n                <rolatech-image-placeholder></rolatech-image-placeholder>\n              </div>\n            }\n            <div class=\"flex w-full justify-between\">\n              <div class=\"flex justify-between w-full\">\n                <div>\n                  <div>{{ item.name }}</div>\n                  @if (item.options) {\n                    <div class=\"text-sm text-[--rt-text-secondary] mt-2\">\n                      {{ item.options | orderItemoptions: order().type }}\n                    </div>\n                  }\n                </div>\n                <div class=\"text-right\">\n                  <div class=\"text-sm\">\u00A5{{ item.total | fixed }}</div>\n                  <div class=\"text-sm mt-2\">x{{ item.quantity }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n</div>\n<hr />\n", styles: [".scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}\n"] }]
+        }] });
+
+class OrderIndexComponent {
+    constructor() {
+        this.orderService = inject(OrderService);
+        this.title = inject(Title);
+        this.route = inject(ActivatedRoute);
+        this.orderType = OrderType;
+        this.orderStatus = OrderStatus;
+        this.filterOptions = {
+            type: '',
+            status: '',
+        };
+        this.links = [
+            {
+                name: '全部',
+                icon: 'dashboard',
+            },
+            {
+                name: '待付款',
+                icon: 'category',
+                status: 'created',
+            },
+            {
+                name: '已支付',
+                icon: 'category',
+                status: 'paid',
+            },
+            {
+                name: '已退款',
+                icon: 'category',
+                status: 'refunded',
+            },
+            {
+                name: '已取消',
+                icon: 'category',
+                status: 'canceled',
+            },
+        ];
+        this.orders = [];
+        this.select = 0;
+        this.filter = false;
+    }
+    ngOnInit() {
+        this.title.setTitle('我的订单 - 拼小课');
+        this.route.queryParams.subscribe(({ status }) => {
+            this.select = this.links.findIndex((item) => item.status === status);
+            if (status) {
+                this.filterOptions.status = status.toUpperCase();
+            }
+            else {
+                delete this.filterOptions.status;
+            }
+            this.findOrders();
+        });
+    }
+    findOrders() {
+        const options = {
+            sort: 'updatedAt desc',
+        };
+        const filterString = this.convertFilterOptions(this.filterOptions);
+        if (filterString) {
+            options['filter'] = filterString;
+        }
+        this.orderService.me(options).subscribe({
+            next: (res) => {
+                this.orders = res.data;
+            },
+        });
+    }
+    resetFilter() {
+        this.filterOptions = {
+            type: '',
+        };
+        this.filter = false;
+        this.findOrders();
+    }
+    convertFilterOptions(jsonObj) {
+        return Object.entries(jsonObj)
+            .filter(([key, value]) => value !== '' && value !== undefined)
+            .map(([key, value]) => {
+            return `${key}:${value}`;
+        })
+            .join(',');
+    }
+    statusCompareFn(t1, t2) {
+        return t1 === t2;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderIndexComponent, isStandalone: true, selector: "rolatech-order-index", ngImport: i0, template: "<rolatech-container>\n  <rolatech-toolbar title=\"\u6211\u7684\u8BA2\u5355\" large>\n    <button mat-button (click)=\"filter = !filter\">\n      <span>\u8FC7\u6EE4</span>\n      <mat-icon>tune</mat-icon>\n    </button>\n  </rolatech-toolbar>\n  <rolatech-filter>\n    <div [@filter]=\"filter === true ? 'expanded' : 'collapsed'\">\n      <div\n        class=\"min-w-[256px] md:min-w-[320px] px-3 h-full flex flex-row md:flex-col md:h-full items-center md:items-start shadow-inner shadow-light-400 md:shadow-none overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n      >\n        <div class=\"flex items-center gap-3 mt-2\">\n          <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n            <mat-select name=\"type\" placeholder=\"\u7C7B\u578B\" [(ngModel)]=\"filterOptions.type\">\n              @for (type of orderType | keyvalue; track type) {\n                <mat-option [value]=\"type.key\">\n                  {{ type.value }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n          <mat-form-field subscriptSizing=\"dynamic\">\n            <mat-select [compareWith]=\"statusCompareFn\" placeholder=\"\u72B6\u6001\" [(ngModel)]=\"filterOptions.status\">\n              @for (status of orderStatus | keyvalue; track status) {\n                <mat-option [value]=\"status.key\">\n                  {{ status.value }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n          <div>\n            <button mat-flat-button (click)=\"findOrders()\">\u641C\u7D22</button>\n            <button mat-stroked-button (click)=\"resetFilter()\" class=\"ml-3\">\u91CD\u7F6E</button>\n          </div>\n        </div>\n      </div>\n    </div>\n  </rolatech-filter>\n  <rolatech-tabs [select]=\"select\">\n    @for (item of links; track item) {\n      @if (item.status) {\n        <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n      } @else {\n        <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n      }\n    }\n  </rolatech-tabs>\n  <rolatech-list>\n    @if (orders) {\n      @for (item of orders; track item) {\n        <rolatech-order-item [routerLink]=\"['./', item.id]\" [order]=\"item\"></rolatech-order-item>\n      }\n    } @else {\n      <rolatech-empty></rolatech-empty>\n    }\n  </rolatech-list>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: ListComponent, selector: "rolatech-list" }, { kind: "component", type: OrderItemComponent, selector: "rolatech-order-item", inputs: ["order"] }, { kind: "component", type: EmptyComponent, selector: "rolatech-empty" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i6.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: FilterComponent, selector: "rolatech-filter" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }], animations: [
+            trigger('filter', [
+                state('collapsed', style({ height: '0px', minHeight: '0' })),
+                state('expanded', style({ height: '*' })),
+                transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
+            ]),
+        ], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderIndexComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-index', imports: [
+                        ContainerComponent,
+                        RouterModule,
+                        TabsComponent,
+                        TabComponent,
+                        ToolbarComponent,
+                        ListComponent,
+                        OrderItemComponent,
+                        EmptyComponent,
+                        MatButtonModule,
+                        MatIconModule,
+                        FormsModule,
+                        MatFormFieldModule,
+                        MatDatepickerModule,
+                        MatOptionModule,
+                        MatInputModule,
+                        MatSelectModule,
+                        MatButtonModule,
+                        FilterComponent,
+                        KeyValuePipe,
+                    ], animations: [
+                        trigger('filter', [
+                            state('collapsed', style({ height: '0px', minHeight: '0' })),
+                            state('expanded', style({ height: '*' })),
+                            transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
+                        ]),
+                    ], encapsulation: ViewEncapsulation.None, template: "<rolatech-container>\n  <rolatech-toolbar title=\"\u6211\u7684\u8BA2\u5355\" large>\n    <button mat-button (click)=\"filter = !filter\">\n      <span>\u8FC7\u6EE4</span>\n      <mat-icon>tune</mat-icon>\n    </button>\n  </rolatech-toolbar>\n  <rolatech-filter>\n    <div [@filter]=\"filter === true ? 'expanded' : 'collapsed'\">\n      <div\n        class=\"min-w-[256px] md:min-w-[320px] px-3 h-full flex flex-row md:flex-col md:h-full items-center md:items-start shadow-inner shadow-light-400 md:shadow-none overflow-x-scroll overflow-y-hidden scrollbar-hide whitespace-pre\"\n      >\n        <div class=\"flex items-center gap-3 mt-2\">\n          <mat-form-field appearance=\"fill\" subscriptSizing=\"dynamic\">\n            <mat-select name=\"type\" placeholder=\"\u7C7B\u578B\" [(ngModel)]=\"filterOptions.type\">\n              @for (type of orderType | keyvalue; track type) {\n                <mat-option [value]=\"type.key\">\n                  {{ type.value }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n          <mat-form-field subscriptSizing=\"dynamic\">\n            <mat-select [compareWith]=\"statusCompareFn\" placeholder=\"\u72B6\u6001\" [(ngModel)]=\"filterOptions.status\">\n              @for (status of orderStatus | keyvalue; track status) {\n                <mat-option [value]=\"status.key\">\n                  {{ status.value }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n          <div>\n            <button mat-flat-button (click)=\"findOrders()\">\u641C\u7D22</button>\n            <button mat-stroked-button (click)=\"resetFilter()\" class=\"ml-3\">\u91CD\u7F6E</button>\n          </div>\n        </div>\n      </div>\n    </div>\n  </rolatech-filter>\n  <rolatech-tabs [select]=\"select\">\n    @for (item of links; track item) {\n      @if (item.status) {\n        <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n      } @else {\n        <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n      }\n    }\n  </rolatech-tabs>\n  <rolatech-list>\n    @if (orders) {\n      @for (item of orders; track item) {\n        <rolatech-order-item [routerLink]=\"['./', item.id]\" [order]=\"item\"></rolatech-order-item>\n      }\n    } @else {\n      <rolatech-empty></rolatech-empty>\n    }\n  </rolatech-list>\n</rolatech-container>\n" }]
+        }] });
+
+class OrderReturnRequestComponent {
+    constructor() {
+        this.output = output();
+        this.reason = model();
+    }
+    ngDoCheck() {
+        this.output.emit(this.reason());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderReturnRequestComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", type: OrderReturnRequestComponent, isStandalone: true, selector: "rolatech-order-return-request", inputs: { reason: { classPropertyName: "reason", publicName: "reason", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { output: "output", reason: "reasonChange" }, ngImport: i0, template: "<div class=\"py-2\">\n  <h2 class=\"mb-2\">\u5728\u4E0B\u9762\u8F93\u5165\u9000\u6B3E\u7406\u7531</h2>\n  <mat-form-field appearance=\"fill\">\n    <mat-label> \u9000\u6B3E\u7406\u7531 </mat-label>\n    <textarea matInput required [(ngModel)]=\"reason\"></textarea>\n  </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: AngularCommonModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: AngularComponentsModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderReturnRequestComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-return-request', imports: [AngularCommonModule, AngularComponentsModule], template: "<div class=\"py-2\">\n  <h2 class=\"mb-2\">\u5728\u4E0B\u9762\u8F93\u5165\u9000\u6B3E\u7406\u7531</h2>\n  <mat-form-field appearance=\"fill\">\n    <mat-label> \u9000\u6B3E\u7406\u7531 </mat-label>\n    <textarea matInput required [(ngModel)]=\"reason\"></textarea>\n  </mat-form-field>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
+        }] });
+
+class OrderDetailItemComponent {
+    constructor() {
+        this.thumbnail = input();
+        this.title = input.required();
+        this.description = input();
+        this.quantity = input(0);
+        this.total = input.required();
+        this.link = input.required();
+        this.priceDisplay = computed(() => {
+            return (this.total() / 100)?.toFixed(2);
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderDetailItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderDetailItemComponent, isStandalone: true, selector: "rolatech-order-detail-item", inputs: { thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, quantity: { classPropertyName: "quantity", publicName: "quantity", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, link: { classPropertyName: "link", publicName: "link", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex justify-between py-3\">\n  <div class=\"flex w-full\">\n    <div\n      class=\"min-w-24 w-36 aspect-video bg-[--rt-raised-background] hover:rounded-none rounded-lg h-fit cursor-pointer\"\n      [routerLink]=\"link()\"\n    >\n      @defer (on viewport()) {\n        <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n      } @placeholder {\n        <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video\"></div>\n      }\n    </div>\n\n    <div class=\"w-full ml-3 flex flex-col justify-between\">\n      <!-- info -->\n      <div class=\"flex justify-between\">\n        <div class=\"flex flex-col\">\n          <span class=\"text-lg font-bold hover:text-[--rt-brand-color] cursor-pointer\" [routerLink]=\"link()\">{{\n            title()\n          }}</span>\n          <span class=\"text-sm text-[--rt-text-secondary]\">{{ description() }}</span>\n          <ng-content></ng-content>\n        </div>\n        <div class=\"text-right p-1\">\n          <div class=\"text-sm\">\u00A5{{ priceDisplay() }}</div>\n          <div class=\"text-sm mt-2\">x{{ quantity() }}</div>\n        </div>\n      </div>\n      <!-- action -->\n      <div class=\"flex justify-between items-center w-full\">\n        <div class=\"flex items-center text-sm\"></div>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], deferBlockDependencies: [() => [import('@rolatech/angular-components').then(m => m.ThumbnailComponent)]] }); }
+}
+i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "19.0.3", ngImport: i0, type: OrderDetailItemComponent, resolveDeferredDeps: () => [import('@rolatech/angular-components').then(m => m.ThumbnailComponent)], resolveMetadata: ThumbnailComponent => ({ decorators: [{
+                type: Component,
+                args: [{ selector: 'rolatech-order-detail-item', imports: [CommonModule, ThumbnailComponent, RouterLink], template: "<div class=\"flex justify-between py-3\">\n  <div class=\"flex w-full\">\n    <div\n      class=\"min-w-24 w-36 aspect-video bg-[--rt-raised-background] hover:rounded-none rounded-lg h-fit cursor-pointer\"\n      [routerLink]=\"link()\"\n    >\n      @defer (on viewport()) {\n        <rolatech-thumbnail [src]=\"thumbnail()\" size=\"medium\" mode=\"full\"> </rolatech-thumbnail>\n      } @placeholder {\n        <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video\"></div>\n      }\n    </div>\n\n    <div class=\"w-full ml-3 flex flex-col justify-between\">\n      <!-- info -->\n      <div class=\"flex justify-between\">\n        <div class=\"flex flex-col\">\n          <span class=\"text-lg font-bold hover:text-[--rt-brand-color] cursor-pointer\" [routerLink]=\"link()\">{{\n            title()\n          }}</span>\n          <span class=\"text-sm text-[--rt-text-secondary]\">{{ description() }}</span>\n          <ng-content></ng-content>\n        </div>\n        <div class=\"text-right p-1\">\n          <div class=\"text-sm\">\u00A5{{ priceDisplay() }}</div>\n          <div class=\"text-sm mt-2\">x{{ quantity() }}</div>\n        </div>\n      </div>\n      <!-- action -->\n      <div class=\"flex justify-between items-center w-full\">\n        <div class=\"flex items-center text-sm\"></div>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+            }], ctorParameters: null, propDecorators: null }) });
+
+class OrderDetailComponent extends BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.status = OrderStatus;
+        this.type = CourseType;
+        this.orderType = OrderType;
+        this.orderService = inject(OrderService);
+        this.courseService = inject(CourseService);
+        this.productService = inject(ProductService);
+        this.navigationService = inject(NavigationService);
+        this.info = false;
+        this.loadingTimeline = false;
+        this.timelineStatus = OrderTimelineStatus;
+        this.countDown = '';
+    }
+    ngOnInit() {
+        this.get();
+    }
+    get() {
+        this.orderService.get(this.id).subscribe({
+            next: (res) => {
+                this.order = res.data;
+                if (this.order.status === 'CREATED') {
+                    setInterval(() => {
+                        const start = moment();
+                        const end = moment(this.order.createdAt).add(15, 'minute');
+                        const diff = end.diff(start);
+                        const duration = moment.duration(diff);
+                        this.countDown = moment.utc(duration.as('milliseconds')).format('mm:ss');
+                    }, 1000);
+                }
+            },
+        });
+    }
+    refund() {
+        const options = {
+            width: '500px',
+            title: '申请退款',
+            height: '90%',
+            cancelText: '取消',
+            confirmText: '确认',
+            component: OrderReturnRequestComponent,
+            data: {
+                reason: '',
+            },
+        };
+        this.dialogService.open(options);
+        this.dialogService.confirmed().subscribe((res) => {
+            if (res) {
+                this.orderService.refund(this.id, { reason: res }).subscribe({
+                    next: (res) => {
+                        this.snackBarService.open('退款申请成功, 等待审核');
+                    },
+                    error: (error) => {
+                        this.snackBarService.open(error.message);
+                    },
+                });
+            }
+        });
+    }
+    cancel() {
+        this.orderService.cancel(this.id).subscribe({
+            next: (res) => {
+                this.order.status = 'CANCELED';
+                this.snackBarService.open('取消成功');
+            },
+            error: (error) => {
+                this.snackBarService.open(error.message);
+            },
+        });
+    }
+    pay() {
+        this.router.navigateByUrl(`/orders/${this.id}/qrcodepay`);
+    }
+    timeline() {
+        this.info = true;
+        this.loadingTimeline = true;
+        this.orderService.timeline(this.id).subscribe({
+            next: (res) => {
+                this.timelineData = res.data;
+                this.loadingTimeline = false;
+            },
+            error: (error) => {
+                this.loadingTimeline = false;
+            },
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderDetailComponent, isStandalone: true, selector: "rolatech-order-detail", usesInheritance: true, ngImport: i0, template: "@if (order) {\n  <rolatech-container>\n    <rolatech-toolbar [title]=\"status[order.status]\" large link=\"../\">\n      <button mat-button (click)=\"timeline()\">\n        <mat-icon>history</mat-icon>\n        <span>\u8BA2\u5355\u72B6\u6001</span>\n      </button>\n      <button mat-button routerLink=\"./tracking\">\n        <mat-icon>local_shipping</mat-icon>\n        <span>\u7269\u6D41\u67E5\u8BE2</span>\n      </button>\n    </rolatech-toolbar>\n    <div>\n      @if (order.status === 'CREATED') {\n        <div class=\"text-[--rt-brand-color] font-bold\">\u652F\u4ED8\u5012\u8BA1\u65F6: {{ countDown }}</div>\n      }\n      <div>\n        <div>\n          @for (item of order.items; track $index) {\n            <rolatech-order-detail-item\n              [thumbnail]=\"item.media[0].url + '!w200 '\"\n              [link]=\"order.type.toString() === 'PRODUCT' ? '/products/' + item.productId : '/courses/' + item.productId\"\n              [title]=\"item.name\"\n              [total]=\"item.total\"\n              [description]=\"item.options | orderItemoptions: order.type\"\n              [quantity]=\"item.quantity\"\n            ></rolatech-order-detail-item>\n          }\n        </div>\n        <div class=\"mt-3\">\n          <div class=\"text-lg py-3 font-medium\">\u8BA2\u5355\u4FE1\u606F</div>\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u8BA2\u5355\u53F7</span>\n            <span class=\"text-sm\"> {{ order.orderNo }}</span>\n          </div>\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u4E0B\u5355\u65F6\u95F4</span>\n            <span class=\"text-sm\"> {{ order.createdAt }}</span>\n          </div>\n          <div class=\"flex items-baseline justify-between py-1\">\n            <span class=\"font-medium min-w-20\">\u914D\u9001\u4FE1\u606F</span>\n            <span class=\"text-sm\">{{ order.shippingAddress | shippingAddress }}</span>\n          </div>\n          <div class=\"flex items-baseline justify-between py-1\">\n            <span class=\"font-medium min-w-20\">\u5907\u6CE8\u4FE1\u606F</span>\n            <span class=\"text-sm\">{{ order.note || '\u65E0' }}</span>\n          </div>\n          @if (order.deposit) {\n            <div class=\"flex items-center justify-between py-1\">\n              <span class=\"font-medium\">\u5B9A\u91D1\u91D1\u989D</span>\n              <span class=\"text-sm\">\u00A5{{ order.deposit | fixed }}</span>\n            </div>\n            <div class=\"flex items-center justify-between py-1\">\n              <span class=\"font-medium\">\u5C3E\u6B3E\u91D1\u989D</span>\n              <span class=\"text-sm\">\u00A5{{ order.total - order.deposit | fixed }}</span>\n            </div>\n          }\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u5E94\u4ED8\u91D1\u989D</span>\n            <span class=\"text-sm\">\u00A5{{ order.total | fixed }}</span>\n          </div>\n        </div>\n        @if (order.status.toString() === 'CREATED' || order.status.toString() === 'PAID') {\n          <div class=\"mt-6\">\n            <div class=\"text-lg pb-3 font-medium\">\u652F\u4ED8\u65B9\u5F0F</div>\n            <div class=\"flex items-center\">\n              <svg\n                class=\"svg-icon\"\n                style=\"width: 2rem; height: 2rem\"\n                viewBox=\"0 0 1024 1024\"\n                version=\"1.1\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n                  fill=\"#09BB07\"\n                />\n              </svg>\n              <span class=\"ml-1\">\u5FAE\u4FE1\u652F\u4ED8</span>\n              <!-- <svg id=\"Layer_1\" data-name=\"Layer 1\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 715.94 211.02\">\n                <title>WeChat Pay logo - Brandlogos.net</title>\n                <g id=\"\u9875\u9762-1\">\n                  <g id=\"\u753B\u677F\">\n                    <g id=\"\u7F16\u7EC4\">\n                      <path\n                        id=\"\u5F62\u72B6\u7ED3\u5408\"\n                        d=\"M710.2,429.86l8.93,24.1c.93,2.7,1.94,5.9,2.61,8.34h.17c.76-2.44,1.6-5.56,2.61-8.51l8.09-23.93h7.84l-11.13,29.08c-5.31,14-8.93,21.16-14,25.54a21.48,21.48,0,0,1-7.57,4.41c-.61-1.09-3.39-5.85-3.39-5.85a19.62,19.62,0,0,0,6.49-3.62,22.5,22.5,0,0,0,6.24-8.26,5.31,5.31,0,0,0,.59-1.77,6.45,6.45,0,0,0-.51-1.94l-15.09-37.59Zm-170.81-.93c12.47,0,15.51,8.51,15.51,16.69v15.26a57.4,57.4,0,0,0,.67,9.78h-6.74l-.59-5.14H548a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.76-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.61,20.61,0,0,0-9.77,2.52L526,432.56A25.3,25.3,0,0,1,539.39,428.94Zm138.79,0c12.47,0,15.51,8.51,15.51,16.69v15.26a57.41,57.41,0,0,0,.67,9.78h-6.74l-.59-5.14h-.25a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.77-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.6,20.6,0,0,0-9.77,2.52l-2.53-4.38A25.3,25.3,0,0,1,678.18,428.94Zm-226.09-16c7.08,0,11.55,1.52,13.48,2.53,0,0-2.24,3.9-3.16,5.38a28,28,0,0,0-10.07-1.75c-13.32,0-22.17,8.51-22.17,23.43,0,13.91,8,22.84,21.83,22.84a31.51,31.51,0,0,0,10.48-1.73c.67,1.17,3,5.19,3,5.19-2.7,1.35-8.09,2.7-15,2.7-16,0-28.07-10.11-28.07-28.74C422.42,425,434.47,412.92,452.09,412.92Zm-55.11,16c13.32,0,16.86,11.72,16.86,19.22a28,28,0,0,1-.25,3.46H384.93c.17,10,6.57,14.16,14,14.16a27.78,27.78,0,0,0,9.78-1.51c.68,1.12,2.78,4.71,2.78,4.71a33,33,0,0,1-13.57,2.53c-12.56,0-20.06-8.26-20.06-20.57S385.09,428.94,397,428.94Zm181-10.79v11.72H588.6v5.65H578v22c0,5.06,1.43,7.92,5.56,7.92.61,0,1.16,0,1.67-.07.87,1.47,3,5.12,3,5.12a18.19,18.19,0,0,1-6.57,1c-3.46,0-6.24-1.1-8-3.12-2.11-2.19-2.87-5.81-2.87-10.62V435.51h-6.32v-5.65h6.32V418.15Zm56.21-4.72c7.25,0,12.56,1.69,15.93,4.72,3.12,2.7,5,6.83,5,11.88s-1.52,9.19-4.38,12.14c-3.88,4.13-10.2,6.24-17.36,6.24a25.3,25.3,0,0,1-5.9-.51v22.76h-7.33V414.52A85.05,85.05,0,0,1,634.19,413.43Zm-321.57.42,6.74,28.74c1.69,7.08,3.2,14.16,4.21,19.64h.17c.93-5.65,2.7-12.39,4.64-19.72L336,413.85h7.67l6.91,28.82c1.6,6.74,3.12,13.48,4,19.47h.17c1.18-6.24,2.78-12.56,4.55-19.64l7.5-28.66h7.5l-16.1,56.81h-7.67l-7.16-29.58a171.14,171.14,0,0,1-3.71-18.54h-.17A177.33,177.33,0,0,1,335,441.07L327,470.65h-7.67l-14.41-56.81Zm171.74-3v25.45h.17a13.77,13.77,0,0,1,5.31-5.23,15.27,15.27,0,0,1,7.59-2.11c5.48,0,14.24,3.37,14.24,17.45v24.27h-7.42V447.23c0-6.57-2.44-12.14-9.44-12.14a10.65,10.65,0,0,0-9.95,7.42,9,9,0,0,0-.51,3.54v24.61h-7.42V410.82ZM530.45,459c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C539.64,449.67,530.45,451.1,530.45,459Zm138.79,0c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C678.43,449.67,669.24,451.1,669.24,459ZM396.39,434.25c-7.5,0-10.79,6.91-11.38,12.05h21.66C406.75,441.58,404.73,434.25,396.39,434.25Zm238-15a30.8,30.8,0,0,0-6.91.59v22.08a24.65,24.65,0,0,0,6.07.59c8.85,0,14.24-4.3,14.24-12.14C647.76,422.87,642.45,419.24,634.36,419.24ZM584.45,291.18V306.1h44.14v7.75H584.45v16.2h35.63s-4.57,23.28-31.27,42.88c10.8,5.69,25,9.72,42.38,12.44,0,0-2.81,5-5.21,8.85-19-3.3-33.81-9.08-45.43-15.86-11.71,6.95-26.85,13-46.43,16.4-1.36-2-5.08-8.6-5.08-8.6,17.75-2.78,32.36-7.27,43.28-13.13-26.84-19.25-32-43-32-43h35.53v-16.2H530V306.1h45.85V291.18ZM323,319.7l6.88,3.65c-3.27,7.77-6.31,13.06-7.15,14.72v56.38H315V350.25c-4.44,6-7,9.07-8.34,10.54l-4.37-7.57C310.57,344.43,317.91,332.36,323,319.7Zm341.11-28.21,9,2-.28.74c-3.66,9.57-7.09,17.72-10.19,24.22v76H654V334.82a161.16,161.16,0,0,1-10.27,14.75L639,341.25c10.14-13.8,18.67-30.56,24.88-49.18Zm-226.36,0,8.15,2s-5.19,16.35-9.16,25l0,76h-8.61V335.12c-3.45,6.5-5.76,10.77-8.68,14.59l-4.66-8.07C426.86,326.4,437.72,291.47,437.72,291.47Zm-54.81-.41,7.75,1.55-.18.7c-1.6,6.13-3.37,12.15-5.26,17.91h23.19v7.33h-5.59c-1.44,20.81-5.13,36.93-10.95,47.93,4.62,9,13.52,17.42,16,19.7-.56,1.07-4.44,7.71-4.44,7.71s-12.89-13.2-15.81-19.59c-3.28,5.51-9.33,12.65-17.53,20h0L366,387s11.22-9.31,17.58-20.55a125.69,125.69,0,0,1-7.81-32.27c-1.36,2.39-2.1,3.68-3.47,5.73,0,0-3.62-6.29-4.36-7.47,6.51-11.45,11.39-24.94,14.87-40.71h0Zm344.12.88v24.4H742v8.18H727v53.12A15.35,15.35,0,0,1,711.7,393h-10v-9h10a6.39,6.39,0,0,0,6.38-6.38V324.52H670.25v-8.18h47.82v-24.4Zm-214.4,64.91v35.69H452V356.85Zm-149-4.26v19.71c1.45-1.23,5.89-5.13,7.38-6.46l3.57,6.18-16.36,13.81s-3.46-6-4.16-7.11c1-1.07,2.25-3.28,2.25-7.5V359.91H341.47c0,16.86-.68,23-11.92,31.75,0,0-2.71-4.78-3.92-6.78,9.66-7.63,8.51-18.06,8.51-32.29Zm140.81,12H460.61v20.61h43.84ZM608,337.7H552.6c3.17,6.6,11,19.34,28,30.42C597.44,356.87,605.06,344,608,337.7Zm79.67-.53L703.31,362l-8.15,4.45-14.64-25ZM395.5,318.55H382.74c-.13.52-1.33,3.54-1.6,4.13,1.59,15.26,3.94,27,7,34.81,3.79-9.1,6.27-22.18,7.36-38.94Zm118,21.24v7.33H451.15v-7.33Zm-146-3.84v7.33h-35V336Zm146-13.22v7.33H451.15v-7.33ZM354.26,292.89v26.87h7.92V300.56h6.9v26.09H331.7V301H339v18.76h7.91V292.89Zm-30.89-1.78,6.76,4.43a101.69,101.69,0,0,1-22.45,30.55L303.6,319C311,311.86,318,301.79,323.38,291.1Zm158.9.37,6.08,13.78h31.1V313H445.61v-7.75h34.12L475.3,294.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #4d4d4d\"\n                      />\n                      <path\n                        id=\"Fill-29\"\n                        d=\"M113,412a8,8,0,0,1-10.54-3.22l-.52-1.14L80.18,359.84a4.16,4.16,0,0,1-.38-1.68A4,4,0,0,1,86.17,355l25.69,18.29a11.86,11.86,0,0,0,10.62,1.22L243.29,320.7c-21.66-25.52-57.32-42.2-97.68-42.2-66,0-119.58,44.62-119.58,99.66,0,30,16.11,57.06,41.32,75.33A8,8,0,0,1,70.69,460a9.43,9.43,0,0,1-.42,2.54l-5.39,20.1a11.73,11.73,0,0,0-.64,2.91,4,4,0,0,0,4,4,4.5,4.5,0,0,0,2.3-.74l26.18-15.11a12.55,12.55,0,0,1,6.35-1.84,12,12,0,0,1,3.51.53,141.5,141.5,0,0,0,39,5.46c66,0,119.59-44.62,119.59-99.66A86.29,86.29,0,0,0,251.58,332l-137.69,79.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #1aad19\"\n                      />\n                    </g>\n                  </g>\n                </g>\n              </svg> -->\n            </div>\n          </div>\n        }\n      </div>\n      <!-- safe area -->\n      <div class=\"pb-16 sm:pb-3\"></div>\n      <div class=\"\">\n        @if (order.status.toString() === 'PAID') {\n          <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"refund()\">\u7533\u8BF7\u9000\u6B3E</button>\n        }\n        <div class=\"flex items-center justify-end\">\n          @if (order.status.toString() === 'CREATED') {\n            <span\n              class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n              (click)=\"cancel()\"\n              >\u53D6\u6D88\u8BA2\u5355</span\n            >\n          }\n          @if (order.status.toString() === 'CREATED') {\n            @if (order.deposit) {\n              <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5B9A\u91D1</button>\n            } @else {\n              <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u8BA2\u5355</button>\n            }\n          }\n          @if (order.status.toString() === 'PARTIAL_PAID') {\n            <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5C3E\u6B3E</button>\n          }\n        </div>\n      </div>\n    </div>\n  </rolatech-container>\n}\n@if (info) {\n  <div\n    [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n    class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n  >\n    <div class=\"flex justify-between items-center sm:p-4\">\n      <div class=\"text-xl font-bold\">\u8BA2\u5355\u72B6\u6001</div>\n      <button mat-icon-button (click)=\"info = !info\">\n        <mat-icon>close</mat-icon>\n      </button>\n    </div>\n    @if (loadingTimeline) {\n      <div>\n        <rolatech-spinner></rolatech-spinner>\n      </div>\n    } @else {\n      <div class=\"mt-3 p-1 sm:p-4\">\n        <ol class=\"relative border-l border-[--rt-border-color]\">\n          @for (item of timelineData; track item) {\n            <li class=\"mb-8 ml-4\">\n              <div\n                class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 border border-[--rt-raised-background] bg-[--rt-text-primary]\"\n              ></div>\n              <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n              @if (item.status === 'BOOKING_RETURN_REJECTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n              }\n              @if (item.status === 'BOOKING_RETURN_REQUESTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n              }\n              <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n            </li>\n          }\n        </ol>\n      </div>\n    }\n  </div>\n}\n\n<div\n  (click)=\"info = !info\"\n  [ngClass]=\"info ? 'visible' : 'invisible'\"\n  class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: OrderDetailItemComponent, selector: "rolatech-order-detail-item", inputs: ["thumbnail", "title", "description", "quantity", "total", "link"] }, { kind: "pipe", type: OrderItemOptionsFormatPipe, name: "orderItemoptions" }, { kind: "pipe", type: FixedPipe, name: "fixed" }, { kind: "pipe", type: ShippingAddressPipe, name: "shippingAddress" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderDetailComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-detail', imports: [
+                        MatButtonModule,
+                        MatIconModule,
+                        NgClass,
+                        SpinnerComponent,
+                        ContainerComponent,
+                        ToolbarComponent,
+                        OrderDetailItemComponent,
+                        OrderItemOptionsFormatPipe,
+                        FixedPipe,
+                        ShippingAddressPipe,
+                        RouterLink,
+                    ], template: "@if (order) {\n  <rolatech-container>\n    <rolatech-toolbar [title]=\"status[order.status]\" large link=\"../\">\n      <button mat-button (click)=\"timeline()\">\n        <mat-icon>history</mat-icon>\n        <span>\u8BA2\u5355\u72B6\u6001</span>\n      </button>\n      <button mat-button routerLink=\"./tracking\">\n        <mat-icon>local_shipping</mat-icon>\n        <span>\u7269\u6D41\u67E5\u8BE2</span>\n      </button>\n    </rolatech-toolbar>\n    <div>\n      @if (order.status === 'CREATED') {\n        <div class=\"text-[--rt-brand-color] font-bold\">\u652F\u4ED8\u5012\u8BA1\u65F6: {{ countDown }}</div>\n      }\n      <div>\n        <div>\n          @for (item of order.items; track $index) {\n            <rolatech-order-detail-item\n              [thumbnail]=\"item.media[0].url + '!w200 '\"\n              [link]=\"order.type.toString() === 'PRODUCT' ? '/products/' + item.productId : '/courses/' + item.productId\"\n              [title]=\"item.name\"\n              [total]=\"item.total\"\n              [description]=\"item.options | orderItemoptions: order.type\"\n              [quantity]=\"item.quantity\"\n            ></rolatech-order-detail-item>\n          }\n        </div>\n        <div class=\"mt-3\">\n          <div class=\"text-lg py-3 font-medium\">\u8BA2\u5355\u4FE1\u606F</div>\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u8BA2\u5355\u53F7</span>\n            <span class=\"text-sm\"> {{ order.orderNo }}</span>\n          </div>\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u4E0B\u5355\u65F6\u95F4</span>\n            <span class=\"text-sm\"> {{ order.createdAt }}</span>\n          </div>\n          <div class=\"flex items-baseline justify-between py-1\">\n            <span class=\"font-medium min-w-20\">\u914D\u9001\u4FE1\u606F</span>\n            <span class=\"text-sm\">{{ order.shippingAddress | shippingAddress }}</span>\n          </div>\n          <div class=\"flex items-baseline justify-between py-1\">\n            <span class=\"font-medium min-w-20\">\u5907\u6CE8\u4FE1\u606F</span>\n            <span class=\"text-sm\">{{ order.note || '\u65E0' }}</span>\n          </div>\n          @if (order.deposit) {\n            <div class=\"flex items-center justify-between py-1\">\n              <span class=\"font-medium\">\u5B9A\u91D1\u91D1\u989D</span>\n              <span class=\"text-sm\">\u00A5{{ order.deposit | fixed }}</span>\n            </div>\n            <div class=\"flex items-center justify-between py-1\">\n              <span class=\"font-medium\">\u5C3E\u6B3E\u91D1\u989D</span>\n              <span class=\"text-sm\">\u00A5{{ order.total - order.deposit | fixed }}</span>\n            </div>\n          }\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u5E94\u4ED8\u91D1\u989D</span>\n            <span class=\"text-sm\">\u00A5{{ order.total | fixed }}</span>\n          </div>\n        </div>\n        @if (order.status.toString() === 'CREATED' || order.status.toString() === 'PAID') {\n          <div class=\"mt-6\">\n            <div class=\"text-lg pb-3 font-medium\">\u652F\u4ED8\u65B9\u5F0F</div>\n            <div class=\"flex items-center\">\n              <svg\n                class=\"svg-icon\"\n                style=\"width: 2rem; height: 2rem\"\n                viewBox=\"0 0 1024 1024\"\n                version=\"1.1\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n                  fill=\"#09BB07\"\n                />\n              </svg>\n              <span class=\"ml-1\">\u5FAE\u4FE1\u652F\u4ED8</span>\n              <!-- <svg id=\"Layer_1\" data-name=\"Layer 1\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 715.94 211.02\">\n                <title>WeChat Pay logo - Brandlogos.net</title>\n                <g id=\"\u9875\u9762-1\">\n                  <g id=\"\u753B\u677F\">\n                    <g id=\"\u7F16\u7EC4\">\n                      <path\n                        id=\"\u5F62\u72B6\u7ED3\u5408\"\n                        d=\"M710.2,429.86l8.93,24.1c.93,2.7,1.94,5.9,2.61,8.34h.17c.76-2.44,1.6-5.56,2.61-8.51l8.09-23.93h7.84l-11.13,29.08c-5.31,14-8.93,21.16-14,25.54a21.48,21.48,0,0,1-7.57,4.41c-.61-1.09-3.39-5.85-3.39-5.85a19.62,19.62,0,0,0,6.49-3.62,22.5,22.5,0,0,0,6.24-8.26,5.31,5.31,0,0,0,.59-1.77,6.45,6.45,0,0,0-.51-1.94l-15.09-37.59Zm-170.81-.93c12.47,0,15.51,8.51,15.51,16.69v15.26a57.4,57.4,0,0,0,.67,9.78h-6.74l-.59-5.14H548a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.76-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.61,20.61,0,0,0-9.77,2.52L526,432.56A25.3,25.3,0,0,1,539.39,428.94Zm138.79,0c12.47,0,15.51,8.51,15.51,16.69v15.26a57.41,57.41,0,0,0,.67,9.78h-6.74l-.59-5.14h-.25a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.77-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.6,20.6,0,0,0-9.77,2.52l-2.53-4.38A25.3,25.3,0,0,1,678.18,428.94Zm-226.09-16c7.08,0,11.55,1.52,13.48,2.53,0,0-2.24,3.9-3.16,5.38a28,28,0,0,0-10.07-1.75c-13.32,0-22.17,8.51-22.17,23.43,0,13.91,8,22.84,21.83,22.84a31.51,31.51,0,0,0,10.48-1.73c.67,1.17,3,5.19,3,5.19-2.7,1.35-8.09,2.7-15,2.7-16,0-28.07-10.11-28.07-28.74C422.42,425,434.47,412.92,452.09,412.92Zm-55.11,16c13.32,0,16.86,11.72,16.86,19.22a28,28,0,0,1-.25,3.46H384.93c.17,10,6.57,14.16,14,14.16a27.78,27.78,0,0,0,9.78-1.51c.68,1.12,2.78,4.71,2.78,4.71a33,33,0,0,1-13.57,2.53c-12.56,0-20.06-8.26-20.06-20.57S385.09,428.94,397,428.94Zm181-10.79v11.72H588.6v5.65H578v22c0,5.06,1.43,7.92,5.56,7.92.61,0,1.16,0,1.67-.07.87,1.47,3,5.12,3,5.12a18.19,18.19,0,0,1-6.57,1c-3.46,0-6.24-1.1-8-3.12-2.11-2.19-2.87-5.81-2.87-10.62V435.51h-6.32v-5.65h6.32V418.15Zm56.21-4.72c7.25,0,12.56,1.69,15.93,4.72,3.12,2.7,5,6.83,5,11.88s-1.52,9.19-4.38,12.14c-3.88,4.13-10.2,6.24-17.36,6.24a25.3,25.3,0,0,1-5.9-.51v22.76h-7.33V414.52A85.05,85.05,0,0,1,634.19,413.43Zm-321.57.42,6.74,28.74c1.69,7.08,3.2,14.16,4.21,19.64h.17c.93-5.65,2.7-12.39,4.64-19.72L336,413.85h7.67l6.91,28.82c1.6,6.74,3.12,13.48,4,19.47h.17c1.18-6.24,2.78-12.56,4.55-19.64l7.5-28.66h7.5l-16.1,56.81h-7.67l-7.16-29.58a171.14,171.14,0,0,1-3.71-18.54h-.17A177.33,177.33,0,0,1,335,441.07L327,470.65h-7.67l-14.41-56.81Zm171.74-3v25.45h.17a13.77,13.77,0,0,1,5.31-5.23,15.27,15.27,0,0,1,7.59-2.11c5.48,0,14.24,3.37,14.24,17.45v24.27h-7.42V447.23c0-6.57-2.44-12.14-9.44-12.14a10.65,10.65,0,0,0-9.95,7.42,9,9,0,0,0-.51,3.54v24.61h-7.42V410.82ZM530.45,459c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C539.64,449.67,530.45,451.1,530.45,459Zm138.79,0c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C678.43,449.67,669.24,451.1,669.24,459ZM396.39,434.25c-7.5,0-10.79,6.91-11.38,12.05h21.66C406.75,441.58,404.73,434.25,396.39,434.25Zm238-15a30.8,30.8,0,0,0-6.91.59v22.08a24.65,24.65,0,0,0,6.07.59c8.85,0,14.24-4.3,14.24-12.14C647.76,422.87,642.45,419.24,634.36,419.24ZM584.45,291.18V306.1h44.14v7.75H584.45v16.2h35.63s-4.57,23.28-31.27,42.88c10.8,5.69,25,9.72,42.38,12.44,0,0-2.81,5-5.21,8.85-19-3.3-33.81-9.08-45.43-15.86-11.71,6.95-26.85,13-46.43,16.4-1.36-2-5.08-8.6-5.08-8.6,17.75-2.78,32.36-7.27,43.28-13.13-26.84-19.25-32-43-32-43h35.53v-16.2H530V306.1h45.85V291.18ZM323,319.7l6.88,3.65c-3.27,7.77-6.31,13.06-7.15,14.72v56.38H315V350.25c-4.44,6-7,9.07-8.34,10.54l-4.37-7.57C310.57,344.43,317.91,332.36,323,319.7Zm341.11-28.21,9,2-.28.74c-3.66,9.57-7.09,17.72-10.19,24.22v76H654V334.82a161.16,161.16,0,0,1-10.27,14.75L639,341.25c10.14-13.8,18.67-30.56,24.88-49.18Zm-226.36,0,8.15,2s-5.19,16.35-9.16,25l0,76h-8.61V335.12c-3.45,6.5-5.76,10.77-8.68,14.59l-4.66-8.07C426.86,326.4,437.72,291.47,437.72,291.47Zm-54.81-.41,7.75,1.55-.18.7c-1.6,6.13-3.37,12.15-5.26,17.91h23.19v7.33h-5.59c-1.44,20.81-5.13,36.93-10.95,47.93,4.62,9,13.52,17.42,16,19.7-.56,1.07-4.44,7.71-4.44,7.71s-12.89-13.2-15.81-19.59c-3.28,5.51-9.33,12.65-17.53,20h0L366,387s11.22-9.31,17.58-20.55a125.69,125.69,0,0,1-7.81-32.27c-1.36,2.39-2.1,3.68-3.47,5.73,0,0-3.62-6.29-4.36-7.47,6.51-11.45,11.39-24.94,14.87-40.71h0Zm344.12.88v24.4H742v8.18H727v53.12A15.35,15.35,0,0,1,711.7,393h-10v-9h10a6.39,6.39,0,0,0,6.38-6.38V324.52H670.25v-8.18h47.82v-24.4Zm-214.4,64.91v35.69H452V356.85Zm-149-4.26v19.71c1.45-1.23,5.89-5.13,7.38-6.46l3.57,6.18-16.36,13.81s-3.46-6-4.16-7.11c1-1.07,2.25-3.28,2.25-7.5V359.91H341.47c0,16.86-.68,23-11.92,31.75,0,0-2.71-4.78-3.92-6.78,9.66-7.63,8.51-18.06,8.51-32.29Zm140.81,12H460.61v20.61h43.84ZM608,337.7H552.6c3.17,6.6,11,19.34,28,30.42C597.44,356.87,605.06,344,608,337.7Zm79.67-.53L703.31,362l-8.15,4.45-14.64-25ZM395.5,318.55H382.74c-.13.52-1.33,3.54-1.6,4.13,1.59,15.26,3.94,27,7,34.81,3.79-9.1,6.27-22.18,7.36-38.94Zm118,21.24v7.33H451.15v-7.33Zm-146-3.84v7.33h-35V336Zm146-13.22v7.33H451.15v-7.33ZM354.26,292.89v26.87h7.92V300.56h6.9v26.09H331.7V301H339v18.76h7.91V292.89Zm-30.89-1.78,6.76,4.43a101.69,101.69,0,0,1-22.45,30.55L303.6,319C311,311.86,318,301.79,323.38,291.1Zm158.9.37,6.08,13.78h31.1V313H445.61v-7.75h34.12L475.3,294.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #4d4d4d\"\n                      />\n                      <path\n                        id=\"Fill-29\"\n                        d=\"M113,412a8,8,0,0,1-10.54-3.22l-.52-1.14L80.18,359.84a4.16,4.16,0,0,1-.38-1.68A4,4,0,0,1,86.17,355l25.69,18.29a11.86,11.86,0,0,0,10.62,1.22L243.29,320.7c-21.66-25.52-57.32-42.2-97.68-42.2-66,0-119.58,44.62-119.58,99.66,0,30,16.11,57.06,41.32,75.33A8,8,0,0,1,70.69,460a9.43,9.43,0,0,1-.42,2.54l-5.39,20.1a11.73,11.73,0,0,0-.64,2.91,4,4,0,0,0,4,4,4.5,4.5,0,0,0,2.3-.74l26.18-15.11a12.55,12.55,0,0,1,6.35-1.84,12,12,0,0,1,3.51.53,141.5,141.5,0,0,0,39,5.46c66,0,119.59-44.62,119.59-99.66A86.29,86.29,0,0,0,251.58,332l-137.69,79.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #1aad19\"\n                      />\n                    </g>\n                  </g>\n                </g>\n              </svg> -->\n            </div>\n          </div>\n        }\n      </div>\n      <!-- safe area -->\n      <div class=\"pb-16 sm:pb-3\"></div>\n      <div class=\"\">\n        @if (order.status.toString() === 'PAID') {\n          <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"refund()\">\u7533\u8BF7\u9000\u6B3E</button>\n        }\n        <div class=\"flex items-center justify-end\">\n          @if (order.status.toString() === 'CREATED') {\n            <span\n              class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n              (click)=\"cancel()\"\n              >\u53D6\u6D88\u8BA2\u5355</span\n            >\n          }\n          @if (order.status.toString() === 'CREATED') {\n            @if (order.deposit) {\n              <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5B9A\u91D1</button>\n            } @else {\n              <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u8BA2\u5355</button>\n            }\n          }\n          @if (order.status.toString() === 'PARTIAL_PAID') {\n            <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5C3E\u6B3E</button>\n          }\n        </div>\n      </div>\n    </div>\n  </rolatech-container>\n}\n@if (info) {\n  <div\n    [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n    class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n  >\n    <div class=\"flex justify-between items-center sm:p-4\">\n      <div class=\"text-xl font-bold\">\u8BA2\u5355\u72B6\u6001</div>\n      <button mat-icon-button (click)=\"info = !info\">\n        <mat-icon>close</mat-icon>\n      </button>\n    </div>\n    @if (loadingTimeline) {\n      <div>\n        <rolatech-spinner></rolatech-spinner>\n      </div>\n    } @else {\n      <div class=\"mt-3 p-1 sm:p-4\">\n        <ol class=\"relative border-l border-[--rt-border-color]\">\n          @for (item of timelineData; track item) {\n            <li class=\"mb-8 ml-4\">\n              <div\n                class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 border border-[--rt-raised-background] bg-[--rt-text-primary]\"\n              ></div>\n              <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n              @if (item.status === 'BOOKING_RETURN_REJECTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n              }\n              @if (item.status === 'BOOKING_RETURN_REQUESTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n              }\n              <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n            </li>\n          }\n        </ol>\n      </div>\n    }\n  </div>\n}\n\n<div\n  (click)=\"info = !info\"\n  [ngClass]=\"info ? 'visible' : 'invisible'\"\n  class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n" }]
+        }] });
+
+class OrderQrcodepayComponent extends BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.status = OrderStatus;
+        this.orderService = inject(OrderService);
+        this.renderer = inject(Renderer2);
+        this.needPay = true;
+        this.qrcElement = viewChild.required('qrcode');
+    }
+    ngOnInit() {
+        this.getOrder();
+    }
+    getOrder() {
+        this.orderService.get(this.id).subscribe({
+            next: (res) => {
+                this.order = res.data;
+                this.needPay = this.order.status.toString() === 'CREATED' || this.order.status.toString() === 'PARTIAL_PAID';
+                if (this.needPay) {
+                    this.getQRCodeUrl();
+                }
+            },
+        });
+    }
+    getQRCodeUrl() {
+        this.orderService.pay(this.id).subscribe({
+            next: (res) => {
+                this.genQRCode(res.data.qrCodeUrl);
+            },
+        });
+    }
+    genQRCode(url) {
+        const element = this.renderer.createElement('canvas');
+        this.toCanvas(element, url)
+            .then(() => {
+            this.renderElement(element);
+        })
+            .catch((e) => {
+            this.removeElementChildren();
+        });
+    }
+    toCanvas(canvas, url) {
+        return QRCode.toCanvas(canvas, url, {
+            errorCorrectionLevel: 'M',
+            width: 200,
+        });
+    }
+    renderElement(element) {
+        this.removeElementChildren();
+        this.renderer.appendChild(this.qrcElement().nativeElement, element);
+    }
+    removeElementChildren() {
+        for (const node of this.qrcElement().nativeElement.childNodes) {
+            this.renderer.removeChild(this.qrcElement().nativeElement, node);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderQrcodepayComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderQrcodepayComponent, isStandalone: true, selector: "rolatech-order-qrcodepay", viewQueries: [{ propertyName: "qrcElement", first: true, predicate: ["qrcode"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (order) {\n  <rolatech-container>\n    <rolatech-toolbar [title]=\"status[order.status]\" link=\"../\" large></rolatech-toolbar>\n    <div>\n      <div>\n        <a class=\"text-[--rt-brand-color]\" routerLink=\"..\"\n          ><span>\u8BA2\u5355: </span><span class=\"underline\">#{{ this.id }}</span></a\n        >\n        @if (order.status.toString() === 'CREATED') {\n          @if (order.deposit) {\n            <div>\u652F\u4ED8\u5B9A\u91D1: \u00A5{{ order.deposit | fixed }}</div>\n          } @else {\n            <div>\u652F\u4ED8\u91D1\u989D: \u00A5{{ order.total | fixed }}</div>\n          }\n        }\n        @if (order.status.toString() === 'PARTIAL_PAID') {\n          <div>\u652F\u4ED8\u5C3E\u6B3E \u00A5{{ order.total - order.deposit | fixed }}</div>\n        }\n      </div>\n      <div class=\"mt-6\">\n        @if (needPay) {\n          <div>\n            <div>\u8BF7\u4F7F\u7528\u5FAE\u4FE1\u626B\u7801\u652F\u4ED8, \u6211\u4EEC\u4F1A\u5728\u6536\u5230\u4ED8\u6B3E\u540E\u5904\u7406\u60A8\u7684\u8BA2\u5355</div>\n            <div class=\"w-52 h-56 flex flex-col justify-end items-center\">\n              <div #qrcode></div>\n              <span class=\"text-md\">\u5FAE\u4FE1\u652F\u4ED8\u4E8C\u7EF4\u7801</span>\n            </div>\n          </div>\n        } @else {\n          <div>\u8BF7\u786E\u8BA4\u5F53\u524D\u8BA2\u5355\u72B6\u6001, \u5982\u5DF2\u7ECF\u4ED8\u6B3E, \u8BF7\u8FD4\u56DE\u67E5\u770B</div>\n        }\n      </div>\n    </div>\n  </rolatech-container>\n}\n", styles: [""], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderQrcodepayComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-qrcodepay', imports: [RouterLink, ContainerComponent, ToolbarComponent, FixedPipe], template: "@if (order) {\n  <rolatech-container>\n    <rolatech-toolbar [title]=\"status[order.status]\" link=\"../\" large></rolatech-toolbar>\n    <div>\n      <div>\n        <a class=\"text-[--rt-brand-color]\" routerLink=\"..\"\n          ><span>\u8BA2\u5355: </span><span class=\"underline\">#{{ this.id }}</span></a\n        >\n        @if (order.status.toString() === 'CREATED') {\n          @if (order.deposit) {\n            <div>\u652F\u4ED8\u5B9A\u91D1: \u00A5{{ order.deposit | fixed }}</div>\n          } @else {\n            <div>\u652F\u4ED8\u91D1\u989D: \u00A5{{ order.total | fixed }}</div>\n          }\n        }\n        @if (order.status.toString() === 'PARTIAL_PAID') {\n          <div>\u652F\u4ED8\u5C3E\u6B3E \u00A5{{ order.total - order.deposit | fixed }}</div>\n        }\n      </div>\n      <div class=\"mt-6\">\n        @if (needPay) {\n          <div>\n            <div>\u8BF7\u4F7F\u7528\u5FAE\u4FE1\u626B\u7801\u652F\u4ED8, \u6211\u4EEC\u4F1A\u5728\u6536\u5230\u4ED8\u6B3E\u540E\u5904\u7406\u60A8\u7684\u8BA2\u5355</div>\n            <div class=\"w-52 h-56 flex flex-col justify-end items-center\">\n              <div #qrcode></div>\n              <span class=\"text-md\">\u5FAE\u4FE1\u652F\u4ED8\u4E8C\u7EF4\u7801</span>\n            </div>\n          </div>\n        } @else {\n          <div>\u8BF7\u786E\u8BA4\u5F53\u524D\u8BA2\u5355\u72B6\u6001, \u5982\u5DF2\u7ECF\u4ED8\u6B3E, \u8BF7\u8FD4\u56DE\u67E5\u770B</div>\n        }\n      </div>\n    </div>\n  </rolatech-container>\n}\n" }]
+        }] });
+
+class OrderTrackingComponent extends BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.orderService = inject(OrderService);
+        this.status = OrderStatus;
+    }
+    ngOnInit() {
+        this.get();
+    }
+    get() {
+        this.orderService.get(this.id).subscribe({
+            next: (res) => {
+                this.order = res.data;
+            },
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderTrackingComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: OrderTrackingComponent, isStandalone: true, selector: "rolatech-order-tracking", usesInheritance: true, ngImport: i0, template: "<rolatech-container>\n  <rolatech-toolbar title=\"\u8BA2\u5355\u8FFD\u8E2A\" large link=\"../\"></rolatech-toolbar>\n  <div>\n    <div class=\"font-bold text-lg\">#{{ order.orderNo }}</div>\n  </div>\n  <div>\n    <div class=\"text-lg py-3 font-medium\">\u7269\u6D41\u4FE1\u606F</div>\n  </div>\n</rolatech-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ContainerComponent, selector: "rolatech-container" }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderTrackingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-tracking', imports: [CommonModule, ContainerComponent, ToolbarComponent], template: "<rolatech-container>\n  <rolatech-toolbar title=\"\u8BA2\u5355\u8FFD\u8E2A\" large link=\"../\"></rolatech-toolbar>\n  <div>\n    <div class=\"font-bold text-lg\">#{{ order.orderNo }}</div>\n  </div>\n  <div>\n    <div class=\"text-lg py-3 font-medium\">\u7269\u6D41\u4FE1\u606F</div>\n  </div>\n</rolatech-container>\n" }]
+        }] });
+
+const orderRoutes = [
+    {
+        path: '',
+        component: OrderIndexComponent,
+    },
+    {
+        path: ':id',
+        component: OrderDetailComponent,
+    },
+    {
+        path: ':id/tracking',
+        component: OrderTrackingComponent,
+    },
+    {
+        path: ':id/qrcodepay',
+        component: OrderQrcodepayComponent,
+    },
+];
+
+class OrderManageItemComponent {
+    constructor() {
+        this.order = input.required();
+        this.thumbnail = input();
+        this.status = OrderStatus;
+        this.fulfillmentStatus = OrderFulfillmentStatus;
+        this.fulfill = output();
+    }
+    onFulfill() {
+        this.fulfill.emit();
+    }
+    archived() { }
+    delete() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderManageItemComponent, isStandalone: true, selector: "rolatech-order-manage-item", inputs: { order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: true, transformFunction: null }, thumbnail: { classPropertyName: "thumbnail", publicName: "thumbnail", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fulfill: "fulfill" }, ngImport: i0, template: "<div class=\"flex p-3 items-center hover:bg-[--rt-raised-background] cursor-pointer\">\n  <div>\n    @if (order().items) {\n      <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n        @defer (on viewport()) {\n          <rolatech-thumbnail [src]=\"order().items[0].media[0].url + '!w400'\" size=\"medium\"> </rolatech-thumbnail>\n        } @placeholder {\n          <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n        }\n      </div>\n    } @else {\n      <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n        <rolatech-image-placeholder></rolatech-image-placeholder>\n      </div>\n    }\n  </div>\n  <div class=\"px-3\">\n    {{ order().items[0].name }}\n  </div>\n  <div class=\"flex-1\"></div>\n  <div class=\"px-3 min-w-28 w-28\">\n    {{ status[order().status] }}\n  </div>\n  <div class=\"px-3 min-w-28 w-28\">\n    {{ fulfillmentStatus[order().fulfillmentStatus] }}\n  </div>\n  <div class=\"px-3 min-w-28 w-28\">\u00A5{{ order().total | fixed }}</div>\n  <div class=\"pr-4\">\n    <button\n      mat-icon-button\n      [matMenuTriggerFor]=\"menu\"\n      aria-label=\"Example icon-button with a menu\"\n      (click)=\"$event.stopPropagation()\"\n    >\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n      @if (order().fulfillmentStatus === 'UNFULFILLED') {\n        <button mat-menu-item (click)=\"onFulfill()\">\n          <span> \u53D1\u8D27 </span>\n        </button>\n      }\n      @if (order().fulfillmentStatus === 'STARTED') {\n        <button mat-menu-item (click)=\"archived()\">\n          <span> \u7ED3\u675F </span>\n        </button>\n      }\n      @if (order().fulfillmentStatus !== 'ACTIVE') {\n        <button mat-menu-item (click)=\"delete()\">\n          <span> \u5220\u9664 </span>\n        </button>\n      }\n    </mat-menu>\n  </div>\n</div>\n<div class=\"h-[1px] px-3 bg-[--rt-raised-background]\"></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImagePlaceholderComponent, selector: "rolatech-image-placeholder" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: FixedPipe, name: "fixed" }], deferBlockDependencies: [() => [ThumbnailComponent]] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-manage-item', imports: [CommonModule, ThumbnailComponent, ImagePlaceholderComponent, MatButtonModule, MatMenuModule, MatIcon, FixedPipe], template: "<div class=\"flex p-3 items-center hover:bg-[--rt-raised-background] cursor-pointer\">\n  <div>\n    @if (order().items) {\n      <div class=\"min-w-16 w-24 object-cover aspect-video rounded-md mr-3\">\n        @defer (on viewport()) {\n          <rolatech-thumbnail [src]=\"order().items[0].media[0].url + '!w400'\" size=\"medium\"> </rolatech-thumbnail>\n        } @placeholder {\n          <div class=\"bg-[--rt-raised-background] h-full w-full object-cover aspect-video rounded-lg\"></div>\n        }\n      </div>\n    } @else {\n      <div class=\"min-w-24 w-36 object-cover aspect-video rounded-lg mr-3\">\n        <rolatech-image-placeholder></rolatech-image-placeholder>\n      </div>\n    }\n  </div>\n  <div class=\"px-3\">\n    {{ order().items[0].name }}\n  </div>\n  <div class=\"flex-1\"></div>\n  <div class=\"px-3 min-w-28 w-28\">\n    {{ status[order().status] }}\n  </div>\n  <div class=\"px-3 min-w-28 w-28\">\n    {{ fulfillmentStatus[order().fulfillmentStatus] }}\n  </div>\n  <div class=\"px-3 min-w-28 w-28\">\u00A5{{ order().total | fixed }}</div>\n  <div class=\"pr-4\">\n    <button\n      mat-icon-button\n      [matMenuTriggerFor]=\"menu\"\n      aria-label=\"Example icon-button with a menu\"\n      (click)=\"$event.stopPropagation()\"\n    >\n      <mat-icon>more_vert</mat-icon>\n    </button>\n    <mat-menu #menu=\"matMenu\" xPosition=\"before\">\n      @if (order().fulfillmentStatus === 'UNFULFILLED') {\n        <button mat-menu-item (click)=\"onFulfill()\">\n          <span> \u53D1\u8D27 </span>\n        </button>\n      }\n      @if (order().fulfillmentStatus === 'STARTED') {\n        <button mat-menu-item (click)=\"archived()\">\n          <span> \u7ED3\u675F </span>\n        </button>\n      }\n      @if (order().fulfillmentStatus !== 'ACTIVE') {\n        <button mat-menu-item (click)=\"delete()\">\n          <span> \u5220\u9664 </span>\n        </button>\n      }\n    </mat-menu>\n  </div>\n</div>\n<div class=\"h-[1px] px-3 bg-[--rt-raised-background]\"></div>\n" }]
+        }] });
+
+class OrderManageIndexComponent {
+    constructor() {
+        this.orderService = inject(OrderService);
+        this.length = 100;
+        this.pageSize = 15;
+        this.pageSizeOptions = [5, 10, 25, 100];
+        this.orders = [];
+        this.orderOptions = [
+            {
+                key: 'createdAt',
+                value: '创建时间',
+                icon: 'arrow_upward',
+                sort: 'asc',
+            },
+            {
+                key: 'createdAt',
+                value: '创建时间',
+                icon: 'arrow_downward',
+                sort: 'desc',
+            },
+            {
+                key: 'status',
+                value: '状态',
+                icon: 'arrow_upward',
+                sort: 'asc',
+            },
+            {
+                key: 'status',
+                value: '状态',
+                icon: 'arrow_downward',
+                sort: 'desc',
+            },
+        ];
+        this.orderString = 'createdAt desc';
+        this.select = 0;
+        this.links = [
+            {
+                name: '全部',
+                icon: 'dashboard',
+            },
+            {
+                name: '待付款',
+                icon: 'category',
+                status: 'created',
+            },
+            {
+                name: '已支付',
+                icon: 'category',
+                status: 'paid',
+            },
+            {
+                name: '已退款',
+                icon: 'category',
+                status: 'refunded',
+            },
+            {
+                name: '已取消',
+                icon: 'category',
+                status: 'canceled',
+            },
+        ];
+    }
+    ngOnInit() {
+        this.find();
+    }
+    find(event) {
+        const page = event ? event.pageIndex + 1 : 1;
+        const limit = event ? event.pageSize : 15;
+        const sort = this.orderString;
+        const options = {
+            page,
+            limit,
+            sort,
+        };
+        this.orderService.merchant(options).subscribe({
+            next: (res) => {
+                this.orders = res.data;
+                this.length = res.meta.pagination.count;
+            },
+        });
+    }
+    onFulfill(orderId) { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageIndexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderManageIndexComponent, isStandalone: true, selector: "rolatech-order-manage-index", ngImport: i0, template: "<rolatech-toolbar title=\"\u8BA2\u5355\u7BA1\u7406\">\n  <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n  @for (item of links; track item) {\n    @if (item.status) {\n      <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n    } @else {\n      <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n    }\n  }\n</rolatech-tabs>\n<div>\n  @for (item of orders; track $index) {\n    <rolatech-order-manage-item\n      [order]=\"item\"\n      routerLink=\"./{{ item.id }}\"\n      (fulfill)=\"onFulfill(item.id)\"\n    ></rolatech-order-manage-item>\n  }\n</div>\n<mat-paginator\n  #paginator\n  [length]=\"length\"\n  [pageSize]=\"pageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  (page)=\"pageEvent = find($event)\"\n  hidePageSize\n  showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: TabsComponent, selector: "rolatech-tabs", inputs: ["select", "loading"], outputs: ["selectChange"] }, { kind: "component", type: TabComponent, selector: "rolatech-tab", inputs: ["label"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: OrderManageItemComponent, selector: "rolatech-order-manage-item", inputs: ["order", "thumbnail"], outputs: ["fulfill"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageIndexComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-manage-index', imports: [
+                        CommonModule,
+                        RouterLink,
+                        ToolbarComponent,
+                        TabsComponent,
+                        TabComponent,
+                        MatPaginatorModule,
+                        OrderManageItemComponent,
+                    ], template: "<rolatech-toolbar title=\"\u8BA2\u5355\u7BA1\u7406\">\n  <div class=\"flex items-center gap-2\"></div>\n</rolatech-toolbar>\n<rolatech-tabs [select]=\"select\">\n  @for (item of links; track item) {\n    @if (item.status) {\n      <rolatech-tab [label]=\"item.name\" routerLink=\"./\" [queryParams]=\"{ status: item.status }\"></rolatech-tab>\n    } @else {\n      <rolatech-tab [label]=\"item.name\" routerLink=\"./\"></rolatech-tab>\n    }\n  }\n</rolatech-tabs>\n<div>\n  @for (item of orders; track $index) {\n    <rolatech-order-manage-item\n      [order]=\"item\"\n      routerLink=\"./{{ item.id }}\"\n      (fulfill)=\"onFulfill(item.id)\"\n    ></rolatech-order-manage-item>\n  }\n</div>\n<mat-paginator\n  #paginator\n  [length]=\"length\"\n  [pageSize]=\"pageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  (page)=\"pageEvent = find($event)\"\n  hidePageSize\n  showFirstLastButtons\n>\n</mat-paginator>\n", styles: ["mat-form-field{width:100%}table{width:100%}td.mat-column-actions{text-align:right;max-width:64px;font-size:.8rem;padding:0 8px}.mat-mdc-header-cell.actions{text-align:right;max-width:64px;width:64px}.mat-mdc-cell:nth-last-child(2),.mat-mdc-header-cell:nth-last-child(2),.mat-mdc-footer-cell:nth-last-child(2){text-align:right;max-width:180px;width:180px}mat-cell:last-of-type,mat-header-cell:last-of-type,mat-footer-cell:last-of-type{text-align:right;padding-right:8px!important}\n"] }]
+        }] });
+
+class OrderManageFulfillmentComponent extends BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.fulfillmentService = inject(FulfillmentService);
+        this.orderService = inject(OrderService);
+        this.order = {};
+        this.fulfillments = {};
+    }
+    ngOnInit() {
+        this.findOrder();
+    }
+    findOrder() {
+        this.orderService.get(this.id).subscribe({
+            next: (res) => {
+                this.order = res.data;
+            },
+        });
+    }
+    fulfill() {
+        this.fulfillments['orderId'] = this.id;
+        this.fulfillmentService.fulfill(this.id, this.fulfillments).subscribe({
+            next: (res) => {
+                console.log(res);
+            },
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageFulfillmentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: OrderManageFulfillmentComponent, isStandalone: true, selector: "rolatech-order-manage-fulfillment", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar large link=\"../\" title=\"\u53D1\u8D27\"> </rolatech-toolbar>\n<div class=\"flex flex-col w-full md:w-1/3\">\n  <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u5355\u53F7</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments.trackingNumber\" />\n  </mat-form-field>\n  <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u516C\u53F8</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments.carrierId\" />\n  </mat-form-field>\n</div>\n<button mat-flat-button (click)=\"fulfill()\">\n  <mat-icon>local_shipping</mat-icon>\n  <span>\u53D1\u8D27</span>\n</button>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: TextFieldModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageFulfillmentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-manage-fulfillment', imports: [
+                        CommonModule,
+                        ToolbarComponent,
+                        MatButtonModule,
+                        MatIcon,
+                        FormsModule,
+                        MatFormFieldModule,
+                        MatInputModule,
+                        TextFieldModule,
+                    ], template: "<rolatech-toolbar large link=\"../\" title=\"\u53D1\u8D27\"> </rolatech-toolbar>\n<div class=\"flex flex-col w-full md:w-1/3\">\n  <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u5355\u53F7</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments.trackingNumber\" />\n  </mat-form-field>\n  <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u516C\u53F8</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments.carrierId\" />\n  </mat-form-field>\n</div>\n<button mat-flat-button (click)=\"fulfill()\">\n  <mat-icon>local_shipping</mat-icon>\n  <span>\u53D1\u8D27</span>\n</button>\n" }]
+        }] });
+
+class OrderVariantItemComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderVariantItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: OrderVariantItemComponent, isStandalone: true, selector: "rolatech-order-variant-item", ngImport: i0, template: "<p>order-variant-item works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderVariantItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-variant-item', imports: [CommonModule], template: "<p>order-variant-item works!</p>\n" }]
+        }] });
+
+class OrderFulfillComponent {
+    constructor() {
+        this.formBuilder = inject(FormBuilder);
+        this.fulfillments = model();
+        this.output = output();
+    }
+    ngOnInit() {
+        this.fulfillmentForm = this.formBuilder.group({
+            trackingNumber: [null, Validators.required],
+            carrierId: [null, Validators.required],
+        });
+    }
+    ngDoCheck() {
+        this.output.emit(this.fulfillmentForm.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderFulfillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.0.3", type: OrderFulfillComponent, isStandalone: true, selector: "rolatech-order-fulfill", inputs: { fulfillments: { classPropertyName: "fulfillments", publicName: "fulfillments", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fulfillments: "fulfillmentsChange", output: "output" }, ngImport: i0, template: "<div class=\"flex flex-col w-full\">\n  <!-- <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u5355\u53F7</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments().trackingNumber\" />\n  </mat-form-field>\n  <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u516C\u53F8</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments().carrierId\" />\n  </mat-form-field> -->\n  <form [formGroup]=\"fulfillmentForm\">\n    <mat-form-field appearance=\"fill\">\n      <mat-label> \u7269\u6D41\u5355\u53F7 </mat-label>\n      <input matInput formControlName=\"trackingNumber\" required />\n    </mat-form-field>\n    <mat-form-field appearance=\"fill\">\n      <mat-label> \u7269\u6D41\u516C\u53F8 </mat-label>\n      <input matInput formControlName=\"carrierId\" required />\n    </mat-form-field>\n  </form>\n</div>\n", styles: ["mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderFulfillComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-fulfill', imports: [CommonModule, MatFormFieldModule, MatInputModule, FormsModule, ReactiveFormsModule], template: "<div class=\"flex flex-col w-full\">\n  <!-- <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u5355\u53F7</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments().trackingNumber\" />\n  </mat-form-field>\n  <mat-form-field appearance=\"fill\">\n    <mat-label>\u7269\u6D41\u516C\u53F8</mat-label>\n    <input matInput type=\"text\" [(ngModel)]=\"fulfillments().carrierId\" />\n  </mat-form-field> -->\n  <form [formGroup]=\"fulfillmentForm\">\n    <mat-form-field appearance=\"fill\">\n      <mat-label> \u7269\u6D41\u5355\u53F7 </mat-label>\n      <input matInput formControlName=\"trackingNumber\" required />\n    </mat-form-field>\n    <mat-form-field appearance=\"fill\">\n      <mat-label> \u7269\u6D41\u516C\u53F8 </mat-label>\n      <input matInput formControlName=\"carrierId\" required />\n    </mat-form-field>\n  </form>\n</div>\n", styles: ["mat-form-field{width:100%}\n"] }]
+        }] });
+
+class OrderManageDetailComponent extends BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.status = OrderStatus;
+        this.type = CourseType;
+        this.orderType = OrderType;
+        this.orderService = inject(OrderService);
+        this.courseService = inject(CourseService);
+        this.productService = inject(ProductService);
+        this.fulfillmentService = inject(FulfillmentService);
+        this.navigationService = inject(NavigationService);
+        this.info = false;
+        this.loadingTimeline = false;
+        this.timelineStatus = OrderTimelineStatus;
+        this.countDown = '';
+    }
+    ngOnInit() {
+        this.get();
+    }
+    get() {
+        this.orderService.get(this.id).subscribe({
+            next: (res) => {
+                this.order = res.data;
+                if (this.order.status === 'CREATED') {
+                    setInterval(() => {
+                        const start = moment();
+                        const end = moment(this.order.createdAt).add(15, 'minute');
+                        const diff = end.diff(start);
+                        const duration = moment.duration(diff);
+                        this.countDown = moment.utc(duration.as('milliseconds')).format('mm:ss');
+                    }, 1000);
+                }
+            },
+        });
+    }
+    refund() {
+        const options = {
+            width: '500px',
+            title: '申请退款',
+            height: '90%',
+            cancelText: '取消',
+            confirmText: '确认',
+            component: OrderReturnRequestComponent,
+            data: {
+                reason: '',
+            },
+        };
+        this.dialogService.open(options);
+        this.dialogService.confirmed().subscribe((res) => {
+            if (res) {
+                this.orderService.refund(this.id, { reason: res }).subscribe({
+                    next: (res) => {
+                        this.snackBarService.open('退款申请成功, 等待审核');
+                    },
+                    error: (error) => {
+                        this.snackBarService.open(error.message);
+                    },
+                });
+            }
+        });
+    }
+    cancel() {
+        this.orderService.cancel(this.id).subscribe({
+            next: (res) => {
+                this.order.status = 'CANCELED';
+                this.snackBarService.open('取消成功');
+            },
+            error: (error) => {
+                this.snackBarService.open(error.message);
+            },
+        });
+    }
+    pay() {
+        this.router.navigateByUrl(`/orders/${this.id}/qrcodepay`);
+    }
+    timeline() {
+        this.info = true;
+        this.loadingTimeline = true;
+        this.orderService.timeline(this.id).subscribe({
+            next: (res) => {
+                this.timelineData = res.data;
+                this.loadingTimeline = false;
+            },
+            error: (error) => {
+                this.loadingTimeline = false;
+            },
+        });
+    }
+    fulfill() {
+        const options = {
+            title: '发货',
+            cancelText: '取消',
+            confirmText: '确认',
+            component: OrderFulfillComponent,
+            data: {},
+        };
+        this.dialogService.open(options);
+        this.dialogService.confirmed().subscribe({
+            next: (result) => {
+                if (result) {
+                    this.fulfillmentService.fulfill(this.id, result).subscribe({
+                        next: (res) => {
+                            this.snackBarService.open('发货成功');
+                        },
+                        error: (error) => {
+                            this.snackBarService.open(error.message);
+                        },
+                    });
+                }
+            },
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageDetailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.3", type: OrderManageDetailComponent, isStandalone: true, selector: "rolatech-order-manage-detail", usesInheritance: true, ngImport: i0, template: "<rolatech-toolbar [title]=\"status[order.status]\" large link=\"../\">\n  <button mat-button (click)=\"fulfill()\">\n    <mat-icon>local_shipping</mat-icon>\n    <span>\u53D1\u8D27</span>\n  </button>\n  <button mat-button (click)=\"timeline()\">\n    <mat-icon>history</mat-icon>\n    <span>\u8BA2\u5355\u72B6\u6001</span>\n  </button>\n</rolatech-toolbar>\n@if (info) {\n  <div\n    [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n    class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n  >\n    <div class=\"flex justify-between items-center sm:p-4\">\n      <div class=\"text-xl font-bold\">\u8BA2\u5355\u72B6\u6001</div>\n      <button mat-icon-button (click)=\"info = !info\">\n        <mat-icon>close</mat-icon>\n      </button>\n    </div>\n    @if (loadingTimeline) {\n      <div>\n        <rolatech-spinner></rolatech-spinner>\n      </div>\n    } @else {\n      <div class=\"mt-3 p-1 sm:p-4\">\n        <ol class=\"relative border-l border-[--rt-border-color]\">\n          @for (item of timelineData; track item) {\n            <li class=\"mb-8 ml-4\">\n              <div\n                class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 border border-[--rt-raised-background] bg-[--rt-text-primary]\"\n              ></div>\n              <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n              @if (item.status === 'BOOKING_RETURN_REJECTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n              }\n              @if (item.status === 'BOOKING_RETURN_REQUESTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n              }\n              <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n            </li>\n          }\n        </ol>\n      </div>\n    }\n  </div>\n}\n\n<div\n  (click)=\"info = !info\"\n  [ngClass]=\"info ? 'visible' : 'invisible'\"\n  class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n\n<div class=\"flex flex-col gap-3 p-3 justify-between\">\n  <div class=\"\">\n    <div class=\"text-lg py-2 font-medium\">\u8BA2\u5355\u4FE1\u606F</div>\n    <div>\n      <div>\n        @for (item of order.items; track $index) {\n          <rolatech-order-detail-item\n            [thumbnail]=\"item.media[0].url + '!w200 '\"\n            [link]=\"order.type.toString() === 'PRODUCT' ? '/products/' + item.productId : '/courses/' + item.productId\"\n            [title]=\"item.name\"\n            [total]=\"item.total\"\n            [description]=\"item.options | orderItemoptions: order.type\"\n            [quantity]=\"item.quantity\"\n          ></rolatech-order-detail-item>\n        }\n      </div>\n      <div class=\"mt-3\">\n        <div class=\"flex items-center justify-between py-1\">\n          <span class=\"font-medium\">\u8BA2\u5355\u53F7</span>\n          <span class=\"text-sm\"> {{ order.orderNo }}</span>\n        </div>\n        <div class=\"flex items-center justify-between py-1\">\n          <span class=\"font-medium\">\u4E0B\u5355\u65F6\u95F4</span>\n          <span class=\"text-sm\"> {{ order.createdAt }}</span>\n        </div>\n\n        @if (order.deposit) {\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u5B9A\u91D1\u91D1\u989D</span>\n            <span class=\"text-sm\">\u00A5{{ order.deposit | fixed }}</span>\n          </div>\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u5C3E\u6B3E\u91D1\u989D</span>\n            <span class=\"text-sm\">\u00A5{{ order.total - order.deposit | fixed }}</span>\n          </div>\n        }\n        <div class=\"flex items-center justify-between py-1\">\n          <span class=\"font-medium\">\u91D1\u989D</span>\n          <span class=\"text-sm\">\u00A5{{ order.total | fixed }}</span>\n        </div>\n      </div>\n      @if (order.status.toString() === 'CREATED' || order.status.toString() === 'PAID') {\n        <div class=\"mt-6\">\n          <div class=\"text-lg pb-3 font-medium\">\u652F\u4ED8\u65B9\u5F0F</div>\n          <div class=\"flex items-center\">\n            <svg\n              class=\"svg-icon\"\n              style=\"width: 2rem; height: 2rem\"\n              viewBox=\"0 0 1024 1024\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n                fill=\"#09BB07\"\n              />\n            </svg>\n            <span class=\"ml-1\">\u5FAE\u4FE1\u652F\u4ED8</span>\n            <!-- <svg id=\"Layer_1\" data-name=\"Layer 1\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 715.94 211.02\">\n                <title>WeChat Pay logo - Brandlogos.net</title>\n                <g id=\"\u9875\u9762-1\">\n                  <g id=\"\u753B\u677F\">\n                    <g id=\"\u7F16\u7EC4\">\n                      <path\n                        id=\"\u5F62\u72B6\u7ED3\u5408\"\n                        d=\"M710.2,429.86l8.93,24.1c.93,2.7,1.94,5.9,2.61,8.34h.17c.76-2.44,1.6-5.56,2.61-8.51l8.09-23.93h7.84l-11.13,29.08c-5.31,14-8.93,21.16-14,25.54a21.48,21.48,0,0,1-7.57,4.41c-.61-1.09-3.39-5.85-3.39-5.85a19.62,19.62,0,0,0,6.49-3.62,22.5,22.5,0,0,0,6.24-8.26,5.31,5.31,0,0,0,.59-1.77,6.45,6.45,0,0,0-.51-1.94l-15.09-37.59Zm-170.81-.93c12.47,0,15.51,8.51,15.51,16.69v15.26a57.4,57.4,0,0,0,.67,9.78h-6.74l-.59-5.14H548a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.76-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.61,20.61,0,0,0-9.77,2.52L526,432.56A25.3,25.3,0,0,1,539.39,428.94Zm138.79,0c12.47,0,15.51,8.51,15.51,16.69v15.26a57.41,57.41,0,0,0,.67,9.78h-6.74l-.59-5.14h-.25a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.77-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.6,20.6,0,0,0-9.77,2.52l-2.53-4.38A25.3,25.3,0,0,1,678.18,428.94Zm-226.09-16c7.08,0,11.55,1.52,13.48,2.53,0,0-2.24,3.9-3.16,5.38a28,28,0,0,0-10.07-1.75c-13.32,0-22.17,8.51-22.17,23.43,0,13.91,8,22.84,21.83,22.84a31.51,31.51,0,0,0,10.48-1.73c.67,1.17,3,5.19,3,5.19-2.7,1.35-8.09,2.7-15,2.7-16,0-28.07-10.11-28.07-28.74C422.42,425,434.47,412.92,452.09,412.92Zm-55.11,16c13.32,0,16.86,11.72,16.86,19.22a28,28,0,0,1-.25,3.46H384.93c.17,10,6.57,14.16,14,14.16a27.78,27.78,0,0,0,9.78-1.51c.68,1.12,2.78,4.71,2.78,4.71a33,33,0,0,1-13.57,2.53c-12.56,0-20.06-8.26-20.06-20.57S385.09,428.94,397,428.94Zm181-10.79v11.72H588.6v5.65H578v22c0,5.06,1.43,7.92,5.56,7.92.61,0,1.16,0,1.67-.07.87,1.47,3,5.12,3,5.12a18.19,18.19,0,0,1-6.57,1c-3.46,0-6.24-1.1-8-3.12-2.11-2.19-2.87-5.81-2.87-10.62V435.51h-6.32v-5.65h6.32V418.15Zm56.21-4.72c7.25,0,12.56,1.69,15.93,4.72,3.12,2.7,5,6.83,5,11.88s-1.52,9.19-4.38,12.14c-3.88,4.13-10.2,6.24-17.36,6.24a25.3,25.3,0,0,1-5.9-.51v22.76h-7.33V414.52A85.05,85.05,0,0,1,634.19,413.43Zm-321.57.42,6.74,28.74c1.69,7.08,3.2,14.16,4.21,19.64h.17c.93-5.65,2.7-12.39,4.64-19.72L336,413.85h7.67l6.91,28.82c1.6,6.74,3.12,13.48,4,19.47h.17c1.18-6.24,2.78-12.56,4.55-19.64l7.5-28.66h7.5l-16.1,56.81h-7.67l-7.16-29.58a171.14,171.14,0,0,1-3.71-18.54h-.17A177.33,177.33,0,0,1,335,441.07L327,470.65h-7.67l-14.41-56.81Zm171.74-3v25.45h.17a13.77,13.77,0,0,1,5.31-5.23,15.27,15.27,0,0,1,7.59-2.11c5.48,0,14.24,3.37,14.24,17.45v24.27h-7.42V447.23c0-6.57-2.44-12.14-9.44-12.14a10.65,10.65,0,0,0-9.95,7.42,9,9,0,0,0-.51,3.54v24.61h-7.42V410.82ZM530.45,459c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C539.64,449.67,530.45,451.1,530.45,459Zm138.79,0c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C678.43,449.67,669.24,451.1,669.24,459ZM396.39,434.25c-7.5,0-10.79,6.91-11.38,12.05h21.66C406.75,441.58,404.73,434.25,396.39,434.25Zm238-15a30.8,30.8,0,0,0-6.91.59v22.08a24.65,24.65,0,0,0,6.07.59c8.85,0,14.24-4.3,14.24-12.14C647.76,422.87,642.45,419.24,634.36,419.24ZM584.45,291.18V306.1h44.14v7.75H584.45v16.2h35.63s-4.57,23.28-31.27,42.88c10.8,5.69,25,9.72,42.38,12.44,0,0-2.81,5-5.21,8.85-19-3.3-33.81-9.08-45.43-15.86-11.71,6.95-26.85,13-46.43,16.4-1.36-2-5.08-8.6-5.08-8.6,17.75-2.78,32.36-7.27,43.28-13.13-26.84-19.25-32-43-32-43h35.53v-16.2H530V306.1h45.85V291.18ZM323,319.7l6.88,3.65c-3.27,7.77-6.31,13.06-7.15,14.72v56.38H315V350.25c-4.44,6-7,9.07-8.34,10.54l-4.37-7.57C310.57,344.43,317.91,332.36,323,319.7Zm341.11-28.21,9,2-.28.74c-3.66,9.57-7.09,17.72-10.19,24.22v76H654V334.82a161.16,161.16,0,0,1-10.27,14.75L639,341.25c10.14-13.8,18.67-30.56,24.88-49.18Zm-226.36,0,8.15,2s-5.19,16.35-9.16,25l0,76h-8.61V335.12c-3.45,6.5-5.76,10.77-8.68,14.59l-4.66-8.07C426.86,326.4,437.72,291.47,437.72,291.47Zm-54.81-.41,7.75,1.55-.18.7c-1.6,6.13-3.37,12.15-5.26,17.91h23.19v7.33h-5.59c-1.44,20.81-5.13,36.93-10.95,47.93,4.62,9,13.52,17.42,16,19.7-.56,1.07-4.44,7.71-4.44,7.71s-12.89-13.2-15.81-19.59c-3.28,5.51-9.33,12.65-17.53,20h0L366,387s11.22-9.31,17.58-20.55a125.69,125.69,0,0,1-7.81-32.27c-1.36,2.39-2.1,3.68-3.47,5.73,0,0-3.62-6.29-4.36-7.47,6.51-11.45,11.39-24.94,14.87-40.71h0Zm344.12.88v24.4H742v8.18H727v53.12A15.35,15.35,0,0,1,711.7,393h-10v-9h10a6.39,6.39,0,0,0,6.38-6.38V324.52H670.25v-8.18h47.82v-24.4Zm-214.4,64.91v35.69H452V356.85Zm-149-4.26v19.71c1.45-1.23,5.89-5.13,7.38-6.46l3.57,6.18-16.36,13.81s-3.46-6-4.16-7.11c1-1.07,2.25-3.28,2.25-7.5V359.91H341.47c0,16.86-.68,23-11.92,31.75,0,0-2.71-4.78-3.92-6.78,9.66-7.63,8.51-18.06,8.51-32.29Zm140.81,12H460.61v20.61h43.84ZM608,337.7H552.6c3.17,6.6,11,19.34,28,30.42C597.44,356.87,605.06,344,608,337.7Zm79.67-.53L703.31,362l-8.15,4.45-14.64-25ZM395.5,318.55H382.74c-.13.52-1.33,3.54-1.6,4.13,1.59,15.26,3.94,27,7,34.81,3.79-9.1,6.27-22.18,7.36-38.94Zm118,21.24v7.33H451.15v-7.33Zm-146-3.84v7.33h-35V336Zm146-13.22v7.33H451.15v-7.33ZM354.26,292.89v26.87h7.92V300.56h6.9v26.09H331.7V301H339v18.76h7.91V292.89Zm-30.89-1.78,6.76,4.43a101.69,101.69,0,0,1-22.45,30.55L303.6,319C311,311.86,318,301.79,323.38,291.1Zm158.9.37,6.08,13.78h31.1V313H445.61v-7.75h34.12L475.3,294.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #4d4d4d\"\n                      />\n                      <path\n                        id=\"Fill-29\"\n                        d=\"M113,412a8,8,0,0,1-10.54-3.22l-.52-1.14L80.18,359.84a4.16,4.16,0,0,1-.38-1.68A4,4,0,0,1,86.17,355l25.69,18.29a11.86,11.86,0,0,0,10.62,1.22L243.29,320.7c-21.66-25.52-57.32-42.2-97.68-42.2-66,0-119.58,44.62-119.58,99.66,0,30,16.11,57.06,41.32,75.33A8,8,0,0,1,70.69,460a9.43,9.43,0,0,1-.42,2.54l-5.39,20.1a11.73,11.73,0,0,0-.64,2.91,4,4,0,0,0,4,4,4.5,4.5,0,0,0,2.3-.74l26.18-15.11a12.55,12.55,0,0,1,6.35-1.84,12,12,0,0,1,3.51.53,141.5,141.5,0,0,0,39,5.46c66,0,119.59-44.62,119.59-99.66A86.29,86.29,0,0,0,251.58,332l-137.69,79.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #1aad19\"\n                      />\n                    </g>\n                  </g>\n                </g>\n              </svg> -->\n          </div>\n        </div>\n      }\n    </div>\n    <!-- safe area -->\n    <div class=\"\">\n      @if (order.status.toString() === 'PAID') {\n        <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"refund()\">\u7533\u8BF7\u9000\u6B3E</button>\n      }\n      <div class=\"flex items-center justify-end\">\n        @if (order.status.toString() === 'CREATED') {\n          <span\n            class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n            (click)=\"cancel()\"\n            >\u53D6\u6D88\u8BA2\u5355</span\n          >\n        }\n        @if (order.status.toString() === 'CREATED') {\n          @if (order.deposit) {\n            <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5B9A\u91D1</button>\n          } @else {\n            <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u8BA2\u5355</button>\n          }\n        }\n        @if (order.status.toString() === 'PARTIAL_PAID') {\n          <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5C3E\u6B3E</button>\n        }\n      </div>\n    </div>\n  </div>\n  <div class=\"\">\n    <div class=\"text-lg py-2 font-medium\">\u914D\u9001\u4FE1\u606F</div>\n    <div class=\"flex items-baseline justify-between py-1\">\n      <span class=\"font-medium min-w-20\">\u6536\u8D27\u5730\u5740</span>\n      <span class=\"text-sm\">{{ order.shippingAddress | shippingAddress }}</span>\n    </div>\n    <div class=\"flex items-baseline justify-between py-1\">\n      <span class=\"font-medium min-w-20\">\u5907\u6CE8\u4FE1\u606F</span>\n      <span class=\"text-sm\">{{ order.note || '\u65E0' }}</span>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i1$1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SpinnerComponent, selector: "rolatech-spinner", inputs: ["title"] }, { kind: "component", type: ToolbarComponent, selector: "rolatech-toolbar", inputs: ["title", "subtitle", "back", "link", "large", "divider"] }, { kind: "component", type: OrderDetailItemComponent, selector: "rolatech-order-detail-item", inputs: ["thumbnail", "title", "description", "quantity", "total", "link"] }, { kind: "pipe", type: OrderItemOptionsFormatPipe, name: "orderItemoptions" }, { kind: "pipe", type: FixedPipe, name: "fixed" }, { kind: "pipe", type: ShippingAddressPipe, name: "shippingAddress" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageDetailComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-manage-detail', imports: [
+                        MatButtonModule,
+                        MatIconModule,
+                        NgClass,
+                        SpinnerComponent,
+                        ToolbarComponent,
+                        OrderDetailItemComponent,
+                        OrderItemOptionsFormatPipe,
+                        FixedPipe,
+                        ShippingAddressPipe,
+                    ], template: "<rolatech-toolbar [title]=\"status[order.status]\" large link=\"../\">\n  <button mat-button (click)=\"fulfill()\">\n    <mat-icon>local_shipping</mat-icon>\n    <span>\u53D1\u8D27</span>\n  </button>\n  <button mat-button (click)=\"timeline()\">\n    <mat-icon>history</mat-icon>\n    <span>\u8BA2\u5355\u72B6\u6001</span>\n  </button>\n</rolatech-toolbar>\n@if (info) {\n  <div\n    [ngClass]=\"loadingTimeline ? 'translate-x-full' : 'translate-none'\"\n    class=\"fixed top-0 right-0 z-[1001] h-screen p-4 overflow-y-auto transition-transform bg-[--rt-raised-background] w-80 sm:w-[300px] shadow-xl\"\n  >\n    <div class=\"flex justify-between items-center sm:p-4\">\n      <div class=\"text-xl font-bold\">\u8BA2\u5355\u72B6\u6001</div>\n      <button mat-icon-button (click)=\"info = !info\">\n        <mat-icon>close</mat-icon>\n      </button>\n    </div>\n    @if (loadingTimeline) {\n      <div>\n        <rolatech-spinner></rolatech-spinner>\n      </div>\n    } @else {\n      <div class=\"mt-3 p-1 sm:p-4\">\n        <ol class=\"relative border-l border-[--rt-border-color]\">\n          @for (item of timelineData; track item) {\n            <li class=\"mb-8 ml-4\">\n              <div\n                class=\"absolute w-3 h-3 rounded-full mt-1.5 -left-1.5 border border-[--rt-raised-background] bg-[--rt-text-primary]\"\n              ></div>\n              <div class=\"text-md font-bold mb-1\">{{ timelineStatus[item.status] }}</div>\n              @if (item.status === 'BOOKING_RETURN_REJECTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.note }}</div>\n              }\n              @if (item.status === 'BOOKING_RETURN_REQUESTED') {\n                <div class=\"text-sm mb-1\">{{ item.return.reason }}</div>\n              }\n              <div class=\"text-sm text-[--rt-text-secondary]\">{{ item.date }}</div>\n            </li>\n          }\n        </ol>\n      </div>\n    }\n  </div>\n}\n\n<div\n  (click)=\"info = !info\"\n  [ngClass]=\"info ? 'visible' : 'invisible'\"\n  class=\"bg-[--rt-10-percent-layer] fixed inset-0 z-[1000]\"\n></div>\n\n<div class=\"flex flex-col gap-3 p-3 justify-between\">\n  <div class=\"\">\n    <div class=\"text-lg py-2 font-medium\">\u8BA2\u5355\u4FE1\u606F</div>\n    <div>\n      <div>\n        @for (item of order.items; track $index) {\n          <rolatech-order-detail-item\n            [thumbnail]=\"item.media[0].url + '!w200 '\"\n            [link]=\"order.type.toString() === 'PRODUCT' ? '/products/' + item.productId : '/courses/' + item.productId\"\n            [title]=\"item.name\"\n            [total]=\"item.total\"\n            [description]=\"item.options | orderItemoptions: order.type\"\n            [quantity]=\"item.quantity\"\n          ></rolatech-order-detail-item>\n        }\n      </div>\n      <div class=\"mt-3\">\n        <div class=\"flex items-center justify-between py-1\">\n          <span class=\"font-medium\">\u8BA2\u5355\u53F7</span>\n          <span class=\"text-sm\"> {{ order.orderNo }}</span>\n        </div>\n        <div class=\"flex items-center justify-between py-1\">\n          <span class=\"font-medium\">\u4E0B\u5355\u65F6\u95F4</span>\n          <span class=\"text-sm\"> {{ order.createdAt }}</span>\n        </div>\n\n        @if (order.deposit) {\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u5B9A\u91D1\u91D1\u989D</span>\n            <span class=\"text-sm\">\u00A5{{ order.deposit | fixed }}</span>\n          </div>\n          <div class=\"flex items-center justify-between py-1\">\n            <span class=\"font-medium\">\u5C3E\u6B3E\u91D1\u989D</span>\n            <span class=\"text-sm\">\u00A5{{ order.total - order.deposit | fixed }}</span>\n          </div>\n        }\n        <div class=\"flex items-center justify-between py-1\">\n          <span class=\"font-medium\">\u91D1\u989D</span>\n          <span class=\"text-sm\">\u00A5{{ order.total | fixed }}</span>\n        </div>\n      </div>\n      @if (order.status.toString() === 'CREATED' || order.status.toString() === 'PAID') {\n        <div class=\"mt-6\">\n          <div class=\"text-lg pb-3 font-medium\">\u652F\u4ED8\u65B9\u5F0F</div>\n          <div class=\"flex items-center\">\n            <svg\n              class=\"svg-icon\"\n              style=\"width: 2rem; height: 2rem\"\n              viewBox=\"0 0 1024 1024\"\n              version=\"1.1\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M395.846 603.585c-3.921 1.98-7.936 2.925-12.81 2.925-10.9 0-19.791-5.85-24.764-14.625l-2.006-3.864-78.106-167.913c-0.956-1.98-0.956-3.865-0.956-5.845 0-7.83 5.928-13.68 13.863-13.68 2.965 0 5.928 0.944 8.893 2.924l91.965 64.43c6.884 3.864 14.82 6.79 23.708 6.79 4.972 0 9.85-0.945 14.822-2.926L861.71 282.479c-77.149-89.804-204.684-148.384-349.135-148.384-235.371 0-427.242 157.158-427.242 351.294 0 105.368 57.361 201.017 147.323 265.447 6.88 4.905 11.852 13.68 11.852 22.45 0 2.925-0.957 5.85-2.006 8.775-6.881 26.318-18.831 69.334-18.831 71.223-0.958 2.92-2.013 6.79-2.013 10.75 0 7.83 5.929 13.68 13.865 13.68 2.963 0 5.928-0.944 7.935-2.925l92.922-53.674c6.885-3.87 14.82-6.794 22.756-6.794 3.916 0 8.889 0.944 12.81 1.98 43.496 12.644 91.012 19.53 139.48 19.53 235.372 0 427.24-157.158 427.24-351.294 0-58.58-17.78-114.143-48.467-163.003l-491.39 280.07-2.963 1.98z\"\n                fill=\"#09BB07\"\n              />\n            </svg>\n            <span class=\"ml-1\">\u5FAE\u4FE1\u652F\u4ED8</span>\n            <!-- <svg id=\"Layer_1\" data-name=\"Layer 1\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 715.94 211.02\">\n                <title>WeChat Pay logo - Brandlogos.net</title>\n                <g id=\"\u9875\u9762-1\">\n                  <g id=\"\u753B\u677F\">\n                    <g id=\"\u7F16\u7EC4\">\n                      <path\n                        id=\"\u5F62\u72B6\u7ED3\u5408\"\n                        d=\"M710.2,429.86l8.93,24.1c.93,2.7,1.94,5.9,2.61,8.34h.17c.76-2.44,1.6-5.56,2.61-8.51l8.09-23.93h7.84l-11.13,29.08c-5.31,14-8.93,21.16-14,25.54a21.48,21.48,0,0,1-7.57,4.41c-.61-1.09-3.39-5.85-3.39-5.85a19.62,19.62,0,0,0,6.49-3.62,22.5,22.5,0,0,0,6.24-8.26,5.31,5.31,0,0,0,.59-1.77,6.45,6.45,0,0,0-.51-1.94l-15.09-37.59Zm-170.81-.93c12.47,0,15.51,8.51,15.51,16.69v15.26a57.4,57.4,0,0,0,.67,9.78h-6.74l-.59-5.14H548a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.76-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.61,20.61,0,0,0-9.77,2.52L526,432.56A25.3,25.3,0,0,1,539.39,428.94Zm138.79,0c12.47,0,15.51,8.51,15.51,16.69v15.26a57.41,57.41,0,0,0,.67,9.78h-6.74l-.59-5.14h-.25a15.19,15.19,0,0,1-12.47,6.07c-8.26,0-12.47-5.82-12.47-11.72,0-9.86,8.77-15.25,24.53-15.17v-.84c0-3.37-.93-9.44-9.27-9.44a20.6,20.6,0,0,0-9.77,2.52l-2.53-4.38A25.3,25.3,0,0,1,678.18,428.94Zm-226.09-16c7.08,0,11.55,1.52,13.48,2.53,0,0-2.24,3.9-3.16,5.38a28,28,0,0,0-10.07-1.75c-13.32,0-22.17,8.51-22.17,23.43,0,13.91,8,22.84,21.83,22.84a31.51,31.51,0,0,0,10.48-1.73c.67,1.17,3,5.19,3,5.19-2.7,1.35-8.09,2.7-15,2.7-16,0-28.07-10.11-28.07-28.74C422.42,425,434.47,412.92,452.09,412.92Zm-55.11,16c13.32,0,16.86,11.72,16.86,19.22a28,28,0,0,1-.25,3.46H384.93c.17,10,6.57,14.16,14,14.16a27.78,27.78,0,0,0,9.78-1.51c.68,1.12,2.78,4.71,2.78,4.71a33,33,0,0,1-13.57,2.53c-12.56,0-20.06-8.26-20.06-20.57S385.09,428.94,397,428.94Zm181-10.79v11.72H588.6v5.65H578v22c0,5.06,1.43,7.92,5.56,7.92.61,0,1.16,0,1.67-.07.87,1.47,3,5.12,3,5.12a18.19,18.19,0,0,1-6.57,1c-3.46,0-6.24-1.1-8-3.12-2.11-2.19-2.87-5.81-2.87-10.62V435.51h-6.32v-5.65h6.32V418.15Zm56.21-4.72c7.25,0,12.56,1.69,15.93,4.72,3.12,2.7,5,6.83,5,11.88s-1.52,9.19-4.38,12.14c-3.88,4.13-10.2,6.24-17.36,6.24a25.3,25.3,0,0,1-5.9-.51v22.76h-7.33V414.52A85.05,85.05,0,0,1,634.19,413.43Zm-321.57.42,6.74,28.74c1.69,7.08,3.2,14.16,4.21,19.64h.17c.93-5.65,2.7-12.39,4.64-19.72L336,413.85h7.67l6.91,28.82c1.6,6.74,3.12,13.48,4,19.47h.17c1.18-6.24,2.78-12.56,4.55-19.64l7.5-28.66h7.5l-16.1,56.81h-7.67l-7.16-29.58a171.14,171.14,0,0,1-3.71-18.54h-.17A177.33,177.33,0,0,1,335,441.07L327,470.65h-7.67l-14.41-56.81Zm171.74-3v25.45h.17a13.77,13.77,0,0,1,5.31-5.23,15.27,15.27,0,0,1,7.59-2.11c5.48,0,14.24,3.37,14.24,17.45v24.27h-7.42V447.23c0-6.57-2.44-12.14-9.44-12.14a10.65,10.65,0,0,0-9.95,7.42,9,9,0,0,0-.51,3.54v24.61h-7.42V410.82ZM530.45,459c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C539.64,449.67,530.45,451.1,530.45,459Zm138.79,0c0,4.8,3.2,7.08,7,7.08a10.15,10.15,0,0,0,9.86-6.83,7.74,7.74,0,0,0,.42-2.36v-7.08C678.43,449.67,669.24,451.1,669.24,459ZM396.39,434.25c-7.5,0-10.79,6.91-11.38,12.05h21.66C406.75,441.58,404.73,434.25,396.39,434.25Zm238-15a30.8,30.8,0,0,0-6.91.59v22.08a24.65,24.65,0,0,0,6.07.59c8.85,0,14.24-4.3,14.24-12.14C647.76,422.87,642.45,419.24,634.36,419.24ZM584.45,291.18V306.1h44.14v7.75H584.45v16.2h35.63s-4.57,23.28-31.27,42.88c10.8,5.69,25,9.72,42.38,12.44,0,0-2.81,5-5.21,8.85-19-3.3-33.81-9.08-45.43-15.86-11.71,6.95-26.85,13-46.43,16.4-1.36-2-5.08-8.6-5.08-8.6,17.75-2.78,32.36-7.27,43.28-13.13-26.84-19.25-32-43-32-43h35.53v-16.2H530V306.1h45.85V291.18ZM323,319.7l6.88,3.65c-3.27,7.77-6.31,13.06-7.15,14.72v56.38H315V350.25c-4.44,6-7,9.07-8.34,10.54l-4.37-7.57C310.57,344.43,317.91,332.36,323,319.7Zm341.11-28.21,9,2-.28.74c-3.66,9.57-7.09,17.72-10.19,24.22v76H654V334.82a161.16,161.16,0,0,1-10.27,14.75L639,341.25c10.14-13.8,18.67-30.56,24.88-49.18Zm-226.36,0,8.15,2s-5.19,16.35-9.16,25l0,76h-8.61V335.12c-3.45,6.5-5.76,10.77-8.68,14.59l-4.66-8.07C426.86,326.4,437.72,291.47,437.72,291.47Zm-54.81-.41,7.75,1.55-.18.7c-1.6,6.13-3.37,12.15-5.26,17.91h23.19v7.33h-5.59c-1.44,20.81-5.13,36.93-10.95,47.93,4.62,9,13.52,17.42,16,19.7-.56,1.07-4.44,7.71-4.44,7.71s-12.89-13.2-15.81-19.59c-3.28,5.51-9.33,12.65-17.53,20h0L366,387s11.22-9.31,17.58-20.55a125.69,125.69,0,0,1-7.81-32.27c-1.36,2.39-2.1,3.68-3.47,5.73,0,0-3.62-6.29-4.36-7.47,6.51-11.45,11.39-24.94,14.87-40.71h0Zm344.12.88v24.4H742v8.18H727v53.12A15.35,15.35,0,0,1,711.7,393h-10v-9h10a6.39,6.39,0,0,0,6.38-6.38V324.52H670.25v-8.18h47.82v-24.4Zm-214.4,64.91v35.69H452V356.85Zm-149-4.26v19.71c1.45-1.23,5.89-5.13,7.38-6.46l3.57,6.18-16.36,13.81s-3.46-6-4.16-7.11c1-1.07,2.25-3.28,2.25-7.5V359.91H341.47c0,16.86-.68,23-11.92,31.75,0,0-2.71-4.78-3.92-6.78,9.66-7.63,8.51-18.06,8.51-32.29Zm140.81,12H460.61v20.61h43.84ZM608,337.7H552.6c3.17,6.6,11,19.34,28,30.42C597.44,356.87,605.06,344,608,337.7Zm79.67-.53L703.31,362l-8.15,4.45-14.64-25ZM395.5,318.55H382.74c-.13.52-1.33,3.54-1.6,4.13,1.59,15.26,3.94,27,7,34.81,3.79-9.1,6.27-22.18,7.36-38.94Zm118,21.24v7.33H451.15v-7.33Zm-146-3.84v7.33h-35V336Zm146-13.22v7.33H451.15v-7.33ZM354.26,292.89v26.87h7.92V300.56h6.9v26.09H331.7V301H339v18.76h7.91V292.89Zm-30.89-1.78,6.76,4.43a101.69,101.69,0,0,1-22.45,30.55L303.6,319C311,311.86,318,301.79,323.38,291.1Zm158.9.37,6.08,13.78h31.1V313H445.61v-7.75h34.12L475.3,294.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #4d4d4d\"\n                      />\n                      <path\n                        id=\"Fill-29\"\n                        d=\"M113,412a8,8,0,0,1-10.54-3.22l-.52-1.14L80.18,359.84a4.16,4.16,0,0,1-.38-1.68A4,4,0,0,1,86.17,355l25.69,18.29a11.86,11.86,0,0,0,10.62,1.22L243.29,320.7c-21.66-25.52-57.32-42.2-97.68-42.2-66,0-119.58,44.62-119.58,99.66,0,30,16.11,57.06,41.32,75.33A8,8,0,0,1,70.69,460a9.43,9.43,0,0,1-.42,2.54l-5.39,20.1a11.73,11.73,0,0,0-.64,2.91,4,4,0,0,0,4,4,4.5,4.5,0,0,0,2.3-.74l26.18-15.11a12.55,12.55,0,0,1,6.35-1.84,12,12,0,0,1,3.51.53,141.5,141.5,0,0,0,39,5.46c66,0,119.59-44.62,119.59-99.66A86.29,86.29,0,0,0,251.58,332l-137.69,79.5Z\"\n                        transform=\"translate(-26.03 -278.49)\"\n                        style=\"fill: #1aad19\"\n                      />\n                    </g>\n                  </g>\n                </g>\n              </svg> -->\n          </div>\n        </div>\n      }\n    </div>\n    <!-- safe area -->\n    <div class=\"\">\n      @if (order.status.toString() === 'PAID') {\n        <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"refund()\">\u7533\u8BF7\u9000\u6B3E</button>\n      }\n      <div class=\"flex items-center justify-end\">\n        @if (order.status.toString() === 'CREATED') {\n          <span\n            class=\"underline text-sm underline-offset-4 mr-6 cursor-pointer hover:text-[--rt-brand-color]\"\n            (click)=\"cancel()\"\n            >\u53D6\u6D88\u8BA2\u5355</span\n          >\n        }\n        @if (order.status.toString() === 'CREATED') {\n          @if (order.deposit) {\n            <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5B9A\u91D1</button>\n          } @else {\n            <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u8BA2\u5355</button>\n          }\n        }\n        @if (order.status.toString() === 'PARTIAL_PAID') {\n          <button mat-flat-button class=\"w-32 min-h-11\" (click)=\"pay()\">\u652F\u4ED8\u5C3E\u6B3E</button>\n        }\n      </div>\n    </div>\n  </div>\n  <div class=\"\">\n    <div class=\"text-lg py-2 font-medium\">\u914D\u9001\u4FE1\u606F</div>\n    <div class=\"flex items-baseline justify-between py-1\">\n      <span class=\"font-medium min-w-20\">\u6536\u8D27\u5730\u5740</span>\n      <span class=\"text-sm\">{{ order.shippingAddress | shippingAddress }}</span>\n    </div>\n    <div class=\"flex items-baseline justify-between py-1\">\n      <span class=\"font-medium min-w-20\">\u5907\u6CE8\u4FE1\u606F</span>\n      <span class=\"text-sm\">{{ order.note || '\u65E0' }}</span>\n    </div>\n  </div>\n</div>\n" }]
+        }] });
+
+class OrderManageTrackingComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageTrackingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: OrderManageTrackingComponent, isStandalone: true, selector: "rolatech-order-manage-tracking", ngImport: i0, template: "<p>order-manage-tracking works!</p>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: OrderManageTrackingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'rolatech-order-manage-tracking', imports: [CommonModule], template: "<p>order-manage-tracking works!</p>\n" }]
+        }] });
+
+const orderMangeRoutes = [
+    {
+        path: '',
+        component: OrderManageIndexComponent,
+    },
+    {
+        path: ':id',
+        component: OrderManageDetailComponent,
+    },
+    {
+        path: ':id/fulfillments',
+        component: OrderManageFulfillmentComponent,
+    },
+    {
+        path: ':id/tracking',
+        component: OrderManageTrackingComponent,
+    },
+];
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { OrderDetailItemComponent, OrderFulfillmentStatus, OrderItemComponent, OrderItemOptionsFormatPipe, OrderItemStatus, OrderPaymentStatus, OrderPayoutStatus, OrderPayoutType, OrderReturnRequestComponent, OrderReturnStatus, OrderStatus, OrderTimelineStatus, OrderType, OrderVariantItemComponent, PaymentStatus, PaymentType, orderMangeRoutes, orderRoutes };
+//# sourceMappingURL=rolatech-angular-order.mjs.map