@penggy/element-ui 2.4.11 → 2.4.12

package/packages/select/src/navigation-mixin.js

@@ -1,54 +1,54 @@
-export default {
-  data() {
-    return {
-      hoverOption: -1
-    };
-  },
-
-  computed: {
-    optionsAllDisabled() {
-      return this.options.filter(option => option.visible).every(option => option.disabled);
-    }
-  },
-
-  watch: {
-    hoverIndex(val) {
-      if (typeof val === 'number' && val > -1) {
-        this.hoverOption = this.options[val] || {};
-      }
-      this.options.forEach(option => {
-        option.hover = this.hoverOption === option;
-      });
-    }
-  },
-
-  methods: {
-    navigateOptions(direction) {
-      if (!this.visible) {
-        this.visible = true;
-        return;
-      }
-      if (this.options.length === 0 || this.filteredOptionsCount === 0) return;
-      if (!this.optionsAllDisabled) {
-        if (direction === 'next') {
-          this.hoverIndex++;
-          if (this.hoverIndex === this.options.length) {
-            this.hoverIndex = 0;
-          }
-        } else if (direction === 'prev') {
-          this.hoverIndex--;
-          if (this.hoverIndex < 0) {
-            this.hoverIndex = this.options.length - 1;
-          }
-        }
-        const option = this.options[this.hoverIndex];
-        if (option.disabled === true ||
-          option.groupDisabled === true ||
-          !option.visible) {
-          this.navigateOptions(direction);
-        }
-        this.$nextTick(() => this.scrollToOption(this.hoverOption));
-      }
-    }
-  }
-};
+export default {
+  data() {
+    return {
+      hoverOption: -1
+    };
+  },
+
+  computed: {
+    optionsAllDisabled() {
+      return this.options.filter(option => option.visible).every(option => option.disabled);
+    }
+  },
+
+  watch: {
+    hoverIndex(val) {
+      if (typeof val === 'number' && val > -1) {
+        this.hoverOption = this.options[val] || {};
+      }
+      this.options.forEach(option => {
+        option.hover = this.hoverOption === option;
+      });
+    }
+  },
+
+  methods: {
+    navigateOptions(direction) {
+      if (!this.visible) {
+        this.visible = true;
+        return;
+      }
+      if (this.options.length === 0 || this.filteredOptionsCount === 0) return;
+      if (!this.optionsAllDisabled) {
+        if (direction === 'next') {
+          this.hoverIndex++;
+          if (this.hoverIndex === this.options.length) {
+            this.hoverIndex = 0;
+          }
+        } else if (direction === 'prev') {
+          this.hoverIndex--;
+          if (this.hoverIndex < 0) {
+            this.hoverIndex = this.options.length - 1;
+          }
+        }
+        const option = this.options[this.hoverIndex];
+        if (option.disabled === true ||
+          option.groupDisabled === true ||
+          !option.visible) {
+          this.navigateOptions(direction);
+        }
+        this.$nextTick(() => this.scrollToOption(this.hoverOption));
+      }
+    }
+  }
+};

package/packages/select/src/option-group.vue

@@ -1,60 +1,60 @@
-<template>
-  <ul class="el-select-group__wrap" v-show="visible">
-    <li class="el-select-group__title">{{ label }}</li>
-    <li>
-      <ul class="el-select-group">
-        <slot></slot>
-      </ul>
-    </li>
-  </ul>
-</template>
-
-<script type="text/babel">
-  import Emitter from 'element-ui/src/mixins/emitter';
-
-  export default {
-    mixins: [Emitter],
-
-    name: 'ElOptionGroup',
-
-    componentName: 'ElOptionGroup',
-
-    props: {
-      label: String,
-      disabled: {
-        type: Boolean,
-        default: false
-      }
-    },
-
-    data() {
-      return {
-        visible: true
-      };
-    },
-
-    watch: {
-      disabled(val) {
-        this.broadcast('ElOption', 'handleGroupDisabled', val);
-      }
-    },
-
-    methods: {
-      queryChange() {
-        this.visible = this.$children &&
-          Array.isArray(this.$children) &&
-          this.$children.some(option => option.visible === true);
-      }
-    },
-
-    created() {
-      this.$on('queryChange', this.queryChange);
-    },
-
-    mounted() {
-      if (this.disabled) {
-        this.broadcast('ElOption', 'handleGroupDisabled', this.disabled);
-      }
-    }
-  };
-</script>
+<template>
+  <ul class="el-select-group__wrap" v-show="visible">
+    <li class="el-select-group__title">{{ label }}</li>
+    <li>
+      <ul class="el-select-group">
+        <slot></slot>
+      </ul>
+    </li>
+  </ul>
+</template>
+
+<script type="text/babel">
+  import Emitter from '@penggy/element-ui/src/mixins/emitter';
+
+  export default {
+    mixins: [Emitter],
+
+    name: 'ElOptionGroup',
+
+    componentName: 'ElOptionGroup',
+
+    props: {
+      label: String,
+      disabled: {
+        type: Boolean,
+        default: false
+      }
+    },
+
+    data() {
+      return {
+        visible: true
+      };
+    },
+
+    watch: {
+      disabled(val) {
+        this.broadcast('ElOption', 'handleGroupDisabled', val);
+      }
+    },
+
+    methods: {
+      queryChange() {
+        this.visible = this.$children &&
+          Array.isArray(this.$children) &&
+          this.$children.some(option => option.visible === true);
+      }
+    },
+
+    created() {
+      this.$on('queryChange', this.queryChange);
+    },
+
+    mounted() {
+      if (this.disabled) {
+        this.broadcast('ElOption', 'handleGroupDisabled', this.disabled);
+      }
+    }
+  };
+</script>

package/packages/select/src/option.vue

@@ -1,159 +1,159 @@
-<template>
-  <li
-    @mouseenter="hoverItem"
-    @click.stop="selectOptionClick"
-    class="el-select-dropdown__item"
-    v-show="visible"
-    :class="{
-      'selected': itemSelected,
-      'is-disabled': disabled || groupDisabled || limitReached,
-      'hover': hover
-    }">
-    <slot>
-      <span>{{ currentLabel }}</span>
-    </slot>
-  </li>
-</template>
-
-<script type="text/babel">
-  import Emitter from 'element-ui/src/mixins/emitter';
-  import { getValueByPath, escapeRegexpString } from 'element-ui/src/utils/util';
-
-  export default {
-    mixins: [Emitter],
-
-    name: 'ElOption',
-
-    componentName: 'ElOption',
-
-    inject: ['select'],
-
-    props: {
-      value: {
-        required: true
-      },
-      label: [String, Number],
-      created: Boolean,
-      disabled: {
-        type: Boolean,
-        default: false
-      }
-    },
-
-    data() {
-      return {
-        index: -1,
-        groupDisabled: false,
-        visible: true,
-        hitState: false,
-        hover: false
-      };
-    },
-
-    computed: {
-      isObject() {
-        return Object.prototype.toString.call(this.value).toLowerCase() === '[object object]';
-      },
-
-      currentLabel() {
-        return this.label || (this.isObject ? '' : this.value);
-      },
-
-      currentValue() {
-        return this.value || this.label || '';
-      },
-
-      itemSelected() {
-        if (!this.select.multiple) {
-          return this.isEqual(this.value, this.select.value);
-        } else {
-          return this.contains(this.select.value, this.value);
-        }
-      },
-
-      limitReached() {
-        if (this.select.multiple) {
-          return !this.itemSelected &&
-            (this.select.value || []).length >= this.select.multipleLimit &&
-            this.select.multipleLimit > 0;
-        } else {
-          return false;
-        }
-      }
-    },
-
-    watch: {
-      currentLabel() {
-        if (!this.created && !this.select.remote) this.dispatch('ElSelect', 'setSelected');
-      },
-      value(val, oldVal) {
-        const { remote, valueKey } = this.select;
-        if (!this.created && !remote) {
-          if (valueKey && typeof val === 'object' && typeof oldVal === 'object' && val[valueKey] === oldVal[valueKey]) {
-            return;
-          }
-          this.dispatch('ElSelect', 'setSelected');
-        }
-      }
-    },
-
-    methods: {
-      isEqual(a, b) {
-        if (!this.isObject) {
-          return a === b;
-        } else {
-          const valueKey = this.select.valueKey;
-          return getValueByPath(a, valueKey) === getValueByPath(b, valueKey);
-        }
-      },
-
-      contains(arr = [], target) {
-        if (!this.isObject) {
-          return arr.indexOf(target) > -1;
-        } else {
-          const valueKey = this.select.valueKey;
-          return arr.some(item => {
-            return getValueByPath(item, valueKey) === getValueByPath(target, valueKey);
-          });
-        }
-      },
-
-      handleGroupDisabled(val) {
-        this.groupDisabled = val;
-      },
-
-      hoverItem() {
-        if (!this.disabled && !this.groupDisabled) {
-          this.select.hoverIndex = this.select.options.indexOf(this);
-        }
-      },
-
-      selectOptionClick() {
-        if (this.disabled !== true && this.groupDisabled !== true) {
-          this.dispatch('ElSelect', 'handleOptionClick', [this, true]);
-        }
-      },
-
-      queryChange(query) {
-        this.visible = new RegExp(escapeRegexpString(query), 'i').test(this.currentLabel) || this.created;
-        if (!this.visible) {
-          this.select.filteredOptionsCount--;
-        }
-      }
-    },
-
-    created() {
-      this.select.options.push(this);
-      this.select.cachedOptions.push(this);
-      this.select.optionsCount++;
-      this.select.filteredOptionsCount++;
-
-      this.$on('queryChange', this.queryChange);
-      this.$on('handleGroupDisabled', this.handleGroupDisabled);
-    },
-
-    beforeDestroy() {
-      this.select.onOptionDestroy(this.select.options.indexOf(this));
-    }
-  };
-</script>
+<template>
+  <li
+    @mouseenter="hoverItem"
+    @click.stop="selectOptionClick"
+    class="el-select-dropdown__item"
+    v-show="visible"
+    :class="{
+      'selected': itemSelected,
+      'is-disabled': disabled || groupDisabled || limitReached,
+      'hover': hover
+    }">
+    <slot>
+      <span>{{ currentLabel }}</span>
+    </slot>
+  </li>
+</template>
+
+<script type="text/babel">
+  import Emitter from '@penggy/element-ui/src/mixins/emitter';
+  import { getValueByPath, escapeRegexpString } from '@penggy/element-ui/src/utils/util';
+
+  export default {
+    mixins: [Emitter],
+
+    name: 'ElOption',
+
+    componentName: 'ElOption',
+
+    inject: ['select'],
+
+    props: {
+      value: {
+        required: true
+      },
+      label: [String, Number],
+      created: Boolean,
+      disabled: {
+        type: Boolean,
+        default: false
+      }
+    },
+
+    data() {
+      return {
+        index: -1,
+        groupDisabled: false,
+        visible: true,
+        hitState: false,
+        hover: false
+      };
+    },
+
+    computed: {
+      isObject() {
+        return Object.prototype.toString.call(this.value).toLowerCase() === '[object object]';
+      },
+
+      currentLabel() {
+        return this.label || (this.isObject ? '' : this.value);
+      },
+
+      currentValue() {
+        return this.value || this.label || '';
+      },
+
+      itemSelected() {
+        if (!this.select.multiple) {
+          return this.isEqual(this.value, this.select.value);
+        } else {
+          return this.contains(this.select.value, this.value);
+        }
+      },
+
+      limitReached() {
+        if (this.select.multiple) {
+          return !this.itemSelected &&
+            (this.select.value || []).length >= this.select.multipleLimit &&
+            this.select.multipleLimit > 0;
+        } else {
+          return false;
+        }
+      }
+    },
+
+    watch: {
+      currentLabel() {
+        if (!this.created && !this.select.remote) this.dispatch('ElSelect', 'setSelected');
+      },
+      value(val, oldVal) {
+        const { remote, valueKey } = this.select;
+        if (!this.created && !remote) {
+          if (valueKey && typeof val === 'object' && typeof oldVal === 'object' && val[valueKey] === oldVal[valueKey]) {
+            return;
+          }
+          this.dispatch('ElSelect', 'setSelected');
+        }
+      }
+    },
+
+    methods: {
+      isEqual(a, b) {
+        if (!this.isObject) {
+          return a === b;
+        } else {
+          const valueKey = this.select.valueKey;
+          return getValueByPath(a, valueKey) === getValueByPath(b, valueKey);
+        }
+      },
+
+      contains(arr = [], target) {
+        if (!this.isObject) {
+          return arr.indexOf(target) > -1;
+        } else {
+          const valueKey = this.select.valueKey;
+          return arr.some(item => {
+            return getValueByPath(item, valueKey) === getValueByPath(target, valueKey);
+          });
+        }
+      },
+
+      handleGroupDisabled(val) {
+        this.groupDisabled = val;
+      },
+
+      hoverItem() {
+        if (!this.disabled && !this.groupDisabled) {
+          this.select.hoverIndex = this.select.options.indexOf(this);
+        }
+      },
+
+      selectOptionClick() {
+        if (this.disabled !== true && this.groupDisabled !== true) {
+          this.dispatch('ElSelect', 'handleOptionClick', [this, true]);
+        }
+      },
+
+      queryChange(query) {
+        this.visible = new RegExp(escapeRegexpString(query), 'i').test(this.currentLabel) || this.created;
+        if (!this.visible) {
+          this.select.filteredOptionsCount--;
+        }
+      }
+    },
+
+    created() {
+      this.select.options.push(this);
+      this.select.cachedOptions.push(this);
+      this.select.optionsCount++;
+      this.select.filteredOptionsCount++;
+
+      this.$on('queryChange', this.queryChange);
+      this.$on('handleGroupDisabled', this.handleGroupDisabled);
+    },
+
+    beforeDestroy() {
+      this.select.onOptionDestroy(this.select.options.indexOf(this));
+    }
+  };
+</script>