From df79efc124d0f3c65ec19c5a9d62549cf2b0bc90 Mon Sep 17 00:00:00 2001
From: caoyizhong <1270296080@qq.com>
Date: Thu, 20 Apr 2023 18:14:42 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=B7=B2=E5=8A=9E=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/activiti/Cleared.vue  | 555 ++++++++++++++++++++++++++++++++
 src/views/activiti/HaveDone.vue |  28 +-
 2 files changed, 571 insertions(+), 12 deletions(-)
 create mode 100644 src/views/activiti/Cleared.vue

diff --git a/src/views/activiti/Cleared.vue b/src/views/activiti/Cleared.vue
new file mode 100644
index 0000000..b7388ec
--- /dev/null
+++ b/src/views/activiti/Cleared.vue
@@ -0,0 +1,555 @@
+<template>
+  <div class="search" style="height: 100%;">
+    <a-card>
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="handleSearch">
+          <a-row :gutter="24">
+            <a-col :md="6" :sm="8">
+              <a-form-item label="任务名称" prop="name">
+                <a-input
+                  type="text"
+                  v-model="searchForm.name"
+                  placeholder="请输入"
+                  clearable
+                />
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="8">
+              <a-form-item label="状态">
+                <a-select v-model="searchForm.status" placeholder="请选择" :allowClear="true">
+                  <a-select-option value=1>已处理</a-select-option>
+                  <a-select-option value=2>进行中</a-select-option>
+                  <a-select-option value=3>已结束</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <!--            <a-col :md="6" :sm="8">-->
+            <!--              <a-form-item label="所属流程" prop="processName">-->
+            <!--                <a-input-->
+            <!--                  type="text"-->
+            <!--                  v-model="searchForm.processName"-->
+            <!--                  placeholder="请输入"-->
+            <!--                  clearable-->
+            <!--                />-->
+            <!--              </a-form-item>-->
+            <!--            </a-col>-->
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+            <a-col :md="6" :sm="12">
+                <a-button @click="handleSearch" type="primary" icon="search">搜索</a-button>
+                <a-button @click="handleReset" style="margin-left: 10px;">重置</a-button>
+              <a-dropdown v-if="selectedRowKeys.length > 0" v-has="'doneManage:deleteAll'">
+                <a-button style="margin-left: 8px" @click="batchDell"> <a-icon type="delete" /> 删除 </a-button>
+             </a-dropdown>
+            </a-col>
+          </span>
+          </a-row>
+        </a-form>
+      </div>
+
+      <a-row>
+        <a-table
+          :scroll="{x:1200,y:innerHeight/1.4}" bordered
+          :loading="loading"
+          rowKey="id"
+          :dataSource="dataSource"
+          :pagination="ipagination"
+          @change="handleTableChange"
+          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
+          ref="table"
+        >
+          <a-table-column title="序号" :width="70" align="center">
+            <template slot-scope="t,r,i">
+              <span> {{ i + 1 }} </span>
+            </template>
+          </a-table-column>
+          <a-table-column title="任务名称" dataIndex="name" align="center" :width="180">
+            <template slot-scope="t,r,i">
+              <span> {{ t }} </span>
+            </template>
+          </a-table-column>
+          <a-table-column title="所属流程" dataIndex="processName" align="center" :width="210">
+            <template slot-scope="t,r,i">
+              <span> {{ t }} </span>
+            </template>
+          </a-table-column>
+          <a-table-column title="委托人" dataIndex="owner" align="center" :width="100">
+            <template slot-scope="t,r,i">
+              <span> {{ t }} </span>
+            </template>
+          </a-table-column>
+          <a-table-column title="流程发起人" dataIndex="applyer" align="center" :width="120">
+            <template slot-scope="t,r,i">
+              <span> {{ t }} </span>
+            </template>
+          </a-table-column>
+          <!--          <a-table-column title="优先级" dataIndex="priority"   align="center" :width="100"-->
+          <!--                          key="priority" :sorter="(a,b)=>a.priority - b.priority"-->
+          <!--          >-->
+          <!--            <template slot-scope="t">-->
+          <!--              <span v-if="t==0" style="color: green;"> 普通 </span>-->
+          <!--              <span v-else-if="t==1" style="color: orange;"> 重要 </span>-->
+          <!--              <span v-else-if="t==2" style="color: red;"> 紧急 </span>-->
+          <!--              <span v-else style="color: #999;"> 无 </span>-->
+          <!--            </template>-->
+          <!--          </a-table-column>-->
+          <a-table-column title="审批操作" dataIndex="deleteReason" align="center">
+            <template slot-scope="t">
+              <span> {{ t }} </span>
+            </template>
+          </a-table-column>
+          <a-table-column title="状态" dataIndex="apart" align="center" :width="120">
+            <template slot-scope="t">
+              <span v-if="t == 1"> 已处理 </span>
+              <span v-if="t == 2"> 进行中 </span>
+              <span v-if="t == 3"> 已结束 </span>
+            </template>
+          </a-table-column>
+          <a-table-column title="审批意见" dataIndex="comment" align="center">
+            <template slot-scope="t">
+              <!--<j-ellipsis :value="t" :length="10"/>-->
+              <span>{{ removeHtmlStyle(t) }}</span>
+            </template>
+          </a-table-column>
+          <!--          <a-table-column title="耗时" dataIndex="duration"   align="center" :width="100"-->
+          <!--                          key="duration" :sorter="(a,b)=>a.duration - b.duration"-->
+          <!--          >-->
+          <!--            <template slot-scope="t">-->
+          <!--              <span> {{millsToTime(t)}} </span>-->
+          <!--            </template>-->
+          <!--          </a-table-column>-->
+          <a-table-column title="创建时间" dataIndex="createTime" align="center" :width="170">
+            <template slot-scope="t,r,i">
+              <span v-if="!!r.createTime"> {{ t }} </span>
+              <span v-else> {{ r.startTime }} </span>
+              <!--              <span  > {{i}} </span>-->
+            </template>
+          </a-table-column>
+          <a-table-column title="操作" dataIndex="action" align="center">
+            <template slot-scope="t,r,i">
+              <span v-if="r.apart == 1">
+                <a href="javascript:void(0);" @click="detail(r)" v-has="'doneManage:from'">流程数据1</a>
+                <!--<a-divider type="vertical" />
+                <a href="javascript:void(0);" @click="history(r)" >审批历史</a>-->
+              <a-divider type="vertical" v-has="'doneManage:delete'" />
+              <a-popconfirm title="确定删除吗?" @confirm="() => remove(r)">
+                <a style="color: red;" v-has="'doneManage:delete'">删除</a>
+              </a-popconfirm>
+              </span>
+              <span v-else-if="r.apart == 2">
+                 <template v-if="r.isSuspended">
+                <a href="javascript:void(0);" style="color: green;" @click="editStatus(1,r)">激活</a>
+                <a-divider type="vertical" />
+              </template>
+              <a href="javascript:void(0);" style="color: #999;" @click="details(r)"
+                 v-has="'processInsManage:from'">流程数据2</a>
+              <a-divider type="vertical" />
+              <a href="javascript:void(0);" style="color: #999;" @click="detailActionLog(r)"
+                 v-has="'processInsManage:history'">操作记录</a>
+              <a-divider type="vertical" v-has="'processInsManage:delete'" />
+              <a-popconfirm title="确定删除吗?" @confirm="() => remove(r)">
+                <a style="color: red;" v-has="'processInsManage:delete'">删除</a>
+              </a-popconfirm>
+              </span>
+              <span v-else-if="r.apart == 3">
+                 <a href="javascript:void(0);" style="color: blue;" @click="detai(r)"
+                    v-has="'processFinishManage:from'">流程数据3</a>
+              <a-divider type="vertical" v-has="'processFinishManage:delete'" />
+              <a-popconfirm title="确定删除吗?" @confirm="() => remove(r)">
+                <a style="color: red;" v-has="'processFinishManage:delete'">删除</a>
+              </a-popconfirm>
+              </span>
+
+            </template>
+
+          </a-table-column>
+        </a-table>
+      </a-row>
+    </a-card>
+    <!---->
+    <a-modal title="审批历史" v-model="modalLsVisible" :mask-closable="false" :width="'80%'" :footer="null">
+      <div v-if="modalLsVisible">
+        <component :is="historicDetail" :procInstId="procInstId"></component>
+      </div>
+    </a-modal>
+    <!--流程表单-->
+    <a-modal :title="lcModa.title" v-model="lcModa.visible" :footer="null" :maskClosable="false" width="80%">
+      <component :disabled="lcModa.disabled" v-if="lcModa.visible" :is="lcModa.formComponent"
+                 :processData="lcModa.processData" :isNew="lcModa.isNew" :procInstId="lcModa.procInstId"
+                 :pictureId="lcModa.pictureId"
+                 :itemId="lcModa.itemId"
+                 @close="lcModa.visible=false,lcModa.disabled = false"></component>
+    </a-modal>
+
+    <a-modal
+      :title="modalTitle"
+      v-model="modalVisible"
+      :mask-closable="false"
+      :width="500"
+      :styles="{top: '30px'}"
+    >
+      <a-form ref="form" :model="form" :label-width="70" :rules="formValidate">
+        <a-form-item label="删除原因" prop="reason">
+          <a-input type="textarea" v-model="form.reason" :rows="4" />
+        </a-form-item>
+      </a-form>
+      <div slot="footer">
+        <a-button type="text" @click="handelCancel">取消</a-button>
+        <a-button type="primary" :loading="submitLoading" @click="handelSubmit">提交</a-button>
+      </div>
+    </a-modal>
+    <!--进行中 -->
+    <a-modal title="流程操作记录" v-model="operatingRecord" :mask-closable="false" :width="'80%'" :footer="null">
+      <div v-if="operatingRecord">
+        <component :is="operatingRecordDetail" :tableId="tableId"></component>
+      </div>
+    </a-modal>
+
+  </div>
+</template>
+
+<script>
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+import { activitiMixin } from '@/views/activiti/mixins/activitiMixin'
+import { getAction, postFormAction } from '@api/manage'
+
+export default {
+  name: 'Cleared',
+  mixins: [activitiMixin, JeecgListMixin],
+  data() {
+    return {
+      //用于控制流程操作记录的显示
+      operatingRecord: false,
+      tableId: '',
+      openSearch: true,
+      conheight: 580,
+      openTip: true,
+      loading: true, // 表单加载状态
+      selectCount: 0, // 多选计数
+      selectList: [], // 多选数据
+      searchForm: {
+        // 搜索框对应data对象
+        name: '',
+        processName: '',
+        pageNumber: 1, // 当前页数
+        pageSize: 10, // 页面大小
+        sort: 'createTime', // 默认排序字段
+        order: 'desc' // 默认排序方式
+      },
+      modalType: 0, // 添加或编辑标识
+      modalVisible: false, // 添加或编辑显示
+      modalTitle: '', // 添加或编辑标题
+      form: {
+        // 添加或编辑表单对象初始化数据
+        reason: ''
+      },
+      formValidate: {
+        // 表单验证规则
+      },
+      submitLoading: false, // 添加或编辑提交状态
+      data: [], // 表数据
+      total: 0, // 表数据总数
+      deleteId: '',
+      url: {
+        list: '/actProcessIns/actionTakenList',
+        deleteHistoricTask: '/actTask/deleteHistoric/'
+      },
+      modalLsVisible: false,
+      procInstId: '',
+      lcModa: {
+        title: '',
+        disabled: false,
+        visible: false,
+        itemId: '',
+        formComponent: null,
+        isNew: false
+      }
+    }
+  },
+  mounted() {
+    // this.init();
+  },
+  methods: {
+    handelSubmit() {
+      this.submitLoading = true;
+      this.postFormAction(this.url.deleteProcessIns+this.deleteId, this.form).then(res => {
+        this.submitLoading = false;
+        if (res.success) {
+          this.$message.success("操作成功");
+          this.modalVisible = false;
+          this.getDataList();
+        }else {
+          this.$message.error(res.message);
+        }
+      });
+    },
+    detai(r) {
+      if (!r.routeName) {
+        this.$message.warning(
+          "该流程信息未配置表单，请联系开发人员！"
+        );
+        return;
+      }
+      console.log(r.id,'查看数据********')
+      this.lcModa.itemId=r.tableId
+      this.lcModa.disabled = true;
+      this.lcModa.title = '查看流程业务信息：'+r.name;
+      this.lcModa.formComponent = this.getFormComponent(r.routeName).component;
+      this.lcModa.processData = r;
+      this.lcModa.isNew = false;
+
+      this.lcModa.procInstId=r.id;
+      this.lcModa.visible = true;
+    },
+    //通过流程主表id查询在流程操作记录中存入的操作记录
+    detailActionLog(v){
+      console.log(v.tableId)
+      if (!v.tableId){
+        this.$message.error("流程主表id不存在");
+        return;
+      }
+      this.tableId = v.tableId;
+      this.operatingRecord = true;
+    },
+    details(r) {
+      if (!r.routeName) {
+        this.$message.warning(
+          "该流程信息未配置表单，请联系开发人员！"
+        );
+        return;
+      }
+      this.lcModa.itemId=r.tableId
+      this.lcModa.disabled = true;
+      this.lcModa.title = '查看流程业务信息：'+r.name;
+      this.lcModa.formComponent = this.getFormComponent(r.routeName).component;
+      this.lcModa.processData = r;
+      this.lcModa.isNew = false;
+      this.lcModa.procInstId=r.procInstId;
+      this.lcModa.visible = true;
+    },
+    editStatus(status, v) {
+      let operation = "";
+      if (status == 0) {
+        operation = "暂停挂起";
+      } else {
+        operation = "激活运行";
+      }
+      this.$confirm({
+        title: "确认" + operation,
+        content: `您确认要${operation}流程实例${v.name}?`,
+        loading: true,
+        onOk: () => {
+          let params = {
+            status: status,
+            id: v.id
+          };
+          this.postFormAction(this.url.updateInsStatus,params).then(res => {
+            if (res.success) {
+              this.$message.success("操作成功");
+              this.getDataList();
+            }else {
+              this.$message.error(res.message);
+            }
+          });
+        }
+      });
+    },
+    batchDell() {
+      if (!this.url.deleteHistoricTask) {
+        this.$message.error('请设置url.deleteHistoricTask属性!!!!')
+        return
+      }
+      if (this.selectedRowKeys.length <= 0) {
+        this.$message.warning('请选择一条记录！')
+        return
+      } else {
+        var ids = ''
+        for (var a = 0; a < this.selectedRowKeys.length; a++) {
+          ids += this.selectedRowKeys[a] + ','
+        }
+        var that = this
+        this.$confirm({
+          title: '确认删除',
+          content: '是否删除选中数据?',
+          onOk: function() {
+            that.loading = true
+            postFormAction(that.url.deleteHistoricTask + ids, null).then((res) => {
+              if (res.success) {
+                that.$message.success(res.message)
+                that.getDataList()
+              } else {
+                that.$message.warning(res.message)
+              }
+            }).finally(() => {
+              that.loading = false
+            })
+          }
+        })
+      }
+    },
+    loadData(arg) {
+      if (!this.url.list) {
+        this.$message.error('请设置url.list属性!')
+        return
+      }
+      //加载数据 若传入参数1则加载第一页的内容
+      if (arg === 1) {
+        this.ipagination.current = 1
+      }
+      // var params = this.getQueryParams();//查询条件
+      this.loading = true
+      console.log('params>>>>>>', this.searchForm)
+      getAction(this.url.list, this.searchForm).then((res) => {
+        if (res.success) {
+          this.dataSource = res.result.records || res.result
+          if (res.result.total) {
+            this.ipagination.total = res.result.total
+          }
+        }
+        if (res.code === 510) {
+          this.$message.warning(res.message)
+        }
+        this.loading = false
+      })
+    },
+    init() {
+      this.getDataList()
+    },
+    getDataList() {
+      this.loading = true
+      this.getAction(this.url.doneList, this.searchForm).then(res => {
+        this.loading = false
+        if (res.success) {
+          console.log('执行了')
+          this.data = res.result.records
+          this.ipagination.total = res.result.total
+
+        } else {
+          this.$message.error(res.message)
+        }
+      })
+    },
+    removeHtmlStyle(str) {
+      if (!str) {
+        return
+      }
+      str = str.replace(/<\/?[^>]*>/g, '')       //匹配所有html标签
+
+      str = str.replace(/<p[^>]*>/g, '<p class="tag-class">') //去除标签内所有属性，并设置自定义类名
+
+      str = str.replace(/(\n)/g, '')             //去除换行
+
+      str = str.replace(/\s+style="[^"]*"/g, '') //去除style样式
+
+      str = str.replace(/&nbsp;/gi, '')          //去除空格
+
+      str = str.replace(/\<img/gi, '<img class="img_class"')  //添加自定义
+      return str
+    },
+    handleSearch() {
+      this.searchForm.pageNumber = 1
+      this.searchForm.pageSize = 10
+      this.loadData(1)
+    },
+    handleReset() {
+      this.searchForm = {}
+      this.searchForm.pageNumber = 1
+      this.searchForm.pageSize = 10
+      // 重新加载数据
+      this.loadData(1)
+    },
+    handelCancel() {
+      this.modalVisible = false
+    },
+    detail(r) {
+      if (!r.routeName) {
+        this.$message.warning(
+          '该流程信息未配置表单，请联系开发人员！'
+        )
+        return
+      }
+      this.lcModa.disabled = true
+      this.lcModa.itemId = r.tableId
+      this.lcModa.title = '查看流程业务信息：' + r.processName
+      this.lcModa.formComponent = this.getFormComponent(r.routeName).component
+      this.lcModa.processData = r
+      this.lcModa.isNew = false
+      this.lcModa.isTask = true
+      this.lcModa.procInstId = r.procInstId
+      this.lcModa.visible = true
+    },
+    history(r) {
+      if (!r.procInstId) {
+        this.$message.error('流程实例ID不存在')
+        return
+      }
+      this.procInstId = r.procInstId
+      this.modalLsVisible = true
+    },
+    remove(v) {
+      console.log(">>>>>>>>>>",v);
+      if(v.apart == 1){
+        this.postFormAction(this.url.deleteHistoricTask + v.id).then(res => {
+          if (res.success) {
+            this.$message.success('操作成功')
+            this.loadData(1)
+          } else {
+            this.$message.error(res.message)
+          }
+        })
+      }else if(v.apart == 2){
+        this.modalTitle = `确认删除流程 ${v.name}`;
+        // 单个删除
+        this.deleteId = v.id;
+        this.modalType = 0;
+        this.modalVisible = true;
+      }else if(v.apart ===3 ){
+        this.postFormAction(this.url.delHistoricIns+v.id).then(res => {
+          if (res.success) {
+            this.$message.success("操作成功");
+            this.getDataList();
+          }else {
+            this.$message.error(res.message);
+          }
+        });
+      }
+
+
+
+
+    },
+    handleTableChange(pagination, filters, sorter) {
+      //分页、排序、筛选变化时触发
+      //TODO 筛选
+      if (Object.keys(sorter).length > 0) {
+        this.isorter.column = sorter.field
+        this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
+      }
+      this.ipagination = pagination
+      // this.loadData();
+    }
+  },
+  watch: {}
+}
+</script>
+
+<style scoped>
+@import '~@assets/less/common.less';
+
+/deep/ .ant-modal {
+  overflow-y: hidden;
+}
+
+/deep/ .ant-modal-content {
+  height: 100%;
+  overflow-y: scroll;
+}
+
+/deep/ .ant-modal-body {
+  height: 100%;
+  /*overflow-y: scroll;*/
+}
+
+/deep/ .ant-modal {
+  top: 45px
+}
+</style>
\ No newline at end of file
diff --git a/src/views/activiti/HaveDone.vue b/src/views/activiti/HaveDone.vue
index a2f69fd..ca5ba1a 100644
--- a/src/views/activiti/HaveDone.vue
+++ b/src/views/activiti/HaveDone.vue
@@ -1,16 +1,18 @@
 <template>
   <div style="background-color: white" :style="conheight">
-    <a-tabs default-active-key="1" @change="callback" style="padding: 0px 10px">
-      <a-tab-pane key="1" tab="我的已办">
-        <done-manage/>
-      </a-tab-pane>
-      <a-tab-pane key="2" tab="进行中流程" force-render>
-        <process-ins-manage/>
-      </a-tab-pane>
-      <a-tab-pane key="3" tab="已结束流程" force-render>
-        <process-finish-manage/>
-      </a-tab-pane>
-    </a-tabs>
+<!--  <div style="background-color: white">-->
+    <Cleared/>
+<!--    <a-tabs default-active-key="1" @change="callback" style="padding: 0px 10px">-->
+<!--      <a-tab-pane key="1" tab="我的已办">-->
+<!--        <done-manage/>-->
+<!--      </a-tab-pane>-->
+<!--      <a-tab-pane key="2" tab="进行中流程" force-render>-->
+<!--        <process-ins-manage/>-->
+<!--      </a-tab-pane>-->
+<!--      <a-tab-pane key="3" tab="已结束流程" force-render>-->
+<!--        <process-finish-manage/>-->
+<!--      </a-tab-pane>-->
+<!--    </a-tabs>-->
   </div>
 </template>
 
@@ -18,6 +20,7 @@
 import doneManage from '@views/activiti/doneManage'
 import processInsManage from '@views/activiti/processInsManage'
 import processFinishManage from '@views/activiti/processFinishManage'
+import Cleared from '@views/activiti/Cleared'
 
 
 export default {
@@ -25,7 +28,8 @@ export default {
   components:{
     doneManage,
     processFinishManage,
-    processInsManage
+    processInsManage,
+    Cleared
   },
   data(){
     return{