流程清单增加 历史记录导出功能

com.actionsoft.apps.coe.pal.processlist/src/components/ExportLog.vue

@@ -0,0 +1,178 @@
+<script>
+import awsuiAxios from "@/awsuiAxios";
+
+export default {
+  name: "ExportLog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    wsId: {// 资产库ID
+      type: String,
+      default: '',
+      required: true
+    }
+  },
+  data() {
+    return {
+      internalVisible: this.visible,
+      width: '800px',
+      timer: null, // 定时器
+      exportLogData: [],
+      loading: true,
+      executingIds: [] // 记录状态在执行中的导出记录ID
+    }
+  },
+  methods: {
+    async init() {
+      const param = {
+        url:'jd',
+        data:{
+          cmd: 'com.actionsoft.apps.coe.pal.processlist_export_log_data',
+          wsId: this.wsId
+        }
+      };
+      const {result, msg, data } = await awsuiAxios.post(param);
+      // console.log('导出记录',result, msg)
+      if (result === 'ok'){
+        this.loading = false;
+        this.exportLogData = [...data.exportList]
+        this.executingIds = [...data.executeIdList]
+        this.handleClearInterVal(data.isAllComplate)
+      }else {
+        this.$message({
+          type: 'error',
+          message: msg
+        })
+      }
+    },
+    // 处理导出记录状态信息 只针对执行中的
+    async handleExportExecutingStatusInfo(){
+      if (!this.executingIds.length){
+        return;
+      }
+      const param = {
+        url:'jd',
+        data:{
+          cmd: 'com.actionsoft.apps.coe.pal.processlist_export_executing_status_get',
+          wsId: this.wsId,
+          exportIds: JSON.stringify(this.executingIds)
+        }
+      };
+      const { result, msg, data } = await awsuiAxios.post(param);
+      if (result === 'ok'){
+        // console.log('状态执行中的定时查询结果', data)
+        this.executingIds = [...data.executeIdList]
+        const exportLogData = [...data.exportList]
+        exportLogData.forEach(item1 => {
+          this.exportLogData.forEach(item2 => {
+            if (item1.id === item2.id){
+              item2.progress = item1.progress
+              item2.status = item1.status
+              item2.statusText = item1.statusText
+              item2.updateTime = item1.updateTime
+            }
+          })
+        })
+        this.handleClearInterVal(data.isAllComplate)
+      }else {
+        this.$message({
+          type: 'error',
+          message: msg
+        })
+      }
+    },
+    handleClearInterVal(isAllComplate){
+      if (isAllComplate){
+        // console.log('全部加载完成清除定时器')
+        clearInterval(this.timer);
+      }
+    },
+    downloadExportLog(url){
+      if (url){
+        document.getElementById("downloadIframe").src = url;
+      }
+    },
+    handleClose(done) {
+      this.$emit('close')
+      done();
+    },
+  },
+  watch: {
+    visible(newVal) {
+      this.internalVisible = newVal;
+    }
+  },
+  mounted() {
+    this.init(); // 初始化调用一次数据接口
+    this.timer = setInterval( () => {
+       this.handleExportExecutingStatusInfo(); // 每隔5s调用一次数据接口
+    }, 5000);
+  },
+  beforeDestroy() {
+    clearInterval(this.timer); // 组件销毁前清除定时器
+    // console.log('组件销毁 清除定时器')
+  }
+}
+</script>
+
+<template>
+  <el-dialog
+      title="导出记录"
+      :visible.sync="internalVisible"
+      :destroy-on-close=true
+      :width="width"
+      :modal-append-to-body=false
+      :close-on-click-modal=false
+      :before-close="handleClose"
+      :append-to-body=true>
+    <div class="export-log-content">
+      <el-table
+          :data="exportLogData"
+          v-loading="loading"
+          height="350"
+          style="width: 100%">
+        <el-table-column
+            align="center"
+            prop="fileName"
+            label="文件名称"
+            width="280">
+        </el-table-column>
+        <el-table-column
+            prop="statusText"
+            align="center"
+            label="状态"
+            width="80">
+        </el-table-column>
+        <el-table-column
+            prop="progress"
+            align="center"
+            width="100"
+            label="进度">
+          <template slot-scope="{ row }">
+            <el-progress :percentage="row.progress" ></el-progress>
+          </template>
+        </el-table-column>
+        <el-table-column
+            prop="updateTime"
+            align="center"
+            label="更新时间"
+            width="200">
+        </el-table-column>
+        <el-table-column
+            width="80"
+            align="center"
+            label="下载">
+          <template slot-scope="{ row }">
+            <i v-if="row.status === 1" style="cursor: pointer;" class="awsui-iconfont" @click="downloadExportLog(row.downloadUrl)">&#xe653;</i>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </el-dialog>
+</template>
+
+<style scoped>
+
+</style>

com.actionsoft.apps.coe.pal.processlist/src/views/ProcesslistHome.vue

@@ -13,8 +13,11 @@
           <div class="head-title" style="float:left;width:200px;">
             <awsui-select id="levelSelect" v-model="levelValue" collapse-tags placeholder="请选择流程层级" :options="levelOptions" multiple @change="searchProcessList(false)"></awsui-select>
           </div>
-          <div class="head-title" style="float:right;width: 260px;position: relative;bottom: 5px;">
+          <div class="head-title" style="float:right;width: 300px;position: relative;bottom: 5px;">
             <awsui-button class="button-general-color button_fixed_width" type="primary" @click="exportProcessList">导出</awsui-button>
+            <el-tooltip class="item" effect="dark" content="历史导出记录" placement="bottom-end" :hide-after="1000">
+              <i class="awsui-iconfont custom_table_dlg_icon" style="margin-right: 10px;" @click="openExportLogPage()">&#xe690;</i>
+            </el-tooltip>
             <el-tooltip class="item" effect="dark" content="重置筛选条件" placement="bottom-end" :hide-after="1000">
               <awsui-button class="button_fixed_width" @click="resetCondition">重置</awsui-button>
             </el-tooltip>
@@ -206,6 +209,7 @@
         :title="bpmOrgAddress.title"
         :multiple="bpmOrgAddress.multiple"
     />
+    <ExportLog v-if="exportLog.visible" :ws-id="exportLog.wsId" :visible="exportLog.visible" v-on:close="closeExportLogPage"/>
   </awsui-layout>
 </template>
 
@@ -213,6 +217,7 @@
   import draggable from "vuedraggable";
   import awsuiAxios from "../awsuiAxios";
   import {openDesigner} from "../api/commonFun";
+  import ExportLog from "@/components/ExportLog.vue";
   import PalRelationAddress from  "@/components/common/PalRelationAddress/index.js";
   import PALRepositoryTree from "@/components/common/PALRepositoryTree/index.js";
   import BPMOrgAddress from  "@/components/common/BPMOrgAddress/index.js";// pal平台组织架构地址簿，调用平台部门人员角色
@@ -228,7 +233,8 @@
         draggable,
         PalRelationAddress,
         BPMOrgAddress,
-        PALRepositoryTree
+        PALRepositoryTree,
+        ExportLog
       },
       data() {
         return {
@@ -276,6 +282,10 @@
             isRequired: false
           },
           showMoreSearch: false,
+          exportLog: {
+            wsId: wsId,
+            visible: false,
+          }
         }
       },
       methods : {
@@ -501,7 +511,11 @@
           params = this.getSearchCondition(params);
           awsuiAxios.post(params).then(function (ro) {// 查询数据总条数
             if (ro.result == 'ok') {
-              document.getElementById("downloadIframe").src=ro.msg;
+              // document.getElementById("downloadIframe").src=ro.msg;
+              that.$message({
+                type: 'success',
+                message: ro.msg
+              })
             } else {
               // alert('请求响应错误');
               // debugger;
@@ -592,6 +606,12 @@
           this.showMoreSearch = visible;
           this.searchProcessList(false);
         },
+        openExportLogPage(){ // 打开导出记录页
+          this.exportLog.visible = true;
+        },
+        closeExportLogPage(){
+          this.exportLog.visible = false;
+        },
         clearSearchMore() {
           this.frameworkSearchInput1 = '';
           this.frameworkSearchInput1Arr = [];