Typescript 목데이터 가데이터 만들기 예시

import { Injectable } from '@angular/core';
import * as dayjs from 'dayjs';
import { Order, OrderLog } from 'src/lib/order';

import { faker } from '@faker-js/faker';
import { OrderStatus } from 'src/lib/order';
import { generate } from 'rxjs';
export const ORDER_KEY = 'orders';

faker.setLocale('ko');

@Injectable({
  providedIn: 'root',
})
export class OrderService {
  orders: Order[] = [];

  branchNames: string[] = [
    '노원(서울)',
    '안양(경기)',
    '광주(전남)',
    '전주(전북)',
    '서귀포(제주)',
  ];
  options: string[] = ['M', 'L', 'XL'];
  pizzaNames: string[] = [
    '콤비네이션피자',
    '불고기피자',
    '바베큐치킨',
    '페파로니피자',
    '치즈피자',
    '야채피자',
    '베이컨포테이토',
    '고구마무스',
    '핫불고기',
    '핫치킨',
    '하와이언',
    '불갈비',
    '그릴드포크',
    '멜팅치즈&스테이크',
    '쉬림프베이컨',
    '킹프런&비프크럼블',
    '리얼스테이크&깐쇼',
    '트리플킹',
  ];

  constructor() {
    const data = localStorage.getItem(ORDER_KEY);
    if (!data) {
      this.createMockData();
    } else {
      this.orders = JSON.parse(data) as Order[];
    }
  }

  getid() {
    return this.orders.length;
  }

  getItems(item?: Order) {
    return this.orders.sort((a, b) => {
      return dayjs(a.createdAt).isAfter(dayjs(b.createdAt)) ? -1 : 1;
    });
  }

  createItem(item: Order) {
    // 데이터
    item.id = this.orders.length; // 고유 값
    item.status = item.status ?? OrderStatus.WAITING_FOR_PRODUCTION; // 최초 상태 값
    this.orders.push(item);
    this.save();
  }

  updateItem(item: Order) {
    // 데이터
    const index = this.orders.findIndex((_item) => _item.id === item.id);
    item.updatedAt = new Date();
    this.orders[index] = item;
    this.save();
  }

  deleteItem(item: Order) {
    // 데이터
    this.orders = this.orders.filter((_item) => {
      return _item.id !== item.id;
    });
    this.save();
  }

  save() {
    localStorage.setItem(ORDER_KEY, JSON.stringify(this.orders));
  }

  createMockData() {
    for (let i = 1; i <= 100; i++) {
      const status =
        Object.entries(OrderStatus)[
          Math.floor(Math.random() * Object.entries(OrderStatus).length)
        ][1];

      const randomDate = dayjs()
        .subtract(Math.abs(Math.random() * 100), 'day')
        .toDate();
      let order: Order = {
        id: i,
        ordererId: `${faker.name.lastName()}${faker.name.firstName()}${Math.floor(
          Math.random() * 100
        )}`,
        branchName:
          this.branchNames[Math.floor(Math.random() * this.branchNames.length)],
        ordererName: `${faker.name.lastName()}${faker.name.firstName()}`,
        createdAt: randomDate,
        updatedAt: randomDate,
        tel: `010-${Math.round(Math.random() * 10000)}-${Math.floor(
          Math.random() * 10000
        )}`,
        address: `${faker.name.lastName()}길 ${Math.floor(
          Math.random() * 100
        )}-${Math.floor(Math.random() * 100)}`,
        addressDetail: `1${Math.floor(Math.random() * 100)}동 1${Math.floor(
          Math.random() * 100
        )}호`,
        branchAddress: `${Math.floor(Math.random() * 100)}-${Math.floor(
          Math.random() * 100
        )}`,
        branchTel: `${Math.floor(Math.random() * 1000)}-${Math.floor(
          Math.random() * 1000
        )}`,
        status,
        selectedOrder: [
          {
            index: i,
            menuName:
              this.pizzaNames[
                Math.floor(Math.random() * this.pizzaNames.length)
              ],
            option:
              this.options[Math.floor(Math.random() * this.options.length)],
            amount: Math.ceil(Math.random() * 10),
            price: 39000,
          },
        ],
        totalPrice: 0,
        logs: this.generateLogs(status, randomDate),
      };
      order.selectedOrder.map((_item) => {
        order.totalPrice += _item.amount * _item.price;
      });
      this.createItem(order);
    }
    this.orders.sort((a: Order, b: Order) => b.id! - a.id!);
  }

  generateLogs(status: OrderStatus, date: Date) {
    const entries = Object.entries(OrderStatus);

    const index = entries.findIndex(([key, value]) => {
      return value === status; // key : WAITING_FOR_PRODUCTION,  value : '제조 대기'
    });

    const logs = [];

    for (let i = 0; i <= index; i++) {
      logs.push({
        status: entries[i][1],
        date: dayjs(date)
          .add(i * 15, 'minute')
          .toDate(),
      });
    }

    return logs;
  }
}

1. 서비스

 

 

export enum OrderStatus {
  WAITING_FOR_PRODUCTION = '제조 대기',
  PRODUCTION_CONFIRMED = '제조 승인',
  UNDER_PRODUCTION = '제조 중',
  PRODUCTION_COMPLETE = '제조 완료',
  UNDER_DELIVERY = '발송 중',
  DELIVERY_COMPLETE = '발송 완료',
  CUSTOMER_SERVICE_REQUESTED = 'CS 접수',
  CUSTOMER_SERVICE_COMPLETE = 'CS 완료',
}


export type Order = {
  id: number;
  ordererId: string;
  ordererName: string;
  tel: string;
  address: string;
  addressDetail: string;
  branchName: string;
  branchAddress: string;
  branchTel: string;
  status: OrderStatus;
  createdAt: Date;
  updatedAt: Date;
  totalPrice: number;
  selectedOrder: SelectedOrder[];
  logs?: OrderLog[];
};

2. 타입