327 lines
12 KiB
Vue
327 lines
12 KiB
Vue
<template>
|
|
<div class="app-container"><!--从这一层开始嵌入页面-->
|
|
<el-card>
|
|
<el-form label-width="80px">
|
|
<div class="search">
|
|
<div class="sl">
|
|
<el-form-item label="流程标题">
|
|
<el-input
|
|
placeholder="输入流程标题"
|
|
v-model.trim="queryParams.title"
|
|
clearable
|
|
@clear="handleQuery"
|
|
/>
|
|
</el-form-item>
|
|
</div>
|
|
<div class="sr">
|
|
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
|
|
<el-button icon="el-icon-refresh-left" @click="resetQuery">重置</el-button>
|
|
</div>
|
|
</div><!--search 搜索-->
|
|
</el-form><!--el-form-->
|
|
</el-card><!--el-card-->
|
|
<el-card>
|
|
<el-tabs v-model="activeName" @tab-click="state">
|
|
<el-tab-pane :label="'待办('+ statustotal+')'" name="taskToDo">
|
|
<el-table :data="postList" style="width: 100%" height="529" v-loading="loading">
|
|
<el-table-column label="序号" width="60" type="index" align="center"></el-table-column>
|
|
<el-table-column prop="procDefName" label="流程类型" width="110px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="title" label="流程标题" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="curActDefName" label="当前环节" width="95px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="prevActDefName" label="上一环节" width="100px" :show-overflow-tooltip="true">
|
|
<template slot-scope="scope">
|
|
<span v-if="!scope.row.prevActDefName">/</span>
|
|
<span v-else>{{ scope.row.prevActDefName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="sendUserName" label="上一环节处理人" width="115px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="startUserName" label="发起人" width="70px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="sendTime" label="接收时间" width="95px">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.sendTime,'{y}-{m}-{d}')}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="80px" >
|
|
<template slot-scope="scope">
|
|
<el-button type="text" icon="el-icon-info" @click="handleDeal(scope.row)">详情</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table><!--el-table-->
|
|
<pagination
|
|
v-show="total>0"
|
|
:total="total"
|
|
:page.sync="queryParams.pageNum"
|
|
:limit.sync="queryParams.pageSize"
|
|
@pagination="getListData"
|
|
/>
|
|
</el-tab-pane><!--el-tab-pane-->
|
|
<el-tab-pane :label="'已办('+doneTotal+')'" name="taskDealed">
|
|
<el-table :data="postList" style="width: 100%" height="529" v-loading="loading">
|
|
<el-table-column label="序号" width="60" type="index" align="center"></el-table-column>
|
|
<el-table-column prop="procDefName" label="流程类型" width="110px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="title" label="流程标题" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="curActDefName" width="100px" label="处理环节"></el-table-column>
|
|
<el-table-column label="上一环节" width="100px" :show-overflow-tooltip="true">
|
|
<template slot-scope="scope">
|
|
<span v-if="!scope.row.prevActDefName">/</span>
|
|
<span v-else>{{ scope.row.prevActDefName }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="sendUserName" label="上一环节处理人" width="115px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="startUserName" label="发起人" width="70px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="sendTime" label="接收时间" width="95px">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.sendTime,'{y}-{m}-{d}')}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="100" >
|
|
<template slot-scope="scope">
|
|
<el-button type="text" icon="el-icon-info" @click="handleDeal(scope.row)">详情</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table><!--el-table-->
|
|
<pagination
|
|
v-show="total>0"
|
|
:total="total"
|
|
:page.sync="queryParams.pageNum"
|
|
:limit.sync="queryParams.pageSize"
|
|
@pagination="getListData"
|
|
/>
|
|
</el-tab-pane><!--el-tab-pane-->
|
|
<el-tab-pane :label="'办结('+finishedTotal+')'" name="taskFinish">
|
|
<el-table :data="postList" style="width: 100%" height="529" v-loading="loading">
|
|
<el-table-column label="序号" width="60" type="index" align="center"></el-table-column>
|
|
<el-table-column prop="procDefName" label="流程类型" width="110px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="title" label="流程标题" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="startUserName" label="发起人" width="95px" :show-overflow-tooltip="true"></el-table-column>
|
|
<el-table-column prop="startTime" label="发起时间" width="95px">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.startTime,'{y}-{m}-{d}')}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="sendTime" label="接收时间" width="95px">
|
|
<template slot-scope="scope">
|
|
<span>{{ parseTime(scope.row.sendTime,'{y}-{m}-{d}')}}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="80px" >
|
|
<template slot-scope="scope">
|
|
<el-button type="text" icon="el-icon-info" @click="handleDeal(scope.row)">详情</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table><!--el-table-->
|
|
<pagination
|
|
v-show="total>0"
|
|
:total="total"
|
|
:page.sync="queryParams.pageNum"
|
|
:limit.sync="queryParams.pageSize"
|
|
@pagination="getListData"
|
|
/>
|
|
</el-tab-pane><!--el-tab-pane-->
|
|
</el-tabs><!--el-tabs-->
|
|
</el-card>
|
|
<!-- 流程处理抽屉组件 -->
|
|
<DealDrawer v-if="dealDrawerShow" ref="dealDrawer" @closeDrawer="handleCloseChange"></DealDrawer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { workflowToDoList } from "@/api/my_business/workflow";
|
|
import DealDrawer from "@/components/DealDrawer";
|
|
import { getUserMsgCount } from "@/api/message/message"
|
|
|
|
export default {
|
|
name: "Post",
|
|
dicts: ["sys_normal_disable", "sys_operterType"],
|
|
components: {
|
|
DealDrawer
|
|
},
|
|
data() {
|
|
return {
|
|
pageSizes: [10,20,50,100],
|
|
dealDrawerShow: false,
|
|
boxClass: false,
|
|
// 遮罩层
|
|
loading: true,
|
|
// 显示搜索条件
|
|
showSearch: true,
|
|
// 总条数
|
|
total: 0,
|
|
// 表格数据
|
|
postList: [],
|
|
// 弹出层标题
|
|
title: "",
|
|
// 是否显示弹出层
|
|
open: false,
|
|
// 查询参数
|
|
queryParams: {
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
title: "",
|
|
status: 1,
|
|
},
|
|
// 表单校验
|
|
rules: {
|
|
postName: [
|
|
{
|
|
required: true,
|
|
message: "不能为空",
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
postCode: [
|
|
{
|
|
required: true,
|
|
message: "不能为空",
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
postSort: [
|
|
{
|
|
required: true,
|
|
message: "不能为空",
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
},
|
|
doneTotal: 0,
|
|
finishedTotal: 0,
|
|
taskData: [], // 任务数据
|
|
deptOptions: [],
|
|
drawer: false,
|
|
taskFormData: {},
|
|
varChangeColor1: true,
|
|
varChangeColor2: false,
|
|
pListData: {},
|
|
statustotal: "",
|
|
adUpdateDisuseDetails: "",
|
|
userInfo: this.$store.getters.userInfo,
|
|
activeName: "taskToDo",
|
|
classLevelOptions: [],
|
|
};
|
|
},
|
|
created() {
|
|
// 初始化获取待办清单
|
|
this.getListData()
|
|
// 获取已办、办结统计页签数量
|
|
this.getOtherActiveCount()
|
|
},
|
|
methods: {
|
|
// 流程处理事件
|
|
handleDeal(row) {
|
|
this.dealDrawerShow = true;
|
|
let flowUrl = this.buildFlowUrl(row)
|
|
this.$nextTick(() => {
|
|
this.$refs.dealDrawer.init(flowUrl);
|
|
});
|
|
},
|
|
buildFlowUrl(row) {
|
|
let res = row.url;
|
|
//待办=1、已办=2、办结=3
|
|
res += "&invokeFrom=list&status="+row.status
|
|
return res;
|
|
},
|
|
getOtherActiveCount() {
|
|
// 获取已办统计数量
|
|
this.loading = true
|
|
let params = {
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
status: 2,
|
|
};
|
|
workflowToDoList(params).then((response) => {
|
|
this.doneTotal = response.data.totalCount || 0;
|
|
this.loading = false
|
|
});
|
|
// 获取办结统计数量
|
|
this.loading = true
|
|
let params2 = {
|
|
pageNumber: 1,
|
|
pageSize: 10,
|
|
status: 3,
|
|
};
|
|
workflowToDoList(params2).then((response) => {
|
|
this.finishedTotal = response.data.totalCount || 0;
|
|
this.loading = false
|
|
});
|
|
},
|
|
/** 查询列表 */
|
|
getListData() {
|
|
let self = this
|
|
self.loading = true;
|
|
self.postList = [];
|
|
workflowToDoList(self.queryParams).then((response) => {
|
|
if (self.activeName == "taskToDo") {
|
|
// 待办
|
|
self.statustotal = response.data.totalCount;
|
|
// this.$store.commit("SET_THINGNUMBER", response.data.totalCount || 0);
|
|
self.total = response.data.totalCount;
|
|
}
|
|
if (self.activeName == "taskDealed") {
|
|
// 已办
|
|
self.doneTotal = response.data.totalCount;
|
|
self.total = response.data.totalCount;
|
|
}
|
|
if (self.activeName == "taskFinish") {
|
|
// 办结
|
|
self.finishedTotal = response.data.totalCount;
|
|
self.total = response.data.totalCount;
|
|
}
|
|
|
|
self.postList = response.data.result;
|
|
setTimeout(function () {
|
|
self.loading = false;
|
|
}, 500);
|
|
|
|
}).catch(err => {
|
|
console.info("err=============", err)
|
|
setTimeout(function () {
|
|
self.loading = false;
|
|
}, 500);
|
|
});
|
|
},
|
|
// 取消按钮
|
|
handleCloseChange() {
|
|
this.dealDrawerShow = false
|
|
getUserMsgCount(this.$store.getters.userId).then(res => {
|
|
this.$store.commit("SET_UNREAD_MSG_NUMBER", res.data);
|
|
});
|
|
this.getListData();
|
|
},
|
|
/** 搜索按钮操作 */
|
|
handleQuery() {
|
|
this.queryParams.pageNumber = 1;
|
|
this.getListData();
|
|
},
|
|
/** 重置按钮操作 */
|
|
resetQuery() {
|
|
this.queryParams.pageNumber = 1;
|
|
this.queryParams.pageSize = 10;
|
|
this.queryParams.title = "";
|
|
this.handleQuery();
|
|
},
|
|
/** 详情按钮操作 */
|
|
handleDetails(row) {
|
|
|
|
},
|
|
state(tab) {
|
|
let p = Number(tab.index) + 1;
|
|
if (p == 1) {
|
|
this.varChangeColor1 = true;
|
|
this.varChangeColor2 = false;
|
|
}
|
|
if (p == 2 || p == 3) {
|
|
this.varChangeColor1 = false;
|
|
this.varChangeColor2 = true;
|
|
}
|
|
this.queryParams.status = p;
|
|
this.queryParams.pageNumber = 1;
|
|
this.queryParams.title = "";
|
|
this.total = 0;
|
|
this.getListData();
|
|
// this.getshulian();
|
|
},
|
|
},
|
|
};
|
|
</script>
|