import { h, ref, computed } from 'vue'
import { formInputViewProps } from '../../form-input-props'

export default {
  props: formInputViewProps,
  setup (props) {
    const show = ref(false)
    const trigger = () => {
      show.value = !show.value
    }

    const text = computed(() => h('span', {}, show.value ? props.modelValue : '******'))
    return () =>
      h('span', {}, [
        text.value,
        h('i', { className: 'el-icon-view', style: { marginLeft: '10px', cursor: 'pointer' }, onClick: trigger })
      ])
  }
}