<template>
    <li
        @mouseenter="(event) => this.hoverItem(event)"
        @click="(event) => this.selectOptionClick(event)"
        class="el-select-dropdown__item"
        :style="{display: visible ? 'block' : 'none',}"
        :class="{
          selected: itemSelected,
          'is-disabled': disabled || groupDisabled || limitReached,
          hover: hover,
        }">
        <slot>
          <span>{{ currentLabel }}</span>
        </slot>
      </li>
</template>
<script>
import { Option } from "element-ui";
import FormBase from "./FormBase";
export default {
  name: "AceOption",
  // extends:[Option,FormBase],
  mixins: [Option, FormBase],
  data() {
    return {
      isAuth: true,
    };
  },
  computed: {
    selectDisabled() {
      return this.disabled || (this.elForm || {}).disabled || this.isOperationDisabled() || !this.isAuth;
    },
  },
};
</script>
