fix: 改密计划创建表单增加用户名字段；抽离TagInput公共组件

src/components/FormFields/TagInput.vue

@@ -5,7 +5,7 @@
       :key="k"
       closable
       size="small"
-      type="info"
+      :type="tagType"
       :disable-transitions="true"
       @close="handleTagClose(v)"
       @click="handleTagClick(v,k)"
@@ -15,7 +15,7 @@
     <el-input
       ref="SearchInput"
       v-model.trim="filterValue"
-      :placeholder="$tc('perms.Input')"
+      :placeholder="placeholder"
       class="search-input"
       @blur="focus = false"
       @focus="focus = true"
@@ -26,16 +26,26 @@
 </template>
 
 <script>
+import i18n from '@/i18n/i18n'
+
 export default {
   props: {
-    customTag: {
+    value: {
       type: Array,
       default: () => []
+    },
+    tagType: {
+      type: String,
+      default: 'info'
+    },
+    placeholder: {
+      type: String,
+      default: () => i18n.t('perms.Input')
     }
   },
   data() {
     return {
-      filterTags: this.customTag,
+      filterTags: this.value,
       focus: false,
       filterValue: ''
     }
@@ -43,14 +53,14 @@ export default {
   methods: {
     handleTagClose(tag) {
       this.filterTags.splice(this.filterTags.indexOf(tag), 1)
-      this.$emit('tagSearch', this.filterTags)
+      this.$emit('change', this.filterTags)
     },
     handleConfirm() {
       if (this.filterValue === '') return
       if (!this.filterTags.includes(this.filterValue)) {
         this.filterTags.push(this.filterValue)
         this.filterValue = ''
-        this.$emit('tagSearch', this.filterTags)
+        this.$emit('change', this.filterTags)
       }
     },
     handleTagClick(v, k) {
@@ -67,7 +77,7 @@ export default {
 
 <style lang="scss" scoped>
   .el-tag + .el-tag {
-    margin-left: 10px;
+    margin-left: 4px;
   }
   .filter-field {
     display: flex;

src/components/FormFields/index.js

@@ -1,6 +1,7 @@
 import Link from './Link'
 import Text from './Text'
 import Select2 from './Select2'
+import TagInput from './TagInput'
 import Switcher from './Switcher'
 import UploadKey from './UploadKey'
 import JsonEditor from './JsonEditor'
@@ -17,6 +18,7 @@ export default {
   Link,
   Switcher,
   Select2,
+  TagInput,
   UploadKey,
   JsonEditor,
   UpdateToken,
@@ -33,6 +35,7 @@ export {
   Link,
   Switcher,
   Select2,
+  TagInput,
   UploadKey,
   JsonEditor,
   UpdateToken,

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

@@ -25,7 +25,7 @@ export default {
       url: '/api/v1/assets/change-secret-automations/',
       fields: [
         [this.$t('common.Basic'), ['name']],
-        [this.$t('xpack.Asset'), ['assets', 'nodes']],
+        [this.$t('xpack.Asset'), ['accounts', 'assets', 'nodes']],
         [
           this.$t('xpack.ChangeAuthPlan.SecretKeyStrategy'),
           [

src/views/accounts/ChangeAuthPlan/AssetChangeAuthPlan/ChangeAuthPlanDetail/ChangeAuthPlanExecution/ChangeAuthPlanExecutionDetail/ChangeAuthPlanExecutionTaskList.vue

@@ -22,7 +22,7 @@ export default {
     const vm = this
     return {
       tableConfig: {
-        url: `/api/v1/xpack/change-auth-plan/plan-execution-subtask/?plan_execution_id=${this.object.id}`,
+        url: `/api/v1/assets/change-secret-records/?execution_id=${this.object.id}`,
         columns: [
           'username', 'asset', 'is_success', 'timedelta', 'date_start', 'reason_display', 'actions'
         ],
@@ -69,7 +69,7 @@ export default {
                   can: vm.$hasPerm('xpack.change_changeauthplantask'),
                   callback: function({ row, tableData }) {
                     this.$axios.put(
-                      `/api/v1/xpack/change-auth-plan/plan-execution-subtask/${row.id}/`,
+                      `/api/v1/assets/change-secret-records/${row.id}/`,
                     ).then(res => {
                       window.open(`/#/ops/celery/task/${res.task}/log/`, '_blank', 'toolbar=yes, width=900, height=600')
                     })

src/views/accounts/ChangeAuthPlan/fields.js

@@ -1,6 +1,6 @@
 import i18n from '@/i18n/i18n'
 import { AssetSelect, CronTab } from '@/components'
-import { UpdateToken } from '@/components/FormFields'
+import { UpdateToken, TagInput } from '@/components/FormFields'
 import { Required } from '@/components/DataForm/rules'
 
 var validatorInterval = (rule, value, callback) => {
@@ -17,9 +17,7 @@ function getAssetPasswordRulesItems() {
       prop: 'length',
       label: i18n.t('xpack.ChangeAuthPlan.PasswordLength'),
       rules: [Required],
-      hidden: (formValue) => {
-        return !['random_one', 'random_all'].includes(formValue.secret_strategy)
-      }
+      hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'password')
     }
   ]
 }
@@ -32,8 +30,16 @@ function generatePasswordRulesItemsFields(obType) {
   }
   items.forEach((item, index, array) => {
     itemsFields.push({
-      id: item.id, prop: item.prop, el: {}, attrs: {}, type: 'input', label: item.label, rules: item.rules, helpText: item.helpText,
-      hidden: item.hidden })
+      id: item.id,
+      prop: item.prop,
+      el: {},
+      attrs: {},
+      type: 'input',
+      label: item.label,
+      rules: item.rules,
+      helpText: item.helpText,
+      hidden: item.hidden
+    })
   })
   return itemsFields
 }
@@ -116,8 +122,12 @@ export const getFields = () => {
     },
     secret_type: {
       type: 'radio-group',
-      options: [],
-      hidden: (formValue) => formValue.secret_strategy !== 'specific'
+      options: []
+    },
+    accounts: {
+      label: i18n.t('common.Username'),
+      component: TagInput,
+      helpText: i18n.t('xpack.ChangeAuthPlan.HelpText.UsernameOfCreateUpdatePage')
     },
     secret: {
       hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'password')
@@ -128,12 +138,13 @@ export const getFields = () => {
         type: 'textarea',
         rows: 4
       },
-      hidden: (formValue) => formValue.secret_type !== 'ssh_key'
+      hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'ssh_key')
+
     },
     ssh_key_change_strategy: {
       type: 'radio-group',
       options: [],
-      hidden: ({ secret_strategy, secret_type }) => (secret_strategy !== 'specific' || secret_type !== 'ssh_key')
+      hidden: ({ secret_strategy, secret_type }) => (secret_type !== 'ssh_key')
     }
   }
 }

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

@@ -13,14 +13,14 @@
     </el-checkbox-group>
     <TagInput
       v-if="showInput"
-      :custom-tag="customTags"
-      @tagSearch="handleTagChange"
+      :value="customTags"
+      @change="handleTagChange"
     />
   </div>
 </template>
 
 <script>
-import TagInput from './TagInput.vue'
+import { TagInput } from '@/components/FormFields'
 
 export default {
   components: {