feat: 时间线

罗广辉

2026-01-23 bb81b0abdc8d61c29bfd0909fe9f19a8b7624039

feat: 时间线

 applications/task-work-order/src/views/orderView/orderManage/orderManage/FormDiaLog.vue

@@ -10,9 +10,22 @@
    >
        <div class="content" style="display: flex">
            <div class="processBox" v-if="dialogMode !== 'add' && processList.length">
                <el-steps direction="vertical" :active="processList.length">
                    <el-step v-for="item in processList" :title="item.flowName" :description="item.flowDesc" />
                </el-steps>
                <el-timeline>
                    <el-timeline-item
                        v-for="(activity, index) in processList"
                        :key="index"
                        :icon="Check"
                        :type="index === processList.length - 1 ? 'success' : 'info'"
                        :color="activity.color"
                        :hollow="activity.hollow"
                        :timestamp="activity.flowDesc.split(' ')[1]"
                    >
                        <div class="item-content">
                            <div>{{ activity.flowDesc.split(' ')[0] }}</div>
                            <div class="flowName">{{ activity.flowName }}</div>
                        </div>
                    </el-timeline-item>
                </el-timeline>
            </div>
            <div class="leftBox">
                <div v-if="dialogReadonly">
@@ -239,7 +252,7 @@
import RefuseOrderDialog from '@/views/orderView/orderManage/orderManage/RefuseOrderDialog.vue'
import CommonCesiumMap from '@/components/map-container/common-cesium-map.vue'
import { gdPatrolTaskPageApi } from '@/views/orderView/orderManage/inspectionRequest/inspectionRequestApi'

import { Check } from '@element-plus/icons-vue'
// 初始化表单数据
const initForm = () => ({
    workOrderName: '',
@@ -596,6 +609,18 @@

    .processBox {
        width: 312px;
        .el-timeline{
            padding-left: 100px;
        }
        .item-content{
            position: relative;
            .flowName{
                position: absolute;
                left: -100px;
                top: 0;
            }
        }

    }
}