diff --git a/src/components/AccountListTable/index.vue b/src/components/AccountListTable/index.vue
index dd236016f..8f045d177 100644
--- a/src/components/AccountListTable/index.vue
+++ b/src/components/AccountListTable/index.vue
@@ -91,12 +91,12 @@ export default {
           resource: 'account'
         },
         columns: [
-          'asset', 'username', 'version', 'privileged',
+          'name', 'asset', 'username', 'version', 'privileged',
           'secret_type', 'date_created', 'date_updated', 'actions'
         ],
         columnsShow: {
-          min: ['username', 'actions'],
-          default: ['hostname', 'ip', 'username', 'version', 'privileged', 'actions']
+          min: ['name', 'username', 'actions'],
+          default: ['name', 'hostname', 'ip', 'username', 'version', 'privileged', 'actions']
         },
         columnsMeta: {
           asset: {
diff --git a/src/router/console/accounts.js b/src/router/console/accounts.js
index 7d5c72f5e..93e50772c 100644
--- a/src/router/console/accounts.js
+++ b/src/router/console/accounts.js
@@ -22,6 +22,13 @@ export default [
           permissions: ['assets.view_account']
         }
       },
+      {
+        path: ':id',
+        component: () => import('@/views/accounts/AssetAccount/AssetAccountDetail/index.vue'),
+        name: 'AssetAccountDetail',
+        meta: { title: i18n.t('route.AssetAccount') },
+        hidden: true
+      },
       {
         path: 'history',
         name: 'AssetAccountHistoryList',
diff --git a/src/views/accounts/AccountTemplate/AccountTemplateDetail/index.vue b/src/views/accounts/AccountTemplate/AccountTemplateDetail/index.vue
index 034698181..3d419d779 100644
--- a/src/views/accounts/AccountTemplate/AccountTemplateDetail/index.vue
+++ b/src/views/accounts/AccountTemplate/AccountTemplateDetail/index.vue
@@ -24,7 +24,7 @@ export default {
     return {
       object: {},
       config: {
-        url: '/api/v1/assets/account-templates/',
+        url: '/api/v1/assets/account-templates',
         activeMenu: 'Detail',
         submenu: [
           {
diff --git a/src/views/accounts/AssetAccount/AssetAccountDetail/Detail.vue b/src/views/accounts/AssetAccount/AssetAccountDetail/Detail.vue
new file mode 100644
index 000000000..5bfd1aa84
--- /dev/null
+++ b/src/views/accounts/AssetAccount/AssetAccountDetail/Detail.vue
@@ -0,0 +1,89 @@
+<template>
+  <el-row :gutter="20">
+    <el-col :md="14" :sm="24">
+      <DetailCard :items="detailCardItems" />
+    </el-col>
+    <el-col :md="10" :sm="24">
+      <QuickActions type="primary" :actions="quickActions" />
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+import DetailCard from '@/components/DetailCard'
+import QuickActions from '@/components/QuickActions'
+import { toSafeLocalDateStr } from '@/utils/common'
+
+export default {
+  name: 'Detail',
+  components: {
+    DetailCard,
+    QuickActions
+  },
+  props: {
+    object: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    const vm = this
+    return {
+      quickActions: [
+        {
+          title: this.$t('assets.PrivilegedTemplate'),
+          type: 'switcher',
+          attrs: {
+            model: vm.object.privileged,
+            disabled: !vm.$hasPerm('assets.change_account')
+          },
+          callbacks: Object.freeze({
+            change: (val) => {
+              this.$axios.patch(
+                `/api/v1/assets/accounts/${this.object.id}/`,
+                { name: this.object?.name, privileged: val }
+              ).then(res => {
+                this.$message.success(this.$t('common.updateSuccessMsg'))
+              })
+            }
+          })
+        }
+      ]
+    }
+  },
+  computed: {
+    detailCardItems() {
+      return [
+        {
+          key: this.$t('assets.Name'),
+          value: this.object.name
+        },
+        {
+          key: this.$t('users.Username'),
+          value: this.object.username
+        },
+        {
+          key: this.$t('assets.SecretType'),
+          value: this.object.secret_type
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.DateJoined'),
+          value: toSafeLocalDateStr(this.object.date_created)
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.DateUpdated'),
+          value: toSafeLocalDateStr(this.object.date_updated)
+        },
+        {
+          key: this.$t('assets.Comment'),
+          value: this.object.comment
+        }
+      ]
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/accounts/AssetAccount/AssetAccountDetail/index.vue b/src/views/accounts/AssetAccount/AssetAccountDetail/index.vue
new file mode 100644
index 000000000..dbfea4583
--- /dev/null
+++ b/src/views/accounts/AssetAccount/AssetAccountDetail/index.vue
@@ -0,0 +1,47 @@
+<template>
+  <GenericDetailPage
+    :object.sync="TaskDetail"
+    :active-menu.sync="config.activeMenu"
+    v-bind="config"
+    v-on="$listeners"
+  >
+    <keep-alive>
+      <component :is="config.activeMenu" :object="TaskDetail" />
+    </keep-alive>
+  </GenericDetailPage>
+</template>
+
+<script>
+import { GenericDetailPage, TabPage } from '@/layout/components'
+import Detail from './Detail.vue'
+
+export default {
+  components: {
+    GenericDetailPage,
+    TabPage,
+    Detail
+  },
+  data() {
+    return {
+      TaskDetail: {},
+      config: {
+        url: '/api/v1/assets/accounts',
+        activeMenu: 'Detail',
+        submenu: [
+          {
+            title: this.$t('common.BasicInfo'),
+            name: 'Detail'
+          }
+        ],
+        actions: {
+          hasUpdate: () => false
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>