<style scoped>
  @import "../financial/css/cssReset.css";

  .baseSet_Title {
    width: 120px !important;
    padding: 18px 0 0 16px;
    text-align: right;
  }

  .singeRowTable tr th {
    border: 1px solid #d2d2d2;
  }

  .studentTracking td:first-child {
    background-color: #E6E6E6;
    position: sticky;
    left: 0px;
  }

  .studentTracking th:first-child {
    position: sticky;
    left: 0px;
  }
  .stulistNumber {
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 22px;
    border: 1px solid #2961FE;
    border-radius: 50%;
    cursor: pointer;
    color: #2961FE;
  }
  .OCourseTable {
    width: 400px;
    text-align: center;
  }

  .OCourseTable tr td {
    height: 40px;
  }

  .OCourseTable tr th {
    height: 40px;
    background-color: rgb(238, 238, 239);
  }
</style>
<template>
  <div class="page-body studentTracking">
    <div class="page-search row items-center">
      <div class="col row wrap q-mr-lg q-col-gutter-md">
        <div class="col-3">
          <q-input @keyup.enter.native="resetSearch" dense clearable filled v-model="msg.StuName" label="昵称"
            maxlength="20" />
        </div>
        <div class="col-3">
          <q-input @keyup.enter.native="resetSearch" dense clearable filled v-model="msg.StuRealMobile" label="电话"
            maxlength="20" />
        </div>
        <div class="col-3">
          <q-input @keyup.enter.native="resetSearch" dense clearable filled v-model="msg.QQ" label="QQ"
            maxlength="20" />
        </div>
        <div class="col-3">
          <q-input @keyup.enter.native="resetSearch" dense clearable filled v-model="msg.WeChatNo" label="微信号"
            maxlength="20" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" filled v-model="msg.StuType" dense clearable :options="customTypeList"
            option-label="Name" option-value="Id" emit-value map-options label="客户类型" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" dense filled v-model="msg.StuStage" :options="customState" option-label="Name"
            option-value="Id" emit-value map-options label="客户状态" clearable />
        </div>
        <div class="col-3">
          <q-select filled v-model="msg.StuPurpose" dense @input="resetSearch" clearable :options="goalsList"
            option-label="Name" option-value="Id" emit-value map-options label="学习目的" />
        </div>
        <div class="col-3">
          <q-select @input="resetBelong" dense filled option-value="Id" option-label="Name" v-model="msg.BelongType"
            :options="BelongTypeList" emit-value map-options label="归属类型" />
        </div>
        <div class="col-3" v-if="msg.BelongType == 4">
          <q-select @input="resetSearch" dense clearable @filter="filterSubord" use-input filled option-value="Id"
            option-label="EmployeeName" v-model="msg.CreateIds" multiple :options="SubordList" emit-value map-options
            label="我下属的" />
        </div>
        <div class="col-3">
          <q-field filled dense>
            <template v-slot:control>
              <el-date-picker v-model="dateArray" size="mini" @change="resetSearch" value-format="yyyy-MM-dd"
                type="daterange" style="border:none;" range-separator="至" start-placeholder="跟进开始时间"
                end-placeholder="跟进结束时间" />
            </template>
          </q-field>
        </div>
        <template v-if="morequery">
          <div class="col-3">
          <q-select @input="resetSearch" dense filled option-value="SId" option-label="SName" v-model="msg.School_Id"
            :options="CompanyList" emit-value map-options label="校区" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" filled option-value="CourseId" option-label="CourseName" v-model="msg.CourseId"
            clearable emit-value use-input :options="myCourseList" label="课程" dense map-options @filter="filterFnkec" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" dense filled option-value="Id" option-label="EmployeeName"
            v-model="msg.ConsultantId" clearable :options="RoleListData" emit-value map-options label="课程顾问" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" dense filled option-value="Id" option-label="Name" v-model="msg.StuGuestState"
            clearable :options="hetongList" emit-value map-options label="合同状态" />
        </div>
        <div class="col-3">
          <q-select @input="msg.StuSourceId='',msg.StuChannel='',resetSearch()" dense clearable filled option-value="Id"
            option-label="Name" v-model="msg.CreateType" :options="customFromList" emit-value map-options
            label="客户来源" />
        </div>
        <div class="col-3" v-if="msg.CreateType==1">
          <q-select filled v-model="msg.StuChannel" @input="resetSearch" label="收客渠道" dense :options="StuChannelList"
            option-label="Name" option-value="Id" emit-value map-options use-input clearable @filter="filterStuChannel">
            <template v-slot:no-option>
              <q-item>
                <q-item-section class="text-grey">
                  未找到相关数据
                </q-item-section>
              </q-item>
            </template>
          </q-select>
        </div>
        <div class="col-3" v-if="msg.CreateType==2">
          <q-select filled v-model="msg.StuSourceId" dense :options="customList" use-input label="关联同行"
            @filter="filterFn" option-label="CustomerName" @input="resetSearch" clearable option-value="CustomerId"
            emit-value map-options>
            <template v-slot:no-option>
              <q-item>
                <q-item-section class="text-grey">
                  未找到相关数据
                </q-item-section>
              </q-item>
            </template>
          </q-select>
        </div>
        <div class="col-3" v-if="msg.CreateType==3">
          <q-select filled v-model="msg.StuSourceId" dense @filter="filterEmployee" label="介绍人" use-input
            :options="myEmployeeList" option-label="EmployeeName" @input="resetSearch" clearable option-value="Id"
            emit-value map-options />
        </div>
        <div class="col-3" v-if="msg.CreateType==4">
          <q-select filled v-model="msg.StuSourceId" dense use-input @filter="filterStudent" label="转介人"
            :options="MyTransListData" option-label="StuName" @input="resetSearch" clearable option-value="StuId"
            emit-value map-options />
        </div>
        <div class="col-3">

          (
          <q-radio size="xs" v-model="msg.Q_FType" val="1" label="范围内有跟进记录" @input='resetSearch' />
          <q-radio size="xs" v-model="msg.Q_FType" val="2" label="范围内没有跟进记录" @input='resetSearch' />）
        </div>
        </template>
      </div>
    </div>

    <div style="width: 100%;text-align: right;padding: 0 20px;margin-bottom: 10px;">
      <span @click="morequery=!morequery" style="display:inline-flex;align-items:center;cursor: pointer;">
        <q-btn color="accent" class="q-mr-md" size="sm" icon="download" label="下载" v-if="isHaveDownLoad"
          @click="downloadStudentFollow" />
        <span style="margin-right:5px;color: #089bab;">高级查询</span>
        <img v-show="!morequery" style="width:12px;height:12px" src="../../assets/images/more.png" alt="">
        <img v-show="morequery" class="roatImg" style="width:12px;height:12px" src="../../assets/images/more.png"
          alt="">
      </span>
    </div>
    <div class="col row wrap q-gutter-x-md" v-if="dataList.Stat">
      <div class="col stics">
        <span class="stics-name">学生总数</span>
        <span>{{dataList.Stat.StuTNum?dataList.Stat.StuTNum:0}}人</span>
      </div>
      <div class="col stics">
        <span class="stics-name">续费数量</span>
        <span style="color: #F72E52">{{dataList.Stat.RenewNum?dataList.Stat.RenewNum:0}}人</span>
      </div>
      <div class="col stics">
        <span class="stics-name">新生数量</span>
        <span style="color:#2961FE;">{{dataList.Stat.NewNum?dataList.Stat.NewNum:0}}人</span>
      </div>
      <div class="col stics">
        <span class="stics-name">学习中数量</span>
        <span>{{dataList.Stat.StudyNum?dataList.Stat.StudyNum:0}}人</span>
      </div>
      <div class="col stics">
        <span class="stics-name">毕业数量</span>
        <span>{{dataList.Stat.GraduateNum?dataList.Stat.GraduateNum:0}}人</span>
      </div>
      <div class="col stics">
        <span class="stics-name">停课数量</span>
        <span>{{dataList.Stat.SuspendNum?dataList.Stat.SuspendNum:0}}人</span>
      </div>
      <div class="col stics">
        <span class="stics-name">退学数量</span>
        <span>{{dataList.Stat.DropOutNum?dataList.Stat.DropOutNum:0}}人</span>
      </div>
    </div>

    <div style="width: 100%;margin-top: 20px">
      <div style="width: 100%;overflow-x: auto;">
        <table class="po_content singeRowTable" ref="table" style="border:1px solid #E6E6E6;" cellspacing="0"
          cellpadding="0" v-loading="loading">
          <tr>
            <th width="120" rowspan="2" style="min-width: 110px;z-index: 999;">学生</th>
            <th width="120" rowspan="2" style="min-width: 110px;">电话</th>
            <th width="120" rowspan="2" style="min-width: 110px;">课程顾问</th>
            <th width="120" rowspan="2" style="min-width: 110px;">协助老师</th>
            <th width="100" rowspan="2" style="min-width: 100px;">合同时间</th>
            <th width="200" rowspan="2" style="min-width: 200px;">所报课程</th>
            <th width="80" rowspan="2" style="min-width: 80px;">当前级别</th>
            <th width="100" rowspan="2" style="min-width: 100px;">生日</th>
            <th width="100" rowspan="2" style="min-width: 100px;">客户来源</th>
            <th width="100" rowspan="2" style="min-width: 100px;">学习目的</th>
            <th width="100" rowspan="2" style="min-width: 100px;">来源关联人</th>
            <th width="100" rowspan="2" style="min-width: 100px;">收客渠道</th>
            <th width="100" rowspan="2" style="min-width: 100px;">负责人</th>
            <th width="100" rowspan="2" style="min-width: 100px;">合同状态</th>
            <th width="100" rowspan="2" style="min-width: 120px;">期望达成协议日期</th>
            <th width="100" rowspan="2" style="min-width: 100px;">目前状态</th>
            <th width="100" rowspan="2" style="min-width: 100px;">胜率</th>
            <th width="100" rowspan="2" style="min-width: 100px;">跟踪记录</th>

            <th width="500" colspan="3" style="min-width: 500px;" v-for=" ( item , index ) in RListlength "
              :key='index'>
              <div>第{{index+1}}个月</div>
              <div v-if="dataList.MonthList">(累计续约：<span style="color: #F72E52">{{getxuyue(index).RenewNum}} </span>
                <span style="margin-left: 5px;">学员介绍：{{getxuyue(index).IntroductionNum}}</span>) </div>
            </th>
          </tr>
          <tr>
            <th v-for=" ( item , index ) in titlelist " :key='index' :width="item.Id==1?120:200">{{item.Name}}</th>
          </tr>
          <tr v-for=" ( item , index ) in dataList.RList " :key="index"
            v-if='dataList.RList && dataList.RList.length>0'>
            <td style=" border: 1px solid #d2d2d2;">
              <div class="text-blue cursor-pointer" @click="getStuRight(item)">
                {{  item.StuName }}
              </div>
            </td>
            <td>
              <span>{{ item.StuTel }}</span>
            </td>
            <td>
              <span v-html="getCurseManager(item)"></span>
            </td>
            <td>
              <span v-html="getTeacherManager(item)"></span>
            </td>
            <td>
              <span>{{ item.ContractSTime }}</span>
            </td>
            <td>
              <span>{{ item.CourseName }}</span>
            </td>
            <td>
              <span>{{ item.JapanBaseInfo }}</span>
            </td>
            <td>
              <span>{{ item.StuBirthStr }}</span>
            </td>
            <td>
              <span>{{ item.CreateTypeName?item.CreateTypeName:'-' }}</span>
            </td>
            <td>
              {{item.StuPurposeName}}
            </td>
            <td>
              <span><span v-if="item.CreateType==2 && item.EnterpriseName">{{item.EnterpriseName}}:</span>
                {{ item.StuSourceIdName?item.StuSourceIdName:'-' }}</span>
            </td>
            <td>
              <span>{{ item.StuChannelName?item.StuChannelName:'-' }}</span>
            </td>
            <td>
              <span>{{ item.CreateByName?item.CreateByName:'-' }}</span>
            </td>
            <td>
              <span>{{ item.StuGuestStateName }}</span>
            </td>
            <td>
              {{item.AdvisorExpectDate}}
            </td>
            <td>
              {{item.AdvisorStatusName}}
            </td>
            <td>
              {{item.AdvisorWinRate}}%
            </td>
            <td>
              <template v-if="item.AdvisorList">
                <template v-if="item.AdvisorList.length>0">
                  {{item.AdvisorList[0].AdvisorStatusName}}
                  <span class="stulistNumber">
                    {{item.AdvisorList.length}}
                    <q-popup-proxy>
                      <q-banner>
                        <table class="OCourseTable" style="border-collapse:collapse;">
                          <tr>
                            <th>跟进状态</th>
                            <th>跟进日期</th>
                            <th>跟进比例</th>
                            <th>跟进备注</th>
                          </tr>
                          <tr v-for="(sItem,sIndex) in item.AdvisorList" style="border-bottom:1px dashed #d1d1d1;"
                            :key="sIndex">
                            <td>{{sItem.AdvisorStatusName}}</td>
                            <td>{{sItem.AdvisorDate}}</td>
                            <td>{{sItem.AdvisorRate}}</td>
                            <td>{{sItem.AdvisorRemark}}</td>
                          </tr>
                        </table>
                      </q-banner>
                    </q-popup-proxy>
                  </span>
                </template>
                <template v-if="item.AdvisorList.length==0">
                  无
                </template>
              </template>
            </td>
            <td v-for=" ( x , y ) in titlelist " :key="y">
              <div v-if="item.MonthList[x.index]">

                <div v-if="x.Id==1">
                  <span>{{item.MonthList[x.index].Month}}</span>
                  <span style="margin:0 3px">/</span>
                  <span v-if="item.MonthList[x.index].IsRenew==1" style="color: red;">是</span>
                  <span v-if="item.MonthList[x.index].IsRenew==2">否</span>
                  <span style="margin:0 3px">/</span>
                  <span
                    :style="{'color':item.MonthList[x.index].IntroductionNum>0?'red':'#111'}">{{item.MonthList[x.index].IntroductionNum}}</span>
                </div>
                <div v-if="x.Id==2" style="padding: 7px;">
                  <div v-if="item.MonthList[x.index].TeacherTime"
                    style="display: flex;align-items: center;justify-content: space-between;">
                    <div>{{item.MonthList[x.index].TeacherTime}}</div>
                    <span style="text-decoration: underline;cursor: pointer;color: #2961fe ;"
                      @click="lookgengduo(item,item.MonthList[x.index].TeacherTime)">更多</span>
                  </div>
                  <template>
                    <div v-if="item.MonthList[x.index].Teacher!=''" v-html="item.MonthList[x.index].Teacher"></div>
                    <span v-if="item.MonthList[x.index].Teacher==''">-</span>
                  </template>

                </div>
                <div v-if="x.Id==3" style="padding: 3px;">
                  <div v-if="item.MonthList[x.index].ConsultantTime"
                    style="display: flex;align-items: center;justify-content: space-between;">
                    <div>{{item.MonthList[x.index].ConsultantTime}}</div>
                    <span style="text-decoration: underline;cursor: pointer;color: #2961fe ;"
                      @click="lookgengduo(item,item.MonthList[x.index].ConsultantTime)">更多</span>
                  </div>
                  <template>
                    <div v-if="item.MonthList[x.index].Consultant" v-html="item.MonthList[x.index].Consultant"></div>
                    <span v-if="item.MonthList[x.index].Consultant==''">-</span>
                  </template>
                </div>
              </div>
            </td>
          </tr>
        </table>
      </div>
      <div v-if='!dataList.RList||(dataList.RList && dataList.RList.length==0)'
        style="width: 100%;border:1px solid #E6E6E6;display: flex;align-items: center;justify-content: center;height: 60px;">
        暂无数据
      </div>
      <q-pagination v-if='dataList.RList && dataList.RList.length>0' class="full-width justify-end"
        v-model="msg.pageIndex" color="primary" :max="PageCount" :input="true" @input="changePage" />
    </div>
    <studentRight-form v-if="isShowStuRight" :isJudgeTrans="isJudgeTrans" :BelongType="BelongType" :save-obj="stuOption"
      @close="closeStuForm" @success="getList" @reload="getList">
    </studentRight-form>
    <studentFUForm v-if="isShowStuFU" :save-obj="stuOption" @close="closeStuForm">
    </studentFUForm>
  </div>
</template>
<script>
  import {
    getStudentFollowUpPageList,
  } from '../../api/studyabroad/index'
  import {
    queryCourseDropdownList,
  } from '../../api/course/index'
  import {
    queryEmployee
  } from "../../api/users/user";
  import {
    queryGuestStateList,
    CreateTypeList,
    GetStuChannelList,
    GetCustomerList,
    getGuestLearningGoalsEnumList
  } from "../../api/sale/sale.js";
  import {
    queryStuStageList,
    GetStudentTypeList,
    GetPersonalDimension,
    getSchoolDropdown,
    getStudentDorpDownList
  } from "../../api/school/index";
  import {
    EduDownLoad
  } from "../../api/common/common";
  import studentRightForm from "../../components/school/student/studentRight-form";
  import studentFUForm from "../../components/school/student/studentFu-form";
  import {
    mapState
  } from "vuex";

  export default {
    meta: {
      title: "学员跟踪"
    },
    props: {},
    components: {
      studentRightForm,
      studentFUForm
    },
    data() {
      return {
        msg: {
          pageIndex: 1,
          pageSize: 12,
          rowsPerPage: 12,
          StuName: "",
          StuRealMobile: '',
          QQ: '',
          WeChatNo: '',
          StuType: '', //学生类型
          StuGuestState: '', //合同状态
          IsQueryMyStu: '1', //是否查询我的学员 1是 0否
          SFTime: '',
          EFTime: '',
          StuStage: '', //客户状态
          Q_FType: '1', //跟进类型 1范围内有跟进记录 2范围内没有跟进记录	
          BelongType: 1,
          CreateIds: [],
          School_Id: '-1', //校区
          CourseId: '', //课程
          ConsultantId: '', //课程顾问
          CreateType: '', //客户来源
          StuChannel: "", //收客渠道
          StuSourceId: '',
          StuPurpose: '' //学习目的
        },
        //归属类型列表
        BelongTypeList: [{
            Id: 1,
            Name: "全部"
          },
          {
            Id: 2,
            Name: "我负责的"
          },
          {
            Id: 3,
            Name: "我协同的"
          },
          {
            Id: 4,
            Name: "我下属的"
          }
        ],

        loading: false,
        dataList: [], //列表数据
        PageCount: 0,
        customTypeList: [], //客户类型
        customState: [],
        isMyStuList: [{
          Id: '-1',
          Name: '不限'
        }, {
          Id: '1',
          Name: '是'
        }, {
          Id: '0',
          Name: '否'
        }, ],
        hetongList: [{
          Id: '1',
          Name: '正常'
        }, {
          Id: '2',
          Name: '退学'
        }, {
          Id: '5',
          Name: '停课'
        }, {
          Id: '7',
          Name: '毕业'
        }, ],
        dateArray: [], //日期数组
        RListlength: 0,
        titlelist: [],
        stuOption: null,
        BelongType: 1,
        isShowStuRight: false,
        isJudgeTrans: 1,
        SubordList: [], //我的下属数据
        AllSubordList: [],
        stuOption: null,
        isShowStuFU: false,
        morequery: true,
        CompanyList: [],
        allCourseList: [], //课程
        myCourseList: [],
        RoleListData: [], //课程顾问下拉数据
        customFromList: [], //客户来源
        StuChannelList: [], //收客渠道
        allStuChannelList: [], //所有收客渠道
        customList: [], //同行列表
        allCustomList: [], //所有同行列表
        //员工列表
        employeeList: [],
        myEmployeeList: [],
        TransListData: [], //转介人数据
        MyTransListData: [],
        goalsList: [], //学习目的列表
      }
    },
    created() {
      let userinfo = this.getLocalStorage();
      userinfo.ActionMenuList.map(x => { //判断权限
        if (x.FunctionCode == "studentTracking_look") { //判断是否有保存的权限
          this.msg.IsQueryMyStu = 0
          return
        }
      })
    },
    computed: mapState({
      //是否有下载权限
      isHaveDownLoad(state) {
        if (state.user.userInfo && state.user.userInfo.ActionMenuList && state.user.userInfo.ActionMenuList.length >
          0) {
          let action = state.user.userInfo.ActionMenuList.find(x => {
            if (x.FunctionCode == "studentTracking_download") {
              return x;
            }
          });
          return action && action.FunctionCode;
        }
        return false;
      }
    }),
    mounted() {
      this.getList(); //获取规则
      this.getStuStageList();
      this.getCustomTypeList();
      this.GetSubordList();
      this.getBranchList();
      this.getCourseList(); //获取课程下拉
      this.getRole();
      this.getCustomFrom();
      this.GetStuChannelList();
      this.GetCustomerList();
      this.getEmployeeList();
      this.getStudentDorpDown();
      this.queryGoalsList();
      // this.downloadStudentFollow();
    },
    methods: {
      downloadStudentFollow() {
        var msg = JSON.parse(JSON.stringify(this.msg));
        this.loading = true;
        EduDownLoad(
          "/StudentStat/DownLoadStudentFollowUp",
          msg,
          "学员跟踪.xls", res => {
            this.loading = false;
          }
        );
      },
      //获取学习目的列表
      queryGoalsList() {
        getGuestLearningGoalsEnumList({}).then(res => {
          this.goalsList = res.Data;
        });
      },
      //获取收客渠道
      GetStuChannelList() {
        GetStuChannelList({}).then(res => {
          if (res.Code == 1) {
            this.StuChannelList = res.Data;
            this.allStuChannelList = res.Data;
          }
        });
      },
      //筛选渠道
      filterStuChannel(val, update) {
        update(() => {
          if (val === "") {
            this.StuChannelList = JSON.parse(
              JSON.stringify(this.allStuChannelList)
            );
          } else {
            const needle = val.toLowerCase();
            this.StuChannelList = this.allStuChannelList.filter(
              v => v.Name.toLowerCase().indexOf(needle) > -1
            );
          }
        });
      },
      //获取客户来源
      getCustomFrom() {
        CreateTypeList({}).then(res => {
          if (res.Code == 1) {
            this.customFromList = res.Data;
          }
        });
      },
      //获取客户下拉数据
      GetCustomerList() {
        let msg = {
          QCreateBy: 0
        };
        GetCustomerList(msg).then(res => {
          if (res.Code == 1) {
            this.customList = res.Data;
            this.allCustomList = res.Data;
          }
        });
      },
      //筛选客户
      filterFn(val, update) {
        update(() => {
          if (val === "") {
            this.customList = JSON.parse(JSON.stringify(this.allCustomList));
          } else {
            const needle = val.toLowerCase();
            this.customList = this.allCustomList.filter(
              v => v.CustomerName.toLowerCase().indexOf(needle) > -1
            );
          }
        });
      },
      //获取员工列表
      getEmployeeList() {
        queryEmployee({
          IsLeave: 1
        }).then(res => {
          this.employeeList = res.Data;
          this.myEmployeeList = res.Data;
        });
      },
      //筛选员工
      filterEmployee(val, update, abort) {
        update(() => {
          this.myEmployeeList = this.employeeList.filter(
            v => v.EmployeeName.indexOf(val) > -1
          );
        });
      },
      //获取转介人下拉
      getStudentDorpDown() {
        getStudentDorpDownList().then(res => {
          if (res.Code == 1) {
            this.TransListData = res.Data;
            this.MyTransListData = res.Data;
          }
        });
      },
      //筛选转介人
      filterStudent(val, update, abort) {
        update(() => {
          this.MyTransListData = this.TransListData.filter(
            v => v.StuName.indexOf(val) > -1
          );
        });
      },
      getRole() {
        queryEmployee({
          IsLeave: 1,
          UserRole: 2
        }).then(res => {
          this.RoleListData = res.Data;
        });
      },
      getBranchList() { //获取校区
        getSchoolDropdown({}).then(res => {
          var tempArray = res.Data;
          if (!tempArray) {
            tempArray = [];
          }
          tempArray.unshift({
            SId: '-1',
            SName: "不限"
          })
          this.CompanyList = tempArray;
        }).catch(() => {

        })
      },
      //获取课程
      getCourseList() {
        queryCourseDropdownList({
          IsQPrice: 1
        }).then(res => {
          if (res.Code == 1) {
            let data = res.Data
            this.allCourseList = JSON.parse(JSON.stringify(data));
            this.myCourseList = JSON.parse(JSON.stringify(data));
          }
        })
      },
      //获取我下属的下拉数据
      GetSubordList() {
        GetPersonalDimension().then(res => {
          if (res.Code == 1) {
            this.SubordList = res.Data;
            this.AllSubordList = res.Data;
          }
        });
      },
      //筛选转介人
      filterSubord(val, update, abort) {
        update(() => {
          this.SubordList = this.AllSubordList.filter(
            v => v.EmployeeName.indexOf(val) > -1
          );
        });
      },
      resetSearch() {
        this.msg.pageIndex = 1;
        this.getList();
      },
      //翻页
      changePage(val) {
        this.msg.pageIndex = val;
        this.getList()

      },
      getList(type) {
        this.loading = true;
        let msg = JSON.parse(JSON.stringify(this.msg))
        if (this.dateArray && this.dateArray.length > 0) {
          msg.SFTime = this.dateArray[0];
          msg.EFTime = this.dateArray[1];
        } else {
          msg.SFTime = "";
          msg.EFTime = "";
        }
        if (msg.StuType == '' || msg.StuType == null) {
          msg.StuType = 0
        }
        if (msg.StuGuestState == '' || msg.StuGuestState == null) {
          msg.StuGuestState = 0
        }
        if (msg.StuStage == '' || msg.StuStage == null) {
          msg.StuStage = 0
        }
        if (msg.ConsultantId == '' || msg.ConsultantId == null) {
          msg.ConsultantId = 0
        }
        if (msg.StuChannel == '' || msg.StuChannel == null) {
          msg.StuChannel = 0
        }
        if (msg.CreateType == '' || msg.CreateType == null) {
          msg.CreateType = 0
        }
        if (msg.StuSourceId == '' || msg.StuSourceId == null) {
          msg.StuSourceId = 0
        }

        getStudentFollowUpPageList(msg).then(res => {
            this.loading = false;
            this.RListlength = res.Data.PageData && res.Data.PageData.MaxMonth ? res.Data.PageData.MaxMonth : 1;
            this.titlelist = [{
              Name: '月份/续费/转介',
              Id: 1,
              index: 0
            }, {
              Name: '教师跟踪时间及情况说明',
              Id: 2,
              index: 0
            }, {
              Name: '顾问跟踪时间及情况说明',
              Id: 3,
              index: 0
            }, ];
            this.dataList = res.Data.PageData;
            this.PageCount = res.Data.PageCount;
            this.titlelist = [];
            for (let i = 0; i < this.RListlength; i++) {
              let obj = [{
                Name: '月份/续费/转介',
                Id: 1,
                index: i
              }, {
                Name: '教师跟踪时间及情况说明',
                Id: 2,
                index: i
              }, {
                Name: '顾问跟踪时间及情况说明',
                Id: 3,
                index: i
              }, ]
              this.titlelist = [...this.titlelist, ...obj]
            }

          })
          .catch(() => {
            this.loading = false;
          });

      },
      //获取客户类型
      getCustomTypeList() {
        GetStudentTypeList().then(res => {
          if (res.Code == 1) {
            this.customTypeList = res.Data;
          }
        })
      },
      //获取客户阶段列表
      getStuStageList() {
        queryStuStageList().then(res => {
          this.customState = res.Data;
        });
      },
      getxuyue(index) {
        let obj = {
          IntroductionNum: 0,
          RenewNum: 0
        };
        this.dataList.MonthList.forEach(x => {
          if (x.MonthNum == index + 1) {
            obj = x
          }
        })
        return obj
      },
      //点击学生姓名弹出
      getStuRight(obj) {
        if (obj) {
          this.stuOption = obj;
          this.BelongType = 3;
        }
        this.isShowStuRight = true;
      },
      closeStuForm() {
        this.isShowStuRight = false;
        this.isShowStuFU = false
      },
      resetBelong() {
        if (this.msg.BelongType != 4) {
          this.msg.pageIndex = 1;
          this.getList();
        }
      },
      lookgengduo(obj, time) { //跟进备注

        //计算时间 月底日期
        let Month = time.split('-')[0] + '-' + time.split('-')[1] + '-01'
        let date = new Date(Month);
        let currentMonth = date.getMonth();
        let nextMonth = ++currentMonth;
        let nextMonthFirstDay = new Date(date.getFullYear(), nextMonth, 1);
        let oneDay = 1000 * 60 * 60 * 24;
        let endDate = new Date(nextMonthFirstDay - oneDay)
        let endMonth = time.split('-')[0] + '-' + time.split('-')[1] + '-' + endDate.getDate()
        if (obj) {
          this.stuOption = obj;
          this.stuOption.STime = Month;
          this.stuOption.ETime = endMonth;
          this.BelongType = obj.BelongType;
        }
        this.isShowStuFU = true;

      },
      filterFnkec(val, update) { //课程的栓选
        update(() => {
          if (val === '') {
            this.myCourseList = this.allCourseList
          } else {
            const needle = val.toLowerCase();
            this.myCourseList = this.allCourseList.filter(v => v.CourseName.toLowerCase().indexOf(needle) > -1);
          }
        })
      },
      getCurseManager(row) {
        let managerName = "<span class='text-grey-4'>暂未推送</span>";
        if (row.AssistList && row.AssistList.length > 0) {
          row.AssistList.forEach(y => {
            if (y.AssistType == 2) {
              managerName = `<span class='text-dark'>${y.AssistName}</span>`;
            }
          });
        }
        return managerName;
      },
      getTeacherManager(row) {
        let managerName = "<span class='text-grey-4'>暂无</span>";
        if (row.AssistList && row.AssistList.length > 0) {
          row.AssistList.forEach(y => {
            if (y.AssistType == 4) {
              managerName = `<span class='text-dark'>${y.AssistName}</span>`;
            }
          });
        }
        return managerName;
      },

    },
  }

</script>
<style lang="sass">
  @import url('~assets/css/table.sass')

</style>
<style scoped>
  /deep/.el-input__inner,
  /deep/.el-range-input {
    background-color: transparent;
    border: none;
  }

  .stics {
    padding: 10px 20px;
    background: #DDDEE0;
    border-radius: 4px;
    font-size: 13px;
    color: #000000;
    font-weight: bold
  }

  .stics .stics-name {
    color: #2D2D2D;
    font-weight: 600;
    margin-right: 10px
  }

  .roatImg {
    transform: rotate(180deg);
  }

</style>
