import { computed, h, defineAsyncComponent } from 'vue'
import { formInputViewProps } from '../../form-input-props'
import { setOptionWritable } from './util'
export default {
  components: {
    CipTable: () => import('@cip/components/cip-table')
  },
  props: formInputViewProps,
  emits: ['statusChange', 'update:modelValue'],
  setup (props, { emit }) {
    const options = computed(() => {
      const o = props.config.options || []
      return setOptionWritable(o, false)
    })

    return () => {
      // hideOnEmpty为true时判断 值是否存在
      if (props.config.hideOnEmpty && (!props.modelValue || props.modelValue?.length === 0)) {
        emit('statusChange', false)
        return null
      }
      emit('statusChange', true)
      return h(defineAsyncComponent(() => import('@cip/components/cip-table')), {
        data: props.modelValue,
        columns: options.value,
        rowKey: props.config.rowKey,
        treeProps: props.config.treeProps || props.config.optionProps || {},
        offset: 0,
        hideIndex: props.config.hideIndex,
        dependOnValues: props.dependOnValues,
        border: true,
        stripe: true,
        showSummary: props.config.showSummary,
        tableHeaderLabel: props.config.tableHeaderLabel,
        size: 'small'
      })
    }
  }
}