137 lines
4.5 KiB
Vue
137 lines
4.5 KiB
Vue
<template>
|
|
<div>
|
|
<div class="table">
|
|
<vxe-table ref="xTable" :data="tableData" :empty-render="{name: 'NotData'}" align="center" border stripe v-table-min-height="'calc(100vh - 380px)'">
|
|
<vxe-column show-overflow show-header-overflow type="seq" title="序号" width="77">
|
|
<template #default="{ row, rowIndex }">
|
|
{{ rowIndex + (q.current - 1) * q.size + 1 }}
|
|
</template>
|
|
</vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="prcNum"
|
|
title="流程编号">
|
|
<template #default="{ row }">
|
|
<div class="blurcolor" @click="view(row)"> {{row.prcNum}}</div>
|
|
</template>
|
|
</vxe-column>
|
|
<vxe-column show-overflow show-header-overflow
|
|
title="流程类型">
|
|
<template #default="{ row,index }">
|
|
<div>{{getPrcName(row.prcType)}}</div>
|
|
</template>
|
|
</vxe-column>
|
|
<vxe-column show-overflow show-header-overflow title="流程名称">
|
|
<template #default="{ row }" >
|
|
<div class="blurcolor" @click="view(row)">{{row.prcName}}</div>
|
|
</template>
|
|
</vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="creatUserName"
|
|
title="发起人"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="taskAssignee" title="当前处理人"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="taskBackAssignee"
|
|
title="上一处理人"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="creatTime" title="创建时间"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="endTime"
|
|
title="完成时间"></vxe-column>
|
|
<vxe-column show-overflow show-header-overflow field="status" title="状态">
|
|
<template #default="{ row }">
|
|
<span v-if="row.isEnd === '0'">未完成</span>
|
|
<span v-if="row.isEnd === '1'">已完成</span>
|
|
</template>
|
|
</vxe-column>
|
|
<vxe-column show-overflow show-header-overflow title="操作" width="200" fixed="right">
|
|
<template #default="{ row }">
|
|
<el-button @click.native.prevent="view(row)" type="text" size="small">
|
|
查看
|
|
</el-button>
|
|
</template>
|
|
</vxe-column>
|
|
</vxe-table>
|
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="q.current"
|
|
:page-sizes="[5, 10, 20]" :page-size="q.size" layout="total, sizes, prev, pager, next, jumper"
|
|
:total="total" />
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import ProcessMixin from "../../../components/ProcessMixin";
|
|
export default {
|
|
name: 'monitorProcess',
|
|
mixins:[ProcessMixin],
|
|
data() {
|
|
return {
|
|
q:{
|
|
current:1,
|
|
size:10
|
|
},
|
|
total: 0,
|
|
tableData: []
|
|
}
|
|
},
|
|
props:{
|
|
form:{
|
|
type:Object,
|
|
default:{},
|
|
}
|
|
},
|
|
watch:{
|
|
form:{
|
|
handler(){
|
|
console.log("我见他",this.form)
|
|
this.loadData()
|
|
},
|
|
deep:true
|
|
}
|
|
},
|
|
mounted () {
|
|
this.loadData()
|
|
},
|
|
methods: {
|
|
loadData() {
|
|
let userId=this.$store.getters.userInfo.usid
|
|
this.$api.processCenter.monitorProcessesPage({...this.q,...this.searchForm,userId:userId}).then(res=>{
|
|
this.tableData = res.data.list
|
|
this.total = res.data.count
|
|
})
|
|
},
|
|
// 单页数据量
|
|
handleSizeChange(val) {
|
|
this.q.size = val;
|
|
this.q.current = 1;
|
|
this.loadData();
|
|
},
|
|
// 第几页
|
|
handleCurrentChange(val) {
|
|
this.q.current = val;
|
|
this.loadData();
|
|
},
|
|
view(row) {
|
|
this.$router.push({
|
|
path: 'monitorViews',
|
|
query:{
|
|
id: this.$route.query.id,
|
|
prcNum: row.prcNum,
|
|
prcType: row.prcType,
|
|
prcId: row.prcId,
|
|
tabsName: 'MonitorProcess'
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
::v-deep .el-table__fixed,.el-table__fixed-right ::before{
|
|
height: 0px !important;
|
|
}
|
|
.table {
|
|
margin: 0 14px 0 13px;
|
|
::v-deep .el-pagination {
|
|
margin-top: 13px;
|
|
padding-left: 20px;
|
|
padding-bottom: 10px;
|
|
}
|
|
}
|
|
</style>
|