perf: change .sync to model

src/components/Apps/AccountListTable/AccountList.vue

@@ -51,7 +51,12 @@
 
 <script>
 import { mapGetters } from 'vuex'
-import { accountOtherActions, accountQuickFilters, connectivityMeta, isDirectoryServiceAccount } from './const'
+import {
+  accountOtherActions,
+  accountQuickFilters,
+  connectivityMeta,
+  isDirectoryServiceAccount
+} from './const'
 import { openTaskPage } from '@/utils/jms/index'
 import {
   AccountConnectFormatter,
@@ -121,14 +126,11 @@ export default {
     },
     columnsMeta: {
       type: Object,
-      default: () => {
-      }
+      default: () => {}
     },
     columnsDefault: {
       type: Array,
-      default: () => ([
-        'name', 'username', 'secret', 'asset', 'platform', 'connect'
-      ])
+      default: () => ['name', 'username', 'secret', 'asset', 'platform', 'connect']
     },
     headerExtraActions: {
       type: Array,
@@ -159,7 +161,8 @@ export default {
       showResultDialog: false,
       showAddDialog: false,
       showAddTemplateDialog: false,
-      iExportUrl: this.exportUrl || this.url.replace('/accounts/accounts/', '/accounts/account-secrets/'),
+      iExportUrl:
+        this.exportUrl || this.url.replace('/accounts/accounts/', '/accounts/account-secrets/'),
       detailDrawer: () => import('@/views/accounts/Account/AccountDetail/index.vue'),
       createAccountResults: [],
       iAsset: this.asset,
@@ -223,7 +226,7 @@ export default {
           },
           ds: {
             width: '100px',
-            formatter: (row) => {
+            formatter: row => {
               if (row.ds && row.ds['domain_name']) {
                 return row.ds['domain_name']
               } else {
@@ -241,13 +244,13 @@ export default {
           },
           asset: {
             minWidth: '100px',
-            formatter: function(row) {
+            formatter: function (row) {
               return row.asset.name
             }
           },
           username: {
             minWidth: '60px',
-            formatter: function(row) {
+            formatter: function (row) {
               if (row.ds && row.ds['domain_name']) {
                 return `${row.username}@${row.ds['domain_name']}`
               } else {
@@ -256,12 +259,12 @@ export default {
             }
           },
           secret_type: {
-            formatter: function(row) {
+            formatter: function (row) {
               return row.secret_type.label
             }
           },
           source: {
-            formatter: function(row) {
+            formatter: function (row) {
               return row.source.label
             }
           },
@@ -291,7 +294,8 @@ export default {
               hasUpdate: false, // can set function(row, value)
               hasDelete: true, // can set function(row, value)
               hasClone: false,
-              canDelete: ({ row }) => vm.$hasPerm('accounts.delete_account') && !isDirectoryServiceAccount(row, this),
+              canDelete: ({ row }) =>
+                vm.$hasPerm('accounts.delete_account') && !isDirectoryServiceAccount(row, this),
               moreActionsTitle: this.$t('More'),
               extraActions: accountOtherActions(this)
             }
@@ -359,21 +363,27 @@ export default {
             type: 'primary',
             icon: 'verify',
             can: ({ selectedRows }) => {
-              return selectedRows.length > 0 &&
-                ['clickhouse', 'redis', 'website', 'chatgpt'].indexOf(selectedRows[0].asset.type.value) === -1 &&
-                !this.$store.getters.currentOrgIsRoot && vm.$hasPerm('accounts.verify_account')
+              return (
+                selectedRows.length > 0 &&
+                ['clickhouse', 'redis', 'website', 'chatgpt'].indexOf(
+                  selectedRows[0].asset.type.value
+                ) === -1 &&
+                !this.$store.getters.currentOrgIsRoot &&
+                vm.$hasPerm('accounts.verify_account')
+              )
             },
-            callback: function({ selectedRows }) {
+            callback: function ({ selectedRows }) {
               const ids = selectedRows.map(v => {
                 return v.id
               })
-              this.$axios.post(
-                '/api/v1/accounts/accounts/tasks/',
-                { action: 'verify', accounts: ids }).then(res => {
-                openTaskPage(res['task'])
-              }).catch(err => {
-                this.$message.error(this.$tc('BulkVerifyErrorMsg' + ' ' + err))
-              })
+              this.$axios
+                .post('/api/v1/accounts/accounts/tasks/', { action: 'verify', accounts: ids })
+                .then(res => {
+                  openTaskPage(res['task'])
+                })
+                .catch(err => {
+                  this.$message.error(this.$tc('BulkVerifyErrorMsg' + ' ' + err))
+                })
             }.bind(this)
           },
           {
@@ -384,17 +394,18 @@ export default {
             can: ({ selectedRows }) => {
               return selectedRows.length > 0 && vm.$hasPerm('accounts.change_account')
             },
-            callback: function({ selectedRows }) {
+            callback: function ({ selectedRows }) {
               const ids = selectedRows.map(v => {
                 return v.id
               })
-              this.$axios.patch(
-                '/api/v1/accounts/accounts/clear-secret/',
-                { account_ids: ids }).then(() => {
-                this.$message.success(this.$tc('ClearSuccessMsg'))
-              }).catch(err => {
-                this.$message.error(this.$tc('ClearErrorMsg' + ' ' + err))
-              })
+              this.$axios
+                .patch('/api/v1/accounts/accounts/clear-secret/', { account_ids: ids })
+                .then(() => {
+                  this.$message.success(this.$tc('ClearSuccessMsg'))
+                })
+                .catch(err => {
+                  this.$message.error(this.$tc('ClearErrorMsg' + ' ' + err))
+                })
             }.bind(this)
           },
           {
@@ -402,10 +413,12 @@ export default {
             title: this.$t('UpdateSelected'),
             icon: 'batch-update',
             can: ({ selectedRows }) => {
-              return selectedRows.length > 0 &&
+              return (
+                selectedRows.length > 0 &&
                 !this.$store.getters.currentOrgIsRoot &&
                 vm.$hasPerm('accounts.change_account') &&
                 selectedRows.every(i => i.secret_type.value === selectedRows[0].secret_type.value)
+              )
             },
             callback: ({ selectedRows }) => {
               vm.updateSelectedDialogSetting.selectedRows = selectedRows
@@ -441,7 +454,11 @@ export default {
   watch: {
     url(iNew) {
       this.$set(this.tableConfig, 'url', iNew)
-      this.$set(this.headerActions.exportOptions, 'url', iNew.replace(/(.*)accounts/, '$1account-secrets'))
+      this.$set(
+        this.headerActions.exportOptions,
+        'url',
+        iNew.replace(/(.*)accounts/, '$1account-secrets')
+      )
     }
   },
   mounted() {
@@ -477,7 +494,9 @@ export default {
       this.$refs.ListTable.reloadTable()
     },
     async getAssetDetail() {
-      const { query: { asset } } = this.$route
+      const {
+        query: { asset }
+      } = this.$route
       if (asset) {
         this.iAsset = await this.$axios.get(`/api/v1/assets/assets/${asset}/`)
       }

src/components/Apps/VariablesHelpTextDialog/index.vue

@@ -20,8 +20,12 @@
         <td :title="$tc('ClickCopy')" class="item-td text-link" @click="onCopy(item.name)">
           <label class="item-label">{{ item.name }}</label>
         </td>
-        <td><span>{{ item.label }}</span></td>
-        <td><span>{{ item.default }}</span></td>
+        <td>
+          <span>{{ item.label }}</span>
+        </td>
+        <td>
+          <span>{{ item.default }}</span>
+        </td>
       </tr>
     </table>
   </Dialog>
@@ -78,16 +82,17 @@ export default {
 }
 
 :deep(.help-table) {
-  th, td {
+  th,
+  td {
     height: 40px;
     padding: 0 8px;
     text-align: left;
   }
 
-  .item-td, .item-label {
+  .item-td,
+  .item-label {
     cursor: pointer;
     color: var(--color-primary);
   }
 }
-
 </style>

src/components/Common/DataActions/index.vue

@@ -32,7 +32,7 @@
           </span>
         </el-button>
 
-        <!-- <template #dropdown>
+        <template #dropdown>
           <el-dropdown-menu style="overflow: auto; max-height: 60vh">
             <template v-for="option in action.dropdown" :key="option.name">
               <div v-if="option.group" class="dropdown-menu-title" style="width: 130px">
@@ -59,7 +59,7 @@
               </el-tooltip>
             </template>
           </el-dropdown-menu>
-        </template> -->
+        </template>
       </el-dropdown>
 
       <el-button
@@ -273,6 +273,7 @@ $color-drop-menu-border: #e4e7ed;
       display: inline-flex;
       align-items: center;
       justify-content: center;
+      height: 30px;
     }
 
     .more-action.el-button--default {

src/components/Dialog/RemoteProcessingDialog.vue

@@ -40,12 +40,12 @@ export default {
 }
 
 .spinner {
-    width: 100px;
-    height: 100px;
-    border: 5px solid rgba(0, 0, 0, 0.1);
-    border-radius: 50%;
-    border-top-color: var(--color-primary);
-    animation: spin 1s infinite linear;
+  width: 100px;
+  height: 100px;
+  border: 5px solid rgba(0, 0, 0, 0.1);
+  border-radius: 50%;
+  border-top-color: var(--color-primary);
+  animation: spin 1s infinite linear;
 }
 
 #load {
@@ -54,8 +54,8 @@ export default {
 }
 
 @keyframes spin {
-    to {
-        transform: rotate(360deg);
-    }
+  to {
+    transform: rotate(360deg);
+  }
 }
 </style>

src/components/Form/FormFields/JSONManyToManySelect/AttrMatchResultDialog.vue

@@ -26,7 +26,7 @@ export default {
     },
     attrs: {
       type: Array,
-      default: () => ([])
+      default: () => []
     },
     visible: {
       type: Boolean,
@@ -45,13 +45,15 @@ export default {
         },
         tableConfig: {
           url: this.url,
-          columns: this.attrs.filter(item => item.inTable).map(item => {
-            return {
-              prop: item.name,
-              label: item.label,
-              formatter: item.formatter
-            }
-          }),
+          columns: this.attrs
+            .filter(item => item.inTable)
+            .map(item => {
+              return {
+                prop: item.name,
+                label: item.label,
+                formatter: item.formatter
+              }
+            }),
           columnsMeta: {
             actions: {
               has: false
@@ -64,6 +66,4 @@ export default {
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

src/components/Table/ListTable/TableAction/index.vue

@@ -215,18 +215,10 @@ $color-drop-menu-border: #e4e7ed;
     //float: left;
 
     :deep(.action-item.el-dropdown > .el-button) {
-      height: 100%;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      line-height: 1;
+      height: 30px;
     }
 
     :deep(.action-item.el-button) {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      line-height: 1;
       height: 30px;
     }
   }

src/views/ops/Template/components/AddVariableDialog.vue

@@ -9,11 +9,7 @@
     width="800px"
     @update:visible="$emit('update:visible', $event)"
   >
-    <VariableCreateForm
-      :variable="variable"
-      @add="addVariable"
-      @edit="editVariable"
-    />
+    <VariableCreateForm :variable="variable" @add="addVariable" @edit="editVariable" />
   </Dialog>
 </template>
 
@@ -38,13 +34,15 @@ export default {
     },
     variables: {
       type: Array,
-      default: () => ([])
+      default: () => []
     }
   },
   emits: ['update:visible'],
   methods: {
     addVariable(variable) {
-      const i = this.variables.findIndex(item => item.name === variable.name || item.var_name === variable.var_name)
+      const i = this.variables.findIndex(
+        item => item.name === variable.name || item.var_name === variable.var_name
+      )
       if (i !== -1) {
         this.variables.splice(i, 1)
       }
@@ -54,7 +52,9 @@ export default {
     editVariable(form) {
       const i = this.variables.findIndex(item => item.var_name === this.variable.var_name)
       this.variables.splice(i, 1, form)
-      const count = this.variables.filter(value => value.var_name === form.var_name || value.name === form.name).length
+      const count = this.variables.filter(
+        value => value.var_name === form.var_name || value.name === form.name
+      ).length
       // 不允许有相同的变量名
       if (count > 1) {
         this.variables.splice(i, 1)
@@ -65,6 +65,4 @@ export default {
 }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>