6.1 | Notion

안건

~~item schema - isDeleted~~
- ~~api에서 delete → post : isDeleted = true (/default :false / required : true)~~
- ~~전체, 카테고리 목록 isDeleted= true → disabled~~
- ~~관리자 주문 내역에서는 다 보여주기~~
홈페이지 밑에 더 들어갈 아이디어
홈페이지 이름, 파비콘
- 콜렉터 기프트샵, 박물관 C
사용자 상품 주문내역 안보임
디비 갈아 엎고 더미데이터 넣기

스크럼

소감
- 예리
  - 피곤했어요, 오늘도 피곤해요
  - 뭔가를 짤 때 오래걸리는 거 같다 빨리하겠다!!!!!
  - 관리자 → 오류 있나 .. 확인 부탁드립니다
- 혜령님
  - 소셜 로그인 - 네이버, 구글 완성
  - 매진 임박, 신상품 api 작성
  - 오늘은 검색을 할 것 같다.
  - 어제 오류가 있었는데 검색을 통해 잘 해결했다.
- 명진님
  - 소셜로그인 - 카카오
  - 패스워드 검증 api
  - deleteFlag → item Schema
  - 상품 수정 api 작성 됨
  - 많이 할 수 있을 것 같은데 아쉽다.
  - 처음 할 때 잘해야겠다는 생각 → 뒷처리가 많아지는 듯하다
- 형민님
  - 최근 본 상품 기능
  - 매진 임박 기능
  - 계정 관리 페이지 리뉴얼 중
    - 주문 조회 api 먹통
    - 회원정보 수정에서 비번 검증 요청
  - CSS 수정 할 것 같다
  - 최근 본 상품을 만들면서 잘 만들었다 생각.

오늘 프론트에서 할 일 (95%)

오늘 벡엔드에서 할 일 (95%)

‼️ 이슈

이름 정하기
- 콜렉터의 기프트샵 @명진.K
- 콜렉터의 백화점
- 노웨어샵 @김예리 @김혜령
- collector’s @이형민 @김예리 @명진.K
- 모두의 마블
- 핑거스냅 @이형민 @김혜령
- 모두의 핑거스냅 FingerSnap @명진.K

🕗 오피스 아워(프) - 7시

 const updateData = {
    ...(itemName && { itemName }),
    ...(category && { category }),
    ...(manufacturingCompany && {manufacturingCompany}),
    ...(summary && {summary}),
    ...(mainExplanation && {mainExplanation}),
    imgUrl: req.file.location,
    ...(stocks && {stocks}),
    ...(price && {price}),
    ...(hashTag && {hashTag}),
  };

해당 코드는 주문 페이지 기능을 구현해 둔 것인데, user 정보가 없거나 주문 정보가 없을 때 이용하지 못하도록 막아두었습니다. (💟 이부분 입니다) 근데 💛 이 부분의 함수도 순차적으로 실행이 되어서 실행이 되는 거 같은데 막을 방법이 있을까요?

import * as Api from '/api.js';

import { addCommas } from '/useful-functions.js';
import {
  addNavEventListeners,
  addNavElements,
  checkUserStatus,
} from '../components/Nav/event.js';
import { addFooterElements } from '../components/Footer/event.js';

const orderList = JSON.parse(localStorage.getItem('order'));
const isLoggedIn = checkUserStatus();

//💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟💟
window.onload = async () => {
  if (!orderList) {
    alert('주문 정보가 없습니다. 주문 정보를 확인해주세요.');
    window.location.href = '/cart';
    return;
  }
  if (!isLoggedIn) {
    alert('비정상적인 접근입니다.');
    window.location.href = '/';
    return;
  }
};

let orderInfo = { orderList };
const shipFreeMinPrice = 50000;

const purchaseBtn = document.querySelector('#purchase-btn');
const findAddressBtn = document.querySelector('#findAddressBtn');

// 배송지 정보 폼
const nameInput = document.querySelector('#name');
const phoneNumberInput = document.querySelector('#phoneNumber');
const postNumberInput = document.querySelector('#postNumber');
const address1Input = document.querySelector('#address1');
const address2Input = document.querySelector('#address2');
const requestMsgInput = document.querySelector('#requestMsgInput');
const requestMsgTextInputDiv = document.querySelector(
  '#requestMsgTextInputDiv',
);

let shipRequest = ``;

await addAllElements();
await addAllEvents();

async function addAllElements() {
  addNavElements();
  addFooterElements();
  if (isLoggedIn) await addUserShipElements(); // 유저 배송지 정보 가져오기
  await addOrderInfoElements(); // 주문 정보 가져오기
}

// 여러 개의 addEventListener들을 묶어주어서 코드를 깔끔하게 하는 역할임.
async function addAllEvents() {
  addNavEventListeners();
  await addInputEventListener();
}
async function addInputEventListener() {
  await purchaseBtn.addEventListener('click', handlePurchaseBtn);
  await findAddressBtn.addEventListener('click', handleFindAddressBtn);
  await requestMsgInput.addEventListener('change', handleRequestMsgInput);
}
function handleRequestMsgInput() {
  // 요청 사항 핸들러
  if (this.selectedIndex === 0) {
    shipRequest = '';
    requestMsgTextInputDiv.innerHTML = '';
  } else if (this.selectedIndex === this.options.length - 1) {
    requestMsgTextInputDiv.innerHTML = `<input class="input" id="requestMsgText" type="text"/>`;
  } else {
    shipRequest = this.options[this.selectedIndex].text;
    requestMsgTextInputDiv.innerHTML = '';
  }
}
async function handlePurchaseBtn() {
  // 주문 내역 전송.
  if (!nameInput.value) {
    return alert('주문자 이름을 적어주세요.');
  }
  if (!phoneNumberInput.value) {
    return alert('주문자 전화번호를 적어주세요.');
  }
  if (!postNumberInput.value || !address1Input.value) {
    return alert('주소를 입력해주세요.');
  }
  if (!address2Input.value) {
    return alert('상세 주소를 입력해주세요.');
  }
  if (!orderInfo.totalCost || !orderList) {
    window.location.href = '/cart';
    return alert('결제 정보를 다시 확인해주세요.');
  }
  if (requestMsgInput.selectedIndex === requestMsgInput.options.length - 1) {
    // 요청 사항 직접 입력하기 처리
    shipRequest = document.querySelector('#requestMsgText').value;
  }
  const itemList = orderList.map(([id, num]) => {
    return { itemId: id, count: num };
  });
  const addressData = {
    postalCode: postNumberInput.value,
    address1: address1Input.value,
    address2: address2Input.value,
  };
  const shipData = {
    shipAddress: addressData,
    totalCost: orderInfo.totalCost,
    recipientName: nameInput.value,
    recipientPhone: phoneNumberInput.value,
    shipRequest,
    itemList,
  };
  try {
    const user_id = await Api.get('/api/user/id');
    const orderData = {
      userId: user_id,
      orderInfo: shipData,
    };
    await Api.post('/api/order/makeOrder', orderData);

    localStorage.removeItem('order');
    localStorage.setItem('orderInfo', JSON.stringify(orderInfo));

    alert(`정상적으로 주문이 완료되었습니다.`);

    // 주문 완료 페이지 이동
    window.location.href = '/order/complete';
  } catch (err) {
    console.error(err.stack);
    alert(`문제가 발생하였습니다. 확인 후 다시 시도해 주세요: ${err.message}`);
  }
}

function handleFindAddressBtn() {
  new daum.Postcode({
    oncomplete: function (data) {
      postNumberInput.value = data.zonecode;
      address1Input.value = data.address;
      address2Input.value = '';
    },
  }).open();
}
async function addUserShipElements() {
  const { fullName, address, phoneNumber } = await getUserShipInfos();
  if (fullName) nameInput.value = fullName;
  if (phoneNumber) phoneNumberInput.value = phoneNumber;
  if (address) {
    postNumberInput.value = address.postalCode;
    address1Input.value = address.address1;
    address2Input.value = address.address2;
  }
}
//💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛💛
async function getUserShipInfos() {
  try {
    const user_id = await Api.get('/api/user/id');
    const userInfo = await Api.get(`/api/user/${user_id}`);
    return userInfo;
  } catch (err) {
    console.error(err.stack);
    alert(`문제가 발생하였습니다. 확인 후 다시 시도해 주세요: ${err.message}`);
  }
}
async function addOrderInfoElements() {
  const orderItemsDiv = document.querySelector('#orderItems');
  const itemTotalPriceDiv = document.querySelector('#itemTotalPrice');
  const shipFeeDiv = document.querySelector('#shipFee');
  const totalPriceDiv = document.querySelector('#totalPrice');

  const { orderItemsText, totalItemPrice, shipFee } = await getOrderItemInfos();

  orderItemsDiv.innerHTML = orderItemsText;
  itemTotalPriceDiv.innerHTML = `${addCommas(totalItemPrice)}원`;
  shipFeeDiv.innerHTML = `${addCommas(shipFee)}원`;
  totalPriceDiv.innerHTML = `${addCommas(totalItemPrice + shipFee)}원`;
}

async function getOrderItemInfos() {
  let orderItemsText = ``;
  let totalItemPrice = 0;
  try {
    for (let i = 0; i < orderList.length; i++) {
      const [id, num] = orderList[i];
      const info = await Api.get(`/api/item/${id}`);
      // const info = await response.json();
      const { itemName, price } = info;
      orderItemsText += `<div>${itemName} / ${num}개</div>`;
      totalItemPrice += Number(price) * num;
    }

    let shipFee = totalItemPrice > shipFreeMinPrice ? 0 : 3000;
    orderInfo = {
      totalCost: totalItemPrice + shipFee,
      orderItemsText,
    };
    return { orderItemsText, totalItemPrice, shipFee };
  } catch (err) {
    console.error(err.stack);
    alert(`문제가 발생하였습니다. 확인 후 다시 시도해 주세요: ${err.message}`);
  }
}
window.onunload = () => {
  localStorage.removeItem('order');
};

안건

스크럼

오늘 프론트에서 할 일 (95%)

오늘 벡엔드에서 할 일 (95%)

‼️ 이슈

🕗 오피스 아워(프) - 7시

마무리