diff --git a/frontend/src/pages/AppManagement.vue b/frontend/src/pages/AppManagement.vue
index 254efab..38ca627 100644
--- a/frontend/src/pages/AppManagement.vue
+++ b/frontend/src/pages/AppManagement.vue
@@ -39,11 +39,12 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, reactive } from 'vue';
+import { ref, onMounted, watch, reactive } from 'vue';
 import { api } from 'boot/axios';
 import { useAuthStore } from 'stores/useAuthStore';
 import { useFlowEditorStore } from 'stores/flowEditor';
 import { router } from 'src/router';
+import { date } from 'quasar'
 
 interface IUser{
    first_name:string;
@@ -78,7 +79,7 @@ const columns = [
   { name: 'url', label: 'URL', field: 'url', align: 'left', sortable: true },
   { name: 'user', label: '最後更新者', field: 'user', align: 'left', sortable: true},
   { name: 'updatetime', label: '最後更新日', field: 'updatetime', align: 'left', sortable: true},
-  { name: 'version', label: 'バージョン', field: 'version', align: 'left'},
+  { name: 'version', label: 'バージョン', field: 'version', align: 'left', sortable: true},
   { name: 'actions', label: '操作', field: 'actions' }
 ];
 
@@ -95,13 +96,14 @@ const getApps = async () => {
   const result = await api.get('api/apps');
   rows.value = result.data.map((item:IManagedApp) => {
     return {
-      id: item.appid,
+      id: Number(item.appid),
       name: item.appname,
       url: `${item.domainurl}/k/${item.appid}`,
       user: `${item.user.first_name} ${item.user.last_name}` ,
-      updatetime:item.update_time,
-      version: item.version }
-  });
+      updatetime:date.formatDate(item.update_time, 'YYYY/MM/DD HH:mm'),
+      version: Number(item.version)
+    }
+  }).sort((a, b) => a.id - b.id); // set default order
   loading.value = false;
 }
 
@@ -110,6 +112,10 @@ onMounted(async () => {
   await getApps();
 });
 
+watch(() => authStore.currentDomain.id, async () => {
+  await getApps();
+});
+
 const addRow = () => {
   return
 }