perf: 修改 v3

src/components/AccountCreateForm/index.vue

@@ -1,7 +1,5 @@
 <template>
-  <div>
+  <AutoDataForm v-bind="$data" @submit="confirm" />
-    <AutoDataForm v-bind="$data" @submit="confirm" />
-  </div>
 </template>
 
 <script>
@@ -53,7 +51,8 @@ export default {
   },
   methods: {
     confirm(form) {
-      if (this.account && this.account._id) {
+      console.log('Account form: accout is: ', this.account)
+      if (this.account) {
         this.$emit('edit', form)
       } else {
         this.$emit('add', form)

src/components/AutoDataForm/index.vue

@@ -1,5 +1,12 @@
 <template>
-  <DataForm ref="dataForm" v-loading="loading" :fields="totalFields" :form="iForm" v-bind="$attrs" v-on="$listeners">
+  <DataForm
+    ref="dataForm"
+    v-loading="loading"
+    :fields="totalFields"
+    :form="iForm"
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
     <FormGroupHeader
       v-for="(group, i) in groups"
       :slot="'id:'+group.name"

src/components/AutoDataForm/utils.js

@@ -15,10 +15,10 @@ export class FormFieldGenerator {
       case 'choice':
         if (!fieldRemoteMeta.read_only) {
           field.options = fieldRemoteMeta.choices.map(v => {
-            return { label: v.display_name, value: v.value }
+            return { label: v.label, value: v.value }
           })
           // 因为现在的 detail 返回的 choice 是一个对象了 {label: '', value: ''}
-          if (type === 'display_choice') {
+          if (type === 'well_choice') {
             field.options = field.options.map(v => {
               v.value = { value: v.value }
               return v

src/components/AutoDataSearch/index.vue

@@ -71,12 +71,12 @@ export default {
           option.children = field.choices.map(item => {
             if (typeof (item.value) === 'boolean') {
               if (item.value) {
-                return { label: item.display_name, value: 'True' }
+                return { label: item.label, value: 'True' }
               } else {
-                return { label: item.display_name, value: 'False' }
+                return { label: item.label, value: 'False' }
               }
             }
-            return { label: item.display_name, value: item.value }
+            return { label: item.label, value: item.value }
           })
         }
         if (field.type === 'boolean') {

src/components/AutoDataTable/index.vue

@@ -193,12 +193,12 @@ export default {
           col.filters = column.choices.map(item => {
             if (typeof (item.value) === 'boolean') {
               if (item.value) {
-                return { text: item['display_name'], value: 'True' }
+                return { text: item['label'], value: 'True' }
               } else {
-                return { text: item['display_name'], value: 'False' }
+                return { text: item['label'], value: 'False' }
               }
             }
-            return { text: item['display_name'], value: item.value }
+            return { text: item['label'], value: item.value }
           })
           col.sortable = false
           col['column-key'] = col.prop

src/components/FormFields/AssetAccounts.vue

@@ -2,15 +2,20 @@
   <div class="accounts">
     <el-table :data="accounts" style="width: 100%">
       <el-table-column prop="username" label="用户名" width="180" />
-      <el-table-column prop="type" label="类型" />
+      <el-table-column prop="privileged" label="特权账号">
+        <template slot-scope="scope">
+          <i class="fa text-primary" :class="scope.row['privileged'] ? 'fa-check' : ''" />
+        </template>
+      </el-table-column>
       <el-table-column fixed="right" align="right" label="操作" width="135" class-name="buttons">
         <template slot-scope="scope">
           <el-button type="danger" icon="el-icon-minus" size="mini" @click="removeAccount(scope.row)" />
-          <el-button type="primary" icon="el-icon-edit" size="mini" @click="showEditDialog(scope.row)" />
+          <el-button type="primary" icon="el-icon-edit" size="mini" @click="onEditClick(scope.row)" />
         </template>
       </el-table-column>
     </el-table>
-    <el-button size="mini" type="primary" @click="showAddDialog">添加</el-button>
+    <el-button size="mini" type="primary" @click="onAddClick">添加</el-button>
+    <el-button size="mini" type="success" @click="onAddClick">模版添加</el-button>
     <Dialog
       v-if="visible"
       :title="this.$tc('assets.AddAccount')"
@@ -53,7 +58,7 @@ export default {
     return {
       visible: false,
       accounts: [],
-      account: null,
+      account: {},
       initial: false
     }
   },
@@ -73,7 +78,10 @@ export default {
   },
   methods: {
     addAccount(account) {
-      account._id = this.accounts.length + 1
+      const i = this.accounts.findIndex(item => item.username === account.username)
+      if (i !== -1) {
+        this.accounts.splice(i, 1)
+      }
       this.accounts.push(account)
       this.visible = false
     },
@@ -82,17 +90,22 @@ export default {
         return item._id !== account._id
       })
     },
-    editAccount(account) {
+    editAccount(form) {
-      this.accounts.splice(account._id, 1, account)
+      const i = this.accounts.findIndex(item => item.username === this.account.username)
+      this.accounts.splice(i, 1, form)
       this.visible = false
     },
-    showEditDialog(account) {
+    onEditClick(account) {
       this.account = account
-      this.visible = true
+      setTimeout(() => {
+        this.visible = true
+      })
     },
-    showAddDialog() {
+    onAddClick() {
       this.account = null
-      this.visible = true
+      setTimeout(() => {
+        this.visible = true
+      })
     }
   }
 }

src/components/FormFields/NestedObjectSelect2.vue

@@ -44,7 +44,6 @@ export default {
       get() {
         const value = this.objectsToValues(this.value)
         console.log('Nest get ivalue: ', value, 'Value: ', this.value)
-        console.log('Attrs: ', this.$attrs)
         return value
       }
     }

src/router/console/assets.js

@@ -15,13 +15,6 @@ export default [
         component: () => import('@/views/assets/Asset/AssetList/index.vue'),
         meta: { title: i18n.t('route.AssetList') }
       },
-      {
-        path: 'create',
-        name: 'AssetCreate',
-        component: () => import('@/views/assets/Asset/AssetCreateUpdate.vue'),
-        hidden: true,
-        meta: { title: i18n.t('route.AssetCreate') }
-      },
       {
         path: ':id',
         name: 'AssetDetail',
@@ -29,13 +22,6 @@ export default [
         hidden: true,
         meta: { title: i18n.t('route.AssetDetail') }
       },
-      {
-        path: ':id/update',
-        name: 'AssetUpdate',
-        component: () => import('@/views/assets/Asset/AssetCreateUpdate.vue'),
-        hidden: true,
-        meta: { title: i18n.t('route.AssetUpdate') }
-      },
       {
         path: 'detail/:id/update',
         name: 'AssetMoreInformationEdit',

src/views/assets/Asset/AssetCreateUpdate.vue

@@ -1,61 +0,0 @@
-<template>
-  <GenericCreateUpdatePage v-bind="$data" />
-</template>
-
-<script>
-import GenericCreateUpdatePage from '@/layout/components/GenericCreateUpdatePage'
-import { assetFieldsMeta } from '@/views/assets/const'
-
-export default {
-  name: 'AssetCreateUpdate',
-  components: {
-    GenericCreateUpdatePage
-  },
-  data() {
-    return {
-      initial: {},
-      fields: [
-        [this.$t('common.Basic'), ['name', 'ip', 'platform', 'domain']]
-        // [this.$t('assets.Protocol'), ['protocols']],
-        // [this.$t('assets.Node'), ['nodes']],
-        // this.$route.params.id ? null : [this.$t('assets.Account'), ['accounts']],
-        // [this.$t('assets.Label'), ['labels']],
-        // [this.$t('common.Other'), ['is_active', 'comment']]
-      ],
-      fieldsMeta: assetFieldsMeta(),
-      url: '/api/v1/assets/assets/',
-      createSuccessNextRoute: { name: 'AssetDetail', query: { 'activeTab': 'Account' }},
-      hasDetailInMsg: false
-    }
-  },
-  mounted() {
-    this.setPlatformInitial()
-  },
-  methods: {
-    async setPlatformInitial() {
-      const nodesInitial = []
-      if (this.$route.query['node']) {
-        nodesInitial.push(this.$route.query.node)
-      }
-      const platformId = this.$route.query['platform'] || 1
-      const url = `/api/v1/assets/platforms/${platformId}/`
-      this.platform = await this.$axios.get(url)
-      const initial = {
-        is_active: true,
-        platform: parseInt(platformId),
-        protocols: this.platform.protocols_default || ['ssh/22'],
-        nodes: nodesInitial,
-        domain: this.platform['domain_default']
-      }
-      const limits = this.platform['type_constraint']
-      this.fieldsMeta.protocols.el.choices = limits['protocols']
-      this.initial = initial
-      this.loading = false
-    }
-  }
-}
-</script>
-
-<style>
-
-</style>

src/views/assets/Asset/AssetCreateUpdate/HostCreateUpdate.vue

@@ -16,7 +16,9 @@ export default {
       loading: true,
       platform: {},
       initial: {
-        labels: []
+        labels: [],
+        is_active: true,
+        nodes: []
       },
       fields: [
         [this.$t('common.Basic'), ['name', 'ip', 'platform', 'domain']],
@@ -45,15 +47,15 @@ export default {
       const url = `/api/v1/assets/platforms/${platformId}/`
       this.platform = await this.$axios.get(url)
       const initial = {
-        is_active: true,
         platform: parseInt(platformId),
-        protocols: this.platform.protocols_default,
+        protocols: this.platform.protocols,
         nodes: nodesInitial,
         domain: this.platform.domain_default
       }
+      Object.assign(this.initial, initial)
+
       const constraints = this.platform['type_constraints']
       this.fieldsMeta.protocols.el.choices = constraints['protocols']
-      this.initial = initial
       this.loading = false
     }
   }

src/views/assets/Platform/PlatformCreateUpdate.vue

@@ -57,9 +57,6 @@ export default {
         [this.$t('assets.Protocol'), [
           'protocols_enabled', 'protocols'
         ]],
-        [this.$t('assets.Domain'), [
-          'domain_enabled', 'domain_default'
-        ]],
         [this.$t('assets.Account'), [
           'su_enabled', 'su_method',
           'verify_account_enabled', 'verify_account_method',
@@ -103,15 +100,6 @@ export default {
           },
           hidden: (formValue) => !formValue['protocols_enabled']
         },
-        domain_enabled: {
-          el: {
-            disabled: false
-          }
-        },
-        domain_default: {
-          ...assetMeta.domain,
-          hidden: (formValue) => !formValue['domain_enabled']
-        },
         verify_account_method: {
           hidden: (formValue) => {
             return !formValue['verify_account_enabled']
@@ -119,12 +107,6 @@ export default {
           type: 'select',
           options: []
         },
-        create_account_method: {
-          hidden: (formValue) => !formValue['create_account_enabled'],
-          type: 'select',
-          options: [],
-          el: {}
-        },
         change_password_method: {
           hidden: (formValue) => !formValue['change_password_enabled'],
           type: 'select',
@@ -175,21 +157,18 @@ export default {
       const type = this.$route.query.type
       const url = `/api/v1/assets/platforms/type-constraints/?category=${category}&type=${type}`
       const constraints = await this.$axios.get(url)
-      const hasDomain = constraints['has_domain']
-      this.fieldsMeta.domain_enabled.el.disabled = !hasDomain
 
       const protocols = constraints['protocols'] || []
       this.fieldsMeta.protocols_enabled.el.disabled = protocols.length === 0
       this.fieldsMeta.protocols.el.choices = protocols
 
       this.initial.protocols_enabled = !!protocols.length
-      this.initial.domain_enabled = hasDomain
     },
     async setOpsMethods() {
       const category = this.$route.query.category
       const type = this.$route.query.type
       const allMethods = await this.$axios.get('/api/v1/assets/platforms/ops-methods/')
-      const items = ['verify_account', 'change_password', 'create_account']
+      const items = ['verify_account', 'change_password']
       for (const item of items) {
         const methods = allMethods.filter(method => {
           const ok = method['method'] === item && method['category'] === category