Component({
  properties: {
    canvasId: {
      type: String,
      value: 'ec-canvas'
    },
    ec: {
      type: Object,
      value: {}
    },
    disableTouch: {
      type: Boolean,
      value: false
    }
  },

  data: {
    isNew: true
  },

  ready() {
    console.log('ec-canvas ready')

    if (!this.data.ec) {
      console.warn('组件需绑定 ec 对象')
      return
    }

    if (!this.data.ec.onInit) {
      console.warn('ec 对象需包含 onInit 方法')
      return
    }

    const query = this.createSelectorQuery()
    query.select(`#${this.data.canvasId}`)
      .fields({ node: true, size: true })
      .exec((res) => {
        console.log('Canvas query 结果:', res)

        if (!res || !res[0]) {
          console.error('Canvas 节点未找到')
          return
        }

        const canvasNode = res[0].node
        const ctx = canvasNode.getContext('2d')

        const dpr = wx.getSystemInfoSync().pixelRatio
        const width = res[0].width
        const height = res[0].height

        console.log('Canvas 尺寸信息:', { width, height, dpr })

        canvasNode.width = width * dpr
        canvasNode.height = height * dpr
        ctx.scale(dpr, dpr)

        const canvas = {
          width: width * dpr,  // 使用缩放后的宽度
          height: height * dpr, // 使用缩放后的高度
          getContext: () => ctx,
          node: canvasNode
        }

        console.log('准备调用 onInit，canvas 对象:', canvas)
        this.chart = this.data.ec.onInit(canvas, width, height, res)
        console.log('onInit 返回的 chart:', this.chart)
      })
  },

  methods: {
    touchStart(e) {
      if (this.chart && this.chart.touchStart) {
        this.chart.touchStart(e)
      }
    },

    touchMove(e) {
      if (this.chart && this.chart.touchMove) {
        this.chart.touchMove(e)
      }
    },

    touchEnd(e) {
      if (this.chart && this.chart.touchEnd) {
        this.chart.touchEnd(e)
      }
    }
  }
})