카테고리 저장 기능 추가

admin/pages/category.vue

@@ -0,0 +1,62 @@
+<template>
+  <main>
+    <div class="container-fluid c-section">
+      <div class="row">
+        <div class="col-sm-3"></div>
+        <div class="col-sm-6">
+          <div class="a-spacing-top-medium"></div>
+          <h2>Add a new Category</h2>
+          <form action="">
+            <div class="a-spacing-top-medium">
+              <label for="">Type</label>
+              <input v-model="type" type="text" class="a-input-text" />
+            </div>
+            <hr/>
+            <!--Button-->
+            <div class="a-spacing-top-large">
+              <span class="a-button-register">
+                <span @click="onAddCategory" class="a-button-text">Add Category</span>
+              </span>
+            </div>
+          </form>
+          <br/>
+          <ul class="list-group-item">
+            <li v-for="category in categories" :key="category._id">{{ category.type }}</li>
+          </ul>
+        </div>
+        <div class="col-sm-3"></div>
+      </div>
+    </div>
+  </main>
+</template>
+
+<script>
+export default {
+  async asyncData ({ $axios }) {
+    try {
+      let response = await $axios.$get('http://localhost:3000/api/categories')
+      return {
+        categories: response.categories
+      }
+    } catch (err) {
+      console.log(err)
+    }
+  },
+  data () {
+    return {
+      type: ''
+    }
+  },
+  methods: {
+    async onAddCategory () {
+      try {
+        let data = { type: this.type }
+        let response = await this.$axios.$post('http://localhost:3000/api/categories', data)
+        this.categories.push(data)
+      } catch (err) {
+        console.log(err)
+      }
+    }
+  }
+}
+</script>