SZYGM1.0/src/views/dashboard/hooks/usePublic.ts

import { Query } from '@/api/webApi'
import { CommonData } from '~/common'
import * as _ from 'lodash'

export enum showTimeMsg {
  HourlyPeak, //小时峰值
  WaybillTrend, //运单趋势
  NodePeak, //始发站/目的站统计分析
  AirlineTraffic, //航司统计
  AirlineAbnormal, //航班统计
  PickingStatistics, //拉货统计
}

export function usePublic() {
  const optionLeft = {
    tooltip: {
      trigger: 'axis',
    },
    legend: {
      show: true,
      top: 0,
      left: '30%',
      icon: 'roundRect',
      textStyle: {
        color: '#698dc3',
      },
    },
    grid: {
      left: '5%',
      right: '5%',
      bottom: '0%',
      top: '17%',
      containLabel: true,
    },
    color: ['#F5BB3D', '#73D970', '#6A9DD9'],
    xAxis: {
      type: 'category',
      boundaryGap: true,
      data: [
        '0:00',
        '2:00',
        '4:00',
        '6:00',
        '8:00',
        '10:00',
        '12:00',
        '14:00',
        '16:00',
        '18:00',
        '20:00',
        '22:00',
      ],
      axisLine: {
        show: true,
        lineStyle: {
          color: '#8897BC',
        },
      },
      axisTick: {
        show: false,
      },
      axisLabel: {
        color: '#8897BC',
      },
    },
    yAxis: [
      {
        type: 'value',
        axisLabel: {
          color: '#8897BC',
          formatter: function (item) {
            return item / 10000 + '万'
          },
        },
        splitLine: {
          lineStyle: {
            type: 'dashed',
            color: 'rgba(196,194,225, 0.54)',
          },
        },
        name: '单',
      },
      {
        type: 'value',
        axisLabel: {
          color: '#8897BC',
        },
        splitLine: {
          lineStyle: {
            type: 'dashed',
            color: 'rgba(196,194,225, 0.54)',
          },
        },
        name: '吨',
      },
    ],
    series: [
      {
        name: '运单/单',
        type: 'line',
        symbol: 'none',
        key: 'bagsnum',
        yAxisIndex: 0,
        data: [120, 132, 101, 134, 90, 230, 210, 132, 101, 134, 90, 230],
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(125,72,255,0.5)',
              },
              {
                offset: 1,
                color: 'rgba(0,180,255,0.01)',
              },
            ],
            global: false,
          },
        },
      },
      {
        name: '重量/吨',
        type: 'line',
        symbol: 'none',
        yAxisIndex: 1,
        key: 'passengers',
        data: [220, 182, 191, 234, 290, 330, 310, 132, 101, 134, 90, 230],
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(125,72,255,0.5)',
              },
              {
                offset: 1,
                color: 'rgba(0,180,255,0.01)',
              },
            ],
            global: false,
          },
        },
      },
    ],
  }
  const airlineAbnormalBaggage = {
    component: 'commonChartsBar',
    option: {
      baseOption: {
        tooltip: {
          trigger: 'axis',
          valueFormatter: function (value) {
            return value + '单'
          },
        },
        legend: {
          data: ['报警', '预警'],
          right: '20%',
          textStyle: {
            color: '#8897BC',
          },
          // top:"-10"
        },
        color: ['#EC3B71', '#E5B35C'],
        grid: {
          bottom: '10%',
          left: '5%',
          right: '1%',
          top: '17%',
        },
        xAxis: {
          data: ['卸机', '机下交接', '货站交接', '提取'],
          axisLine: {
            show: true,
            lineStyle: {
              color: '#8897BC',
            },
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#8897BC',
          },
        },
        yAxis: {
          type: 'value',
          axisLabel: {
            color: '#8897BC',
          },
          splitLine: {
            lineStyle: {
              type: 'dashed',
              color: 'rgba(196,194,225, 0.54)',
            },
          },
          name: '单',
        },
        series: [
          {
            name: '报警',
            type: 'bar',
            data: [0, 0, 0, 0],
          },
          {
            name: '预警',
            type: 'bar',
            data: [0, 0, 0, 0],
          },
        ],
      },
    },
  }
  const airCompaneBaggage = {
    component: 'commonChartsBar',
    option: {
      baseOption: {
        tooltip: {
          trigger: 'axis',
        },
        legend: {
          data: ['运单/单', '重量/吨'],
          right: '20%',
          textStyle: {
            color: '#8897BC',
          },
        },
        color: ['#51DEE9', '#4C88E1'],
        grid: {
          bottom: '10%',
          left: '13%',
          right: '8%',
          top: '17%',
        },
        xAxis: {
          data: ['国航', '南航', '深航', '东航', '海航', '国泰', '川航'],
          axisLine: {
            show: true,
            lineStyle: {
              color: '#8897BC',
            },
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#8897BC',
          },
        },
        yAxis: [
          {
            type: 'value',
            axisLabel: {
              color: '#8897BC',
              formatter: function (item) {
                return item / 10000 + '万'
              },
            },
            splitLine: {
              lineStyle: {
                type: 'dashed',
                color: 'rgba(196,194,225, 0.54)',
              },
            },
            name: '单',
          },
          {
            type: 'value',
            axisLabel: {
              color: '#8897BC',
            },
            splitLine: {
              lineStyle: {
                type: 'dashed',
                color: 'rgba(196,194,225, 0.54)',
              },
            },
            name: '吨',
          },
        ],
        series: [
          {
            name: '运单/单',
            type: 'bar',
            data: [12, 10, 15, 11, 16, 4, 6],
            yAxisIndex: 0,
          },
          {
            name: '重量/吨',
            type: 'bar',
            data: [11, 15, 17, 8, 1, 4, 6],
            yAxisIndex: 1,
          },
        ],
      },
    },
  }
  const airStutas = {
    component: 'commonChartsBar',
    option: {
      baseOption: {
        // legend: {
        //   data: ['2020年', '2021年'],
        //   right:"20",
        //   textStyle:{
        //     color: "#8897BC"
        //   }
        //   // top:"-10"
        // },
        tooltip: {
          trigger: 'axis',
          valueFormatter: function (value) {
            return value + '单'
          },
        },
        color: ['#51DEE9', '#4C88E1'],
        grid: {
          bottom: '10%',
          left: '5%',
          right: '1%',
          top: '17%',
        },
        xAxis: {
          data: ['机下交接', '货站交接', '理货'],
          axisLine: {
            show: true,
            lineStyle: {
              color: '#8897BC',
            },
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: '#8897BC',
          },
        },
        yAxis: {
          type: 'value',
          axisLabel: {
            color: '#8897BC',
          },
          splitLine: {
            lineStyle: {
              type: 'dashed',
              color: 'rgba(196,194,225, 0.54)',
            },
          },
          name: '单',
        },
        series: [
          {
            type: 'bar',
            data: [12, 10, 15],
          },
        ],
      },
    },
  }

  const node = ['卸机', '机下交接', '货站交接', '提取']

  const hours = Array.from({ length: 24 }, (v, i) => i + 1)
  const hourPeak = {
    component: 'commonChartsScatter',
    option: {
      tooltip: {
        trigger: 'axis',
        valueFormatter: function (value) {
          return value + '单'
        },
      },
      title: node.map((month, index) => ({
        top: ((index + 0.5) * 100) / 4 - 3 + '%',
        text: month,
        textStyle: {
          fontSize: 12,
          fontWeight: 'normal',
          color: '#698dc3',
        },
      })),
      singleAxis: node.map((month, index) => ({
        type: 'category',
        data: hours,
        top: ((index + 0.5) * 100) / 4 - 3 + '%',
        height: 100 / 4 - 5 + '%',
        left: '12%',
        right: '1%',
        axisTick: {
          show: false,
        },
        splitLine: {
          show: false,
        },
      })),
      series: node.map((month, index) => ({
        singleAxisIndex: index,
        coordinateSystem: 'singleAxis',
        type: 'scatter',
        data: [
          3,
          6,
          1,
          4,
          0,
          4,
          2,
          5,
          4,
          4,
          6,
          2,
          0,
          3,
          1,
          6,
          6,
          1,
          0,
          3,
          6,
          3,
          0,
          5,
        ],
        symbolSize: function (dataItem) {
          return dataItem * 3
        },
      })),
    },
  }
  const getPublicData = async (id: number, times?: any[]) => {
    try {
      const {
        code,
        returnData: { listValues },
      } = await Query<CommonData>({
        id,
        dataContent: times,
      })
      if (Number(code) !== 0) {
        return []
      } else {
        return listValues
      }
    } catch (err) {
      return []
    }
  }

  return {
    optionLeft,
    airlineAbnormalBaggage,
    airCompaneBaggage,
    airStutas,
    hourPeak,
    getPublicData,
  }
}