<template>
|
<GlobalWindow
|
:title="title"
|
width="50%"
|
:withFooter="false"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
>
|
<div class="time-line">
|
<el-timeline :reverse="true">
|
<el-timeline-item
|
v-for="(activity, index) in list"
|
:key="index"
|
color="#2991FF"
|
size="large"
|
type="primary"
|
>
|
<div class="time">
|
<div>
|
<span class="year">
|
{{ activity.createTime.substring(0, 10) }}
|
</span>
|
</div>
|
<div class="day">{{ activity.createTime.substring(10,20) }}</div>
|
</div>
|
<div class="ml10">
|
<div class="list-title">{{ activity.title }}</div>
|
<div class="list-company">{{activity.logInfo }}</div>
|
</div>
|
</el-timeline-item>
|
</el-timeline>
|
</div>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
export default {
|
name: 'orderProgress',
|
extends: BaseOpera,
|
components: { GlobalWindow },
|
data () {
|
return {
|
list: []
|
}
|
},
|
methods: {
|
open (title, target) {
|
this.title = title
|
this.list = target
|
this.visible = true
|
}
|
}
|
}
|
</script>
|
<style lang="scss" scoped>
|
.time-line {
|
margin-top: 50px;
|
margin-left: 200px;
|
}
|
.list-title {
|
font-size: 12px;
|
font-family: PingFangSC-Medium, PingFang SC;
|
font-weight: 500;
|
color: #181b1e;
|
}
|
.list-company {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: #596878;
|
margin-top: 15px;
|
margin-bottom: 15px;
|
}
|
.list-desc {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: #596878;
|
}
|
//左侧时间
|
.time {
|
color: #409eff;
|
position: absolute;
|
left: -94px;
|
top: 1px;
|
.year {
|
font-size: 14px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: #20354a;
|
}
|
.day {
|
font-size: 12px;
|
font-family: PingFangSC-Regular, PingFang SC;
|
font-weight: 400;
|
color: black;
|
text-align: right;
|
margin-top: 0px;
|
}
|
}
|
</style>
|
