<style>
.myClue{
    height: 100%;
}
.myClue .title{
    padding: 10px 20px;
    font-size: 14px;
    color: #333;
}
.title .iconfont{
    display: inline-block;
    font-size: 12px;
    padding: 6px;
    color: #fff;
    margin-right: 10px;
}
.myClue .query-box{
    padding: 15px 20px;
}
.myClue .title .tips{
    cursor: pointer;
    font-size: 12px;
    color: white;
    background-color: #cbcbcb;
    display: inline-block;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    text-align: center;
    line-height: 13px;
    margin-left: 5px;
}
</style>
<template>
    <div class="myClue">
        <div class="title">
            <i class="iconfont iconxiansuo" style="background-color: rgb(112, 74, 253)"></i>
            <span>分配给我的线索</span>
            <el-tooltip class="item" effect="dark" content="转移之后未跟进的线索" placement="top">
                <span  class="tips">?</span>
            </el-tooltip>
        </div>
        <div class="query-box">
            <el-select size="mini" v-model="msg.ToDayContactType" @change="getList">
                <el-option :key="1" label="待跟进" :value="1"> </el-option>
                <el-option :key="2" label="已跟进" :value="2"> </el-option>
            </el-select>
        </div>
        <div>
            <el-table
                v-loading="loading"
                stripe
                ref="multipleTable"
                :data="dataList"
                tooltip-effect="dark"
                style="width: 100%"
                row-class-name="font-size-12"
                @selection-change="handleSelectionChange">
                <el-table-column fixed type="selection" width="40"></el-table-column>
                <el-table-column 
                    prop="CustomerName"
                    label="线索名称"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        <p @click="openDetails(scope)" class="font-color-link cp">{{scope.row.CustomerName}}</p>
                    </template>
                </el-table-column>
                <el-table-column 
                    prop="CustomerName"
                    label="线索来源"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="CustomerLevelStr"
                    label="客户级别"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="CustomerSourceTypeStr"
                    label="客户来源"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="Contact"
                    label="联系人"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="ContactNumber"
                    label="联系电话"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="NextContantTime"
                    label="下次联系时间"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="Remark"
                    label="备注"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="CreateTimestr"
                    label="创建时间"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column 
                    prop="PersonChargeStr"
                    label="创建人"
                    show-overflow-tooltip>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>
<script>
export default {
    data(){
        return {
            msg: {
                ToDayContactType: 1,
                pageIndex: 1,
                pageSize: 15
            },
            dataList: [],
            loading: false,
            selectID: []
        }
    },
    mounted() {
        this.getList()
    },
    methods: {
        openDetails(scope){
            console.log(scope.row)
            this.MsgBus.$emit('openClueWin', scope.row)
        },
        handleSelectionChange(val) {
            this.selectID = val.map(x=>
                x.ID
            )
        },
        getList(){
            this.loading = true
            this.apipost('/api/CustomerAgency/GetFollowUpCluePageList', this.msg, res=>{
                if (res.data.resultCode == 1) {
                    this.loading = false
                    this.dataList = res.data.data.pageData
                } else {
                    this.loading = false
                }
            })
        }
    }
}
</script>