index.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <template>
  2. <div class="p-4">
  3. <!-- <GrowCard :loading="loading" :list="growCardList" class="enter-y" /> -->
  4. <orderEchart title="相机出库数量统计" class="!my-4 enter-y" @change="Search" :echartData="echartData" :loading="loading" />
  5. </div>
  6. </template>
  7. <script lang="ts" setup>
  8. import { ref,reactive,onMounted } from 'vue';
  9. // import { growCardList } from '../data';
  10. import orderEchart from '../components/orderEchart.vue';
  11. import { cameraTrend } from '/@/api/statistics/index';
  12. const loading = ref(true);
  13. const echartData = reactive({
  14. xdata:[],
  15. nameList:['四维看看','四维看见','四维深时','四维深光'],
  16. downOrder:[],
  17. incrementOrder:[],
  18. partOrder:[],
  19. echartTypr:'bar',
  20. })
  21. const SearchData = reactive({
  22. startTime:'',
  23. endTime:'',
  24. dataType:0,
  25. type:2,
  26. })
  27. async function getList() {
  28. let downlist = [],xdata = []
  29. loading.value = true;
  30. const {kjList,kkList,ssList} = await cameraTrend(SearchData);
  31. kjList.map(ele => {
  32. xdata.push(ele.groupKey)
  33. downlist.push(ele.count)
  34. })
  35. echartData.xdata = xdata
  36. echartData.downOrder =kkList.map(ele => ele.count)
  37. echartData.incrementOrder = kjList &&kjList.map(ele => ele.count)|| []
  38. echartData.partOrder = ssList &&ssList.map(ele => ele.count)|| []
  39. console.log('echartData',echartData)
  40. loading.value = false;
  41. }
  42. onMounted(() => {
  43. getList()
  44. });
  45. function Search(val){
  46. const {startTime,endTime,dataType,type} = val
  47. console.log('params',val)
  48. SearchData.startTime = startTime
  49. SearchData.endTime = endTime
  50. SearchData.dataType = type
  51. SearchData.type = dataType
  52. // SearchData.type = type
  53. getList()
  54. }
  55. // setTimeout(() => {
  56. // loading.value = false;
  57. // }, 1500);
  58. </script>