<template>
    <div>
        <!-- table -->
        <div class="pt-8">
            <div class="height-56 flex-row align-items-center justify-content-between">
                <div class="f18 color-text-primary">电话呼叫列表</div>
                <div class="flex-row">
                    
                </div>
            </div>
            
            <div class="case-table">
                <el-table :data="tableData" height="370" >
                    <el-table-column type="index" label="序号" width="55"></el-table-column>
                    <el-table-column prop="pkgName" label="外呼/呼入类型" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="planStartTime" label="外呼/呼入时间" show-overflow-tooltip >
                        <template slot-scope="scope">
                            <span >{{ scope.row.planStartTime | formaDate("yyyy-MM-dd hh:mm:ss") }}</span>
                        </template>
                    </el-table-column>
                    
                    <el-table-column prop="entrustingAgencyName" label="外呼/呼入电话号码" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="channel" label="姓名" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="channel" label="关系" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="channel" label="接听状态" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="channel" label="沟通时长" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="channel" label="操作人" show-overflow-tooltip ></el-table-column>
                    <el-table-column prop="planStartTime" label="操作时间" show-overflow-tooltip >
                        <template slot-scope="scope">
                            <span >{{ scope.row.planStartTime | formaDate("yyyy-MM-dd hh:mm:ss") }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="channel" label="录音文件" show-overflow-tooltip ></el-table-column>
                    
                </el-table>
            </div>
            
            <div class="text-center pt-16">
                <el-pagination
                    @size-change="getCaseInfoList"
                    @current-change="getCaseInfoList"
                    :current-page="queryParam.current"
                    :page-size="queryParam.size"
                    layout="total, prev, pager, next, jumper"
                    :total="total">
                </el-pagination>
            </div>
        </div>
    </div>
</template>
<script>
import api from "@/services/caseManagement";
    export default {
        components: {
        },
        props: {
            eventTraDialog: {
                type: Object,
                default: () => {
                    return {}
                },
            },
        },
        data() {
            return {
            
                queryParam:{},
                tableData:[],
                total:0,

            };
        },
        mounted () {
            console.log(this.eventTraDialog,'eventTraDialog')
        },
        methods: {
            
            handleClose() {
                this.$emit('update:eventTraDialog', null)
            },
        }
    };
</script>
<style scoped lang="scss">
.dialog-trace{
    padding: 16px 20px;
    max-height:500px
}

</style>