<script>
import util from 'eoss-ui/src/utils/util';
export default {
  name: 'EsSwitch',
  inheritAttrs: false,
  props: {
    // 显示隐藏组件
    display: {
      type: Boolean,
      default: true
    },
    // 	是否不渲染组件
    hide: {
      type: Boolean,
      default: false
    },
    inlay: {
      type: Boolean,
      default: true
    },
    data: {
      type: [Object, Array],
      default() {
        return [];
      }
    },
    value: [String, Boolean, Number],
    readonly: Boolean,
    plain: Boolean,
    activeText: String,
    inactiveText: String
  },
  data() {
    return {
      attrs: {
        activeText: '',
        inactiveText: '',
        activeValue: '',
        inactiveValue: ''
      }
    };
  },
  computed: {
    model: {
      get() {
        return this.value;
      },
      set(val) {
        return val;
      }
    }
  },
  render(h) {
    if (!this.hide) {
      if (this.readonly) {
        let dom = '';
        if (Array.isArray(this.data)) {
          this.data.forEach((item) => {
            if (this.value === item.value) {
              dom = item.name || item.label || item.text || item.value;
              return;
            }
          });
        } else {
          for (let i in this.data) {
            if (
              util.isObject(this.data[i]) &&
              this.value === this.data[i].value
            ) {
              dom =
                this.data[i].name ||
                this.data[i].label ||
                this.data[i].text ||
                this.data[i].value;
              break;
            } else if (this.value === this.data[i]) {
              dom = this.data[i];
              break;
            }
          }
        }
        return h(
          'div',
          { class: ['es-input__inner', { 'es-plain': this.plain }] },
          [dom]
        );
      }
      if (Array.isArray(this.data)) {
        this.data.forEach((item) => {
          if (
            util.isObject(item) &&
            (typeof item.value === 'boolean' || typeof item.value === 'number')
          ) {
            if (item.value) {
              this.attrs.activeValue = item.value;
              this.attrs.activeText =
                this.activeText !== undefined
                  ? this.activeText
                  : item.name || item.label || item.text || item.value;
            } else {
              this.attrs.inactiveValue = item.value;
              this.attrs.inactiveText =
                this.inactiveText !== undefined
                  ? this.inactiveText
                  : item.name || item.label || item.text || item.value;
            }
          } else {
            console.error('数据错误');
            return false;
          }
        });
      } else {
        if (this.data.active && this.data.inactive) {
          if (typeof this.data.active === 'string') {
            this.attrs.activeValue = this.data.active;
            this.attrs.activeText =
              this.activeText !== undefined
                ? this.activeText
                : this.data.active;
          } else if (util.isObject(this.data.active)) {
            this.attrs.activeValue = this.data.active.value;
            this.attrs.activeText =
              this.activeText !== undefined
                ? this.activeText
                : this.data.active.name ||
                  this.data.active.label ||
                  this.data.active.text ||
                  this.data.active.value;
          }
          if (typeof this.data.inactive === 'string') {
            this.attrs.inactiveValue = this.data.inactive;
            this.attrs.inactiveText =
              this.inactiveText !== undefined
                ? this.inactiveText
                : this.data.inactive;
          } else if (util.isObject(this.data.inactive)) {
            this.attrs.inactiveValue = this.data.inactive.value;
            this.attrs.inactiveText =
              this.inactiveText !== undefined
                ? this.inactiveText
                : this.data.inactive.name ||
                  this.data.inactive.label ||
                  this.data.inactive.text ||
                  this.data.inactive.value;
          }
        }
      }
      return h('div', { class: 'es-switch-content' }, [
        h('el-switch', {
          attrs: {
            ...this.$attrs,
            ...this.attrs,
            inlay: this.inlay,
            value: this.model
          },
          on: this.$listeners,
          directives: [
            {
              name: 'show',
              value: this.display
            }
          ]
        })
      ]);
    } else {
      return '';
    }
  }
};
</script>
