无人机管理后台前端(已迁走)
chenyao
2025-11-28 466cbe781ab2e8fb8725069e4041be43a8663b31
feat:默认本年,把工单统计占比更好事件概括统计接口
3 files modified
78 ■■■■ changed files
src/api/home/index.js 8 ●●●●● patch | view | raw | blame | history
src/utils/date.js 27 ●●●●● patch | view | raw | blame | history
src/views/wel/components/proportionStatic.vue 43 ●●●● patch | view | raw | blame | history
src/api/home/index.js
@@ -6,6 +6,14 @@
    method: 'get',
  });
};
// 大屏首页=>事件状态数量
export const getEventStatusNum = data => {
  return request({
    url: '/drone-device-core/jobEvent/eventStatusNum',
    method: 'post',
    data,
  })
}
// 事件概况分类数
export const getJobEventByStatus = data => {
  return request({
src/utils/date.js
@@ -1,3 +1,11 @@
import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
import weekday from 'dayjs/plugin/weekday'
// 配置 dayjs
dayjs.locale('zh-cn')
dayjs.extend(weekday)
export const calcDate = (date1, date2) => {
  let date3 = date2 - date1;
@@ -56,3 +64,22 @@
export function dateNow() {
  return dateFormat(new Date(), 'yyyyMMddhhmmss');
}
export const getDateRange = (unit, formatStr = 'YYYY-MM-DD HH:mm:ss') => {
  const todayDate = dayjs()
  let returnArr = [dayjs(), todayDate]
  if (unit === 'today') {
    returnArr = [dayjs(), todayDate]
  }
  if (unit === 'week') {
    returnArr = [dayjs().weekday(0), todayDate]
  }
  if (unit === 'month') {
    returnArr = [dayjs().startOf('month'), todayDate]
  }
  if (unit === 'year') {
    returnArr = [dayjs().startOf('year'), todayDate]
  }
  returnArr = [returnArr[0].startOf('day').format(formatStr), returnArr[1].endOf('day').format(formatStr)]
  return returnArr
}
src/views/wel/components/proportionStatic.vue
@@ -46,22 +46,32 @@
<script setup>
import useEchartsResize from '@/hooks/useEchartsResize';
import { getJobEventByStatus } from '@/api/home/index';
import { getJobEventByStatus, getEventStatusNum } from '@/api/home/index';
import { getDateRange } from '@/utils/date'
import overviewImg2 from '@/assets/images/workbench/tc2.svg';
import overviewImg3 from '@/assets/images/workbench/tc3.svg';
import overviewImg4 from '@/assets/images/workbench/tc4.svg';
import overviewImg5 from '@/assets/images/workbench/tc5.svg';
import { useRouter } from 'vue-router'
import _ from 'lodash'
const router = useRouter()
let checked = ref('CURRENT_YEAR');
let timeListStr = ['本周', '本月', '本年'];
let timeListEnum = ['CURRENT_WEEK', 'CURRENT_MONTH', 'CURRENT_YEAR'];
const dateRanges = {
  today: getDateRange('today'),
  week: getDateRange('week'),
  month: getDateRange('month'),
  year: getDateRange('year'),
}
const params = ref({
  date_enum: 'CURRENT_YEAR',
  // date_enum: 'CURRENT_YEAR',
  device_sn: '',
  end_date: undefined,
  start_date: undefined,
   source:1,//数据来源
  end_date: dateRanges['year'][1], // undefined,
  start_date: dateRanges['year'][0], // undefined,
  source:1,//数据来源
});
const dateSelect = ref('CURRENT_YEAR');
const eventTypeList = ref([
@@ -72,13 +82,14 @@
]);
//  工单统计
const getTypeData = () => {
  getJobEventByStatus(params.value).then(res => {
  getEventStatusNum(params.value).then(res => {
    const resList = res?.data?.data || [];
    let totalNum = resList.reduce((sum, item) => sum + (item.num || 0), 0);
    resList.forEach(item => {
      eventTypeList.value.forEach(item1 => {
        if (item1.name === item.name) {
          item1.value = item.num;
          item1.rate = item.rate;
          item1.rate = _.round((item.num/totalNum)*100, 1);
        }
      });
    });
@@ -94,7 +105,18 @@
let timeClick = (item, index) => {
  checked.value = item;
  params.value.date_enum = item;
  // params.value.date_enum = item;
  if(item === 'CURRENT_WEEK') {
    params.value.start_date = dateRanges['week'][0]
    params.value.end_date = dateRanges['week'][1]
  } else if(item === 'CURRENT_MONTH') {
    params.value.start_date = dateRanges['month'][0]
    params.value.end_date = dateRanges['month'][1]
  } else {
    params.value.start_date = dateRanges['year'][0]
    params.value.end_date = dateRanges['year'][1]
  }
  dateSelect.value = item;
  getTypeData();
};
@@ -110,7 +132,7 @@
const echartsRef = ref(null);
let { chart } = useEchartsResize(echartsRef);
const initChart = val => {
  const totalNum = val.reduce((sum, item) => sum + item.num, 0);
  let totalNum = val.reduce((sum, item) => sum + item.num, 0);
  const data = {
    total: {
      title: '总计',
@@ -119,9 +141,10 @@
    data: val.map(item => ({
      value: item.num,
      name: item.name,
      rate: item.rate,
      rate: _.round((item.num/totalNum)*100, 1),
    })),
  };
  console.log(data, '898')
  const containerWidth = chart.value.clientWidth;
  const isSmallScreen = containerWidth < 768; // 移动端判断
  const echartsOption = {