Merge pull request #3302 from jumpserver/pr@dev@applet_host_deployment

feat: 批量部署发布机

src/i18n/langs/en.json

@@ -668,6 +668,7 @@
     "SyncSuccessMsg": "Sync success",
     "BatchActivate": "Batch activate",
     "SyncSelected": "Sync selected",
+    "bulkDeploy": "Bulk deploy",
     "bulkDeleteErrorMsg": "Bulk delete failed: ",
     "bulkDeleteSuccessMsg": "Bulk delete success",
     "bulkRemoveErrorMsg": "Bulk remove failed: ",

src/i18n/langs/ja.json

@@ -666,6 +666,7 @@
     "BatchActivate": "一括アクティブ化",
     "SyncSuccessMsg": "同期に成功しました",
     "SyncSelected": "選択した同期",
+    "bulkDeploy": "一括デプロイ",
     "bulkSyncErrorMsg": "一括同期に失敗しました:",
     "bulkDeleteErrorMsg": "一括削除に失敗しました:",
     "bulkDeleteSuccessMsg": "一括削除に成功しました",

src/i18n/langs/zh.json

@@ -696,6 +696,7 @@
     "User": "用户",
     "BatchActivate": "批量激活",
     "SyncSelected": "同步所选",
+    "bulkDeploy": "批量部署",
     "bulkDeleteErrorMsg": "批量删除失败: ",
     "bulkDeleteSuccessMsg": "批量删除成功",
     "bulkRemoveErrorMsg": "批量移除失败: ",

src/views/settings/Applet/Applet/AppletDetail/AppletHosts.vue

@@ -0,0 +1,121 @@
+<template>
+  <el-row :gutter="20">
+    <ListTable :header-actions="headerActions" :table-config="config" />
+  </el-row>
+</template>
+
+<script type="text/jsx">
+import { ListTable } from '@/components'
+import { DetailFormatter } from '@/components/Table/TableFormatters'
+import { openTaskPage } from '@/utils/jms'
+
+export default {
+  name: 'Publications',
+  components: {
+    ListTable
+  },
+  props: {
+    object: {
+      type: Object,
+      default: () => {
+      }
+    }
+  },
+  data() {
+    const vm = this
+    return {
+      headerActions: {
+        hasCreate: false,
+        hasImport: false,
+        hasExport: false,
+        hasBulkDelete: false,
+        extraMoreActions: [
+          {
+            name: 'SyncSelected',
+            title: this.$t('common.bulkDeploy'),
+            type: 'primary',
+            callback: function({ selectedRows }) {
+              vm.$axios.post(
+                `/api/v1/terminal/applet-host-deployments/applets/`,
+                {
+                  hosts: selectedRows.map(v => { return v.host.id }),
+                  applet_id: vm.object.id
+                }
+              ).then(res => {
+                openTaskPage(res['task'])
+              })
+            }
+          }
+        ]
+      },
+      config: {
+        url: `/api/v1/terminal/applet-publications/?applet=${this.object.id}`,
+        columns: [
+          'host.display_name', 'applet.version',
+          'date_updated', 'status', 'actions'
+        ],
+        columnsMeta: {
+          'host.display_name': {
+            label: this.$t('common.DisplayName'),
+            formatter: DetailFormatter,
+            formatterArgs: {
+              getTitle: ({ row }) => row.host.name,
+              getRoute: ({ row }) => ({
+                name: 'AppletHostDetail',
+                params: { id: row.host.id }
+              })
+            },
+            id: ({ row }) => row.host.id
+          },
+          'applet.version': {
+            label: this.$t('common.Version')
+          },
+          status: {
+            label: this.$t('applets.PublishStatus'),
+            formatter: (row) => {
+              const typeMapper = {
+                'pending': 'success',
+                'success': 'primary',
+                'failed': 'danger',
+                'unknown': 'warning'
+              }
+              const tp = typeMapper[row.status.value] || 'warning'
+              return <el-tag size='mini' type={tp}>{row.status.label}</el-tag>
+            }
+          },
+          date_updated: {
+            label: this.$t('ops.date')
+          },
+          actions: {
+            formatterArgs: {
+              hasUpdate: false,
+              hasDelete: false,
+              hasClone: false,
+              extraActions: [
+                {
+                  title: this.$t('common.Deploy'),
+                  callback: function({ row }) {
+                    this.$axios.post(
+                      `/api/v1/terminal/applet-host-deployments/applets/`,
+                      {
+                        hosts: [row.host.id],
+                        applet_id: vm.object.id
+                      }
+                    ).then(res => {
+                      openTaskPage(res['task'])
+                    })
+                  }
+                }
+              ]
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/views/settings/Applet/Applet/AppletDetail/index.vue

@@ -14,13 +14,15 @@
 <script>
 import { GenericDetailPage, TabPage } from '@/layout/components'
 import Detail from './Detail'
+import AppletHosts from './AppletHosts'
 
 export default {
   name: 'AppletDetail',
   components: {
     GenericDetailPage,
     TabPage,
-    Detail
+    Detail,
+    AppletHosts
   },
   data() {
     return {
@@ -32,6 +34,10 @@ export default {
           {
             'title': this.$t('common.Detail'),
             'name': 'Detail'
+          },
+          {
+            'title': this.$t('terminal.AppletHosts'),
+            'name': 'AppletHosts'
           }
         ],
         hasRightSide: true,

src/views/settings/Applet/AppletHost/AppletHostDetail/Applets.vue

@@ -84,7 +84,7 @@ export default {
                     this.$axios.post(
                       `/api/v1/terminal/applet-host-deployments/applets/`,
                       {
-                        host: row.host.id,
+                        hosts: [row.host.id],
                         applet_id: row.applet.id
                       }
                     ).then(res => {
@@ -125,7 +125,7 @@ export default {
             click: function() {
               this.$axios.post(
                 `/api/v1/terminal/applet-host-deployments/applets/`,
-                { host: this.object.id }
+                { hosts: [this.object.id] }
               ).then(res => {
                 openTaskPage(res['task'])
               })