<template>
    <div class="orderbox">
        <h2>{{infolist.woTitle||infolist.msgTital}}</h2>
        <p v-if="mini == 1">信息分类：{{infolist.msgTypeName}}</p>
        <span>{{infolist.arcDesc||infolist.msgInfo}}</span>
        <div v-if="mini != 1">
            <div style="padding: 0 30px 0 20px;">
                <uploadDown :datalist="datalist" :dialogStatus="dialogInfo"></uploadDown>
            </div>
            <em>工单备注：{{infolist.dealRemark}}</em>
            <div style="padding: 0 30px 0 20px;">
                <uploadDown :datalist="backlist" :dialogStatus="dialogInfo"></uploadDown>
            </div>
        </div>
        <div class="tabbox" v-if="historySts">
            <el-table :data="hisList" tooltip-effect="dark" size="mini" border>
                <el-table-column prop="dealName" label="处理人">
                </el-table-column>
                <el-table-column prop="dealTime" label="处理时间">
                </el-table-column>
                <el-table-column prop="dealTypeDesc" label="节点">
                </el-table-column>
                <el-table-column prop="deptName" label="部门">
                </el-table-column>
                <el-table-column prop="dealRemark" label="备注">
                </el-table-column>
                <el-table-column prop="woStsDesc" label="状态">
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script>
    import uploadDown from '../../../components/uploadDown.vue'
    export default {
        props: ["infolist","datalist","backlist","dialogInfo","historySts","mini"],
        components:{
            uploadDown
        },
        data() {
            return {
                hisList:[]
            };
        },
        methods: {
            getList(){
                this.$http({
                    url: "/market/wotrace/queryList",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: {
                        woNo: this.infolist.woNo,
                    },
                }).then((res) => {
                    this.hisList = res.data;
                    res.data.forEach(item=>{
                        if(item.woSts == 4){
                            item.dealTypeDesc = '审核'
                        }else if(item.woSts == 2){
                            item.dealTypeDesc = '派发'
                        }else if(item.woSts == 1){
                            item.dealTypeDesc = '回复'
                        }else if(item.woSts == 3){
                            item.dealTypeDesc = '归档'
                        }else{
                            item.dealTypeDesc = '发起'
                        }
                    })
                });
            }
        },
        created() {
            this.getList();
            this.$forceUpdate()
        },
        watch: {
            dialogInfo(){
                this.getList();
                this.$forceUpdate()
            },
        }
    };
</script>

<style scoped lang="scss">
    .orderbox{
        h2{
            width: 100%;
            text-align: center;
            margin-bottom: 10px;
        }
        span{
            display: inline-block;
            text-indent:30px;
            line-height: 30px;
            padding: 0 30px 0 20px;
            text-align: justify;
            margin-bottom: 20px;
        }
        em{
            font-style: normal;
            display: inline-block;
            text-indent:30px;
            line-height: 30px;
            padding: 0 30px 0 20px;
            text-align: justify;
            margin-top: 20px;
        }
        .tabbox{
            padding: 0 30px 0 20px;
            margin-top: 20px;
        }
        p{
            text-align: right;
            margin-right: 30px;
        }
    }
</style>
