pref: 修改 perms actions组件

src/components/AutoDataForm/utils.js

@@ -4,6 +4,7 @@ import ObjectSelect2 from '@/components/FormFields/NestedObjectSelect2'
 import NestedField from '@/components/AutoDataForm/components/NestedField'
 import Switcher from '@/components/FormFields/Switcher'
 import rules from '@/components/DataForm/rules'
+import BasicTree from '@/components/FormFields/BasicTree'
 import { assignIfNot } from '@/utils/common'
 
 export class FormFieldGenerator {
@@ -26,6 +27,10 @@ export class FormFieldGenerator {
         console.log('multiple choice: ', field.options)
         type = 'checkbox-group'
         break
+      case 'tree':
+        field.el.tree = fieldRemoteMeta.tree
+        field.component = BasicTree
+        break
       case 'datetime':
         type = 'date-picker'
         field.el = {

src/components/FormFields/BasicTree.vue

@@ -0,0 +1,61 @@
+<template>
+  <el-tree
+    :data="tree"
+    show-checkbox
+    node-key="value"
+    :default-expand-all="false"
+    :default-expanded-keys="iValue"
+    :default-checked-keys="iValue"
+    :props="defaultProps"
+    @check="handleCheckChange"
+  />
+
+</template>
+
+<script>
+export default {
+  props: {
+    value: {
+      type: Array,
+      default: () => []
+    },
+    tree: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      defaultProps: {
+        children: 'children',
+        label: 'label'
+      }
+    }
+  },
+  computed: {
+    iValue() {
+      return this.value.map(item => {
+        if (item.value) {
+          return item.value
+        }
+        return item
+      })
+    }
+  },
+  methods: {
+    handleCheckChange(node, { checkedNodes }) {
+      const checkedKeys = checkedNodes
+        .filter(item => !item.children)
+        .map(node => node.value)
+      if (checkedKeys.length !== 0) {
+        checkedKeys.push('connect')
+      }
+      this.$emit('input', checkedKeys)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/layout/components/GenericCreateUpdateForm/index.vue

@@ -11,6 +11,7 @@
     v-bind="$attrs"
     v-on="$listeners"
     @submit="handleSubmit"
+    @afterRemoteMeta="handleAfterRemoteMeta"
   />
 </template>
 <script>
@@ -48,6 +49,11 @@ export default {
       type: Function,
       default: (value) => value
     },
+    // 获取 meta
+    afterGetRemoteMeta: {
+      type: Function,
+      default: null
+    },
     // 当提交的时候，怎么处理
     onSubmit: {
       type: Function,
@@ -302,6 +308,11 @@ export default {
       }
       return values
     },
+    handleAfterRemoteMeta(meta) {
+      if (this.afterGetRemoteMeta) {
+        return this.afterGetRemoteMeta(meta)
+      }
+    },
     handleSubmit(values, formName, addContinue) {
       let handler = this.onSubmit || this.defaultOnSubmit
       handler = handler.bind(this)

src/router/console/accounts.js

@@ -210,56 +210,6 @@ export default [
           title: i18n.t('xpack.ChangeAuthPlan.ExecutionDetail'),
           permissions: ['xpack.view_changeauthplanexecution']
         }
-      },
-      {
-        path: 'app-plan',
-        component: () => import('@/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/AppChangeAuthPlanList.vue'),
-        name: 'AppChangeAuthPlanList',
-        meta: {
-          title: i18n.t('xpack.ChangeAuthPlan.AppChangeAuthPlan'),
-          permissions: ['xpack.view_applicationchangeauthplan']
-        },
-        hidden: true
-      },
-      {
-        path: 'app-plan/create',
-        component: () => import('@/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/AppChangeAuthPlanCreateUpdate.vue'),
-        name: 'AppChangeAuthPlanCreate',
-        meta: {
-          title: i18n.t('xpack.ChangeAuthPlan.AppChangeAuthPlanCreate'),
-          permissions: ['xpack.add_applicationchangeauthplan']
-        },
-        hidden: true
-      },
-      {
-        path: 'app-plan/:id',
-        component: () => import('@/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/index.vue'),
-        name: 'AppChangeAuthPlanDetail',
-        meta: {
-          title: i18n.t('xpack.ChangeAuthPlan.AppChangeAuthPlan'),
-          permissions: ['xpack.view_applicationchangeauthplan']
-        },
-        hidden: true
-      },
-      {
-        path: 'app-plan/:id/update',
-        component: () => import('@/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/AppChangeAuthPlanCreateUpdate.vue'),
-        name: 'AppChangeAuthPlanUpdate',
-        meta: {
-          title: i18n.t('xpack.ChangeAuthPlan.AppChangeAuthPlanUpdate'),
-          permissions: ['xpack.change_applicationchangeauthplan']
-        },
-        hidden: true
-      },
-      {
-        path: 'app-plan-execution/:id',
-        component: () => import('@/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/AppChangeAuthPlanExecution/ChangeAuthPlanExecutionDetail/index.vue'),
-        name: 'AppChangeAuthPlanExecutionDetail',
-        meta: {
-          title: i18n.t('xpack.ChangeAuthPlan.ExecutionDetail'),
-          permissions: ['xpack.view_applicationchangeauthplanexecution']
-        },
-        hidden: true
       }
     ]
   },

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/AppChangeAuthPlanCreateUpdate.vue

@@ -1,107 +0,0 @@
-<template>
-  <GenericCreateUpdatePage v-bind="$data" />
-</template>
-
-<script>
-import { GenericCreateUpdatePage } from '@/layout/components'
-import getFields from '@/views/accounts/ChangeAuthPlan/fields'
-
-export default {
-  name: 'AppChangeAuthPlanCreateUpdate',
-  components: {
-    GenericCreateUpdatePage
-  },
-  data() {
-    const fields = getFields.bind(this)()
-    return {
-      url: '/api/v1/xpack/change-auth-plan/app-plan/',
-      fields: [
-        [this.$t('common.Basic'), ['name']],
-        [this.$t('assets.Applications'), ['category', 'type', 'apps', 'system_users']],
-        [this.$t('xpack.ChangeAuthPlan.PasswordStrategy'), ['password_strategy', 'password', 'password_rules']],
-        [this.$t('xpack.Timer'), ['is_periodic', 'crontab', 'interval']],
-        [this.$t('common.Other'), ['recipients', 'comment']]
-      ],
-      initial: {
-        type: this.$route.query.type,
-        category: this.$route.query.category,
-        password_strategy: 'custom',
-        is_periodic: true,
-        password_rules: {
-          length: 30
-        },
-        interval: 24
-      },
-      fieldsMeta: {
-        type: {
-          type: 'select',
-          disabled: true
-        },
-        category: {
-          hidden: () => true
-        },
-        apps: {
-          label: this.$t('assets.Applications'),
-          el: {
-            value: [],
-            ajax: {
-              url: `/api/v1/applications/applications/?category=${this.$route.query.category}&type=${this.$route.query.type}`,
-              transformOption: (item) => {
-                return { label: item.name + ' (' + item.type_display + ')', value: item.id }
-              }
-            }
-          }
-        },
-        system_users: {
-          el: {
-            value: [],
-            ajax: {
-              url: (function() {
-                let url = '/api/v1/assets/system-users/'
-                const queryType = this.$route.query.type
-                if (this.$route.query.category === 'remote_app') {
-                  url += `?protocol=rdp`
-                } else if (queryType) {
-                  url += `?protocol=${queryType}`
-                }
-                return url
-              }.bind(this)()),
-              transformOption: (item) => {
-                if (this.$route.query.type === 'k8s') {
-                  return { label: item.name, value: item.id }
-                }
-                const username = item.username || '*'
-                return { label: item.name + '(' + username + ')', value: item.id }
-              }
-            }
-          }
-        },
-        password: fields.password,
-        password_rules: fields.database_password_rules,
-        is_periodic: fields.is_periodic,
-        password_strategy: fields.password_strategy,
-        crontab: fields.crontab,
-        interval: fields.interval,
-        recipients: fields.recipients
-      },
-      createSuccessNextRoute: { name: 'ChangeAuthPlanIndex' },
-      updateSuccessNextRoute: { name: 'ChangeAuthPlanIndex' },
-      cleanFormValue(data) {
-        if (data['password_strategy'] === 'custom') {
-          delete data['password_rules']
-        } else {
-          delete data['password']
-        }
-        if (data['interval'] === '') {
-          delete data['interval']
-        }
-        return data
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/AppChangeAuthPlanList.vue

@@ -1,147 +0,0 @@
-<template>
-  <GenericListTable :table-config="tableConfig" :header-actions="headerActions" />
-</template>
-
-<script>
-import { GenericListTable } from '@/layout/components'
-import { DetailFormatter } from '@/components/TableFormatters'
-import { openTaskPage } from '@/utils/jms'
-import { AppPlanDatabase } from '@/views/applications/const'
-
-export default {
-  name: 'AppChangeAuthPlanList',
-  components: {
-    GenericListTable
-  },
-  data() {
-    const vm = this
-    return {
-      tableConfig: {
-        permissions: {
-          'app': 'xpack',
-          'resource': 'applicationchangeauthplan'
-        },
-        url: '/api/v1/xpack/change-auth-plan/app-plan/',
-        columns: [
-          'name', 'password_strategy_display', 'is_periodic', 'periodic_display',
-          'run_times', 'comment', 'org_name', 'actions'
-        ],
-        columnsShow: {
-          min: ['name', 'actions'],
-          default: [
-            'name', 'password_strategy_display', 'is_periodic',
-            'periodic_display', 'run_times', 'actions'
-          ]
-        },
-        columnsMeta: {
-          name: {
-            formatter: DetailFormatter,
-            formatterArgs: {
-              route: 'AppChangeAuthPlanDetail'
-            }
-          },
-          systemuser_display: {
-            label: vm.$t('xpack.ChangeAuthPlan.SystemUser'),
-            width: '300px',
-            showOverflowTooltip: true
-          },
-          password_strategy_display: {
-            label: vm.$t('xpack.ChangeAuthPlan.PasswordStrategy'),
-            width: '220px',
-            showOverflowTooltip: true
-          },
-          is_periodic: {
-            label: vm.$t('xpack.ChangeAuthPlan.Timer'),
-            formatterArgs: {
-              showFalse: false
-            },
-            width: '80px'
-          },
-          periodic_display: {
-            label: vm.$t('xpack.ChangeAuthPlan.TimerPeriod'),
-            showOverflowTooltip: true,
-            width: '150px'
-          },
-          run_times: {
-            label: vm.$t('xpack.ChangeAuthPlan.ExecutionTimes'),
-            width: '87px',
-            formatter: DetailFormatter,
-            formatterArgs: {
-              route: 'AppChangeAuthPlanDetail',
-              routeQuery: {
-                activeTab: 'AppChangeAuthPlanExecutionList'
-              }
-            }
-          },
-          comment: {
-            width: '90px'
-          },
-          actions: {
-            width: '164px',
-            formatterArgs: {
-              onClone: ({ row }) => {
-                vm.$router.push({
-                  name: 'AppChangeAuthPlanCreate',
-                  query: {
-                    clone_from: row.id,
-                    category: row.category.toLowerCase(),
-                    type: row.type.toLowerCase()
-                  }
-                })
-              },
-              onUpdate: ({ row }) => {
-                vm.$router.push({
-                  name: 'AppChangeAuthPlanUpdate',
-                  params: { id: row.id },
-                  query: {
-                    category: row.category.toLowerCase(),
-                    type: row.type.toLowerCase()
-                  }
-                })
-              },
-              extraActions: [
-                {
-                  title: vm.$t('xpack.Execute'),
-                  name: 'execute',
-                  can: this.$hasPerm('xpack.add_applicationchangeauthplanexecution'),
-                  type: 'info',
-                  callback: function({ row }) {
-                    this.$axios.post(
-                      `/api/v1/xpack/change-auth-plan/app-plan-execution/`,
-                      { plan: row.id }
-                    ).then(res => {
-                      openTaskPage(res['task'])
-                    })
-                  }.bind(this)
-                }
-              ]
-            }
-          }
-        }
-      },
-      headerActions: {
-        hasRefresh: true,
-        hasExport: false,
-        hasImport: false,
-        hasMoreActions: false,
-        searchConfig: {
-          getUrlQuery: false
-        },
-        moreCreates: {
-          callback: (option) => {
-            vm.$router.push({ name: 'AppChangeAuthPlanCreate', query: {
-              category: option.category.toLowerCase(),
-              type: option.name.toLowerCase()
-            }})
-          },
-          dropdown: AppPlanDatabase
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/AppChangeAuthPlanExecution/ChangeAuthPlanExecutionDetail/ChangeAuthPlanExecutionInfo.vue

@@ -1,72 +0,0 @@
-<template>
-  <el-row :gutter="20">
-    <el-col :md="14" :sm="24">
-      <DetailCard :items="detailItems" />
-    </el-col>
-  </el-row>
-</template>
-
-<script>
-import DetailCard from '@/components/DetailCard'
-import { toSafeLocalDateStr } from '@/utils/common'
-
-export default {
-  name: 'AppChangeAuthPlanExecutionInfo',
-  components: {
-    DetailCard
-  },
-  props: {
-    object: {
-      type: Object,
-      default: () => ({})
-    }
-  },
-  data() {
-    return {
-    }
-  },
-  computed: {
-    detailItems() {
-      return [
-        {
-          key: this.$t('xpack.ChangeAuthPlan.Database'),
-          value: this.object.apps_display.join(', ')
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.SystemUser'),
-          value: this.object.system_users_display.join(', ')
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.AppAmount'),
-          value: this.object.apps_amount
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.SystemUserAmount'),
-          value: this.object.system_users_amount
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.PasswordStrategy'),
-          value: this.object.password_strategy_display
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.TimeDelta'),
-          value: this.object.timedelta.toFixed(2) + 's'
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.DateStart'),
-          value: toSafeLocalDateStr(this.object.date_start)
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.MailRecipient'),
-          value: this.object.recipients ? this.object.recipients.map(
-            i => `${i[0]}` + `${i[1] ? ': ' + this.$t('xpack.ChangeAuthPlan.ContainAttachment') : ''}`).join(', ') : ''
-        }
-      ]
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/AppChangeAuthPlanExecution/ChangeAuthPlanExecutionDetail/ChangeAuthPlanExecutionTaskList.vue

@@ -1,96 +0,0 @@
-<template>
-  <GenericListTable :table-config="tableConfig" :header-actions="headerActions" />
-</template>
-
-<script>
-import GenericListTable from '@/layout/components/GenericListTable'
-
-export default {
-  name: 'AppChangeAuthPlanExecutionTaskList',
-  components: {
-    GenericListTable
-  },
-  props: {
-    object: {
-      type: Object,
-      required: true,
-      default: () => ({})
-    }
-  },
-  data() {
-    return {
-      tableConfig: {
-        url: `/api/v1/xpack/change-auth-plan/app-plan-execution-subtask/?plan_execution_id=${this.object.id}`,
-        columns: [
-          'app_display', 'system_user_display', 'is_success', 'timedelta', 'date_start', 'reason_display', 'actions'
-        ],
-        columnsMeta: {
-          app_display: {
-            label: this.$t('xpack.ChangeAuthPlan.Database'),
-            formatter: function(row, column, cellValue, index) {
-              const to = {
-                name: 'DatabaseAppDetail',
-                params: { id: row.app }
-              }
-              return <router-link to={ to } >{ row.app_display }</router-link>
-            }
-          },
-          reason_display: {
-            label: this.$t('xpack.AccountBackupPlan.Reason')
-          },
-          system_user_display: {
-            label: this.$t('xpack.ChangeAuthPlan.SystemUser')
-          },
-          is_success: {
-            label: this.$t('xpack.ChangeAuthPlan.Success')
-          },
-          timedelta: {
-            label: this.$t('xpack.ChangeAuthPlan.TimeDelta'),
-            width: '90px',
-            formatter: function(row) {
-              return row.timedelta.toFixed(2) + 's'
-            }
-          },
-          actions: {
-            formatterArgs: {
-              hasDelete: false,
-              hasUpdate: false,
-              hasClone: false,
-              extraActions: [
-                {
-                  name: 'retry',
-                  type: 'info',
-                  title: this.$t('xpack.ChangeAuthPlan.Retry'),
-                  can: this.$hasPerm('xpack.change_applicationchangeauthplantask'),
-                  callback: function({ row, tableData }) {
-                    this.$axios.put(
-                      `/api/v1/xpack/change-auth-plan/app-plan-execution-subtask/${row.id}/`,
-                    ).then(res => {
-                      window.open(`/#/ops/celery/task/${res.task}/log/`, '_blank', 'toolbar=yes, width=900, height=600')
-                    })
-                  }.bind(this)
-                }
-              ]
-            }
-          }
-        }
-      },
-      headerActions: {
-        hasSearch: true,
-        hasRefresh: true,
-        hasLeftActions: true,
-        hasRightActions: true,
-        hasExport: false,
-        hasImport: false,
-        hasCreate: false,
-        hasBulkDelete: false,
-        hasBulkUpdate: false
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/AppChangeAuthPlanExecution/ChangeAuthPlanExecutionDetail/index.vue

@@ -1,55 +0,0 @@
-<template>
-  <GenericDetailPage :object.sync="execution" :active-menu.sync="config.activeMenu" v-bind="config" v-on="$listeners">
-    <keep-alive>
-      <component :is="config.activeMenu" :object="execution" />
-    </keep-alive>
-  </GenericDetailPage>
-</template>
-
-<script>
-import { GenericDetailPage } from '@/layout/components'
-import AppChangeAuthPlanExecutionInfo from './ChangeAuthPlanExecutionInfo'
-import AppChangeAuthPlanExecutionTaskList from './ChangeAuthPlanExecutionTaskList'
-
-export default {
-  name: 'AppChangeAuthPlanExecutionDetail',
-  components: {
-    GenericDetailPage,
-    AppChangeAuthPlanExecutionInfo,
-    AppChangeAuthPlanExecutionTaskList
-  },
-  data() {
-    return {
-      execution: { id: '' },
-      config: {
-        activeMenu: 'AppChangeAuthPlanExecutionInfo',
-        actions: {
-          hasUpdate: false,
-          hasDelete: false
-        },
-        submenu: [
-          {
-            title: this.$t('common.BasicInfo'),
-            name: 'AppChangeAuthPlanExecutionInfo'
-          },
-          {
-            title: this.$t('xpack.ChangeAuthPlan.TaskList'),
-            name: 'AppChangeAuthPlanExecutionTaskList'
-          }
-        ],
-        getTitle: this.getExecutionTitle
-
-      }
-    }
-  },
-  methods: {
-    getExecutionTitle() {
-      return `${this.$route.meta.title}: ${this.execution.id}`
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/AppChangeAuthPlanExecution/ChangeAuthPlanExecutionList.vue

@@ -1,124 +0,0 @@
-<template>
-  <GenericListTable :table-config="tableConfig" :header-actions="headerActions" />
-</template>
-
-<script>
-import GenericListTable from '@/layout/components/GenericListTable'
-
-export default {
-  name: 'AppChangeAuthPlanExecutionList',
-  components: {
-    GenericListTable
-  },
-  props: {
-    object: {
-      type: Object,
-      required: true,
-      default: () => ({})
-    }
-  },
-  data() {
-    return {
-      tableConfig: {
-        url: `/api/v1/xpack/change-auth-plan/app-plan-execution/?plan_id=${this.object.id}`,
-        columns: [
-          'username', 'result_summary', 'password_strategy_display', 'timedelta', 'trigger_display',
-          'apps_amount', 'system_users_amount', 'date_start', 'actions'
-        ],
-        columnsShow: {
-          min: ['actions'],
-          default: [
-            'username', 'password_strategy_display',
-            'timedelta', 'trigger_display', 'date_start', 'actions', 'result_summary'
-          ]
-        },
-        columnsMeta: {
-          username: {
-            label: this.$t('xpack.ChangeAuthPlan.Username')
-          },
-          apps_amount: {
-            label: this.$t('xpack.ChangeAuthPlan.AppAmount')
-          },
-          system_users_amount: {
-            label: this.$t('xpack.ChangeAuthPlan.SystemUserAmount')
-          },
-          systemusers: {
-            label: this.$t('xpack.ChangeAuthPlan.SystemUser')
-          },
-          result_summary: {
-            label: this.$t('xpack.ChangeAuthPlan.Result'),
-            width: '80px',
-            showOverflowTooltip: true,
-            formatter: function(row) {
-              const summary = <div>
-                <span class='text-primary'>{row.result_summary.succeed}</span>/
-                <span class='text-danger'>{row.result_summary.failed}</span>/
-                <span>{row.result_summary.total}</span>
-              </div>
-              return summary
-            }
-          },
-          password_strategy_display: {
-            label: this.$t('xpack.ChangeAuthPlan.PasswordStrategy'),
-            width: '220px',
-            showOverflowTooltip: true
-          },
-          timedelta: {
-            label: this.$t('xpack.ChangeAuthPlan.TimeDelta'),
-            width: '90px',
-            formatter: function(row) {
-              return row.timedelta.toFixed(2) + 's'
-            }
-          },
-          date_start: {
-            showOverflowTooltip: true
-          },
-          actions: {
-            formatterArgs: {
-              hasDelete: false,
-              hasUpdate: false,
-              hasClone: false,
-              extraActions: [
-                {
-                  name: 'log',
-                  type: 'primary',
-                  can: 'xpack.view_applicationchangeauthplanexecution',
-                  title: this.$t('xpack.ChangeAuthPlan.Log'),
-                  callback: function({ row }) {
-                    window.open(`/#/ops/celery/task/${row.id}/log/`, '_blank', 'toolbar=yes, width=900, height=600')
-                  }
-                },
-                {
-                  name: 'detail',
-                  title: this.$t('xpack.ChangeAuthPlan.Detail'),
-                  type: 'info',
-                  can: this.$hasPerm('xpack.view_applicationchangeauthplantask'),
-                  callback: function({ row }) {
-                    return this.$router.push({ name: 'AppChangeAuthPlanExecutionDetail', params: { id: row.id }})
-                  }
-                }
-              ]
-            }
-          }
-        }
-      },
-      headerActions: {
-        hasSearch: true,
-        hasRefresh: true,
-        hasRightActions: true,
-        hasLeftActions: true,
-        hasMoreActions: false,
-        hasExport: false,
-        hasImport: false,
-        hasCreate: false,
-        hasBulkDelete: false,
-        hasBulkUpdate: false
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/AppChangeAuthPlanInfo.vue

@@ -1,102 +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'
-import { toSafeLocalDateStr } from '@/utils/common'
-
-export default {
-  name: 'AppChangeAuthPlanInfo',
-  components: {
-    DetailCard,
-    QuickActions
-  },
-  props: {
-    object: {
-      type: Object,
-      required: true,
-      default: () => ({})
-    }
-  },
-  data() {
-    return {
-      quickActions: [
-        {
-          title: this.$t('xpack.ChangeAuthPlan.ManualExecutePlan'),
-          attrs: {
-            type: 'primary',
-            label: this.$t('xpack.ChangeAuthPlan.Execute'),
-            disabled: !this.$hasPerm('xpack.add_applicationchangeauthplanexecution')
-          },
-          callbacks: {
-            click: function() {
-              this.$axios.post(
-                `/api/v1/xpack/change-auth-plan/app-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.SystemUser'),
-          value: this.object.systemuser_display
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.PasswordStrategy'),
-          value: this.object.password_strategy_display
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.RegularlyPerform'),
-          value: this.object.crontab,
-          formatter: (item, val) => {
-            return <span>{this.object.is_periodic ? val : ''}</span>
-          }
-        },
-        {
-          key: this.$t('xpack.ChangeAuthPlan.CyclePerform'),
-          value: this.object.interval,
-          formatter: (item, val) => {
-            return <span>{this.object.is_periodic ? val : ''}</span>
-          }
-        },
-        {
-          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('common.Comment'),
-          value: this.object.comment
-        }
-      ]
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/ChangeAuthPlanDetail/index.vue

@@ -1,68 +0,0 @@
-<template>
-  <GenericDetailPage :object.sync="plan" :active-menu.sync="config.activeMenu" v-bind="config">
-    <keep-alive>
-      <component :is="config.activeMenu" :object="plan" />
-    </keep-alive>
-  </GenericDetailPage>
-</template>
-
-<script>
-import { GenericDetailPage } from '@/layout/components'
-import ChangeAuthPlanDatabase from './ChangeAuthPlanApp/index'
-import AppChangeAuthPlanInfo from './AppChangeAuthPlanInfo'
-import AppChangeAuthPlanExecutionList from './AppChangeAuthPlanExecution/ChangeAuthPlanExecutionList'
-
-export default {
-  name: 'AppChangeAuthPlanDetail',
-  components: {
-    GenericDetailPage,
-    ChangeAuthPlanDatabase,
-    AppChangeAuthPlanInfo,
-    AppChangeAuthPlanExecutionList
-  },
-  data() {
-    const vm = this
-    return {
-      plan: { name: '', comment: '' },
-      config: {
-        activeMenu: 'AppChangeAuthPlanInfo',
-        submenu: [
-          {
-            title: this.$t('common.BasicInfo'),
-            name: 'AppChangeAuthPlanInfo',
-            hidden: !this.$hasPerm('xpack.view_applicationchangeauthplan')
-          },
-          {
-            title: this.$t('xpack.ChangeAuthPlan.SystemUser'),
-            name: 'ChangeAuthPlanDatabase',
-            hidden: !this.$hasPerm('xpack.change_applicationchangeauthplan')
-          },
-          {
-            title: this.$t('xpack.ChangeAuthPlan.ExecutionList'),
-            name: 'AppChangeAuthPlanExecutionList',
-            hidden: !this.$hasPerm('xpack.view_applicationchangeauthplanexecution')
-          }
-        ],
-        actions: {
-          updateCallback: () => {
-            const id = this.$route.params.id
-            const routeName = 'AppChangeAuthPlanUpdate'
-            this.$router.push({
-              name: routeName,
-              params: { id: id },
-              query: {
-                category: vm.plan.category.toLowerCase(),
-                type: vm.plan.type.toLowerCase()
-              }
-            })
-          }
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

src/views/accounts/ChangeAuthPlan/AssetChangeAuthPlan/ChangeAuthPlanCreateUpdate.vue

@@ -4,7 +4,7 @@
 
 <script>
 import { GenericCreateUpdatePage } from '@/layout/components'
-import getFields from '@/views/accounts/ChangeAuthPlan/fields'
+import { getFields } from '@/views/accounts/ChangeAuthPlan/fields'
 
 export default {
   name: 'AssetChangeAuthPlanCreateUpdate',
@@ -12,59 +12,55 @@ export default {
     GenericCreateUpdatePage
   },
   data() {
-    const fields = getFields.bind(this)()
     return {
-      url: '/api/v1/xpack/change-auth-plan/plan/',
-      fields: [
-        [this.$t('common.Basic'), ['name']],
-        [this.$t('xpack.Asset'), ['username', 'assets', 'nodes']],
-        [this.$t('xpack.ChangeAuthPlan.PasswordStrategy'), ['is_password', 'password_strategy', 'password', 'password_rules']],
-        [this.$t('xpack.ChangeAuthPlan.SecretKeyStrategy'), ['is_ssh_key', 'ssh_key_strategy', 'private_key', 'passphrase']],
-        [this.$t('xpack.Timer'), ['is_periodic', 'crontab', 'interval']],
-        [this.$t('common.Other'), ['recipients', 'comment']]
-      ],
       initial: {
-        password_strategy: 'custom',
-        ssh_key_strategy: 'add',
         is_periodic: true,
-        is_password: true,
-        is_ssh_key: false,
         password_rules: {
           length: 30
         },
-        interval: 24
+        interval: 24,
+        secret_type: 'password',
+        secret_strategy: 'specific'
       },
+      url: '/api/v1/assets/change-secret-automations/',
+      fields: [
+        [this.$t('common.Basic'), ['name']],
+        [this.$t('xpack.Asset'), ['assets', 'nodes']],
+        [
+          this.$t('xpack.ChangeAuthPlan.SecretKeyStrategy'),
+          [
+            'secret_strategy', 'secret_type', 'secret',
+            'password_rules', 'ssh_key_change_strategy', 'ssh_key',
+            'passphrase'
+          ]
+        ],
+        [this.$t('xpack.Timer'), ['is_periodic', 'crontab', 'interval']],
+        [this.$t('common.Other'), ['is_active', 'recipients', 'comment']]
+      ],
       fieldsMeta: {
-        username: fields.username,
-        assets: fields.assets,
-        password: fields.password,
-        passphrase: fields.passphrase,
-        password_rules: fields.asset_password_rules,
-        private_key: fields.private_key,
-        nodes: fields.nodes,
-        is_periodic: fields.is_periodic,
-        is_password: fields.is_password,
-        is_ssh_key: fields.is_ssh_key,
-        password_strategy: fields.password_strategy,
-        ssh_key_strategy: fields.ssh_key_strategy,
-        crontab: fields.crontab,
-        interval: fields.interval,
-        recipients: fields.recipients
+        ...getFields()
       },
       createSuccessNextRoute: { name: 'ChangeAuthPlanIndex' },
       updateSuccessNextRoute: { name: 'ChangeAuthPlanIndex' },
+      afterGetRemoteMeta: this.handleAfterGetRemoteMeta,
       cleanFormValue(data) {
-        if (data['password_strategy'] === 'custom') {
-          delete data['password_rules']
-        } else {
-          delete data['password']
-        }
-        if (data['interval'] === '') {
-          delete data['interval']
+        const secretType = data.secret_type || ''
+        if (secretType !== 'password') {
+          data.secret = data[secretType]
+          delete data[secretType]
         }
         return data
       }
     }
+  },
+  methods: {
+    handleAfterGetRemoteMeta(meta) {
+      const needSetOptionFields = ['secret_type', 'secret_strategy', 'ssh_key_change_strategy']
+      for (const i of needSetOptionFields) {
+        const field = this.fieldsMeta[i] || {}
+        field.options = meta[i]?.choices || []
+      }
+    }
   }
 }
 </script>

src/views/accounts/ChangeAuthPlan/AssetChangeAuthPlan/ChangeAuthPlanList.vue

@@ -16,7 +16,7 @@ export default {
     const vm = this
     return {
       tableConfig: {
-        url: '/api/v1/xpack/change-auth-plan/plan/',
+        url: '/api/v1/assets/change-secret-automations/',
         columns: [
           'name', 'username', 'assets_amount', 'nodes_amount', 'password_strategy_display',
           'is_periodic', 'periodic_display', 'run_times', 'comment', 'org_name', 'actions'
@@ -91,7 +91,7 @@ export default {
                   type: 'info',
                   callback: function({ row }) {
                     this.$axios.post(
-                      `/api/v1/xpack/change-auth-plan/plan-execution/`,
+                      `/api/v1/assets/automation-executions/`,
                       { plan: row.id }
                     ).then(res => {
                       openTaskPage(res['task'])

src/views/accounts/ChangeAuthPlan/fields.js

@@ -1,6 +1,6 @@
 import i18n from '@/i18n/i18n'
-import { AssetSelect, CronTab, UploadKey } from '@/components'
-import { Select2, UpdateToken } from '@/components/FormFields'
+import { AssetSelect, CronTab } from '@/components'
+import { UpdateToken } from '@/components/FormFields'
 import { Required } from '@/components/DataForm/rules'
 
 var validatorInterval = (rule, value, callback) => {
@@ -13,28 +13,12 @@ var validatorInterval = (rule, value, callback) => {
 function getAssetPasswordRulesItems() {
   return [
     {
-      id: 'length', prop: 'length', label: i18n.t('xpack.ChangeAuthPlan.PasswordLength'),
-      rules: [Required], hidden: (formValue) => {
-        return ['random_one', 'random_all'].indexOf(formValue.password_strategy) === -1 || !formValue.is_password
-      }
-    }
-  ]
-}
-
-function getDatabasePasswordRulesItems() {
-  return [
-    {
-      id: 'length', prop: 'length', label: i18n.t('xpack.ChangeAuthPlan.PasswordLength'),
-      rules: [Required], hidden: (formValue) => {
-        return ['random_one', 'random_all'].indexOf(formValue.password_strategy) === -1
-      }
-    },
-    {
-      id: 'symbol_set', prop: 'symbol_set',
-      label: i18n.t('xpack.ChangeAuthPlan.SymbolSet'),
-      helpText: i18n.t('xpack.ChangeAuthPlan.SymbolSetHelpText'),
+      id: 'length',
+      prop: 'length',
+      label: i18n.t('xpack.ChangeAuthPlan.PasswordLength'),
+      rules: [Required],
       hidden: (formValue) => {
-        return ['random_one', 'random_all'].indexOf(formValue.password_strategy) === -1
+        return !['random_one', 'random_all'].includes(formValue.secret_strategy)
       }
     }
   ]
@@ -45,8 +29,6 @@ function generatePasswordRulesItemsFields(obType) {
   let items
   if (obType === 'asset') {
     items = getAssetPasswordRulesItems()
-  } else if (obType === 'database') {
-    items = getDatabasePasswordRulesItems()
   }
   items.forEach((item, index, array) => {
     itemsFields.push({
@@ -56,193 +38,103 @@ function generatePasswordRulesItemsFields(obType) {
   return itemsFields
 }
 
-function getFields() {
-  const username = {
-    helpText: i18n.t('xpack.ChangeAuthPlan.HelpText.UsernameOfCreateUpdatePage')
-  }
-
-  const assets = {
-    type: 'assetSelect',
-    component: AssetSelect,
-    rules: [
-      { required: false }
-    ],
-    label: i18n.t('xpack.Asset')
-  }
-
-  const database = {
-    component: Select2,
-    rules: [
-      { required: true }
-    ],
-    label: i18n.t('xpack.Database'),
-    el: {
-      multiple: false,
-      value: [],
-      ajax: {
-        url: '/api/v1/applications/applications/?category=db',
-        transformOption: (item) => {
-          return { label: item.name + '(' + item.type_display + ')', value: item.id, protocol: item.type }
-        }
-      }
-    },
-    on: {
-      changeOptions: ([event], updateform) => {
-        updateform({ systemuser: [] })
-        this.fieldsMeta.systemuser.el.ajax.url = `/api/v1/assets/system-users/?protocol=${event[0].protocol}`
-      }
-    }
-  }
-
-  const password = {
-    hidden: (formValue) => {
-      return formValue.password_strategy !== 'custom' || formValue.is_password === false
-    },
-    rules: [
-      { required: this.$route.meta.action === 'create', message: i18n.t('common.fieldRequiredError'), trigger: 'blur' }
-    ]
-  }
-
-  const passphrase = {
-    label: i18n.t('assets.Passphrase'),
-    component: UpdateToken,
-    hidden: (formValue) => {
-      return formValue.is_ssh_key === false
-    }
-  }
-
-  const asset_password_rules = {
-    type: 'group',
-    items: generatePasswordRulesItemsFields('asset')
-  }
-
-  const database_password_rules = {
-    type: 'group',
-    items: generatePasswordRulesItemsFields('database')
-  }
-
-  const private_key = {
-    component: UploadKey,
-    hidden: (formValue) => {
-      return formValue.is_ssh_key === false
-    },
-    rules: [
-      { required: this.$route.meta.action === 'create', message: this.$t('common.fieldRequiredError'), trigger: 'blur' }
-    ]
-  }
-
-  const recipients = {
-    label: i18n.t('xpack.ChangeAuthPlan.Addressee'),
-    helpText: i18n.t('xpack.ChangeAuthPlan.OnlyMailSend'),
-    el: {
-      value: [],
-      ajax: {
-        url: '/api/v1/users/users/?fields_size=mini',
-        transformOption: (item) => {
-          return { label: item.name + '(' + item.username + ')', value: item.id }
-        }
-      }
-    }
-  }
-
-  const nodes = {
-    label: i18n.t('xpack.Node'),
-    el: {
-      value: [],
-      ajax: {
-        url: '/api/v1/assets/nodes/',
-        transformOption: (item) => {
-          return { label: item.full_value, value: item.id }
-        }
-      }
-    }
-  }
-
-  const is_password = {
-    label: i18n.t('xpack.ChangeAuthPlan.ChangePassword'),
-    type: 'switch'
-  }
-
-  const is_ssh_key = {
-    label: i18n.t('xpack.ChangeAuthPlan.ModifySSHKey'),
-    type: 'switch'
-  }
-
-  const password_strategy = {
-    label: i18n.t('xpack.ChangeAuthPlan.PasswordStrategy'),
-    hidden: (formValue) => {
-      return formValue.is_password === false
-    }
-  }
-
-  const ssh_key_strategy = {
-    label: i18n.t('xpack.ChangeAuthPlan.SecretKeyStrategy'),
-    hidden: (formValue) => {
-      return formValue.is_ssh_key === false
-    }
-  }
-
-  const systemuser = {
-    component: Select2,
-    label: i18n.t('xpack.ChangeAuthPlan.SystemUser'),
-    rules: [
-      { required: true }
-    ],
-    el: {
-      value: [],
-      ajax: {
-        url: '/api/v1/assets/system-users/',
-        transformOption: (item) => {
-          return { label: item.name + '(' + item.username + ')', value: item.id }
-        }
-      }
-    }
-  }
-
-  const is_periodic = {
-    type: 'switch'
-  }
-
-  const crontab = {
-    type: 'cronTab',
-    component: CronTab,
-    label: i18n.t('xpack.RegularlyPerform'),
-    hidden: (formValue) => {
-      return formValue.is_periodic === false
-    },
-    helpText: i18n.t('xpack.HelpText.CrontabOfCreateUpdatePage')
-  }
-
-  const interval = {
-    label: i18n.t('xpack.CyclePerform'),
-    hidden: (formValue) => {
-      return formValue.is_periodic === false
-    },
-    helpText: i18n.t('xpack.HelpText.IntervalOfCreateUpdatePage'),
-    rules: [
-      { validator: validatorInterval }
-    ]
-  }
-
+export const getFields = () => {
   return {
-    username: username,
-    assets: assets,
-    database: database,
-    systemuser: systemuser,
-    password: password,
-    password_strategy: password_strategy,
-    ssh_key_strategy: ssh_key_strategy,
-    private_key: private_key,
-    passphrase: passphrase,
-    asset_password_rules: asset_password_rules,
-    database_password_rules: database_password_rules,
-    nodes: nodes,
-    is_password: is_password,
-    is_periodic: is_periodic,
-    is_ssh_key: is_ssh_key,
-    crontab: crontab,
-    interval: interval,
-    recipients: recipients
+    assets: {
+      type: 'assetSelect',
+      component: AssetSelect,
+      rules: [
+        { required: false }
+      ],
+      label: i18n.t('xpack.Asset')
+    },
+    passphrase: {
+      label: i18n.t('assets.Passphrase'),
+      component: UpdateToken,
+      hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'ssh_key')
+    },
+    password_rules: {
+      type: 'group',
+      items: generatePasswordRulesItemsFields('asset')
+    },
+    recipients: {
+      label: i18n.t('xpack.ChangeAuthPlan.Addressee'),
+      helpText: i18n.t('xpack.ChangeAuthPlan.OnlyMailSend'),
+      el: {
+        value: [],
+        ajax: {
+          url: '/api/v1/users/users/?fields_size=mini',
+          transformOption: (item) => {
+            return { label: item.name + '(' + item.username + ')', value: item.id }
+          }
+        }
+      }
+    },
+    nodes: {
+      label: i18n.t('xpack.Node'),
+      el: {
+        value: [],
+        ajax: {
+          url: '/api/v1/assets/nodes/',
+          transformOption: (item) => {
+            return { label: item.full_value, value: item.id }
+          }
+        }
+      }
+    },
+    password_strategy: {
+      label: i18n.t('xpack.ChangeAuthPlan.PasswordStrategy'),
+      hidden: (formValue) => {
+        return formValue.is_password === false
+      }
+    },
+    is_periodic: {
+      type: 'switch'
+    },
+    crontab: {
+      type: 'cronTab',
+      component: CronTab,
+      label: i18n.t('xpack.RegularlyPerform'),
+      hidden: (formValue) => {
+        return formValue.is_periodic === false
+      },
+      helpText: i18n.t('xpack.HelpText.CrontabOfCreateUpdatePage')
+    },
+    interval: {
+      label: i18n.t('xpack.CyclePerform'),
+      hidden: (formValue) => {
+        return formValue.is_periodic === false
+      },
+      helpText: i18n.t('xpack.HelpText.IntervalOfCreateUpdatePage'),
+      rules: [
+        { validator: validatorInterval }
+      ]
+    },
+    secret_strategy: {
+      type: 'radio-group',
+      options: []
+    },
+    secret_type: {
+      type: 'radio-group',
+      options: [],
+      hidden: (formValue) => formValue.secret_strategy !== 'specific'
+    },
+    secret: {
+      hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'password')
+    },
+    ssh_key: {
+      label: i18n.t('assets.PrivateKey'),
+      el: {
+        type: 'textarea',
+        rows: 4
+      },
+      hidden: (formValue) => formValue.secret_type !== 'ssh_key'
+    },
+    ssh_key_change_strategy: {
+      type: 'radio-group',
+      options: [],
+      hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'ssh_key')
+    }
   }
 }
 

src/views/accounts/ChangeAuthPlan/index.vue

@@ -20,12 +20,6 @@ export default {
             name: 'AssetChangeAuthPlanList',
             hidden: () => !this.$hasPerm('xpack.view_changeauthplan'),
             component: () => import('@/views/accounts/ChangeAuthPlan/AssetChangeAuthPlan/ChangeAuthPlanList.vue')
-          },
-          {
-            title: this.$t('xpack.ChangeAuthPlan.AppChangeAuthPlan'),
-            name: 'AppChangeAuthPlanList',
-            hidden: () => !this.$hasPerm('xpack.view_applicationchangeauthplan'),
-            component: () => import('@/views/accounts/ChangeAuthPlan/AppChangeAuthPlan/AppChangeAuthPlanList.vue')
           }
         ]
       }

src/views/perms/AssetPermission/components/PermissionFormActionField.vue

@@ -3,7 +3,7 @@
     :data="iData"
     show-checkbox
     node-key="id"
-    :default-expand-all="false"
+    :default-expand-all="true"
     :default-checked-keys="value"
     :props="defaultProps"
     v-bind="$attrs"