<style>
    @import '../../assets/css/customerManage.css';

    .vux-flexbox {
        width: 100%;
        text-align: left;
        display: flex;
        box-align: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .vux-flex-row {
        box-direction: row;
        box-orient: horizontal;
        -webkit-box-orient: horizontal;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .el-table__fixed-body-wrapper table {
        padding-bottom: 8px !important;
    }

    .scene-container {
        position: relative;
        width: 180px;
    }

    .scene-list {
        max-height: 240px;
        overflow-y: auto;
        font-size: 12px;
        margin-bottom: 10px;
    }

    .scene-list .scene-list-item {
        color: #333;
        padding: 10px 15px;
        cursor: pointer;
        background-color: #fff;
    }

    .scene-list .scene-list-item-select,
    .scene-list .scene-list-item::before {
        background-color: #f7f8fa;
        color: #2362fb;
    }

    .handle-interval {
        border-top: 1px solid #efefef;
    }

    .handle-button {
        padding: 6px 20px;
        font-size: 12px;
        cursor: pointer;
        color: #2362fb;
    }

    .handle-button .handle-button-icon {
        margin-right: 8px;
        margin-top: 3px;
    }

    .handle-button .handle-button-name {
        font-size: 12px;
    }

    .popover-class {
        padding: 0 !important;
    }

    .select-no {
        display: none;
    }

    .scene-wrapper {
        min-height: 50px;
        background: #fff;
        border-top: 1px solid #e1e1e1;
        font-size: 13px;
        overflow-x: scroll;
        color: #aaa;
        margin-top: 20px;
    }

    .scene-wrapper .list,
    .scene-wrapper {
        width: 100%;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    .scene-wrapper .list {
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }

    .scene-wrapper .list .list-item {
        height: 30px;
        padding: 0 10px;
        margin: 10px 15px 0 0;
        border: 1px solid #e1e1e1;
        border-radius: 3px;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .scene-wrapper .list .list-item .icon {
        margin-left: 20px;
        cursor: pointer;
    }
</style>
<template>
    <div class="customerManage">
        <div class="tools">
            <h1>客户管理</h1>
            <div style="width: 340px;">
                <el-input placeholder="请输入客户名称/手机" v-model="msg.KeyWord" class="input-with-select">
                    <el-button slot="append" icon="el-icon-search" @click="getList"></el-button>
                </el-input>
            </div>
            <div class="rightmenu">
                <!-- <el-button class="crm-btn query-btn" @click="getList">查询</el-button> -->
                <el-button icon="el-icon-plus" class="crm-btn org-btn"
                    @click="CustomerId = 0, dialogTableVisibleName = '新建客户', dialogTableVisible=true">新建客户</el-button>
                <el-dropdown @command="handleCommand">
                    <el-button class="crm-btn crm-btn-more easy-btn margin-right0">
                        <i class="iconfont icongengduo"></i>
                    </el-button>
                    <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item command="1"><i class="iconfont icondaoru"></i> 导入</el-dropdown-item>
                        <!-- <el-dropdown-item><i class="iconfont icondaochu"></i> 导出</el-dropdown-item> -->
                    </el-dropdown-menu>
                </el-dropdown>
            </div>
        </div>
        <div class="query-box" :style="{'padding-bottom': sceneList.length > 0 ? '0px' : '10px'}">
            <div v-if="!multipleSelection.length">
                <el-row :gutter="30">
                    <el-col :span="4">
                        <span class="font-size-12" style="padding-right: 10px">场景</span>
                        <el-popover placement="bottom" width="180" popper-class="popover-class" v-model="visible"
                            trigger="click">
                            <div data-v-16d669bb="" class="scene-container">
                                <div class="scene-list">
                                    <div class="scene-list-item"
                                        :class="{'scene-list-item-select': sceneID === item.ID}"
                                        v-for="(item, index) in SceneEmployeeList" :key="index"
                                        @click="changeWhere(item)">{{item.SceneName}}</div>
                                </div>
                                <div class="handle-interval">
                                    <div class="vux-flexbox handle-button vux-flex-row"
                                        @click="MsgBus.$emit('sceneBoxShow', 1, 1)">
                                        <i class="el-icon-circle-plus-outline handle-button-icon"></i>
                                        <div class="handle-button-name">新建场景</div>
                                    </div>
                                    <div class="vux-flexbox handle-button vux-flex-row"
                                        @click="MsgBus.$emit('sceneEditBoxShow', 1, SceneEmployeeList)">
                                        <i class="el-icon-setting handle-button-icon"></i>
                                        <div class="handle-button-name">管理</div>
                                    </div>
                                </div>
                            </div>
                            <el-select size="mini" popper-class="select-no" slot="reference" v-model="msg.ID"
                                placeholder="请选择">
                                <el-option v-for="item in SceneEmployeeList" :key="item.ID" :label="item.SceneName"
                                    :value="item.ID">
                                </el-option>
                            </el-select>
                        </el-popover>

                    </el-col>
                    <el-col :span="4">
                        <el-button icon="iconfont iconshaixuan" class="crm-btn query-btn crm-btn-mini margin-right0"
                            @click="MsgBus.$emit('sceneBoxShow', 1)">高级筛选</el-button>
                    </el-col>
                </el-row>
            </div>
            <div v-else class="flex-center">
                <p class="font-size-12">已选 <span class="font-color-link">{{multipleSelection.length}}</span> 项</p>
                <div class="selection-box">
                    <el-button v-for="(item, index) in selectionList" :key="index" @click="item.myFun"><i
                            :class="item.class"></i>{{item.name}}</el-button>
                </div>
            </div>
            <div class="scene-wrapper" v-if="sceneList.length > 0">
                <ul class="list">
                    <li class="list-item" v-for="(item, index) in sceneList" :key="index">
                        <span
                            v-if="item.formType !== 'datetime'">{{item.str}}&nbsp;{{item.regionStr}}“{{item.nameFC ? item.nameFC : item.value}}”</span>
                        <span v-else>{{item.str}}&nbsp;“{{item.start}}-{{item.end}}”</span>
                        <i class="el-icon-close icon" @click="deleteScene(index)"></i>
                    </li>
                </ul>
            </div>
        </div>
        <div class="page-content">
            <!-- <el-table 
            v-show="loading"
            v-loading="true"
            :data="[]">
            <el-table-column 
                v-for="(item, index) in queryType2" :key="index"
                :label="item.label">
            </el-table-column>
        </el-table> -->
            <el-table v-loading="loading" ref="multipleTable" :data="tableData" tooltip-effect="dark"
                style="width: 100%" :height="sceneList.length > 0 ? '600' : '660'" border row-class-name="font-size-12"
                @sort-change="handleSortChange" @selection-change="handleSelectionChange">
                <el-table-column fixed type="selection" width="40"></el-table-column>
                <el-table-column fixed prop="CustomerName" label="客户名称" width="120" 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="CustomerTypeAlias" label="客户类型" v-if="queryType[20].show" width="120"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="CustomerSourceTypeStr" label="客户来源" width="120" v-if="queryType[1].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="Contact" label="联系人" width="120" v-if="queryType[2].show" show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="ContactNumber" label="联系电话" width="120" sortable v-if="queryType[3].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="Address" label="地址" width="150" v-if="queryType[4].show" show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="BusinessCount" label="商机数" width="80" v-if="queryType[5].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="OrderCount" label="交易订单数" sortable width="120" v-if="queryType[6].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="GuestCount" label="交客数" sortable width="100" v-if="queryType[19].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="OrderMoney" label="交易金额" sortable width="120" v-if="queryType[7].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="CouponCount" label="优惠券" sortable width="80" v-if="queryType[8].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="Client_Balance" label="幸福存折" width="100" sortable v-if="queryType[9].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="CustomerLevelStr" label="客户级别" width="120" sortable v-if="queryType[10].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="CustomerStatus" label="审核状态" v-if="queryType[11].show" show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="RealNameAuthentication" label="实名认证状态" v-if="queryType[12].show" width="120"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        <p v-if="scope.row.RealNameAuthentication === 1" class="font-color-success">已认证</p>
                        <p v-else class="font-color-warning">未认证</p>
                    </template>
                </el-table-column>
                <el-table-column prop="IsAppLogin" label="APP激活状态" v-if="queryType[13].show" width="120"
                    show-overflow-tooltip>
                    <template slot-scope="scope">
                        <p v-if="scope.row.IsAppLogin === 0" class="font-color-warning">未激活</p>
                        <p v-else class="font-color-success">已激活</p>
                    </template>
                </el-table-column>
                <el-table-column prop="CustomerPublic" label="距进入公海天数" sortable v-if="queryType[14].show" width="120"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="PersonChargeStr" label="负责人" width="120" v-if="queryType[15].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="LastFollowUpTime" label="近期约访" sortable v-if="queryType[16].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="UpdateTime" label="更新时间" sortable v-if="queryType[17].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="CreateTimestr" label="创建时间" sortable v-if="queryType[18].show"
                    show-overflow-tooltip>
                </el-table-column>
                <el-table-column prop="IsCarefor" fixed="right" width="50" label="关注">
                    <template slot-scope="scope">
                        <p>
                            <el-tooltip class="item" effect="dark" content="关注" placement="top">
                                <i v-if="scope.row.IsCarefor === 0" @click="CareforCustomer(scope)"
                                    class="iconfont iconwujiaoxing cp"></i>
                            </el-tooltip>
                            <el-tooltip class="item" effect="dark" content="取消关注" placement="top">
                                <i v-if="scope.row.IsCarefor === 1" @click="CareforCustomer(scope)"
                                    class="iconfont iconstar_full cp"></i>
                            </el-tooltip>
                        </p>
                    </template>
                </el-table-column>
                <el-table-column width="40" fixed="right">
                    <template slot="header" slot-scope="scope">
                        <el-popover placement="bottom" width="240">
                            <mySelect :queryType="queryType" @listenTochildEvent="showMessageFromChild" />
                            <i class="el-icon-s-operation cp" slot="reference"></i>
                        </el-popover>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div>
            <el-pagination class="Mypagination" background @current-change="handleCurrentChange"
                :page-sizes="[30, 60, 90, 100]" :page-size="msg.pageSize" layout="sizes, prev, pager, next"
                @size-change="handleSizeChange" :total="total">
            </el-pagination>
        </div>
        <el-drawer :with-header="false" size='70%' :visible.sync="drawer" direction="rtl" :before-close="handleClose">
            <customerInfoBox :CustomerId="CustomerId" @transferS="transfer" @watersS="waters" @editCustS="editCust" />
        </el-drawer>
        <div v-if="dialogTableVisible">
            <customerDialogBox @getList="getList" :name="dialogTableVisibleName" :CustomerId="CustomerId" />
        </div>
        <el-dialog :visible.sync="transferVisible" :close-on-click-modal="false" width="450px"
            custom-class="transfer-box add-box add-box2">
            <div class="add-tit" slot="title">
                <p><span></span>客户转移</p>
                <span icon="el-icon-close"></span>
            </div>
            <el-form :model="transferMsg" ref="form" class="MyEditForm">
                <div class="MyEditForm-item">
                    <el-form-item label="变更负责人为" class="label-pad-left">
                        <el-select filterable v-model="transferMsg.EmpId" placeholder="请选择">
                            <el-option v-for="item in EmployeeList" :label='item.EmName' :value='item.EmployeeId'
                                :key='item.EmployeeId'>
                            </el-option>
                        </el-select>
                    </el-form-item>
                </div>
                <div class="MyEditForm-item">
                    <el-form-item label="将原负责人" class="label-pad-left form-check">
                        <div class="pad-left-10">
                            <el-radio v-model="transferMsg.TransferType" :label="1">移出</el-radio>
                            <el-radio v-model="transferMsg.TransferType" :label="2">转为团队成员</el-radio>
                        </div>
                    </el-form-item>
                </div>
                <div class="MyEditForm-item" v-if="transferMsg.TransferType === 2">
                    <el-form-item label="权限" class="label-pad-left form-check">
                        <div class="pad-left-10">
                            <el-radio v-model="transferMsg.IsRead" :label="0">只读</el-radio>
                            <el-radio v-model="transferMsg.IsRead" :label="1">读写</el-radio>
                        </div>
                    </el-form-item>
                </div>
                <div class="MyEditForm-item">
                    <el-form-item label="同时变更负责人至" class="label-pad-left form-check">
                        <div class="pad-left-10">
                            <el-checkbox-group v-model="transferMsg.TransferOther">
                                <el-checkbox :value="1" :label="1">联系人</el-checkbox>
                                <el-checkbox :value="2" :label="2">商机</el-checkbox>
                                <el-checkbox :value="3" :label="3">合同</el-checkbox>
                            </el-checkbox-group>
                        </div>
                    </el-form-item>
                </div>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" class="add-box-btn" @click="transfer(2)">确 定</el-button>
                <el-button class="add-box-btn add-box-cancel" @click="transferVisible = false">取 消</el-button>
            </div>
        </el-dialog>
        <!-- 添加团队成员弹窗 -->
        <div v-if="addTeammanShow">
            <addTeamman :ID="CustomerIdStr" @addTeammanOk="addTeammanOk" />
        </div>
    </div>
</template>
<script>
    import mySelect from "../dialogModel/select";
    import customerInfoBox from "../assembly/customerInfoBox";
    import customerDialogBox from "../dialogModel/customerDialogBox";
    import addTeamman from "../dialogModel/addTeamman";
    export default {
        components: {
            mySelect,
            customerInfoBox,
            customerDialogBox,
            addTeamman
        },
        data() {
            return {
                visible: false,
                queryType2: [{
                        label: '客户名称',
                        show: true,
                    }, {
                        label: '客户来源',
                        show: true,
                    }, {
                        label: '联系人',
                        show: true,
                    }, {
                        label: '联系电话',
                        show: true,
                    }, {
                        label: '地址',
                        show: true,
                    }, {
                        label: '商机数',
                        show: true,
                    }, {
                        label: '交易订单数',
                        show: true,
                    }, {
                        label: '交易金额',
                        show: true,
                    }, {
                        label: '优惠券',
                        show: true,
                    }, {
                        label: '幸福存折',
                        show: true,
                    }, {
                        label: '客户级别',
                        show: true,
                    }, {
                        label: '审核状态',
                        show: true,
                    }, {
                        label: '实名认证状态',
                        show: true,
                    }, {
                        label: 'APP激活状态',
                        show: true,
                    }, {
                        label: '距进入公海天数',
                        show: true,
                    }, {
                        label: '负责人',
                        show: true,
                    }, {
                        label: '近期约访',
                        show: true,
                    }, {
                        label: '更新时间',
                        show: true,
                    }, {
                        label: '创建时间',
                        show: true,
                    }, {
                        label: '交客数',
                        show: true,
                    },
                    {
                        label: '客户类型',
                        show: true,
                    }
                ],
                queryType: [{
                    label: '客户名称',
                    show: true,
                }, {
                    label: '客户来源',
                    show: true,
                }, {
                    label: '联系人',
                    show: true,
                }, {
                    label: '联系电话',
                    show: true,
                }, {
                    label: '地址',
                    show: true,
                }, {
                    label: '商机数',
                    show: true,
                }, {
                    label: '交易订单数',
                    show: true,
                }, {
                    label: '交易金额',
                    show: true,
                }, {
                    label: '优惠券',
                    show: true,
                }, {
                    label: '幸福存折',
                    show: true,
                }, {
                    label: '客户级别',
                    show: true,
                }, {
                    label: '审核状态',
                    show: true,
                }, {
                    label: '实名认证状态',
                    show: true,
                }, {
                    label: 'APP激活状态',
                    show: true,
                }, {
                    label: '距进入公海天数',
                    show: true,
                }, {
                    label: '负责人',
                    show: true,
                }, {
                    label: '近期约访',
                    show: true,
                }, {
                    label: '更新时间',
                    show: true,
                }, {
                    label: '创建时间',
                    show: true,
                }, {
                    label: '交客数',
                    show: true,
                }, {
                    label: '客户类型',
                    show: true,
                }],
                CustomerId: 0,
                CustomerIdStr: '',
                addTeammanShow: false,
                transferVisible: false,
                mySelectCtrl: false,
                drawer: false,
                loading: true,
                dialogTableVisible: false,
                dialogTableVisibleName: '新建客户',
                tableData: [],
                multipleSelection: [],
                EmployeeList: [],
                value: '',
                userInfo: {},
                transferMsg: {
                    CustomerIds: [],
                    TransferType: 1, //类型，1-移除，2-转为团员
                    IsRead: 0, //0-读写，1-只读
                    EmpId: '',
                    TransferOther: [] //1-联系人，2-商机，3-合同
                },
                msg: {
                    KeyWord: '',
                    Contact: '',
                    pageIndex: 1,
                    pageSize: 30,
                    ContactNumber: '',
                    WhereType: -1,
                    OrderBy: '',
                    Data: {},
                    ID: 1,
                },
                total: 0,
                WhereTypeList: [{
                    id: -1,
                    name: '全部'
                }, {
                    id: 1,
                    name: '我负责的'
                }, {
                    id: 2,
                    name: '下属的'
                }, {
                    id: 3,
                    name: '我参与的'
                }, {
                    id: 4,
                    name: '我关注的'
                }, ],
                selectionList: [{
                        name: '转移',
                        class: 'iconfont iconplus-transfer',
                        myFun: this.transfer
                    }, {
                        name: '放入公海',
                        class: 'iconfont icongonghaiguanli',
                        myFun: this.waters
                    },
                    // {
                    //     name: '更改成交状态',
                    //     class:'iconfont iconwancheng',
                    //     myFun: this.changeState
                    // },
                    {
                        name: '删除',
                        class: 'iconfont icondelete',
                        myFun: this.delete
                    },
                    // {
                    //     name: '锁定',
                    //     class:'iconfont iconsuoguan',
                    //     myFun: this.locking
                    // },
                    // {
                    //     name: '解锁',
                    //     class:'iconfont iconsuokai',
                    //     myFun: this.Unlock
                    // },
                    {
                        name: '添加团队成员',
                        class: 'iconfont icontianjia',
                        myFun: this.addCust
                    },
                    // {
                    //     name: '删除团队成员',
                    //     class:'iconfont iconjian',
                    //     myFun: this.delCust,
                    // },
                ],
                sceneList: [],
                SceneEmployeeList: [],
                sceneID: 1,
            };
        },
        mounted() {
            this.userInfo = this.getLocalStorage();
            this.getList()
            this.Employee()
            this.GetSceneEmployeeList()
            let $this = this
            this.MsgBus.$on('closeCustomerDialogBox', function () {
                $this.dialogTableVisible = false
            })
            this.MsgBus.$on('closeaddTeamman', function () {
                $this.addTeammanShow = false
            })
            this.MsgBus.$on('sceneSave', function (msg) {
                $this.sceneList = [...msg]
                $this.GetSceneEmployeeList()
                let obj = {}
                msg.forEach(element => {
                    obj[element.name] = element
                });
                $this.msg.Data = obj
                $this.getList()
            })
            this.MsgBus.$on('editScene', function () {
                $this.GetSceneEmployeeList()
            })
        },
        beforeDestroy() {
            this.MsgBus.$off('sceneSave');
            this.MsgBus.$off('editScene');
        },
        methods: {
            handleCommand(command) {
                this.$message.warning('功能正在开发中~');
            },
            changeWhere(item) {
                this.msg.ID = item.ID
                this.sceneID = item.ID
                this.msg.Data = item.WhereData ? JSON.parse(item.WhereData) : {}
                this.msg.WhereType = item.WhereType
                this.visible = false
                this.getList()
            },
            GetSceneEmployeeList() {
                this.apipost('/api/Scene/GetSceneEmployeeList', {
                    LableType: 1
                }, res => {
                    if (res.data.resultCode == 1) {
                        this.SceneEmployeeList = res.data.data
                    }
                })
            },
            deleteScene(index) {
                this.sceneList.splice(index, 1)
                let obj = {}
                this.sceneList.forEach(element => {
                    obj[element.name] = element
                });
                this.msg.Data = obj
                this.getList()
            },
            changeItem(item) {
                this.msg.WhereType = item.id
                this.visible = false
                this.getList()
            },
            Employee() {
                let msg = {
                    RB_Group_id: this.userInfo.RB_Group_id,
                    BranchId: -1,
                    DepartmentId: 0,
                    PostId: 0,
                    IsLeave: 0,
                }
                this.apipost2(
                    "admin_get_EmployeeGetList",
                    this.msg,
                    res => {
                        if (res.data.resultCode == 1) {
                            this.EmployeeList = res.data.data;
                        } else {}
                    },
                    err => {}
                );
            },

            //锁定
            locking() {

            },
            //解锁
            Unlock() {

            },
            addTeammanOk() {
                this.addTeammanShow = false
            },
            //添加团队成员
            addCust() {
                let str = ''
                this.multipleSelection.map((x, i) => {
                    str = str + x + ','
                })
                this.CustomerIdStr = str.substring(0, str.length - 1)
                this.addTeammanShow = true
            },
            //删除团队成员
            delCust() {

            },
            //删除
            delete() {

            },
            //导出
            export () {

            },
            // 更改状态
            changeState() {

            },
            // 放入公海
            waters(type) {
                let tips = '是否放入公海？'
                if (type === 1) {
                    tips = '是否把客户“' + this.CustomerName + '”放入公海？'
                    this.multipleSelection.push(this.CustomerId)
                }
                this.$confirm(tips, '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let str = ''
                    this.multipleSelection.map((x, i) => {
                        str = str + x + ','
                    })
                    this.apipost('/api/Customer/RemoveMyCustomer', {
                        CustomerIds: str.substring(0, str.length - 1)
                    }, res => {
                        if (res.data.resultCode == 1) {
                            if (type === 1) {} {
                                this.drawer = false
                            }
                            this.multipleSelection = []
                            this.$message.success(res.data.message);
                            this.getList()
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消'
                    });
                });
            },
            // 关注
            CareforCustomer(scope) {
                this.apipost('/api/Customer/CareforCustomer', {
                    CustomerCreateId: scope.row.CustomerCreateId
                }, res => {
                    if (res.data.resultCode == 1) {
                        this.$message.success('操作成功');
                        this.getList()
                    }
                })
            },
            // 转移
            transfer(type) {
                if (type !== 2) {
                    if (type === 3) {
                        this.multipleSelection.push(this.CustomerId)
                    }
                    this.transferVisible = true
                } else {
                    if (this.transferMsg.EmpId === '') {
                        return this.$message.error('请选择变更负责人！')
                    }
                    let str = ''
                    this.multipleSelection.map((x, i) => {
                        str = str + x + ','
                    })
                    let str2 = ''
                    this.transferMsg.TransferOther.map((x, i) => {
                        str2 = str2 + x + ','
                    })
                    this.transferMsg.CustomerIds = str.substring(0, str.length - 1)
                    this.transferMsg.TransferOther = str2.substring(0, str.length - 1)
                    this.apipost('/api/Customer/TransferCustomer', this.transferMsg, res => {
                        if (res.data.resultCode == 1) {
                            this.multipleSelection = []
                            this.transferVisible = false
                            if (type === 3) {} {
                                this.drawer = false
                            }
                            this.$message.success(res.data.message);
                            this.getList()
                            this.transferMsg = {
                                CustomerIds: [],
                                TransferType: 1,
                                IsRead: 0,
                                EmpId: '',
                                TransferOther: []
                            }
                        }
                    })
                }
            },
            showMessageFromChild(list) {
                this.mySelectCtrl = !this.mySelectCtrl
                if (list) {
                    this.queryType = list
                    this.getList()
                }
            },
            editCust() {
                this.dialogTableVisibleName = '修改客户'
                this.dialogTableVisible = true
            },
            openDetails(scope) {
                this.drawer = true
                this.CustomerId = scope.row.CustomerId
                this.CustomerName = scope.row.CustomerName
            },
            handleSizeChange(val) {
                this.msg.pageSize = val
                this.getList();
            },
            handleCurrentChange(val) {
                this.msg.pageIndex = val;
                this.getList();
            },
            handleClose(done) {
                done();
            },
            getList: function () {
                this.tableData = []
                this.loading = true
                this.apipost('/api/Customer/GetCustomerPage', this.msg, res => {
                    if (res.data.resultCode == 1) {
                        this.tableData = res.data.data.pageData;
                        this.total = res.data.data.count;
                        this.loading = false;
                    }
                })
            },
            handleSelectionChange(val) {
                this.multipleSelection = val.map(x =>
                    x.CustomerId
                )
            },
            handleSortChange(p) {
                if (p.order == 'ascending') {
                    this.msg.OrderBy = `${p.prop} asc`
                } else {
                    this.msg.OrderBy = `${p.prop} desc`
                }
                this.getList()
            }
        }
    };
</script>