import type { PropType} from 'vue';
import { defineComponent, onMounted, ref, watch } from 'vue'
import { useQuasar } from 'quasar'
import { useI18n } from 'vue-i18n'
import { useGlobalStore } from '@store/globalStore'
import { fieldsTable } from '@store/Modules/fieldsTable'
import { tools } from '@tools'
import { costanti } from '@costanti'
import { CMyPopupEdit } from '@src/components/CMyPopupEdit'
import type { IColGridTable, ISpecialField } from 'model';
import { IOperators } from 'model'
import MixinBase from '@src/mixins/mixin-base'


export default defineComponent({
  name: 'CMyValueDb',
  emits: ['save'],
  props: {
    title: {
      type: String,
      required: false,
      default: '',
    },
    visulabel: {
      type: Boolean,
      required: false,
      default: false,
    },
    hint: {
      type: String,
      required: false,
      default: '',
    },
    mykey: {
      type: String,
      required: true,
    },
    mysubkey: {
      type: String,
      required: false,
      default: '',
    },
    specialField: {
      type: Object as PropType<ISpecialField>,
      required: false,
      default: null,
    },
    filter: {
      type: [String, Function],
      required: false,
      default: null,
    },
    indrec: {
      type: Number,
      required: false,
      default: -1,
    },
    maxlength: {
      type: Number,
      required: false,
      default: 0,
    },
    minlength: {
      type: Number,
      required: false,
      default: 0,
    },
    mysubsubkey: {
      type: String,
      required: false,
      default: '',
    },
    type: {
      type: Number,
      required: true,
    },
    serv: {
      type: Boolean,
      required: false,
      default: false,
    },
    editOn: {
      type: Boolean,
      required: false,
      default: false,
    },
    dense: {
      type: Boolean,
      required: false,
      default: false,
    },
    canModify: {
      type: Boolean,
      required: false,
      default: true,
    },
    disable: {
      type: Boolean,
      required: false,
      default: false,
    },
    jointable: {
      type: String,
      required: false,
      default: '',
    },
    table: {
      type: String,
      required: false,
      default: 'settings',
    },
    myimg: {
      type: String,
      required: false,
      default: '',
    },
    rec: {
      type: Object,
      required: false,
      default: null,
    },
    mycol: {
      type: Object as PropType<IColGridTable> | undefined,
      required: false,
      default: () => {
        return null
      },
    },
    id: {
      type: String,
      required: false,
      default: '',
    },
    idmain: {
      type: String,
      required: false,
      default: '',
    },
    tablesel: {
      type: String,
      required: false,
      default: '',
    },
    path: {
      type: String,
      required: false,
      default: '',
    },
    pickup: {
      type: Boolean,
      required: false,
      default: false,
    },
    showall: {
      type: Boolean,
      required: false,
      default: false,
    },
  },
  components: { CMyPopupEdit },
  setup(props, { emit }) {
    const $q = useQuasar()
    const { t } = useI18n()
    const globalStore = useGlobalStore()

    const col = ref(<IColGridTable>{
      name: 'test', fieldtype: 0, showWhen: costanti.showWhen.NewRec + costanti.showWhen.InEdit + costanti.showWhen.InView, visible: true, maxlength: props.maxlength, minlength: props.minlength
    })
    const row = ref({})

    const { setValDb, getValDb } = MixinBase()

    async function showandsave(row: any, col: any, newval: any, valinitial: any) {
      console.log('showandsave CMyFieldDb', row, col, newval)

      if (newval !== valinitial) {
        const ris = tools.saveInDBForTypes($q, props.mykey, newval, props.type, props.serv, props.table, props.mysubkey, props.id, props.indrec, props.mysubsubkey, props.specialField)
        save(newval)

        return ris
      }

    }

    function save(newval: any) {
      emit('save', newval)
    }

    function withBorder() {
      if (col.value)
        return col.value.fieldtype !== costanti.FieldType.onlydate && col.value.fieldtype !== costanti.FieldType.date
      else
        return false
    }

    function mounted() {
      if (props.rec) {
        row.value = props.rec
      }
      if (props.mycol && props.mycol.name !== '') {
        col.value = props.mycol
      } else {
        // console.log('Tab = ', props.table, 'key=', props.mykey, 'mycolProp', props.mycol)
        col.value = fieldsTable.getColByTable(props.table, props.mykey)
      }

      // console.log('COL = ', col.value, 'MyCol passed', props.mycol)
    }

    onMounted(mounted)

    return {
      tools,
      costanti,
      fieldsTable,
      globalStore,
      col,
      row,
      showandsave,
      withBorder,
      save,
    }
  },
})

