instans batch delete, tenant delete, definition delete

5 years ago · b946791d80
4 changed files with 189 additions and 13 deletions
--- a/escheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
+++ b/escheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
@ -1,8 +1,11 @@
 <template>
-  <div class="list-model">
+  <div class="list-model" style="position: relative;">
    <div class="table-box">
      <table class="fixed">
        <tr>
+          <th width="50">
+            <x-checkbox @on-change="_topCheckBoxClick" v-model="checkAll"></x-checkbox>
+          </th>
          <th>
            <span>{{$t('#')}}</span>
          </th>
@ -29,6 +32,7 @@
          </th>
        </tr>
        <tr v-for="(item, $index) in list" :key="item.id">
+          <td width="50"><x-checkbox v-model="item.isCheck" @on-change="_arrDelChange"></x-checkbox></td>
          <td>
            <span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
          </td>
@ -60,11 +64,33 @@
            <x-button type="error" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('offline')" @click="_downline(item)" v-if="item.releaseState === 'ONLINE'" v-ps="['GENERAL_USER']" icon="iconfont icon-erji-xiaxianjilu"><!--{{$t('下线')}}--></x-button>
            <x-button type="warning" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('online')" @click="_poponline(item)" v-if="item.releaseState === 'OFFLINE'" v-ps="['GENERAL_USER']" icon="iconfont icon-erji-xiaxianjilu-copy"><!--{{$t('上线')}}--></x-button>
            <x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('Cron Manage')" @click="_timingManage(item)" :disabled="item.releaseState !== 'ONLINE'" v-ps="['GENERAL_USER']" icon="iconfont icon-paibanguanli"><!--{{$t('定时管理')}}--></x-button>
+            <x-poptip
+              :ref="'poptip-delete-' + $index"
+              placement="bottom-end"
+              width="90">
+              <p>{{$t('Delete?')}}</p>
+              <div style="text-align: right; margin: 0;padding-top: 4px;">
+                <x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
+                <x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
+              </div>
+              <template slot="reference">
+                <x-button
+                  icon="iconfont icon-shanchu"
+                  type="error"
+                  shape="circle"
+                  size="xsmall"
+                  data-toggle="tooltip"
+                  :title="$t('delete')"
+                  v-ps="['GENERAL_USER']">
+                </x-button>
+              </template>
+            </x-poptip>
            <x-button type="info" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('TreeView')" @click="_treeView(item)"  icon="iconfont icon-juxingkaobei"><!--{{$t('树形图')}}--></x-button>
          </td>
        </tr>
      </table>
    </div>
+    <x-button style="position: absolute; bottom: -52px; left: 22px;" v-if="strDelete !== ''" @click="_batchDelete">批量删除</x-button>
  </div>
 </template>
 <script>
@ -78,7 +104,9 @@
    name: 'definition-list',
    data () {
      return {
-        list: []
+        list: [],
+        strDelete: '',
+        checkAll: false
      }
    },
    props: {
@ -87,7 +115,7 @@
      pageSize: Number
    },
    methods: {
-      ...mapActions('dag', ['editProcessState', 'getStartCheck', 'getReceiver']),
+      ...mapActions('dag', ['editProcessState', 'getStartCheck', 'getReceiver', 'deleteDefinition', 'batchDeleteDefinition']),
      _rtPublishStatus (code) {
        return _.filter(publishStatus, v => v.code === code)[0].desc
      },
@ -179,6 +207,27 @@
      _timingManage (item) {
        this.$router.push({ path: `/projects/definition/list/timing/${item.id}` })
      },
+      /**
+       * Close the delete layer
+       */
+      _closeDelete (i) {
+        this.$refs[`poptip-delete-${i}`][0].doClose()
+      },
+      /**
+       * delete
+       */
+      _delete (item, i) {
+        this.deleteDefinition({
+          processDefinitionId: item.id
+        }).then(res => {
+          this.$refs[`poptip-delete-${i}`][0].doClose()
+          this._onUpdate()
+          this.$message.success(res.msg)
+        }).catch(e => {
+          this.$refs[`poptip-delete-${i}`][0].doClose()
+          this.$message.error(e.msg || '')
+        })
+      },
      /**
       * edit
       */
@ -217,6 +266,45 @@
      },
      _onUpdate () {
        this.$emit('on-update')
+      },
+      /**
+       * click the select-all checkbox
+       */
+      _topCheckBoxClick (v) {
+        this.list.forEach((item, i) => {
+          this.$set(this.list[i], 'isCheck', v)
+        })
+        this._arrDelChange()
+      },
+      /**
+       * the array that to be delete
+       */
+      _arrDelChange (v) {
+        let arr = []
+        this.list.forEach((item)=>{
+          if (item.isCheck) {
+            arr.push(item.id)
+          }
+        })
+        this.strDelete = _.join(arr, ',')
+        if (v === false) {
+          this.checkAll = false
+        }
+      },
+      /**
+       * batch delete
+       */
+      _batchDelete () {
+        this.batchDeleteDefinition({
+          processDefinitionIds: this.strDelete
+        }).then(res => {
+          this._onUpdate()
+          this.checkAll = false
+          this.$message.success(res.msg)
+        }).catch(e => {
+          this.checkAll = false
+          this.$message.error(e.msg || '')
+        })
      }
    },
    watch: {
@ -225,6 +313,10 @@
        setTimeout(() => {
          this.list = a
        })
+      },
+      pageNo () {
+        this.checkAll = false
+        this.strDelete = ''
      }
    },
    created () {
--- a/escheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/_source/list.vue
+++ b/escheduler-ui/src/js/conf/home/pages/projects/pages/instance/pages/list/_source/list.vue
@ -1,8 +1,11 @@
 <template>
-  <div class="list-model">
+  <div class="list-model" style="position: relative;">
    <div class="table-box">
      <table class="fixed">
        <tr>
+          <th width="50">
+            <x-checkbox @on-change="_topCheckBoxClick" v-model="checkAll"></x-checkbox>
+          </th>
          <th>
            <span>{{$t('#')}}</span>
          </th>
@ -38,6 +41,7 @@
          </th>
        </tr>
        <tr v-for="(item, $index) in list" :key="item.id">
+          <td width="50"><x-checkbox v-model="item.isCheck" @on-change="_arrDelChange"></x-checkbox></td>
          <td>
            <span>{{parseInt(pageNo === 1 ? ($index + 1) : (($index + 1) + (pageSize * (pageNo - 1))))}}</span>
          </td>
@ -245,6 +249,7 @@
        </tr>
      </table>
    </div>
+    <x-button style="position: absolute; bottom: -52px; left: 22px;" v-if="strDelete !== ''" @click="_batchDelete">批量删除</x-button>
  </div>
 </template>
 <script>
@ -259,7 +264,9 @@
        // 数据
        list: [],
        // 按钮类型
-        buttonType: ''
+        buttonType: '',
+        strDelete: '',
+        checkAll: false
      }
    },
    props: {
@ -268,7 +275,7 @@
      pageSize: Number
    },
    methods: {
-      ...mapActions('dag', ['editExecutorsState', 'deleteInstance']),
+      ...mapActions('dag', ['editExecutorsState', 'deleteInstance', 'batchDeleteInstance']),
      /**
       * Return run type
       */
@ -440,6 +447,36 @@
      },
      _gantt (item) {
        this.$router.push({ path: `/projects/instance/gantt/${item.id}` })
+      },
+      _topCheckBoxClick (v) {
+        this.list.forEach((item, i) => {
+          this.$set(this.list[i], 'isCheck', v)
+        })
+        this._arrDelChange()
+      },
+      _arrDelChange (v) {
+        let arr = []
+        this.list.forEach((item)=>{
+          if (item.isCheck) {
+            arr.push(item.id)
+          }
+        })
+        this.strDelete = _.join(arr, ',')
+        if (v === false) {
+          this.checkAll = false
+        }
+      },
+      _batchDelete () {
+        this.batchDeleteInstance({
+          processInstanceIds: this.strDelete
+        }).then(res => {
+          this._onUpdate()
+          this.checkAll = false
+          this.$message.success(res.msg)
+        }).catch(e => {
+          this.checkAll = false
+          this.$message.error(e.msg || '')
+        })
      }
    },
    watch: {
@ -448,6 +485,10 @@
        setTimeout(() => {
          this.list = this._listDataHandle(a)
        })
+      },
+      pageNo () {
+        this.checkAll = false
+        this.strDelete = ''
      }
    },
    created () {
@ -457,4 +498,4 @@
    },
    components: { }
  }
-</script>
+</script>
--- a/escheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/list.vue
+++ b/escheduler-ui/src/js/conf/home/pages/security/pages/tenement/_source/list.vue
@ -64,19 +64,26 @@
                    @click="_edit(item)"
                    icon="iconfont icon-bianjixiugai">
            </x-button>
-            <!--<x-poptip
-                    :ref="'poptip-' + $index"
-                    placement="bottom-end"
-                    width="90">
+            <x-poptip
+              :ref="'poptip-' + $index"
+              placement="bottom-end"
+              width="90">
              <p>{{$t('Delete?')}}</p>
              <div style="text-align: right; margin: 0;padding-top: 4px;">
                <x-button type="text" size="xsmall" shape="circle" @click="_closeDelete($index)">{{$t('Cancel')}}</x-button>
                <x-button type="primary" size="xsmall" shape="circle" @click="_delete(item,$index)">{{$t('Confirm')}}</x-button>
              </div>
              <template slot="reference">
-                <x-button type="error" shape="circle" size="xsmall" data-toggle="tooltip" :title="$t('delete')">{{$t('delete')}}</x-button>
+                <x-button
+                  icon="iconfont icon-shanchu"
+                  type="error"
+                  shape="circle"
+                  size="xsmall"
+                  data-toggle="tooltip"
+                  :title="$t('delete')">
+                </x-button>
              </template>
-            </x-poptip>-->
+            </x-poptip>
          </td>
        </tr>
      </table>
--- a/escheduler-ui/src/js/conf/home/store/dag/actions.js
+++ b/escheduler-ui/src/js/conf/home/store/dag/actions.js
@ -437,6 +437,42 @@ export default {
      })
    })
  },
+  /**
+   * Batch delete process instance
+   */
+  batchDeleteInstance ({ state }, payload) {
+    return new Promise((resolve, reject) => {
+      io.get(`projects/${state.projectName}/instance/batch-delete`, payload, res => {
+        resolve(res)
+      }).catch(e => {
+        reject(e)
+      })
+    })
+  },
+  /**
+   * Delete definition
+   */
+  deleteDefinition ({ state }, payload) {
+    return new Promise((resolve, reject) => {
+      io.get(`projects/${state.projectName}/process/delete`, payload, res => {
+        resolve(res)
+      }).catch(e => {
+        reject(e)
+      })
+    })
+  },
+  /**
+   * Batch delete definition
+   */
+  batchDeleteDefinition ({ state }, payload) {
+    return new Promise((resolve, reject) => {
+      io.get(`projects/${state.projectName}/process/batch-delete`, payload, res => {
+        resolve(res)
+      }).catch(e => {
+        reject(e)
+      })
+    })
+  },
  /**
   * Process instance get variable
   */