---

import { createWidget, widget } from '@zeppos/device-types'

Page({
  state: {
    num1: 0,
    num2: 0,
    action: '+',
    result: 0
  },

  // Умная функция вычислений без пиксельных багов JavaScript
  calculate() {
    const n1 = this.state.num1
    const n2 = this.state.num2
    let res = 0

    switch (this.state.action) {
      case '+': res = n1 + n2; break
      case '-': res = n1 - n2; break
      case '*': res = n1 * n2; break
      case '/': 
        if (n2 === 0) return 'Error'
        res = n1 / n2
        break
    }

    // Если число дробное, аккуратно округляем до 2 знаков после запятой
    if (res % 1 !== 0 && typeof res === 'number') {
      return Number(res.toFixed(2))
    }
    return res
  },

  build() {
    // 1. Черный фон под размер экрана Mi Band 7
    createWidget(widget.BG, { x: 0, y: 0, w: 192, h: 490, color: 0x000000 })

    // 2. Главное цифровое табло (Ярко-зеленый хакерский цвет)
    const display = createWidget(widget.TEXT, {
      x: 10, y: 40, w: 172, h: 60,
      color: 0x00FF00, text_size: 24,
      align_h: widget.ALIGN.CENTER_H,
      text: '0 + 0 = 0'
    })

    // Функция для обновления текста на табло при кликах
    const updateDisplay = () => {
      this.state.result = this.calculate()
      display.setProperty(widget.prop.MORE, {
        text: `${this.state.num1} ${this.state.action} ${this.state.num2} = ${this.state.result}`
      })
    }

    // 3. БЛОК УПРАВЛЕНИЯ ЧИСЛАМИ (Верхняя половина экрана)
    // Кнопка: Изменить Первое Число (+1)
    createWidget(widget.BUTTON, {
      x: 16, y: 120, w: 75, h: 50, radius: 10,
      normal_color: 0x333333, press_color: 0x555555,
      text: 'N1 +1', text_size: 16, color: 0xFFFFFF
    }).addEventListener(widget.EDGE_EVENT.TAP, () => {
      this.state.num1++
      updateDisplay()
    })

    // Кнопка: Изменить Второе Число (+1)
    createWidget(widget.BUTTON, {
      x: 101, y: 120, w: 75, h: 50, radius: 10,
      normal_color: 0x333333, press_color: 0x555555,
      text: 'N2 +1', text_size: 16, color: 0xFFFFFF
    }).addEventListener(widget.EDGE_EVENT.TAP, () => {
      this.state.num2++
      updateDisplay()
    })

    // Кнопка: Минус 1 от Первого Числа (-1)
    createWidget(widget.BUTTON, {
      x: 16, y: 180, w: 75, h: 50, radius: 10,
      normal_color: 0x333333, press_color: 0x555555,
      text: 'N1 -1', text_size: 16, color: 0xFFFFFF
    }).addEventListener(widget.EDGE_EVENT.TAP, () => {
      this.state.num1--
      updateDisplay()
    })

    // Кнопка: Минус 1 от Второго Числа (-1)
    createWidget(widget.BUTTON, {
      x: 101, y: 180, w: 75, h: 50, radius: 10,
      normal_color: 0x333333, press_color: 0x555555,
      text: 'N2 -1', text_size: 16, color: 0xFFFFFF
    }).addEventListener(widget.EDGE_EVENT.TAP, () => {
      this.state.num2--
      updateDisplay()
    })

    // 4. БЛОК ВЫБОРА ОПЕРАЦИЙ (Оранжевые кнопки, как на iOS/Xiaomi)
    const actions = ['+', '-', '*', '/']
    actions.forEach((act, index) => {
      const posX = 16 + (index % 2) * 85
      const posY = 250 + Math.floor(index / 2) * 60

      createWidget(widget.BUTTON, {
        x: posX, y: posY, w: 75, h: 50, radius: 25,
        normal_color: 0xFF9500, press_color: 0xCC7600,
        text: act, text_size: 20, color: 0xFFFFFF
      }).addEventListener(widget.EDGE_EVENT.TAP, () => {
        this.state.action = act
        updateDisplay()
      })
    })

    // 5. Кнопка полного сброса (Красная)
    createWidget(widget.BUTTON, {
      x: 16, y: 380, w: 160, h: 50, radius: 10,
      normal_color: 0xAA0000, press_color: 0x770000,
      text: 'СБРОС (С)', text_size: 18, color: 0xFFFFFF
    }).addEventListener(widget.EDGE_EVENT.TAP, () => {
      this.state.num1 = 0
      this.state.num2 = 0
      this.state.action = '+'
      this.state.result = 0
      display.setProperty(widget.prop.MORE, { text: '0 + 0 = 0' })
    })
  }
})