Newer
Older
smartwell_front / src / views / dataView / components / jobAnalysis.vue
<!--工单情况-->
<template>
  <panel-card title="工单分析">
    <template slot="func">
      <el-col :span="16">
        <el-date-picker
          v-model="timeRange"
          type="datetimerange"
          range-separator="至"
          size="small"
          value-format="yyyy-MM-dd HH:mm:ss"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
          @change="refresh"
        />
      </el-col>
    </template>
    <ve-bar
      :data="chartData"
      :extend="extend"
      :settings="chartSettings"
    />
  </panel-card>
</template>

<script>
import PanelCard from '@/components/BigData/Card/panelCard'
import { getSearchLastWeekTime } from '@/utils/dateutils'
import { jobStaticsByDept } from '@/api/data/dataStatics'
export default {
  name: 'JobAnalysis',
  components: { PanelCard },
  data() {
    return {
      listQuery: {
        beginTime: '',
        endTime: ''
      }, // 查询条件
      timeRange: [], // 时间范围
      chartSettings: {
        labelMap: {
          'deptName': '权属单位',
          'beforeGet': '待处理',
          'beforeConfirm': '待确认',
          'inHandle': '处理中',
          'over': '已完成'
        },
        stack: {
          'xxx': ['beforeGet', 'beforeConfirm', 'inHandle', 'over']
        }
      },
      extend: {
        xAxis: {
          type: 'value',
          minInterval: 1
        },
        series: {
          barMaxWidth: 35
        }
      },
      chartData: {
        columns: ['deptName', 'beforeGet', 'beforeConfirm', 'inHandle', 'over'],
        rows: []
      }
    }
  },
  created() {
    this.timeRange = getSearchLastWeekTime()
    this.refresh()
  },
  mounted() {
  },
  methods: {
    refresh() {
      this.handleDateTime()
      this.fetchData()
    },
    fetchData() {
      jobStaticsByDept(this.listQuery).then(response => {
        this.chartData.rows = response.data
        const maxValue = Math.max.apply(Math, response.data.map(function(item) {
          return parseInt(item.beforeGet) + parseInt(item.beforeConfirm) + parseInt(item.inHandle) + parseInt(item.over)
        }))
        if (maxValue < 10) {
          this.extend.xAxis = { type: 'value', minInterval: 1, max: 10 }
        } else {
          this.extend.xAxis = { type: 'value', minInterval: 1 }
        }
      })
    },
    // 处理时间
    handleDateTime() {
      if (this.timeRange && this.timeRange.length > 0) {
        this.listQuery.beginTime = this.timeRange[0]
        this.listQuery.endTime = this.timeRange[1]
      } else {
        this.listQuery.beginTime = ''
        this.listQuery.endTime = ''
      }
    }
  }
}
</script>

<style lang="scss" scoped>
</style>