<script setup>
import { ref } from 'vue';

import { roadshowInterence } from "@/api/api.js";
import calendar from "@/components/calendar.vue";

// 活动列表
const eventList=ref([])
// 销售员列表
const sellerList=ref([])
// 选择的销售
const selectSeller=ref("")

const calendarRef=ref(null) 

//获取销售列表
const getSellerList=async()=>{
  const res = await roadshowInterence.getSellerList();
  if(res.Ret!==200) return 
  sellerList.value = res.Data.List||[]
  sellerList.value = sellerList.value.map(i=>{
    if(!i.AdminName){
        i.AdminName = i.GroupName
    }
    if(!i.AdminId){
        i.AdminId = i.GroupId
    }
    return i
  })
}
      
// 获取活动列表
const getEventList=async()=>{

  //当前的起始日期
  const { currentStart,currentEnd } = calendarRef.value.calendarApi.view;

  const { formateDate } = calendarRef.value;

  // 获取本周日程
  const res = await roadshowInterence.getSellerCalendarDetail({
    StartDate: formateDate(currentStart),
    EndDate: formateDate(new Date(currentEnd.getTime()- 24*60*60*1000)),
    SellerId: Number(selectSeller.value) || -1
  });

  eventList.value = [
    ...(res.Data.CalendarList || []),
    ...(res.Data.RsMattersList || []),
  ].map((item, index) => {
    return { ...item, id: index };
  });
}

getSellerList();
  
</script>

<template>
  <div class="seller-calendar">
      <el-card class="seller-calendar-context">
        <!-- 日程组件 -->
        <calendar
          ref="calendarRef"
          :eventList="eventList"
          @weekChange="getEventList"
        >
          <template #left>
            <el-cascader
              v-model="selectSeller"
              :options="sellerList"
              :show-all-levels="false"
              :props="{
                expandTrigger: 'hover',
                children: 'Child',
                emitPath: false,
                label:'AdminName',
                value:'AdminId',
              }"
              filterable
              clearable
              placeholder="请选择销售"
              @change="getEventList"
            />
          </template>
        </calendar>
      </el-card>
  </div>
</template>
  
<style>
</style>