kely
2 years ago
47 changed files with 872 additions and 222 deletions
@ -0,0 +1,28 @@ |
|||||
|
<div> |
||||
|
<h2>流程记录</h2> |
||||
|
<div class="mt-4 p-3"> |
||||
|
<nz-timeline> |
||||
|
@for (item of flowRecords; track $index) { |
||||
|
<nz-timeline-item [nzDot]="item.finishTime ? undefined : dotTemplate"> |
||||
|
<div> |
||||
|
{{ item.createTime }} |
||||
|
<span> |
||||
|
{{ item.comment?.comment }} |
||||
|
</span> |
||||
|
</div> |
||||
|
<div>任务名称：{{ item.taskName }}</div> |
||||
|
<div>审批人：{{ item?.assigneeName ?? '-' }}</div> |
||||
|
@if (item.finishTime) { |
||||
|
<div> |
||||
|
<span> 流程完成时间：{{ item.finishTime }} </span> |
||||
|
<span> 用时：{{ item.duration }} </span> |
||||
|
</div> |
||||
|
} |
||||
|
</nz-timeline-item> |
||||
|
} |
||||
|
</nz-timeline> |
||||
|
<ng-template #dotTemplate> |
||||
|
<span nz-icon nzType="clock-circle-o" style="font-size: 16px"></span> |
||||
|
</ng-template> |
||||
|
</div> |
||||
|
</div> |
||||
@ -0,0 +1,27 @@ |
|||||
|
import { Component, Input, OnInit } from '@angular/core' |
||||
|
import { ApiService } from 'app/services' |
||||
|
import { SharedModule } from 'app/shared/shared.module' |
||||
|
import { NzSafeAny } from 'ng-zorro-antd/core/types' |
||||
|
|
||||
|
@Component({ |
||||
|
selector: 'app-flow-result', |
||||
|
standalone: true, |
||||
|
imports: [SharedModule], |
||||
|
templateUrl: './flow-result.component.html', |
||||
|
styleUrl: './flow-result.component.less', |
||||
|
}) |
||||
|
export class FlowResultComponent implements OnInit { |
||||
|
constructor(private api: ApiService) {} |
||||
|
|
||||
|
@Input() flow: NzSafeAny = null |
||||
|
|
||||
|
flowRecords: NzSafeAny[] = [] |
||||
|
|
||||
|
ngOnInit(): void { |
||||
|
if (this.flow) { |
||||
|
this.api.getFlowRecord(this.flow.deployId, this.flow.procInsId).subscribe((res) => { |
||||
|
this.flowRecords = res.body.flowList |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,88 @@ |
|||||
|
.dashboard { |
||||
|
.statistic { |
||||
|
@apply flex; |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
.icon { |
||||
|
display: block; |
||||
|
width: 48px; |
||||
|
height: 48px; |
||||
|
border-radius: 50%; |
||||
|
background-color: #1890ff; |
||||
|
color: #fff; |
||||
|
font-size: 20px; |
||||
|
@apply flex items-center justify-center mr-2 flex-shrink-0; |
||||
|
} |
||||
|
|
||||
|
[nz-carousel-content] { |
||||
|
text-align: center; |
||||
|
height: 160px !important; |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
::ng-deep { |
||||
|
.ant-carousel .slick-dots-bottom { |
||||
|
bottom: 0; |
||||
|
} |
||||
|
|
||||
|
.ant-carousel .slick-dots li button { |
||||
|
background-color: rgba(0, 0, 0, .35); |
||||
|
} |
||||
|
|
||||
|
.ant-carousel .slick-dots li.slick-active button { |
||||
|
background-color: #1890ff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.example-list { |
||||
|
width: 500px; |
||||
|
max-width: 100%; |
||||
|
border: solid 1px #ccc; |
||||
|
min-height: 30px; |
||||
|
display: block; |
||||
|
background: white; |
||||
|
border-radius: 4px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
.example-box { |
||||
|
padding: 6px 10px; |
||||
|
border-bottom: solid 1px #ccc; |
||||
|
color: rgba(0, 0, 0, 0.87); |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
align-items: center; |
||||
|
|
||||
|
box-sizing: border-box; |
||||
|
cursor: move; |
||||
|
background: white; |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
.cdk-drag-preview { |
||||
|
box-sizing: border-box; |
||||
|
border-radius: 4px; |
||||
|
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), |
||||
|
0 8px 10px 1px rgba(0, 0, 0, 0.14), |
||||
|
0 3px 14px 2px rgba(0, 0, 0, 0.12); |
||||
|
} |
||||
|
|
||||
|
.cdk-drag-placeholder { |
||||
|
opacity: 0; |
||||
|
} |
||||
|
|
||||
|
.cdk-drag-animating { |
||||
|
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); |
||||
|
} |
||||
|
|
||||
|
.example-box:last-child { |
||||
|
border: none; |
||||
|
} |
||||
|
|
||||
|
.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) { |
||||
|
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1); |
||||
|
} |
||||
Loading…
Reference in new issue