import { defineComponent, ref, computed, PropType, toRef } from 'vue'
import { IOperators } from 'model'

import { useI18n } from 'vue-i18n'
import { useQuasar } from 'quasar'

import { shared_consts } from '@src/common/shared_vuejs'

export default defineComponent({
  name: 'CMySlider',
  props: {
    modelValue: {
      type: [String, Number],
      required: false,
      default: '0',
      validator: (value) => {
        return true;
      },
    },
    label: {
      type: String,
      required: true,
    },
    showvalue: {
      type: Boolean,
      required: false,
      default: false,
    },
    min: {
      type: Number,
      required: true,
    },
    max: {
      type: Number,
      required: true,
    },
    addstr: {
      type: String,
      required: false,
      default: '',
    },
    color: {
      type: String,
      required: false,
      default: '',
    },
    disable: {
      type: Boolean,
      required: false,
      default: false,
    },
  },
  setup(props, { emit }) {
    const $q = useQuasar()
    const { t } = useI18n()


    const sliderValue = computed({
      get: () => {
        if (!props.modelValue)
          return ''
        const mystr = props.modelValue + ''
        return mystr.replace(props.addstr, '')
      },
      set: (value) => emit('update:modelValue', value ? value + props.addstr : '')
    })

    function valoreinc() {
      const mioval = parseFloat(sliderValue.value)
      if (mioval >= 1000) {
        return 20
      } else if (mioval >= 500) {
        return 10
      } else if (mioval >= 100) {
        return 5
      } else {
        if (props.max < 5) {
          return Math.abs((props.max - props.min) / 20)
        } else {
          return 1
        }

      }
    }


    function incrementValue() {
      if (!sliderValue.value) {
        sliderValue.value = '1'
      } else {
        sliderValue.value = (parseFloat(sliderValue.value) + valoreinc()) + ''; // Aumenta il valore
      }
    }

    function decrementValue() {
      if (sliderValue.value === '0') {
        sliderValue.value = ''
      } else if (!sliderValue.value) {
        // niente
      } else {
        sliderValue.value = (parseFloat(sliderValue.value) - valoreinc()) + ''; // Diminuisci il valore
      }
    }

    function incrementValuePlus1() {
      if (!sliderValue.value) {
        sliderValue.value = '1'
      } else {
        sliderValue.value = (parseFloat(sliderValue.value) + 1) + ''; // Aumenta il valore
      }
    }

    function decrementValueMinus1() {
      if (sliderValue.value === '0') {
        sliderValue.value = ''
      } else if (!sliderValue.value) {
        // niente
      } else {
        sliderValue.value = (parseFloat(sliderValue.value) - 1) + ''; // Diminuisci il valore
      }
    }

    return {
      t,
      shared_consts,
      sliderValue,
      incrementValue,
      decrementValue,
      decrementValueMinus1,
      incrementValuePlus1,
    }
  }
})
