import { Component, Prop, Vue } from 'vue-property-decorator'
import VueClipboard from 'vue-clipboard2'
import httpClient from '@/api/Main/HttpClient'
import { ToggleNewClientTypeRequest } from '@/api/Main/Schemas/ToggleNewClientTypeSchema'

Vue.use(VueClipboard)

@Component
export default class UserTab extends Vue {
  @Prop()
  clientTypeUpdate!: string

  personalCode!: string
  clientType = 'New';

  update () {
    if (this.clientType === 'New') {
      const newToggle = new ToggleNewClientTypeRequest()
      newToggle.personalCode = this.personalCode

      httpClient.toggleNewClientType(newToggle)
    } else {
      const regularToggle = new ToggleNewClientTypeRequest()
      regularToggle.personalCode = this.personalCode

      httpClient.toggleRegularClientType(regularToggle)
    }
  }

  setClientType (event: FocusEvent) {
    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
    // @ts-ignore
    this.clientType = event.target.value
  }

  setPersonalCode (event: FocusEvent) {
    // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
    // @ts-ignore
    this.personalCode = event.target.value
  }
}