Merge remote-tracking branch 'origin/master'

src/components/Dialog/index.vue

@@ -33,7 +33,7 @@ export default {
       this.$emit('cancel')
     },
     onConfirm() {
-      this.$emit('comfirm')
+      this.$emit('confirm')
     }
   }
 }

src/components/ListTable/index.vue

@@ -3,7 +3,7 @@
     <TableAction :table-url="tableConfig.url" :search-table="search" v-bind="headerActions" :selected-rows="selectedRows" :reload-table="reloadTable" />
     <el-card class="table-content" shadow="never">
       <AutoDataTable ref="dataTable" :config="tableConfig" @selection-change="handleSelectionChange" />
-      <Dialog :title="$tc('Export')" :visible.sync="showExportDialog" center @comfirm="handleDialogConfirm('export')" @cancel="handleDialogCancel('export')">
+      <Dialog :title="$tc('Export')" :visible.sync="showExportDialog" center @confirm="handleDialogConfirm('export')" @cancel="handleDialogCancel('export')">
         <el-form>
           <el-form-item :label="this.$t('action.ExportRange')" :label-width="'100px'">
             <el-radio v-model="exportOption" class="export-item" label="1">{{ this.$t('action.ExportAll') }}</el-radio>
@@ -12,7 +12,7 @@
           </el-form-item>
         </el-form>
       </Dialog>
-      <Dialog :title="importtitle" :visible.sync="showImportDialog" center @comfirm="handleDialogConfirm('import')" @cancel="handleDialogCancel('import')">
+      <Dialog :title="importtitle" :visible.sync="showImportDialog" center @confirm="handleDialogConfirm('import')" @cancel="handleDialogCancel('import')">
         <el-form>
           <el-form-item :label="importtitle" :label-width="'100px'">
             <el-radio v-model="importOption" class="export-item" label="1">{{ this.$tc('Import') }}</el-radio>

src/components/TreeTable/components/TreeListTable/index.vue

@@ -3,7 +3,7 @@
     <TableAction :table-url="tableConfig.url" :search-table="search" v-bind="headerActions" :selected-rows="selectedRows" :reload-table="reloadTable" />
     <el-card class="table-content" shadow="never">
       <TreeAutoDataTable ref="dataTable" :config="tableConfig" @selection-change="handleSelectionChange" />
-      <Dialog :title="$tc('Export')" :visible.sync="showExportDialog" center @comfirm="handleDialogConfirm('export')" @cancel="handleDialogCancel('export')">
+      <Dialog :title="$tc('Export')" :visible.sync="showExportDialog" center @confirm="handleDialogConfirm('export')" @cancel="handleDialogCancel('export')">
         <el-form>
           <el-form-item :label="this.$t('action.ExportRange')" :label-width="'100px'">
             <el-radio v-model="exportOption" class="export-item" label="1">{{ this.$t('action.ExportAll') }}</el-radio>
@@ -12,7 +12,7 @@
           </el-form-item>
         </el-form>
       </Dialog>
-      <Dialog :title="importtitle" :visible.sync="showImportDialog" center @comfirm="handleDialogConfirm('import')" @cancel="handleDialogCancel('import')">
+      <Dialog :title="importtitle" :visible.sync="showImportDialog" center @confirm="handleDialogConfirm('import')" @cancel="handleDialogCancel('import')">
         <el-form>
           <el-form-item :label="importtitle" :label-width="'100px'">
             <el-radio v-model="importOption" class="export-item" label="1">{{ this.$tc('Import') }}</el-radio>

src/router/index.js

@@ -193,6 +193,12 @@ export const constantRoutes = [
         component: () => import('@/views/applications/RemoteAppList'),
         meta: { title: 'RemoteApp' }
       },
+      {
+        path: 'remote-apps/:id',
+        name: 'RemoteAppDetail',
+        component: () => import('@/views/applications/RemoteAppList'),
+        meta: { title: 'RemoteApp' }
+      },
       {
         path: 'database-apps',
         name: 'DatabaseAppList',

src/views/applications/RemoteAppList.vue

@@ -4,7 +4,6 @@
 
 <script>
 import { GenericListPage } from '@/layout/components'
-import { DetailFormatter, ActionsFormatter } from '@/components/ListTable/formatters/index'
 
 export default {
   components: {
@@ -15,44 +14,24 @@ export default {
       tableConfig: {
         url: '/api/v1/applications/remote-apps/',
         columns: [
-          {
-            prop: 'name',
-            label: this.$t('applications.name'),
-            formatter: DetailFormatter,
-            sortable: true,
-            route: 'RemoteAppDetail'
+          'name', 'type', 'asset', 'comment', 'actions'
+        ],
+        columnsMeta: {
+          type: {
+            displayKey: 'get_type_display'
           },
-          {
-            prop: 'get_type_display',
-            label: this.$t('applications.appType')
-          },
-          {
-            prop: 'asset_info.hostname',
-            label: this.$t('applications.asset')
-          },
-          {
-            prop: 'comment',
-            label: this.$t('applications.comment'),
-            sortable: 'custom'
-          },
-          {
-            prop: 'id',
-            label: this.$tc('Action'),
-            align: 'center',
-            formatter: ActionsFormatter,
-            width: '200px',
-            actions: {
-              performDelete: ({ row, col }) => {
-                const id = row.id
-                const url = `/api/v1/applications/remote-apps/${id}/`
-                return this.$axios.delete(url)
-              }
+          asset: {
+            formatter: function(row, column, cellValue, index) {
+              return <a class='detail el-link el-link--success is-underline' href={ `/assets/assets/${cellValue}` }>{ row.asset_info.hostname }</a>
             }
           }
-        ]
+        },
+        detailRoute: 'RemoteAppDetail',
+        actions: {
+          updateRoute: 'RemoteAppUpdate'
+        }
       },
       headerActions: {
-        hasBulkDelete: false,
         createRoute: 'RemoteAppCreate'
       }
     }
@@ -60,6 +39,6 @@ export default {
 }
 </script>
 
-<style>
+<style lang="less" scoped>
 
 </style>