Merge branch 'master' of github.com:jumpserver/lina

src/components/ActionsGroup/index.vue

@@ -8,7 +8,7 @@
         {{ this.$tc('More actions') }}<i class="el-icon-arrow-down el-icon--right" />
       </el-button>
       <el-dropdown-menu slot="dropdown">
-        <el-dropdown-item v-for="item in moreActions" :key="item.name" :command="item.name" v-bind="item" @click="handleClick(item.name)">{{ item.title }} </el-dropdown-item>
+        <el-dropdown-item v-for="item in iMoreActions" :key="item.name" :command="item.name" v-bind="item" @click="handleClick(item.name)">{{ item.title }} </el-dropdown-item>
       </el-dropdown-menu>
     </el-dropdown>
   </div>

src/components/DataTable/compenents/el-data-table/el-data-table.vue

@@ -122,6 +122,7 @@
         :page-sizes="paginationSizes"
         :page-size="size"
         :total="total"
+        :background="paginationBackground"
         style="text-align: right; padding: 10px 0;"
         :layout="paginationLayout"
         v-bind="extraPaginationAttrs"

src/components/DataTable/index.vue

@@ -38,7 +38,7 @@ export default {
         // editText: this.$t('action.update'), // 编辑按钮文案
         buttonSize: 'mini',
         tableAttrs: {
-          stripe: true, // 斑马纹表格
+          stripe: false, // 斑马纹表格
           border: true, // 表格边框
           fit: true, // 宽度自适应,
           tooltipEffect: 'dark'
@@ -59,6 +59,7 @@ export default {
         paginationLayout: 'total, sizes, prev, pager, next',
         paginationSizes: [15, 30, 50, 100],
         paginationSize: 15,
+        paginationBackground: true,
         transformQuery: query => {
           if (query.page && query.size) {
             const page = query.page > 0 ? query.page : 1

src/components/ListTable/formatters/CustomActionsFormatter.vue

@@ -0,0 +1,75 @@
+<template>
+  <ActionsGroup :size="'mini'" :actions="cleanedActions" :more-actions="cleanMoreActions" />
+</template>
+
+<script>
+import ActionsGroup from '@/components/ActionsGroup/index'
+import BaseFormatter from './base'
+
+export default {
+  name: 'CustomActionsFormatterVue',
+  components: {
+    ActionsGroup
+  },
+  extends: BaseFormatter,
+  computed: {
+    cleanedActions() {
+      if (this.col.actions.actions instanceof Array) {
+        const copy = _.cloneDeep(this.col.actions.actions)
+        let actions = [...copy]
+        actions = actions.map((v) => {
+          v.has = this.checkBool(v, 'has')
+          v.can = this.checkBool(v, 'can')
+          v.callback = this.cleanCallback(v)
+          return v
+        })
+        return actions
+      }
+      return []
+    },
+    cleanMoreActions() {
+      if (this.col.actions.extraActions instanceof Array) {
+        const copy = _.cloneDeep(this.col.actions.extraActions)
+        let actions = [...copy]
+        actions = actions.map((v) => {
+          v.has = this.checkBool(v, 'has')
+          v.can = this.checkBool(v, 'can')
+          v.callback = this.cleanCallback(v)
+          return v
+        })
+        return actions
+      }
+      return []
+    }
+  },
+  methods: {
+    checkBool(item, attr, defaults) {
+      if (!item) {
+        return false
+      }
+      let ok = item[attr]
+      if (ok && typeof ok === 'function') {
+        ok = ok(this.row, this.cellValue)
+      } else if (ok == null) {
+        ok = defaults === undefined ? true : defaults
+      }
+      return ok
+    },
+    cleanCallback(item) {
+      const callback = item.callback
+      const attrs = {
+        reload: this.reload,
+        row: this.row,
+        col: this.col,
+        cellValue: this.cellValue,
+        tableData: this.tableData
+      }
+      return () => { return callback.bind(this)(attrs) }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/ListTable/formatters/index.js

@@ -7,6 +7,7 @@ import LengthFormatter from './LengthFormatter'
 import RouterFormatter from './RouterFormatter'
 import OutputExpandFormatter from './OutputExpandFormatter'
 import ExpandAssetPermissionFormatter from './ExpandAssetPermissionFormatter'
+import CustomActionsFormatter from './CustomActionsFormatter'
 
 export default {
   DetailFormatter,
@@ -17,7 +18,8 @@ export default {
   LengthFormatter,
   RouterFormatter,
   OutputExpandFormatter,
-  ExpandAssetPermissionFormatter
+  ExpandAssetPermissionFormatter,
+  CustomActionsFormatter
 }
 
 export {
@@ -29,5 +31,6 @@ export {
   LengthFormatter,
   RouterFormatter,
   OutputExpandFormatter,
-  ExpandAssetPermissionFormatter
+  ExpandAssetPermissionFormatter,
+  CustomActionsFormatter
 }

src/components/ListTable/index.vue

@@ -182,11 +182,28 @@ export default {
 }
 </script>
 
-<style lang="less" scoped>
+<style lang="scss" scoped>
 
   .table-content {
     margin-top: 10px;
+
+    & >>> .el-card__body {
+      padding: 0;
+    }
+    & >>> .el-table__header thead > tr > th {
+      background-color: white;
+    }
+
+    /*& >>> .el-table--striped .el-table__body tr.el-table__row--striped td {*/
+      /*background: white;*/
+    /*}*/
+
+    /*& >>> .el-table th, .el-table tr  {*/
+      /*background-color: red;*/
+      /*!*background-color: #FAFAFA;*!*/
+    /*}*/
   }
+
   //修改颜色
   // .el-button--text{
   //   color: #409EFF;

src/i18n/langs/cn.js

@@ -432,7 +432,8 @@ const cn = {
     'createReplay': '创建录像存储',
     'commandStorage': '命令存储',
     'replayStorage': '录像存储',
-    'storage': '存储'
+    'storage': '存储',
+    'test': '测试'
   },
   jobcenter: {
     'RunTimes': '执行次数',

src/i18n/langs/en.js

@@ -313,7 +313,8 @@ const en = {
     'createReplay': 'Create replay storage',
     'commandStorage': 'Command storage',
     'replayStorage': 'Replay Storage',
-    'storage': 'Storage'
+    'storage': 'Storage',
+    'test': 'Test'
   },
   setting: {
     'setting': 'System Setting',

src/layout/components/GenericDetailPage/index.vue

@@ -183,4 +183,8 @@ export default {
     /*margin: 0;*/
     /*background-color: #f3f3f4;*/
   }
+
+  .page-submenu >>> .el-tabs__nav-wrap {
+    position: static;
+  }
 </style>

src/layout/components/TabPage/index.vue

@@ -60,4 +60,7 @@ export default {
     /*margin: 0;*/
     /*background-color: #f3f3f4;*/
   }
+  .page-submenu >>> .el-tabs__nav-wrap {
+    position: static;
+  }
 </style>

src/router/index.js

@@ -458,12 +458,6 @@ export const constantRoutes = [
         name: 'BatchCommand',
         component: () => import('@/views/jobcenter/CommandExecution'),
         meta: { title: 'BatchCommand' }
-      },
-      {
-        path: 'flower',
-        name: 'TaskMonitor',
-        component: () => import('@/views/tree/index'),
-        meta: { title: 'TaskMonitor' }
       }
     ]
   },

src/styles/element-ui.scss

@@ -261,3 +261,24 @@ td .el-button.el-button--mini {
 .el-checkbox__inner:hover {
   border-color: #409EFF;
 }
+
+.el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
+  margin: 0 5px;
+  background-color: white;
+  color: #606266;
+  min-width: 28px;
+  border-radius: 2px;
+  border: 1px solid #DCDFE6;
+  font-size: 12px;
+  line-height: 26px;
+  font-weight: 400;
+}
+
+.el-pagination.is-background .el-pager li:not(.disabled):hover {
+  color: white;
+  background-color: $--color-primary;
+}
+
+.el-pagination.is-background .number {
+  padding: 0;
+}

src/views/form/index.vue

@@ -1,85 +0,0 @@
-<template>
-  <div class="app-container">
-    <el-form ref="form" :model="form" label-width="120px">
-      <el-form-item label="Activity name">
-        <el-input v-model="form.name" />
-      </el-form-item>
-      <el-form-item label="Activity zone">
-        <el-select v-model="form.region" placeholder="please select your zone">
-          <el-option label="Zone one" value="shanghai" />
-          <el-option label="Zone two" value="beijing" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="Activity time">
-        <el-col :span="11">
-          <el-date-picker v-model="form.date1" type="date" placeholder="Pick a date" style="width: 100%;" />
-        </el-col>
-        <el-col :span="2" class="line">-</el-col>
-        <el-col :span="11">
-          <el-time-picker v-model="form.date2" type="fixed-time" placeholder="Pick a time" style="width: 100%;" />
-        </el-col>
-      </el-form-item>
-      <el-form-item label="Instant delivery">
-        <el-switch v-model="form.delivery" />
-      </el-form-item>
-      <el-form-item label="Activity type">
-        <el-checkbox-group v-model="form.type">
-          <el-checkbox label="Online activities" name="type" />
-          <el-checkbox label="Promotion activities" name="type" />
-          <el-checkbox label="Offline activities" name="type" />
-          <el-checkbox label="Simple brand exposure" name="type" />
-        </el-checkbox-group>
-      </el-form-item>
-      <el-form-item label="Resources">
-        <el-radio-group v-model="form.resource">
-          <el-radio label="Sponsor" />
-          <el-radio label="Venue" />
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item label="Activity form">
-        <el-input v-model="form.desc" type="textarea" />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" @click="onSubmit">Create</el-button>
-        <el-button @click="onCancel">Cancel</el-button>
-      </el-form-item>
-    </el-form>
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      form: {
-        name: '',
-        region: '',
-        date1: '',
-        date2: '',
-        delivery: false,
-        type: [],
-        resource: '',
-        desc: ''
-      }
-    }
-  },
-  methods: {
-    onSubmit() {
-      this.$message('submit!')
-    },
-    onCancel() {
-      this.$message({
-        message: 'cancel!',
-        type: 'warning'
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-.line{
-  text-align: center;
-}
-</style>
-

src/views/nested/menu1/index.vue

@@ -1,7 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1">
-      <router-view />
-    </el-alert>
-  </div>
-</template>

src/views/nested/menu1/menu1-1/index.vue

@@ -1,7 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-1" type="success">
-      <router-view />
-    </el-alert>
-  </div>
-</template>

src/views/nested/menu1/menu1-2/index.vue

@@ -1,7 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2" type="success">
-      <router-view />
-    </el-alert>
-  </div>
-</template>

src/views/nested/menu1/menu1-2/menu1-2-1/index.vue

@@ -1,5 +0,0 @@
-<template functional>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2-1" type="warning" />
-  </div>
-</template>

src/views/nested/menu1/menu1-2/menu1-2-2/index.vue

@@ -1,5 +0,0 @@
-<template functional>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-2-2" type="warning" />
-  </div>
-</template>

src/views/nested/menu1/menu1-3/index.vue

@@ -1,5 +0,0 @@
-<template functional>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 1-3" type="success" />
-  </div>
-</template>

src/views/nested/menu2/index.vue

@@ -1,5 +0,0 @@
-<template>
-  <div style="padding:30px;">
-    <el-alert :closable="false" title="menu 2" />
-  </div>
-</template>

src/views/sessions/Storage.vue

@@ -16,6 +16,7 @@
 import { TabPage } from '@/layout/components'
 import { ListTable } from '@/components'
 import { TestCommandStorage, TestReplayStorage } from '@/api/sessions'
+import { CustomActionsFormatter } from '@/components/ListTable/formatters'
 
 export default {
   name: 'Storage',
@@ -89,7 +90,7 @@ export default {
       },
       replayTableConfig: {
         url: '/api/v1/terminal/replay-storages/',
-        columns: ['name', 'type', 'comment', 'actions'],
+        columns: ['name', 'type', 'comment', 'cusActions'],
         columnsMeta: {
           name: {
             formatter: function(row) {
@@ -104,16 +105,39 @@ export default {
           comment: {
             sortable: 'custom'
           },
-          actions: {
+          cusActions: {
             prop: 'id',
+            formatter: CustomActionsFormatter,
             actions: {
-              canUpdate: function(row, value) {
-                return row.name !== 'null' && row.name !== 'default'
-              },
-              extraActions: [
+              actions: [
+                {
+                  name: 'update',
+                  title: this.$tc('Update'),
+                  type: 'primary',
+                  can: function(row, cellValue,) {
+                    return row.name !== 'null' && row.name !== 'default'
+                  },
+                  callback: function({ row, col, cellValue, reload }) {
+                  }
+                },
+                {
+                  name: 'delete',
+                  title: this.$tc('Delete'),
+                  type: 'danger',
+                  can: function(row, cellValue) {
+                    return row.name !== 'null' && row.name !== 'default'
+                  },
+                  callback: function({ row, col, cellValue, reload }) {
+                    const id = row.id
+                    const url = `${this.url}${id}/`
+                    this.$axios.delete(url).then(data => {
+                      reload()
+                    })
+                  }
+                },
                 {
                   name: 'test',
-                  title: 'test',
+                  title: this.$t('sessions.test'),
                   type: 'primary',
                   callback: function({ row, col, cellValue, reload }) {
                     TestReplayStorage(cellValue).then(data => {
@@ -155,7 +179,7 @@ export default {
       commandTableConfig: {
         title: 'command',
         url: '/api/v1/terminal/command-storages/',
-        columns: ['name', 'type', 'comment', 'actions'],
+        columns: ['name', 'type', 'comment', 'cusActions'],
         columnsMeta: {
           comment: {
             sortable: 'custom'
@@ -170,16 +194,39 @@ export default {
               return row.type
             }
           },
-          actions: {
+          cusActions: {
             prop: 'id',
+            formatter: CustomActionsFormatter,
             actions: {
-              canUpdate: function(row, value) {
-                return row.name !== 'null' && row.name !== 'default'
-              },
-              extraActions: [
+              actions: [
+                {
+                  name: 'update',
+                  title: this.$tc('Update'),
+                  type: 'primary',
+                  can: function(row, cellValue,) {
+                    return row.name !== 'null' && row.name !== 'default'
+                  },
+                  callback: function({ row, col, cellValue, reload }) {
+                  }
+                },
+                {
+                  name: 'delete',
+                  title: this.$tc('Delete'),
+                  type: 'danger',
+                  can: function(row, cellValue) {
+                    return row.name !== 'null' && row.name !== 'default'
+                  },
+                  callback: function({ row, col, cellValue, reload }) {
+                    const id = row.id
+                    const url = `${this.url}${id}/`
+                    this.$axios.delete(url).then(data => {
+                      reload()
+                    })
+                  }
+                },
                 {
                   name: 'test',
-                  title: 'test',
+                  title: this.$t('sessions.test'),
                   type: 'primary',
                   callback: function({ row, col, cellValue, reload }) {
                     TestCommandStorage(cellValue).then(data => {