代码更新

surprise

2024-05-09 e897fc3d35f8e5dfa56d5f0c80a655ccf99202cf

 src/components/chart/BaseLineChart.vue

@@ -1,5 +1,6 @@
<template>
  <div class="linechar" ref="chart"></div>
  <div class="linechar"
       ref="chart"></div>
</template>

<script>
@@ -54,27 +55,27 @@
      default: "",
    },
  },
  data() {
  data () {
    return {
      chart: null,
      dataList: [],
    }
  },
  computed: {
    option() {
      let xAxis = []
      let yAxis = []
      const proObj = this.dataList.find(item => item.项目名称 == this.project)
      if (proObj) {
    option () {
      let xAxis=[]
      let yAxis=[]
      const proObj=this.dataList.find(item => item.项目名称==this.project)
      if(proObj) {
        Object.keys(proObj).forEach(item => {
          if (item.toString() != '项目名称') {
          if(item.toString()!='项目名称') {
            xAxis.push(item)
            yAxis.push(proObj[item])
          }
        })
      } else {
        this.dataList.forEach(item => {
          let type = item.type || item.projtype
          let type=item.type||item.projtype
          xAxis.push(type)
          yAxis.push(item.count)
        })
@@ -88,7 +89,17 @@
      //   }
      // })

      let option = {
      var obj=[];
      for(var i in xAxis) {
        if(xAxis[i]) {
          obj.push(xAxis[i])
        } else {
          obj.push("其他")
        }
      }

      xAxis=obj
      let option={
        tooltip: {
          trigger: "axis",
        },
@@ -165,88 +176,88 @@
  watch: {
    option: {
      deep: true,
      handler(newVal) {
      handler (newVal) {
        this.setOptions(newVal)
      },
    },
    project: {
      deep: true,
      immediate: true,
      handler(newVal) {
        let requsetFn = null
        switch (newVal) {
      handler (newVal) {
        let requsetFn=null
        switch(newVal) {
          case "全球项目":
            requsetFn = countProjectTypeNumber
            requsetFn=countProjectTypeNumber
            break
          case "全国项目":
            requsetFn = countProjectTypeNumber
            requsetFn=countProjectTypeNumber
            break
          case "全球管网图":
            requsetFn = countZhPipeMapLength
            requsetFn=countZhPipeMapLength
            break
          case "全国管网图":
            requsetFn = countZhPipeMapLength
            requsetFn=countZhPipeMapLength
            break
          default:
            requsetFn = countStorageByProject
            requsetFn=countStorageByProject

            break
        }
        requsetFn && this.initData(requsetFn)
        requsetFn&&this.initData(requsetFn)

        this.setOptions(this.option)
      },
    },
  },
  mounted() {
  mounted () {
    // this.initData()
    this.initChart()
    if (this.autoResize) {
      window.addEventListener("resize", this.resizeHandler)
    if(this.autoResize) {
      window.addEventListener("resize",this.resizeHandler)
    }
  },
  beforeDestroy() {
    if (!this.chart) {
  beforeDestroy () {
    if(!this.chart) {
      return
    }
    if (this.autoResize) {
      window.removeEventListener("resize", this.resizeHandler)
    if(this.autoResize) {
      window.removeEventListener("resize",this.resizeHandler)
    }
    this.chart.dispose()
    this.chart = null
    this.chart=null
  },
  methods: {
    resizeHandler() {
      this.chart && this.chart.resize()
    resizeHandler () {
      this.chart&&this.chart.resize()
    },
    initChart() {
      this.chart = echarts.init(this.$refs.chart, "", {
    initChart () {
      this.chart=echarts.init(this.$refs.chart,"",{
        renderer: this.type,
      })
      this.chart.setOption(this.option)
      this.chart.on("click", this.handleClick)
      this.chart.on("click",this.handleClick)
    },
    handleClick(params) {
      this.$emit("click", params)
    handleClick (params) {
      this.$emit("click",params)
    },
    setOptions(option) {
    setOptions (option) {
      this.clearChart()
      this.resizeHandler()
      if (this.chart) {
      if(this.chart) {
        this.chart.setOption(option)
      }
    },
    refresh() {
    refresh () {
      this.setOptions(this.option)
    },
    clearChart() {
      this.chart && this.chart.clear()
    clearChart () {
      this.chart&&this.chart.clear()
    },
    async initData(requsetFn = GetServicesVisitsCount) {
      const res = await requsetFn(this.params)
      if (res.code == 200) {
        this.dataList = res.result
        console.log("requsetFn", res)
    async initData (requsetFn=GetServicesVisitsCount) {
      const res=await requsetFn(this.params)
      if(res.code==200) {
        this.dataList=res.result
        console.log("requsetFn",res)
      }
    },
  },