
<script setup>
import { ref,watch } from 'vue';
import { customInterence } from "@/api/api.js";
const props = defineProps({
    isRoadDetailShow:{
        type:Boolean,
        default:false
    },
    customData:{
        type:Object,
        default:{}
    },
})
const emit = defineEmits(['close'])

const columns = [{
			label:"路演日期",
			key:'RoadShowTime'
	},{
			label:"路演形式",
			key:'RoadshowType'
	},{
			label:"路演平台/路演城市",
			key:'RoadshowPlatform'
	},{
			label:"研究员",
			key:'Researchers'
	},{
			label:"对接销售",
			key:'SysUserRealName'
	}
]

const dataList = ref([])
const tableLoading = ref(false)
function getTableData(){
		tableLoading.value = true
		customInterence.roadShowList({
				CompanyId:props.customData.CompanyId
		}).then(res=>{
				tableLoading.value = false
				if(res.Ret!==200) return 
				dataList.value = res.Data||[]
		})
}

watch(
	() =>props.isRoadDetailShow,
	(newVal) => {
		if(newVal){
			getTableData()
		}else{
				dataList.value=[]
		}
	}
)
       
</script>

<template>
    <el-dialog 
				class="total-click-dialog"
        :title="`${customData.CompanyName}-路演详情`"
        :model-value="isRoadDetailShow"
        :close-on-click-modal="false"
        :modal-append-to-body="false"
        @close="emit('close')"
        width="842px"
        draggable
        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 #default="{row}">
                    {{row[column.key]}}
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </el-dialog>
</template>

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