|
@@ -6,17 +6,17 @@
|
|
<div class="search-segment" style="flex: 1 1 0%">
|
|
<div class="search-segment" style="flex: 1 1 0%">
|
|
<el-input v-model="processName" placeholder="流程名称">
|
|
<el-input v-model="processName" placeholder="流程名称">
|
|
<template #append>
|
|
<template #append>
|
|
- <el-button icon="Search" @click="init" />
|
|
|
|
|
|
+ <el-button icon="Search" @click.stop="initList" />
|
|
</template>
|
|
</template>
|
|
</el-input>
|
|
</el-input>
|
|
</div>
|
|
</div>
|
|
<div class="search-segment">
|
|
<div class="search-segment">
|
|
<el-tooltip effect="dark" content="重置" placement="top">
|
|
<el-tooltip effect="dark" content="重置" placement="top">
|
|
- <el-button icon="Refresh" @click="resetSearch('external')" />
|
|
|
|
|
|
+ <el-button icon="Refresh" @click.stop="resetSearch('external')" />
|
|
</el-tooltip>
|
|
</el-tooltip>
|
|
</div>
|
|
</div>
|
|
<div class="search-segment">
|
|
<div class="search-segment">
|
|
- <EditPopover placement="right" :width="320" :showFooter="false" v-model:visible="searchMoreVisible">
|
|
|
|
|
|
+ <EditPopover v-model:visible="searchMoreVisible" placement="right" :width="320" :show-footer="false">
|
|
<template #reference>
|
|
<template #reference>
|
|
<el-button icon="Filter" />
|
|
<el-button icon="Filter" />
|
|
</template>
|
|
</template>
|
|
@@ -27,12 +27,7 @@
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
|
</el-select>
|
|
</el-select>
|
|
<!-- 流程分组 -->
|
|
<!-- 流程分组 -->
|
|
- <el-select
|
|
|
|
- v-if="currentTaskType !== 'pendingApproval'"
|
|
|
|
- v-model="value1"
|
|
|
|
- placeholder="流程分组"
|
|
|
|
- style="margin-bottom: 10px; width: 240px"
|
|
|
|
- >
|
|
|
|
|
|
+ <el-select v-if="currentTaskType !== 'pendingApproval'" v-model="value1" placeholder="流程分组" style="margin-bottom: 10px; width: 240px">
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
|
</el-select>
|
|
</el-select>
|
|
<!-- 流程状态 -->
|
|
<!-- 流程状态 -->
|
|
@@ -67,7 +62,7 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 内容值 -->
|
|
<!-- 内容值 -->
|
|
- <div v-infinite-scroll="load" :infinite-scroll-disabled="disabledInfinite" class="flow-list-box">
|
|
|
|
|
|
+ <div v-infinite-scroll="loadList" :infinite-scroll-disabled="disabledInfinite" class="flow-list-box">
|
|
<div
|
|
<div
|
|
v-for="i in satelliteList"
|
|
v-for="i in satelliteList"
|
|
:key="i.instanceId"
|
|
:key="i.instanceId"
|
|
@@ -79,23 +74,45 @@
|
|
<!--头部-->
|
|
<!--头部-->
|
|
<div class="header">
|
|
<div class="header">
|
|
<el-text tag="b">{{ i.processName }}</el-text>
|
|
<el-text tag="b">{{ i.processName }}</el-text>
|
|
- <el-tag v-if="currentTaskType === 'pendingApproval'">待审批</el-tag>
|
|
|
|
- <template v-else>
|
|
|
|
- <el-tag v-if="i.instanceState === 0">审批中</el-tag>
|
|
|
|
- <el-tag v-if="i.instanceState === 1" type="success">审批通过</el-tag>
|
|
|
|
- <el-tag v-if="i.instanceState === 2" type="danger">审批拒绝</el-tag>
|
|
|
|
- <el-tag v-if="i.instanceState === 3">撤销审批</el-tag>
|
|
|
|
- <el-tag v-if="i.instanceState === 4" type="danger">超时结束</el-tag>
|
|
|
|
- <el-tag v-if="i.instanceState === 5" type="danger">强制终止</el-tag>
|
|
|
|
- </template>
|
|
|
|
|
|
+ <div>
|
|
|
|
+ <el-text v-if="['pendingApproval', 'pendingClaim'].indexOf(props.currentTaskType) !== -1" style="margin-right: 15px">{{
|
|
|
|
+ i.performType == 2 ? '会签' : i.performType == 3 ? '或签' : i.performType == 4 ? '票签' : ''
|
|
|
|
+ }}</el-text>
|
|
|
|
+
|
|
|
|
+ <el-tag v-if="currentTaskType === 'pendingApproval'">待审批</el-tag>
|
|
|
|
+ <template v-else>
|
|
|
|
+ <el-tag v-if="i.instanceState === 0">审批中</el-tag>
|
|
|
|
+ <el-tag v-if="i.instanceState === 1" type="success">审批通过</el-tag>
|
|
|
|
+ <el-tag v-if="i.instanceState === 2" type="danger">审批拒绝</el-tag>
|
|
|
|
+ <el-tag v-if="i.instanceState === 3">撤销审批</el-tag>
|
|
|
|
+ <el-tag v-if="i.instanceState === 4" type="danger">超时结束</el-tag>
|
|
|
|
+ <el-tag v-if="i.instanceState === 5" type="danger">强制终止</el-tag>
|
|
|
|
+ </template>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
<!--操作类容-->
|
|
<!--操作类容-->
|
|
- <div class="summary-list"></div>
|
|
|
|
|
|
+ <div class="summary-list">
|
|
|
|
+ <template v-if="['myReceived', 'myApplication', 'approved'].indexOf(currentTaskType) !== -1">
|
|
|
|
+ <div v-if="i.endTime" class="summary-item">
|
|
|
|
+ <div class="label">结束时间:</div>
|
|
|
|
+ <div class="value">{{ i.endTime }}</div>
|
|
|
|
+ </div>
|
|
|
|
+ <div v-if="i.duration" class="summary-item">
|
|
|
|
+ <div class="label">处理耗时:</div>
|
|
|
|
+ <div class="value">{{ i.duration }}</div>
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+
|
|
|
|
+ <div class="summary-item">
|
|
|
|
+ <div class="label">当前所在节点:</div>
|
|
|
|
+ <div class="value">{{ i.currentNode }}</div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
<!--底部-->
|
|
<!--底部-->
|
|
<div class="footer">
|
|
<div class="footer">
|
|
<!-- 头像 -->
|
|
<!-- 头像 -->
|
|
<div class="initiator">
|
|
<div class="initiator">
|
|
- <FlowNodeAvatar :name="'等待后台补充用户'" />
|
|
|
|
|
|
+ <FlowNodeAvatar :name="i.createBy" />
|
|
</div>
|
|
</div>
|
|
<!-- 时间 -->
|
|
<!-- 时间 -->
|
|
<div class="begin-time">提交于 {{ i.createTime }}</div>
|
|
<div class="begin-time">提交于 {{ i.createTime }}</div>
|
|
@@ -195,18 +212,18 @@ const satelliteList = ref([]) // 列表数据
|
|
// 下拉滚动属性值 end
|
|
// 下拉滚动属性值 end
|
|
|
|
|
|
// 初始化
|
|
// 初始化
|
|
-const init = () => {
|
|
|
|
|
|
+const initList = () => {
|
|
loading.value = false
|
|
loading.value = false
|
|
condition.page = 1
|
|
condition.page = 1
|
|
satelliteList.value = []
|
|
satelliteList.value = []
|
|
totalNumber.value = 0
|
|
totalNumber.value = 0
|
|
totalPages.value = 0
|
|
totalPages.value = 0
|
|
taskProcessInfo.refresh = false
|
|
taskProcessInfo.refresh = false
|
|
- load()
|
|
|
|
|
|
+ loadList()
|
|
}
|
|
}
|
|
|
|
|
|
// 分页获取数据
|
|
// 分页获取数据
|
|
-const load = () => {
|
|
|
|
|
|
+const loadList = () => {
|
|
if (loading.value) return false
|
|
if (loading.value) return false
|
|
loading.value = true
|
|
loading.value = true
|
|
getPagedSatellites()
|
|
getPagedSatellites()
|
|
@@ -236,6 +253,14 @@ const getPagedSatellites = async () => {
|
|
}
|
|
}
|
|
const { records, total, pages } = responseData
|
|
const { records, total, pages } = responseData
|
|
records.forEach(item => {
|
|
records.forEach(item => {
|
|
|
|
+ // todo .. 这里将每个模块的不同值进行调整
|
|
|
|
+ // 我收到、我申请 已审批 [结束时间 / 处理耗时 / 当前所在节点]
|
|
|
|
+ // 待审批、认领 [会签/货签/票钱、当前所在节点]
|
|
|
|
+ const flag1 = ['myReceived', 'myApplication', 'approved'].indexOf(props.currentTaskType) !== -1
|
|
|
|
+ const flag2 = ['pendingApproval', 'pendingClaim'].indexOf(props.currentTaskType) !== -1
|
|
|
|
+ item.currentNode = flag2 ? item.taskName : item.currentNode // 当前节点
|
|
|
|
+ item.createTime = flag2 ? item.launchTime : item.createTime // 创建时间
|
|
|
|
+ item.createBy = flag2 ? item.launchBy : item.createBy // 创建人
|
|
satelliteList.value.push(item)
|
|
satelliteList.value.push(item)
|
|
})
|
|
})
|
|
totalNumber.value = total
|
|
totalNumber.value = total
|
|
@@ -264,7 +289,7 @@ const getTaskDetail = item => {
|
|
const resetSearch = type => {
|
|
const resetSearch = type => {
|
|
if (type === 'external') {
|
|
if (type === 'external') {
|
|
processName.value = ''
|
|
processName.value = ''
|
|
- init()
|
|
|
|
|
|
+ initList()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -280,7 +305,7 @@ watch(
|
|
() => taskProcessInfo.refresh,
|
|
() => taskProcessInfo.refresh,
|
|
(nValue, oValue) => {
|
|
(nValue, oValue) => {
|
|
if (nValue) {
|
|
if (nValue) {
|
|
- init()
|
|
|
|
|
|
+ initList()
|
|
}
|
|
}
|
|
},
|
|
},
|
|
{ immediate: true }
|
|
{ immediate: true }
|
|
@@ -358,6 +383,22 @@ const disabledInfinite = computed(() => noMore.value)
|
|
// 操作类容
|
|
// 操作类容
|
|
.summary-list {
|
|
.summary-list {
|
|
margin-top: 10px;
|
|
margin-top: 10px;
|
|
|
|
+ .summary-item {
|
|
|
|
+ display: flex;
|
|
|
|
+ min-height: 20px;
|
|
|
|
+ .label {
|
|
|
|
+ color: #9ba5b3;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ flex-shrink: 0;
|
|
|
|
+ }
|
|
|
|
+ .value {
|
|
|
|
+ color: #232730;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
// 底部
|
|
// 底部
|