<template>
  <div class="p-4">
    <!-- <GrowCard :loading="loading" :list="growCardList" class="enter-y" /> -->
    <orderEchart title="相机出库数量统计" class="!my-4 enter-y"  @change="Search" :echartData="echartData" :loading="loading" />
  </div>
</template>
<script lang="ts" setup>
  import { ref,reactive,onMounted } from 'vue';
  // import { growCardList } from '../data';
  import orderEchart from '../components/orderEchart.vue';
  import { cameraTrend } from '/@/api/statistics/index';
  const loading = ref(true);
  const echartData = reactive({
    xdata:[],
    nameList:['四维看看','四维看见','四维深时','四维深光'],
    downOrder:[],
    incrementOrder:[],
    partOrder:[],
    echartTypr:'bar',
  })
  const SearchData = reactive({
    startTime:'',
    endTime:'',
    dataType:0,
    type:2,
  })
  async function getList() {
    let downlist = [],xdata = []
    loading.value = true;
    const {kjList,kkList,ssList} = await cameraTrend(SearchData);
    kjList.map(ele => {
      xdata.push(ele.groupKey)
      downlist.push(ele.count)
    })
    echartData.xdata = xdata
    echartData.downOrder =kkList.map(ele => ele.count)
    echartData.incrementOrder =  kjList &&kjList.map(ele => ele.count)|| []
    echartData.partOrder = ssList &&ssList.map(ele => ele.count)|| []
    console.log('echartData',echartData)
    loading.value = false;
  }
  onMounted(() => {
    getList()
  });
  function Search(val){
    const {startTime,endTime,dataType,type} = val
    console.log('params',val)
    SearchData.startTime = startTime
    SearchData.endTime = endTime
    SearchData.dataType = type
    SearchData.type = dataType
    // SearchData.type = type
    getList()
  }
  // setTimeout(() => {
  //   loading.value = false;
  // }, 1500);
</script>
