From 387e8b0743240de72425e5b5c5709d629ace9aa4 Mon Sep 17 00:00:00 2001
From: “dzb” <2632970487@qq.com>
Date: 星期二, 11 十月 2022 20:17:43 +0800
Subject: [PATCH] 新增消息界面、处理遗留问题
---
src/components/process/index.vue | 85 ++++++++++++++++++++----------------------
1 files changed, 40 insertions(+), 45 deletions(-)
diff --git a/src/components/process/index.vue b/src/components/process/index.vue
index 8db0ab4..e66ea59 100644
--- a/src/components/process/index.vue
+++ b/src/components/process/index.vue
@@ -4,33 +4,33 @@
<div class="pro-step" v-for="(item,index) in list" :key="item.name">
<div class="pro-step-top">
<div
- :class="['circle',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
+ :class="['circle',active === index ? 'in-process__circle' : active > index ? 'finish' : 'wait' ]">
</div>
- <div :class="['line',active > index ? 'finish-line' :'']"
+ <div :class="['line',active> index ? 'finish-line' :'']"
v-if="index<list.length-1 ? true:false"></div>
</div>
<div
- :class="['pro-step-name',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
+ :class="['pro-step-name',active === index ? 'in-process' : active > index ? 'finish-name' : 'wait' ]">
{{item.name}}</div>
</div>
</div>
<div class="my-pro-main">
<div class="pro-step-ver" v-for="(item,index) in list" :key="item.title">
<div
- :class="['pro-step-name',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
+ :class="['pro-step-name',active === index ? 'in-process' : active > index ? 'finish-name' : 'wait' ]">
{{item.name}}</div>
<div class="pro-step-top">
<div
- :class="['circle',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
+ :class="['circle',active === index ? 'in-process__circle' : active > index ? 'finish' : 'wait' ]">
</div>
<div :class="['line',active > index ? 'finish-line' :'']"
v-if="index<list.length-1 ? true:false"></div>
</div>
- <div class="desc">
- <div class="desc-title">鐜妭鐢ㄦ椂:{{item.disposeRecords[0].linkTime}}</div>
+ <div :class="['desc',active === index ? 'in-process' : active > index ? 'finish-name' : 'wait' ]">
+ <div class="desc-title">鐜妭鐢ㄦ椂:{{item.disposeRecords.length !==0 ? item.disposeRecords[0].linkTime : ''}}</div>
<div class="desc-content" v-if="active > index">
<div class="desc-content-message">1111111</div>
- <div class="desc-content-endtime">{{item.disposeRecords[0].endTime}}</div>
+ <div class="desc-content-endtime">{{item.disposeRecords.length !==0 ? item.disposeRecords[0].endTime:''}}</div>
</div>
</div>
</div>
@@ -43,46 +43,28 @@
return {
active: 0,
list: [
- {
- title: '涓婃姤',
- status: 'success',
- },
- {
- title: '绔嬫',
- status: 'process',
- },
- {
- title: '娲鹃仯',
- status: 'process',
- },
- {
- title: '澶勭疆',
- status: 'process',
- },
- {
- title: '鏍告煡',
- status: 'process',
- },
- {
- title: '缁撴',
- status: 'process',
- }
- ]
+ ],
}
},
- props:['handlePassVo'],
+ props:['handlePassVo','baseCase'],
created(){
- console.log('process');
- const {handlePassVo:{workflowConfigSteps:mylist}} = this;
+ const {handlePassVo:{workflowConfigSteps:mylist},baseCase:{state:mystate}} = this;
// console.log(this.handlePassVo.workflowConfigSteps[0].name);
- console.log(mylist);
- mylist.forEach(item=>{
- if(item.disposeRecords[0].endTime != null){
- this.active ++;
- }
- })
+ // console.log(mylist);
+ console.log(mystate);
+ if(mystate===0){
+ this.active = -1;
+ }else if(mystate ===6){
+ this.active = 1;
+ }else if(mystate===7){
+ this.active = 2;
+ }else if(mystate ===8){
+ this.active = 3;
+ }else if(mystate ===9){
+ this.active = 4;
+ }
this.list = mylist;
- }
+ },
}
</script>
<style lang="scss" scoped>
@@ -136,6 +118,7 @@
flex: 1;
line-height: 24px;
margin-left: 10px;
+ // color: #4b9bb7;
.desc-content-endtime{
display: flex;
justify-content: flex-end;
@@ -148,14 +131,26 @@
height: 24px;
border-radius: 50%;
background-color: #fff;
+ border: 2px solid #808080;
}
.line {
background-color: #c0c4cc;
}
-
+ .in-process{
+ color: #0079fe;
+ }
+ .in-process__circle{
+ border: 2px solid #0079fe;
+ }
.finish-line {
- background-color: #4b9bb7;
+ background-color: #0079fe;
+ }
+ .finish{
+ border: 2px solid #4b9bb7;
+ }
+ .finish-name{
+ color: #4b9bb7;
}
}
</style>
\ No newline at end of file
--
Gitblit v1.8.0