|
|
@@ -1,58 +1,36 @@
|
|
|
<template>
|
|
|
<hc-new-dialog is-table widths="400px" :show="isShow" title="审批流程" :padding="false" :footer="false" @close="addModalClose">
|
|
|
- <div class="hc-task-time">
|
|
|
- <hc-body class="hc-task-body-card" padding="10px" scrollbar>
|
|
|
- <el-timeline v-if="rowInfo.fixedFlowId == null" class="hc-time-line">
|
|
|
- <template v-for="(item, index) in flowList" :key="index">
|
|
|
- <el-timeline-item :class="item.status === '2' ? 'success' : 'primary'" size="large">
|
|
|
- <div class="timeline-item-icon">
|
|
|
- <hc-icon v-if="item.status === '2'" class="check-icon" name="check" />
|
|
|
- </div>
|
|
|
+ <hc-body class="hc-task-body-card-dialog" padding="10px" scrollbar>
|
|
|
+ <el-timeline class="hc-time-line">
|
|
|
+ <template v-for="(item, index) in flowListTask" :key="index">
|
|
|
+ <el-timeline-item :class="Number(item.status) === 2 ? 'success' : 'primary'" size="large">
|
|
|
+ <div class="timeline-item-icon">
|
|
|
+ <hc-icon v-if="Number(item.status) === 2" class="check-icon" name="check" />
|
|
|
+ </div>
|
|
|
+ <template v-if="item.name">
|
|
|
<div class="reply-name">{{ item.name }}</div>
|
|
|
<div class="reply-time">{{ item.date }}</div>
|
|
|
<div class="reply-content" v-html="item.flowValue" />
|
|
|
- </el-timeline-item>
|
|
|
- </template>
|
|
|
- </el-timeline>
|
|
|
- <el-timeline v-else class="hc-time-line">
|
|
|
- <template v-for="(item, index) in flowListTask" :key="index">
|
|
|
- <el-timeline-item :class="item.status == '2' ? 'success' : 'primary'" size="large">
|
|
|
- <div class="timeline-item-icon">
|
|
|
- <hc-icon v-if="item.status == '2'" class="check-icon" name="check" />
|
|
|
+ </template>
|
|
|
+ <template v-if="item.taskBranchName">
|
|
|
+ <div class="reply-name">
|
|
|
+ <span>{{ item.taskBranchName }}</span>
|
|
|
+ <hc-icon v-if="Number(item.taskBranchType) === 2" name="links" class="ml-2" />
|
|
|
+ <hc-icon v-if="Number(item.taskBranchType) === 1" name="exchange-2" class="ml-2" />
|
|
|
</div>
|
|
|
- <div v-if="!item.isTask" class="reply-name">{{ item.name }}</div>
|
|
|
- <div v-if="item.isTask">
|
|
|
- <div class="reply-name">
|
|
|
- {{ item.name }}
|
|
|
- <hc-icon v-if="item.type == 2" name="links" class="ml-2" />
|
|
|
- <hc-icon v-if="item.type == 1" name="exchange-2" class="ml-2" />
|
|
|
- <br>
|
|
|
- <el-tooltip placement="right" effect="light" :visible="item.taskDetailvisible">
|
|
|
- <template #content>
|
|
|
- <el-timeline class="hc-time-line">
|
|
|
- <template v-for="(item1, index1) in item.userList" :key="index1">
|
|
|
- <el-timeline-item :class="item1.status === '2' ? 'success' : 'primary'" size="large">
|
|
|
- <div class="timeline-item-icon">
|
|
|
- <hc-icon v-if="item1.status === '2'" class="check-icon" name="check" />
|
|
|
- </div>
|
|
|
- <div class="reply-name">{{ item1.name }}</div>
|
|
|
- <div class="reply-time">{{ item1.date }}</div>
|
|
|
- <div class="reply-content" v-html="item1.flowValue" />
|
|
|
- </el-timeline-item>
|
|
|
- </template>
|
|
|
- </el-timeline>
|
|
|
- </template>
|
|
|
- <el-link @click="getTaskDetail" @mouseenter="item.taskDetailvisible = true" @mouseleave="item.taskDetailvisible = false">点击查看详情</el-link>
|
|
|
- </el-tooltip>
|
|
|
+ <div v-for="(item1, index1) in item.userList" :key="index1" class="reply-user-list">
|
|
|
+ <div class="timeline-item-icon">
|
|
|
+ <hc-icon v-if="Number(item1.status) === 2" class="check-icon" name="check" />
|
|
|
</div>
|
|
|
+ <div class="reply-name">{{ item1.name }}</div>
|
|
|
+ <div class="reply-time">{{ item1.date }}</div>
|
|
|
+ <div class="reply-content" v-html="item1.flowValue" />
|
|
|
</div>
|
|
|
- <div class="reply-time">{{ item.date }}</div>
|
|
|
- <div class="reply-content" v-html="item.flowValue" />
|
|
|
- </el-timeline-item>
|
|
|
- </template>
|
|
|
- </el-timeline>
|
|
|
- </hc-body>
|
|
|
- </div>
|
|
|
+ </template>
|
|
|
+ </el-timeline-item>
|
|
|
+ </template>
|
|
|
+ </el-timeline>
|
|
|
+ </hc-body>
|
|
|
</hc-new-dialog>
|
|
|
</template>
|
|
|
|
|
|
@@ -72,7 +50,6 @@ const props = defineProps({
|
|
|
const emit = defineEmits(['close'])
|
|
|
|
|
|
//双向绑定
|
|
|
-// eslint-disable-next-line no-undef
|
|
|
const isShow = defineModel('modelValue', {
|
|
|
default: false,
|
|
|
})
|
|
|
@@ -88,30 +65,16 @@ watch(isShow, (val) => {
|
|
|
if (val) getDataApi()
|
|
|
})
|
|
|
|
|
|
-const rowInfo = ref({})
|
|
|
-const flowList = ref([])
|
|
|
const flowListTask = ref([])
|
|
|
const getDataApi = async () => {
|
|
|
- const { taskId } = getObjValue(dataInfo.value)
|
|
|
- const { data } = await mainApi.getDetail(taskId)
|
|
|
+ //const { taskId } = getObjValue(dataInfo.value)
|
|
|
+ const { data } = await mainApi.getDetail('1808351804224700416')
|
|
|
const tasks = getArrValue(data.taskProcessInfo)
|
|
|
- console.log(tasks)
|
|
|
- flowList.value = tasks
|
|
|
- /*const list = [...arr]
|
|
|
- let firstarr = list.slice(0, 1)
|
|
|
- let taskList = list.slice(1, list.length)
|
|
|
- taskList.forEach((ele)=>{
|
|
|
- ele.name = ele.taskBranchName
|
|
|
- ele.status = ele.taskBranchStatus
|
|
|
- ele.type = ele.taskBranchType
|
|
|
- ele.isTask = true
|
|
|
+ tasks.forEach(item => {
|
|
|
+ item.status = item.taskBranchStatus || item.status
|
|
|
})
|
|
|
- flowListTask.value = arrUnion(firstarr, taskList)*/
|
|
|
-}
|
|
|
-
|
|
|
-//查看详情
|
|
|
-const getTaskDetail = () => {
|
|
|
-
|
|
|
+ console.log(tasks)
|
|
|
+ flowListTask.value = tasks
|
|
|
}
|
|
|
|
|
|
//关闭弹窗
|
|
|
@@ -121,65 +84,18 @@ const addModalClose = () => {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style scoped lang="scss">
|
|
|
-.hc-task-time {
|
|
|
- position: relative;
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-</style>
|
|
|
-
|
|
|
<style lang="scss">
|
|
|
-.hc-task-body-card {
|
|
|
+.hc-task-body-card-dialog {
|
|
|
background: #f7f7f7;
|
|
|
.el-scrollbar__bar.is-vertical {
|
|
|
right: -8px;
|
|
|
}
|
|
|
- .hc-task-body-table {
|
|
|
- position: relative;
|
|
|
- height: calc(100% - 30px);
|
|
|
- .hc-task-body-table-form {
|
|
|
- position: relative;
|
|
|
- height: 100%;
|
|
|
- overflow: auto;
|
|
|
- .title {
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- font-size: 18px;
|
|
|
- border: 1px solid #e5e6ea;
|
|
|
- height: 50px;
|
|
|
- }
|
|
|
- .name {
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- font-size: 13px;
|
|
|
- border: 1px solid #e5e6ea;
|
|
|
- padding: 10px;
|
|
|
- border-top: 0;
|
|
|
- }
|
|
|
- .input {
|
|
|
- position: relative;
|
|
|
- border: 1px solid #e5e6ea;
|
|
|
- padding: 6px;
|
|
|
- border-top: 0;
|
|
|
- }
|
|
|
- .input-box {
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- .box {
|
|
|
- position: relative;
|
|
|
- width: 50%;
|
|
|
- }
|
|
|
- .no-b {
|
|
|
- border-left: 0;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
.hc-task-body-tip {
|
|
|
color: red;
|
|
|
}
|
|
|
+ .reply-user-list {
|
|
|
+ position: relative;
|
|
|
+ padding: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
