dev #12617

сделал список чеков
2022-09-13 13:06:09 +04:00 · 2022-09-13 13:06:09 +04:00 · 7088f2a74a
commit 7088f2a74a
parent 61e90459d6
3 changed files with 72 additions and 127 deletions
--- a/src/app/pages/account/orders/orders.component.html
+++ b/src/app/pages/account/orders/orders.component.html
@ -1,22 +1,9 @@
-<ng-container
-  *ngIf="orders.length !== 0 && !ordersLoadingStatus && selectedOrder === null"
->
-  <app-order-info [order]="orders[0]!" [loadingStatus]="true"></app-order-info>
-</ng-container>
-<div
-  *ngIf="selectedOrder === null; else orderInfo"
-  class="woocommerce-MyAccount-content"
->
+<div class="orders">
  <table
    class="woocommerce-orders-table woocommerce-MyAccount-orders shop_table shop_table_responsive my_account_orders account-orders-table"
  >
    <thead>
      <tr>
-        <th
-          class="woocommerce-orders-table__header woocommerce-orders-table__header-order-number"
-        >
-          <span class="nobr">Заказ</span>
-        </th>
        <th
          class="woocommerce-orders-table__header woocommerce-orders-table__header-order-date"
        >
@ -25,94 +12,77 @@
        <th
          class="woocommerce-orders-table__header woocommerce-orders-table__header-order-status"
        >
-          <span class="nobr">Статус</span>
+          <span class="nobr">Место покупки</span>
        </th>
        <th
          class="woocommerce-orders-table__header woocommerce-orders-table__header-order-total"
        >
-          <span class="nobr">Итого</span>
+          <span class="nobr">Сумма чека</span>
        </th>
        <th
          class="woocommerce-orders-table__header woocommerce-orders-table__header-order-actions"
        >
-          <span class="nobr">Действия</span>
+          <span class="nobr">Бонусы</span>
        </th>
      </tr>
    </thead>
    <tbody>
      <tr
-        *ngFor="let order of ordersShortArray"
+        *ngFor="let purchase of purchasesShortArray"
        class="woocommerce-orders-table__row woocommerce-orders-table__row--status-processing order"
      >
-        <td
-          class="woocommerce-orders-table__cell woocommerce-orders-table__cell-order-number"
-          data-title="Заказ"
-        >
-          <a href="#" (click)="showOrderDetails($event, order.id)">{{
-            order.id
-          }}</a>
-        </td>
        <td
          class="woocommerce-orders-table__cell woocommerce-orders-table__cell-order-date"
          data-title="Дата"
        >
-          <time [dateTime]="order.date_created">{{
-            moment(order.date_created).format("DD.MM.YYYY")
+          <time [dateTime]="purchase.PurchaseDate">{{
+            moment(purchase.PurchaseDate).format("DD.MM.YYYY")
          }}</time>
        </td>
        <td
          class="woocommerce-orders-table__cell woocommerce-orders-table__cell-order-status"
-          data-title="Статус"
+          data-title="Место покупки"
        >
-          {{ formatStatus(order.status) }}
+          {{ purchase.Address }}
        </td>
        <td
          class="woocommerce-orders-table__cell woocommerce-orders-table__cell-order-total"
-          data-title="Итого"
+          data-title="Сумма чека"
        >
-          <span class="woocommerce-Price-amount amount"
-            ><span class="woocommerce-Price-currencySymbol">{{
-              order.currency_symbol
-            }}</span
-            >{{ order.total }}</span
-          >
+          <span class="woocommerce-Price-amount amount">
+            {{ purchase.CheckSummary }}
+          </span>
        </td>
        <td
          class="woocommerce-orders-table__cell woocommerce-orders-table__cell-order-actions"
-          data-title="Действия"
+          data-title="Бонусы"
+          [ngClass]="{
+            'red-color': purchase.BonusSummary ? purchase.BonusSummary < 0 : false,
+            'green-color': purchase.BonusSummary ? purchase.BonusSummary > 0 : false
+          }"
        >
-          <a
-            href="#"
-            class="woocommerce-button button view"
-            (click)="showOrderDetails($event, order.id)"
-            >Просмотр</a
-          >
+          {{ purchase.BonusSummary }}
        </td>
      </tr>
    </tbody>
  </table>
  <p
-    *ngIf="orders.length !== ordersShortArray.length"
+    *ngIf="purchases.length !== purchasesShortArray.length"
    class="show-more-orders"
    (click)="getMoreOrders()"
  >
    Показать больше
  </p>
-  <div
+  <p-progressSpinner
    *ngIf="ordersLoadingStatus"
-    class="angular-spinner-container"
-    style="width: 100%; height: 100%; position: static"
-  >
-    <p-progressSpinner styleClass="angular-spinner"></p-progressSpinner>
-  </div>
+    [style]="{ width: '100%' }"
+    strokeWidth="2"
+    styleClass="angular-spinner"
+  ></p-progressSpinner>
  <p
-    *ngIf="orders.length === 0 && !ordersLoadingStatus"
+    *ngIf="purchases.length === 0 && !ordersLoadingStatus"
    style="width: 100%; text-align: center"
  >
    Нет заказов
  </p>
 </div>
-
-<ng-template #orderInfo>
-  <app-order-info [order]="selectedOrder!"></app-order-info>
-</ng-template>
--- a/src/app/pages/account/orders/orders.component.scss
+++ b/src/app/pages/account/orders/orders.component.scss
@ -1,8 +1,8 @@
 .show-more-orders {
    text-align: center;
    cursor: pointer;
-    color: #009688;
-    margin-top: 8px;
+    color: #09467f;
+    margin-top: 16px;
 }
 .woocommerce-MyAccount-content {
    max-width: 400px;
@ -16,6 +16,9 @@
    text-align: left;
    margin-top: 8px;
    width: 100%;
+    max-width: 400px;
+    margin-left: auto;
+    margin-right: auto;
    thead {
        display: none;
    }
@ -33,9 +36,20 @@
        }
        &__row {
            display: block;
+            &:nth-child(even) {
+                background: #ebebeb;
+            }
        }
-        &__cell-order-actions::before {
-            display: none;
+        // &__cell-order-actions::before {
+        //     display: none;
+        // }
+        &__cell-order-actions {
+            &.red-color {
+                color: #ed0000;
+            }
+            &.green-color {
+                color: #00a700
+            }
        }
        &__cell-order-number a {
            text-decoration: none;
--- a/src/app/pages/account/orders/orders.component.ts
+++ b/src/app/pages/account/orders/orders.component.ts
@ -1,10 +1,10 @@
 import { HttpErrorResponse } from '@angular/common/http';
 import { Component, Input, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { AcceptedOrder } from 'src/app/interface/data';
-import { WpJsonService } from 'src/app/services/wp-json.service';
+import { Purchase } from 'src/app/interface/data';
 import * as moment from 'moment-timezone';
-import { orderStatuses } from 'src/app/app.constants';
+import { lastValueFrom } from 'rxjs';
+import { JsonrpcService, RpcService } from 'src/app/services/jsonrpc.service';

@Component({
  selector: 'app-orders',
@ -13,86 +13,47 @@ import { orderStatuses } from 'src/app/app.constants';
 })
 export class OrdersComponent implements OnInit {
  @Input() handleHttpError!: (error: HttpErrorResponse) => void;
-  
-  public orders: AcceptedOrder[] = [];
-  public ordersShortArray: AcceptedOrder[] = [];
-  public lastViewOrder: number = 4;
-  public selectedOrder: AcceptedOrder|null = null;
-  public selectedOrderId: number|null = null;
+  public lastViewOrder: number = 3;
  public ordersLoadingStatus: boolean = true;
  readonly moment = moment;
-  private timer!: any;
+  public purchases: Purchase[] = [];
+  public purchasesShortArray: Purchase[] = [];

  constructor(
-    private wpJson: WpJsonService,
    private route: ActivatedRoute,
    private router: Router,
+    private jsonrpc: JsonrpcService,
  ) { }

  ngOnInit(): void {
-    this.getOrders();
-    this.route.queryParams.subscribe({
-      next: (queryParams:any) => {
-        this.setSelectedOrder(queryParams.order);
-      }
-    });
-    // this.requestTimer(1);
+    this.getOrders()
  }

-  requestTimer(interval: number) {
-    this.timer = setInterval(() => {
-      if (this.permissionToRequest()) this.getOrders()
-    }, interval * 60000);
-  }
-
-  permissionToRequest() {
-    for (let order of this.ordersShortArray) {
-      if (order.status !== 'Delivered' && order.status !== 'Closed' && order.status !== 'Cancelled' ) {
-        return true
-      }
-    }
-    return false
-  }
-
-  getOrders(): void{
-    this.wpJson.getOrders().subscribe({
-        next: (result) => {
-          this.orders = result;
-          this.ordersShortArray = this.orders.slice(0, this.lastViewOrder);
-          this.setSelectedOrder(this.selectedOrderId);
+  async getOrders(){
+    const purchases: Purchase[] = (await lastValueFrom(
+      this.jsonrpc.rpc(
+        {
+          method: 'GetAccountPurchase',
+          params: []
        },
-        error: this.handleHttpError
-      }
-    );
+        RpcService.bonusService
+      )))['Purchases'];
+
+    this.purchases = purchases.map<Purchase>((purchase) => {
+      const id = purchase.ID.slice(0,36).toLowerCase();
+      // purchase.Transactions = transactions.filter((transaction) => {
+      //   const same = transaction.Purchase === id;
+      //   transaction.HasPurchase = same;
+      //   return same;
+      // });
+      return purchase;
+    });
+    this.purchasesShortArray = this.purchases.slice(0, this.lastViewOrder)
    this.ordersLoadingStatus = false;
  }

-  setSelectedOrder(orderId?:number|null): void{
-    this.selectedOrderId = orderId ?? null;
-    this.selectedOrder = this.orders.find((el) => el.id == this.selectedOrderId) ?? null;
-  }
-
-  showOrderDetails(event: MouseEvent, orderId: number): void{
-    event.preventDefault();
-    this.router.navigate([], {
-      relativeTo: this.route,
-      queryParams: {
-        order: orderId
-      },
-      queryParamsHandling: 'merge',
-    })
-  }
-
-  formatStatus(status: string): string|undefined{
-    const key = Object.keys(orderStatuses).find((el) => status === el) ?? '';
-    if (key === '') {
-      return orderStatuses['InProcessing']
-    }
-    return orderStatuses[key];
-  }
-
  getMoreOrders() {
    this.lastViewOrder += 4;
-    this.ordersShortArray = this.orders.slice(0, this.lastViewOrder);
+    this.purchasesShortArray = this.purchases.slice(0, this.lastViewOrder);
  }
 }