<template>
    <el-dialog custom-class="total-click-dialog"
        :title="`${customData.CompanyName}-路演详情`"
        :visible.sync="isRoadDetailShow"
        :close-on-click-modal="false"
        :modal-append-to-body="false"
        @close="$emit('close')"
        width="842px"
        v-dialogDrag
        center
    >
        <div class="table-wrap" v-loading="tableLoading">
            <p>累计路演次数:{{dataList.length}}</p>
            <el-table :data="dataList"  height="300" border @sort-change="clickNumSortChange" v-loading="showLoading" element-loading-text="加载中">
                <el-table-column  v-for="column in columns" :key="column.key" :label="column.label" align="center" :prop="column.key">
                    <template slot-scope="{row}">
                    {{row[column.key]}}
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </el-dialog>
</template>

<script>
import { customInterence } from "@/api/api.js";
export default {
    props:{
        isRoadDetailShow:{
            type:Boolean,
            default:false
        },
        customData:{
            type:Object,
            default:{}
        },
    },
    data() {
        return {
            columns:[{
                label:"路演日期",
                key:'RoadShowTime'
            },{
                label:"路演形式",
                key:'RoadshowType'
            },{
                label:"路演平台/路演城市",
                key:'RoadshowPlatform'
            },{
                label:"研究员",
                key:'Researchers'
            },{
                label:"对接销售",
                key:'SysUserRealName'
            }],
            dataList:[],
            tableLoading:false,
        };
    },
    watch:{
        isRoadDetailShow(newVal){
            if(newVal){
                this.getTableData()
            }else{
                this.dataList=[]
            }
        }
    },
    methods: {
        getTableData(){
            this.tableLoading = true
            customInterence.roadShowList({
                CompanyId:this.customData.CompanyId
            }).then(res=>{
                this.tableLoading = false
                if(res.Ret!==200) return 
                this.dataList = res.Data||[]
            })
        }
    },
};
</script>

<style scoped lang="scss">
.table-wrap{
    .el-table{
        margin:20px 0 30px 0;
    }
}
</style>
