[Update] 完善改密计划详情页面（2）

src/i18n/langs/cn.json

@@ -608,13 +608,8 @@
     }
   },
   "xpack": {
-    "PasswordStrategy": "密码策略",
-    "PasswordLength": "密码长度",
-    "CyclePerform": "周期执行",
-    "RegularlyPerform": "定期执行",
     "Basic": "基本",
     "Other": "其他",
-    "Run": "执行",
     "Admin": "管理员",
     "AssetCount": "资产数量",
     "Auditor": "审计员",
@@ -625,11 +620,23 @@
     "AdminUser": "管理用户",
     "SystemUser": "系统用户",
     "Label": "标签",
+    "assetAndNode": "资产或节点",
     "ChangeAuthPlan": {
       "ChangeAuthPlan": "改密计划",
       "ChangeAuthPlanCreate": "创建改密计划",
       "ChangeAuthPlanUpdate": "更新改密计划",
-      "ChangeAuthPlanDetail": "改密计划详情"
+      "ChangeAuthPlanDetail": "改密计划详情",
+      "ExecutionList": "执行列表",
+      "Name": "名称",
+      "Username": "用户名",
+      "PasswordStrategy": "密码策略",
+      "PasswordLength": "密码长度",
+      "CyclePerform": "周期执行",
+      "RegularlyPerform": "定期执行",
+      "DateJoined": "创建日期",
+      "DateUpdated": "更新日期",
+      "ManualRunPlan": "手动执行计划",
+      "Run": "执行"
     },
     "Corporation": "公司",
     "Edition": "版本",

src/views/xpack/ChangeAuthPlan/ChangeAuthPlanCreateUpdate.vue

@@ -17,7 +17,7 @@ export default {
       fields: [
         [this.$t('xpack.Basic'), ['name']],
         [this.$t('xpack.Asset'), ['username', 'assets', 'nodes']],
-        [this.$t('xpack.PasswordStrategy'), ['password_strategy', 'password', 'password_rules_length']],
+        [this.$t('xpack.ChangeAuthPlan.PasswordStrategy'), ['password_strategy', 'password', 'password_rules_length']],
         [this.$t('xpack.Timer'), ['is_periodic', 'crontab', 'interval']],
         [this.$t('xpack.Other'), ['comment']]
       ],
@@ -46,7 +46,7 @@ export default {
         },
         password_rules_length: {
           type: 'input',
-          label: this.$t('xpack.PasswordLength'),
+          label: this.$t('xpack.ChangeAuthPlan.PasswordLength'),
           hidden: (formValue) => {
             return ['random_one', 'random_all'].indexOf(formValue.password_strategy) === -1
           }
@@ -72,7 +72,7 @@ export default {
           type: 'switch'
         },
         crontab: {
-          label: this.$t('xpack.RegularlyPerform'),
+          label: this.$t('xpack.ChangeAuthPlan.RegularlyPerform'),
           hidden: (formValue) => {
             return formValue.is_periodic === false
           },
@@ -86,7 +86,7 @@ export default {
             ''
         },
         interval: {
-          label: this.$t('xpack.CyclePerform'),
+          label: this.$t('xpack.ChangeAuthPlan.CyclePerform'),
           hidden: (formValue) => {
             return formValue.is_periodic === false
           },

src/views/xpack/ChangeAuthPlan/ChangeAuthPlanDetail/ChangeAuthPlanDetail.vue

@@ -1,57 +0,0 @@
-<template>
-  <el-row :gutter="20">
-    <el-col :md="14" :sm="24">
-      <DetailCard :items="detailItems" />
-    </el-col>
-    <el-col :md="10" :sm="24">
-      <QuickActions :actions="quickActions" type="primary" />
-    </el-col>
-  </el-row>
-</template>
-
-<script>
-import { DetailCard, QuickActions } from '@/components'
-
-export default {
-  name: 'ChangeAuthPlanInfo',
-  components: {
-    DetailCard,
-    QuickActions
-  },
-  props: {
-    object: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  data() {
-    return {
-      quickActions: [
-
-      ]
-    }
-  },
-  computed: {
-    detailItems() {
-      return [
-        {
-          key: 'name',
-          value: this.object.name
-        },
-        {
-          key: 'username',
-          value: this.object.username
-        },
-        {
-          key: 'password strategy',
-          value: this.object.password_strategy
-        }
-      ]
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/xpack/ChangeAuthPlan/ChangeAuthPlanDetail/ChangeAuthPlanInfo.vue

@@ -0,0 +1,94 @@
+<template>
+  <el-row :gutter="20">
+    <el-col :md="14" :sm="24">
+      <DetailCard :items="detailItems" />
+    </el-col>
+    <el-col :md="10" :sm="24">
+      <QuickActions :actions="quickActions" type="primary" />
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+import { DetailCard, QuickActions } from '@/components'
+
+export default {
+  name: 'ChangeAuthPlanInfo',
+  components: {
+    DetailCard,
+    QuickActions
+  },
+  props: {
+    object: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      quickActions: [
+        {
+          title: this.$t('xpack.ChangeAuthPlan.ManualRunPlan'),
+          attrs: {
+            type: 'primary',
+            label: this.$t('xpack.ChangeAuthPlan.Run')
+          },
+          callbacks: {
+            click: function() {
+              this.$axios.post(
+                `/api/v1/xpack/change-auth-plan/plan-execution/`,
+                { plan: this.object.id }
+              ).then(res => {
+                window.open(`/ops/celery/task/${res.task}/log/`, '_blank', 'toolbar=yes, width=900, height=600')
+              })
+            }.bind(this)
+          }
+        }
+      ]
+    }
+  },
+  computed: {
+    detailItems() {
+      return [
+        {
+          key: this.$t('xpack.ChangeAuthPlan.Name'),
+          value: this.object.name
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.Username'),
+          value: this.object.username
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.PasswordStrategy'),
+          value: this.object.password_strategy_display
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.RegularlyPerform'),
+          value: this.object.crontab
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.CyclePerform'),
+          value: this.object.interval
+
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.DateJoined'),
+          value: this.object.date_created
+        },
+        {
+          key: this.$t('xpack.ChangeAuthPlan.DateUpdated'),
+          value: this.object.date_updated
+        },
+        {
+          key: this.$t('common.Comment'),
+          value: this.object.comment
+        }
+      ]
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/xpack/ChangeAuthPlan/ChangeAuthPlanDetail/index.vue

@@ -8,12 +8,16 @@
 
 <script>
 import { GenericDetailPage } from '@/layout/components'
-import ChangeAuthPlanInfo from './ChangeAuthPlanDetail'
+import ChangeAuthPlanInfo from './ChangeAuthPlanInfo'
+import ChangeAuthPlanAsset from './ChangeAuthPlanAsset'
+import ChangeAuthPlanExecutionList from './ChangeAuthPlanExecution/ChangeAuthPlanExecutionList'
 
 export default {
   components: {
     GenericDetailPage,
-    ChangeAuthPlanInfo
+    ChangeAuthPlanInfo,
+    ChangeAuthPlanAsset,
+    ChangeAuthPlanExecutionList
   },
   data() {
     return {
@@ -24,6 +28,14 @@ export default {
           {
             title: this.$t('common.BasicInfo'),
             name: 'ChangeAuthPlanInfo'
+          },
+          {
+            title: this.$t('xpack.assetAndNode'),
+            name: 'ChangeAuthPlanAsset'
+          },
+          {
+            title: this.$t('xpack.ChangeAuthPlan.ExecutionList'),
+            name: 'ChangeAuthPlanExecutionList'
           }
         ]
       }

src/views/xpack/ChangeAuthPlan/ChangeAuthPlanList.vue

@@ -34,18 +34,17 @@ export default {
         actions: {
           extraActions: [
             {
-              title: vm.$t('xpack.Run'),
+              title: vm.$t('xpack.ChangeAuthPlan.Run'),
               name: 'run',
               type: 'info',
-              callback: function({ cellValue, tableData }) {
-                const newPage = vm.$router.resolve({
-                  name: 'CeleryTaskLog',
-                  query: {
-                    id: 12345678
-                  }
+              callback: function(data) {
+                this.$axios.post(
+                  `/api/v1/xpack/change-auth-plan/plan-execution/`,
+                  { plan: data.cellValue }
+                ).then(res => {
+                  window.open(`/ops/celery/task/${res.task}/log/`, '_blank', 'toolbar=yes, width=900, height=600')
                 })
-                window.open(newPage.href, '_blank', 'toolbar=yes, width=900, height=600')
-              }
+              }.bind(this)
             }
           ]
         }

src/views/xpack/router.js

@@ -106,7 +106,7 @@ export default {
           path: 'plan/:id',
           component: () => import('@/views/xpack/ChangeAuthPlan/ChangeAuthPlanDetail/index.vue'),
           name: 'ChangeAuthPlanDetail',
-          meta: { title: i18n.t('xpack.ChangeAuthPlanDetail'), activeMenu: '/xpack/change-auth-plan' },
+          meta: { title: i18n.t('xpack.ChangeAuthPlan.ChangeAuthPlan'), activeMenu: '/xpack/change-auth-plan' },
           hidden: true
         },
         {