修改时间为字符串

“dzb”

2022-10-20 b654384fcaedb1d90c535d209778003d199aafa5

 src/components/solveProblem/index.vue

@@ -1,74 +1,103 @@
<template>
    <div class="sovle-problem">
        <div class="sovle-header">
            <div class="sovle-limit">处理时限:{{}}</div>
            <div class="sovle-limit">剩余时间:23小时</div>
            <div class="sovle-limit">处理时限:{{dispatchInfo.disposeDate}}</div>
            <div class="sovle-limit">剩余时间:{{getRestTime(dispatchInfo.disposeDate)}}</div>
        </div>
        <div class="sovle-timeline">
            <el-timeline>
                <el-timeline-item :color="mycolor" v-for="item in list" :key="item.id">
                    <div class="title">
                        <div class="title-left">【{{item.name}}】{{item.name === '派遣' ? '派遣员':item.name === '处理' ? '处理人':'评定人'}}:{{item.disposeRecords[0].handleId}}</div>
                        <div class="title-right">{{item.disposeRecords[0].endTime}}</div>
                        <div class="title-left">【{{item.name}}】处理人: {{item.disposeRecords && item.disposeRecords.length != 0 ?  item.disposeRecords[0].handlerText:''}}
                        </div>
                        <div class="title-right">{{item.disposeRecords.length !==0 ? filterTime(item.disposeRecords[0].endTime):''}}
                        </div>
                    </div>
                    <div class="message">【{{item.name === '派遣' ? '派遣意见':item.name === '处理' ? '处理结果':'评定结果'}}】请相关执法队员及时前往现场进行处置</div>
                </el-timeline-item> 
                <!-- <el-timeline-item :color="mycolor">
                    <div class="title">
                        <div class="title-left">【处理】处理人:xxx</div>
                        <div class="title-right">22.09.06 16:40</div>
                    </div>
                    <div class="message">【处理结果】请相关执法队员及时前往现场进行处置</div>
                    <div class="message">{{filterPerson(item.name)}}</div>
                </el-timeline-item>
                <el-timeline-item :color="mycolor">
                    <div class="title">
                        <div class="title-left">【评定】评定人:xxx</div>
                        <div class="title-right">22.09.06 16:40</div>
                    </div>
                    <div class="message">【评定结果】请相关执法队员及时前往现场进行处置</div>
                </el-timeline-item> -->
            </el-timeline>
        </div>
    </div>
</template>
</template> 
<script>
    export default{
        data(){
            return{
                mycolor:'#02a7f0',
                list:[]
import helper from '@/utils/mydate'
import {computeTime} from '@/utils/helper'
export default {
    data() {
        return {
            mycolor: '#02a7f0',
            list: [],
            dispatchInfo: {},
        }
    },
    props: ['handlePassVo', 'baseCase'],
    created() {
        const { handlePassVo: mylist, baseCase } = this;
        console.log(baseCase, mylist); 
        if (mylist) {
            this.list = mylist.workflowConfigSteps;
        }
        if (baseCase.dispatchInfo) {
            this.dispatchInfo = baseCase.dispatchInfo;
        }
    },
    methods: {
        // 获得意见
        filterPerson(name) {
            const { baseCase, dispatchInfo } = this;
            if (name === '调度') {
                return '【派遣意见】' + dispatchInfo.dispatchOpinion
            } else if (name === '核查') {
                return '【核查结果】' + baseCase.handlingOpinion
            } else if (name === '结案') {
                return '【评定结果】' + baseCase.finalOpinion
            } else {
                return '【处理结果】' + baseCase.handlingOpinion
            }
        },
        props:['problemProVo'],
        created(){
            const {problemProVo:{workflowConfigSteps:mylist}} = this;
            console.log(mylist);
            this.list = mylist;
        }   
        // 处理时间
        filterTime(time){
            if(time){
                return helper(time)
            }else{
                return
            }
            
        },
        // 获得剩余时间
        getRestTime(limitTime){
            if(limitTime){
                return computeTime(limitTime)
            }
            return 
        }
    }
}
</script>
<style lang="scss" scoped>
    .sovle-problem{
        .sovle-header{
            padding: 0 200px;
            display: flex;
            line-height: 60px;
            justify-content: space-between;
        }
        .title{
            display: flex;
            justify-content: space-between;
            line-height: 40px;
            padding: 0 20px;
            color: #4b9bb7;
            font-size: 16px;
        }
        .message{
            padding: 20px;
            background-color: #070f22;
            color: #4b9bb7;
            line-height: 20px;
            font-size: 10px;
        }
.sovle-problem {
    .sovle-header {
        padding: 0 200px;
        display: flex;
        line-height: 60px;
        justify-content: space-between;
    }

    .title {
        display: flex;
        justify-content: space-between;
        line-height: 40px;
        padding: 0 20px;
        color: #4b9bb7;
        font-size: 16px;
    }

    .message {
        padding: 20px;
        background-color: #070f22;
        color: #4b9bb7;
        line-height: 20px;
        font-size: 10px;
    }
}
</style>