管道基础大数据平台系统开发-【前端】-新系統界面
TreeWish
2023-02-28 234409bb4a612c5b69b78b1e844492f0a7122521
src/components/chart/BaseBarChart.vue
@@ -4,7 +4,11 @@
<script>
import * as echarts from "echarts"
import { countCountryDimension, countProvinceDimension } from "@/api/screen.js"
import {
  countCountryDimension,
  countProvinceDimension,
  countZhPipeStations,
} from "@/api/screen.js"
export default {
  props: {
    width: {
@@ -30,6 +34,10 @@
    project: {
      type: String,
      default: "全国项目",
    },
    title: {
      type: String,
      default: "",
    },
  },
  data() {
@@ -92,11 +100,36 @@
      if (this.dataList) {
        data = this.dataList
      }
      let count = 0
      let countVal = 0
      const title = this.title
      data.forEach(item => {
        let name = item.province || item.country
        let name = item.province || item.country || item.输送介质
        let value = item.count || item.站场数量
        if (title == "站场座数" && item.管道数量) {
          count += item.管道数量
        } else {
          count += item.count || 0
        }
        // switch (title) {
        //   case "站场座数":
        //     countVal = item.管道数量
        //     break
        //   case "项目个数":
        //     countVal = item.count
        //     break
        // }
        xAxisData.push(name)
        yAxisData.push(item.count)
        yAxisData.push(value)
      })
      console.log("管道数量", countVal)
      if (typeof count === "number") {
        this.$bus.$emit("changeCount", count)
      }
      let option = {
        backgroundColor: "transparent",
        tooltip: {
@@ -134,6 +167,9 @@
                var maxLength = 2 //每项显示文字个数
                var valLength = value.length //X轴类目项的文字个数
                var rowN = Math.ceil(valLength / maxLength) //类目项需要换行的行数
                if (xAxisData.length < 7) {
                  return value
                }
                if (rowN > 1) {
                  //如果类目项的文字大于3,
                  for (var i = 0; i < rowN; i++) {
@@ -170,6 +206,7 @@
        ],
        series: [
          {
            name: this.title,
            type: "bar",
            data: yAxisData,
            barWidth: "12px",
@@ -252,6 +289,7 @@
    },
    project: {
      deep: true,
      immediate: true,
      handler(newVal) {
        let requsetFn = null
        switch (newVal) {
@@ -261,7 +299,12 @@
          case "全国项目":
            requsetFn = countProvinceDimension
            break
          case "全球管网图":
            requsetFn = countZhPipeStations
            break
          case "全国管网图":
            requsetFn = countZhPipeStations
            break
          default:
            break
        }
@@ -271,7 +314,7 @@
    },
  },
  mounted() {
    this.initData()
    // this.initData()
    this.initChart()
    if (this.autoResize) {
      window.addEventListener("resize", this.resizeHandler)
@@ -289,7 +332,7 @@
  },
  methods: {
    resizeHandler() {
      this.chart.resize()
      this.chart && this.chart.resize()
    },
    initChart() {
      this.chart = echarts.init(this.$refs.chart, "", {