diff --git a/owner-apigateway-service/src/main/resources/application.yml b/owner-apigateway-service/src/main/resources/application.yml
index 68321c9..52dbad8 100644
--- a/owner-apigateway-service/src/main/resources/application.yml
+++ b/owner-apigateway-service/src/main/resources/application.yml
@@ -14,6 +14,16 @@ spring:
 
   cloud:
     gateway:
+      globalcors:
+        cors-configurations:
+          '[/**]':
+            allowedOrigins: "http://localhost:8080"
+            allowedMethods:
+              - POST
+              - GET
+              - PUT
+              - OPTIONS
+              - DELETE
       routes:
         - id: owner-frontend-service
           uri: lb://OWNER-FRONTEND-SERVICE
@@ -38,4 +48,10 @@ spring:
           predicates:
             - Path=/user-service/**
           filters:
-            - RewritePath=/user-service/(?<segment>.*),/$\{segment}
\ No newline at end of file
+            - RewritePath=/user-service/(?<segment>.*),/$\{segment}
+        - id: owner-vue
+          uri: http://localhost:8080
+          predicates:
+            - Path=/owner-vue/**
+          filters:
+            - RewritePath=/owner-vue/(?<segment>.*),/$\{segment}
\ No newline at end of file
diff --git a/owner-vue/package.json b/owner-vue/package.json
index 0582a79..6033c79 100644
--- a/owner-vue/package.json
+++ b/owner-vue/package.json
@@ -3,14 +3,18 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "serve": "vue-cli-service serve",
+    "serve": "vue-cli-service serve --port 8080",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
+    "lint": "vue-cli-service lint",
+    "service": "node service.js"
   },
   "dependencies": {
+    "@mdi/js": "^6.5.95",
+    "axios": "^0.26.0",
     "core-js": "^3.6.5",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
+    "vuedraggable": "^2.24.3",
     "vuetify": "^2.4.0"
   },
   "devDependencies": {
@@ -22,6 +26,8 @@
     "babel-eslint": "^10.1.0",
     "eslint": "^6.7.2",
     "eslint-plugin-vue": "^6.2.2",
+    "font-awesome": "^4.7.0",
+    "gulp": "^3.9.1",
     "sass": "~1.32.0",
     "sass-loader": "^10.0.0",
     "vue-cli-plugin-vuetify": "~2.4.2",
diff --git a/owner-vue/src/App.vue b/owner-vue/src/App.vue
index ed3f0a2..3674ca7 100644
--- a/owner-vue/src/App.vue
+++ b/owner-vue/src/App.vue
@@ -15,7 +15,7 @@ import Sidebar from "./components/Sidebar";
 import Topbar from "./components/Topbar";
 export default {
   name: "App",
-  components: { Topbar, Sidebar },
+  components: { Topbar, Sidebar},
   data: () => ({
     cards: ["Today", "Yesterday"],
     drawer: null,
diff --git a/owner-vue/src/main.js b/owner-vue/src/main.js
index 20afa10..79288dd 100644
--- a/owner-vue/src/main.js
+++ b/owner-vue/src/main.js
@@ -1,7 +1,9 @@
+import 'font-awesome/css/font-awesome.min.css' // Ensure you are using css-loader
 import Vue from 'vue'
 import App from './App.vue'
 import vuetify from './plugins/vuetify'
 import router from './router'
+import axios from "axios";
 
 Vue.config.productionTip = false
 
@@ -10,3 +12,5 @@ new Vue({
   router,
   render: h => h(App)
 }).$mount('#app')
+Vue.component('axios',axios)
+
diff --git a/owner-vue/src/router/index.js b/owner-vue/src/router/index.js
index 0f24492..88e355e 100644
--- a/owner-vue/src/router/index.js
+++ b/owner-vue/src/router/index.js
@@ -9,6 +9,11 @@ const routes = [
     name: 'dashboard',
     component: () => import('./../views/Dashboard')
   },
+  {
+    path: '/category',
+    name: 'category',
+    component: () => import('./../views/Category')
+  },
 ]
 
 const router = new VueRouter({
diff --git a/owner-vue/src/views/Category.vue b/owner-vue/src/views/Category.vue
new file mode 100644
index 0000000..10d1933
--- /dev/null
+++ b/owner-vue/src/views/Category.vue
@@ -0,0 +1,103 @@
+<template>
+  <div>
+    <v-subheader class="py-0 d-flex justify-space-between rounded-lg">
+      <h3>Category List</h3>
+      <div style="text-align: right">
+        <span class="group pa-2">
+          <v-btn
+              elevation="2"
+              icon
+              color="success"
+              @click="clickAdd"
+          ><v-icon>{{ icons.mdiPlus }}</v-icon></v-btn>
+        </span>
+        <v-btn
+            elevation="2"
+            icon
+            color="primary"
+            @click="clickSave"
+        ><v-icon>{{ icons.mdiContentSave }}</v-icon></v-btn>
+      </div>
+
+    </v-subheader>
+
+    <v-expansion-panels style="display: block">
+      <draggable v-model="categoryList" >
+        <v-expansion-panel
+            v-for="item in categoryList" :key="item.order" class="category-item"
+        >
+          <v-expansion-panel-header>
+            {{ item.name }}
+          </v-expansion-panel-header>
+          <v-expansion-panel-content>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+          </v-expansion-panel-content>
+        </v-expansion-panel>
+      </draggable>
+    </v-expansion-panels>
+
+  </div>
+</template>
+
+<script>
+import draggable from 'vuedraggable'
+import {
+  mdiContentSave,
+  mdiPlus,
+} from '@mdi/js'
+import axios from "axios";
+
+export default {
+  name: "Category",
+  components:{
+    draggable
+  },
+  data() {
+    return {
+      icons: {
+        mdiContentSave,
+        mdiPlus,
+      },
+      categoryList: [
+        {
+          name: 'cc',
+          no: 1,
+        },
+        {
+          name: 'bb',
+          no: 2,
+        },
+        {
+          name: 'aa',
+          no: 3,
+        },
+      ],
+    }
+  },
+  methods:{
+    clickAdd:function (){
+      alert();
+    },
+    clickSave:function (){
+
+
+    },
+  },
+  created() {
+    var vm =this;
+    axios({
+      method:'get',
+      url:'http://localhost:8001/store-service/category',
+      responseType:'json'
+    })
+    .then(function (response) {
+      console.log(response.data.data)
+      vm.categoryList = response.data.data;
+    });
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file