refactor(owner-vue): 지난 주문 주문상태, 결제금액 표시방법 변경

- Vue Filter를 사용하여 주문상태 가져오는 함수 글로벌하게 사용
- 결제금액 3자리수 콤마 표시 커스텀 필터 사용

owner-vue/src/common/jwt.js

@@ -23,6 +23,9 @@ export default {
     localStorage.removeItem(EXPIRED_TIME_NAME);
   },
   isExpired() {
+    if (this.getToken() == null) return true;
+    if (this.getExpiredTime() == null) return true;
+
     const expiredTime = this.getExpiredTime();
 
     const expiredMoment = moment(expiredTime);

owner-vue/src/components/OrderCard.vue

@@ -15,7 +15,7 @@
     <v-card-title v-if="itemNames.length > 1">
       {{ itemNames[0] }} 외 {{ itemNames.length - 1 }}건
     </v-card-title>
-    <v-card-subtitle>{{this.getOrderStatusName(orderStatus)}}</v-card-subtitle>
+    <v-card-subtitle>{{ orderStatus | getOrderStatusName }}</v-card-subtitle>
     <v-card-text>{{ orderTime }}</v-card-text>
     <v-card-actions>
       <v-row v-if="orderStatus === 'PLACED'">
@@ -128,22 +128,6 @@ export default {
         console.log(error);
       }
     },
-    getOrderStatusName: function(orderStatus) {
-      switch (orderStatus) {
-        case "PLACED":
-          return "주문신청됨";
-        case "ACCEPTED":
-          return "주문수락됨";
-        case "REJECTED":
-          return "주문거절됨";
-        case "WAITING":
-          return "픽업대기중";
-        case "FINISHED":
-          return "픽업완료됨";
-        default:
-          break;
-      }
-    },
     clickDetail: function() {
       alert("준비중 입니다...");
     }

owner-vue/src/main.js

@@ -15,6 +15,28 @@ new Vue({
   render: h => h(App)
 }).$mount('#app')
 
+Vue.filter('getOrderStatusName', function (orderStatus) {
+  switch (orderStatus) {
+    case "PLACED":
+      return "주문신청됨";
+    case "ACCEPTED":
+      return "주문수락됨";
+    case "REJECTED":
+      return "주문거절됨";
+    case "WAITING":
+      return "픽업대기중";
+    case "FINISHED":
+      return "픽업완료됨";
+    default:
+      break;
+  }
+});
+
+Vue.filter('currency', function (value) {
+  var num = new Number(value);
+  return num.toFixed(0).replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, "$1,")
+});
+
 axios.interceptors.response.use(
   (response) => {
     return response;

owner-vue/src/views/LoginUser.vue

@@ -38,9 +38,15 @@
 
 <script>
 import userApi from '../api/user.js'
+import jwt from "@/common/jwt";
 
 export default {
   name: "LoginUser",
+  mounted() {
+    if (false == jwt.isExpired()) {
+      this.$router.push('/order');
+    }
+  },
   data: function() {
     return {
       email: 'owner@gmail.com',
@@ -56,7 +62,7 @@ export default {
 
       const flag = await userApi.requestLoginUser(this.email, this.password);
 
-      if (flag) await this.$router.push('/prev-order');
+      if (flag) await this.$router.push('/order');
     }
   }
 }

owner-vue/src/views/PrevOrder.vue

@@ -105,10 +105,10 @@ export default {
 
         this.orders.push({
           orderId: order.orderId,
-          orderStatus: this.getOrderStatusName(order.orderStatus),
+          orderStatus: this.$options.filters.getOrderStatusName(order.orderStatus),
           orderTime: order.orderTime,
           orderItemNames: this.getOrderItemName(order.orderItems),
-          orderPrice: order.orderPrice,
+          orderPrice: this.$options.filters.currency(order.orderPrice),
           userName: order.userName
         });
       })
@@ -137,12 +137,6 @@ export default {
     inputEndDate: function(value) {
       this.endDate = value;
     },
-    getOrderStatusName: function(orderStatus) {
-      if (orderStatus === "ORDER") return "주문";
-      if (orderStatus === "PLACED") return "주문 수락";
-      if (orderStatus === "REJECT") return "주문 거절";
-      return orderStatus;
-    },
     getOrderItemName: function(orderItems) {
       const orderItemLength = orderItems.length;
       const orderItemName = orderItems[0].orderItemName;