UNPKG

kingdot

Version:

A UI Components Library For Vue

1,157 lines (1,004 loc) 36.4 kB
module.exports = /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); /******/ } /******/ }; /******/ /******/ // define __esModule on exports /******/ __webpack_require__.r = function(exports) { /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); /******/ } /******/ Object.defineProperty(exports, '__esModule', { value: true }); /******/ }; /******/ /******/ // create a fake namespace object /******/ // mode & 1: value is a module id, require it /******/ // mode & 2: merge all properties of value into the ns /******/ // mode & 4: return value when already ns object /******/ // mode & 8|1: behave like require /******/ __webpack_require__.t = function(value, mode) { /******/ if(mode & 1) value = __webpack_require__(value); /******/ if(mode & 8) return value; /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; /******/ var ns = Object.create(null); /******/ __webpack_require__.r(ns); /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); /******/ return ns; /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = "/dist/"; /******/ /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = 247); /******/ }) /************************************************************************/ /******/ ({ /***/ 0: /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return normalizeComponent; }); /* globals __VUE_SSR_CONTEXT__ */ // IMPORTANT: Do NOT use ES2015 features in this file (except for modules). // This module is a runtime utility for cleaner component module output and will // be included in the final webpack user bundle. function normalizeComponent ( scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, /* server only */ shadowMode /* vue-cli only */ ) { // Vue.extend constructor export interop var options = typeof scriptExports === 'function' ? scriptExports.options : scriptExports // render functions if (render) { options.render = render options.staticRenderFns = staticRenderFns options._compiled = true } // functional template if (functionalTemplate) { options.functional = true } // scopedId if (scopeId) { options._scopeId = 'data-v-' + scopeId } var hook if (moduleIdentifier) { // server build hook = function (context) { // 2.3 injection context = context || // cached call (this.$vnode && this.$vnode.ssrContext) || // stateful (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional // 2.2 with runInNewContext: true if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { context = __VUE_SSR_CONTEXT__ } // inject component styles if (injectStyles) { injectStyles.call(this, context) } // register component module identifier for async chunk inferrence if (context && context._registeredComponents) { context._registeredComponents.add(moduleIdentifier) } } // used by ssr in case component is cached and beforeCreate // never gets called options._ssrRegister = hook } else if (injectStyles) { hook = shadowMode ? function () { injectStyles.call( this, (options.functional ? this.parent : this).$root.$options.shadowRoot ) } : injectStyles } if (hook) { if (options.functional) { // for template-only hot-reload because in that case the render fn doesn't // go through the normalizer options._injectStyles = hook // register for functional component in vue file var originalRender = options.render options.render = function renderWithStyleInjection (h, context) { hook.call(context) return originalRender(h, context) } } else { // inject component registration as beforeCreate hook var existing = options.beforeCreate options.beforeCreate = existing ? [].concat(existing, hook) : [hook] } } return { exports: scriptExports, options: options } } /***/ }), /***/ 195: /***/ (function(module, exports, __webpack_require__) { module.exports = __webpack_require__(206); /***/ }), /***/ 206: /***/ (function(module, exports, __webpack_require__) { "use strict"; /** * Copyright (c) 2015, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule normalizeWheel * @typechecks */ var UserAgent_DEPRECATED = __webpack_require__(207); var isEventSupported = __webpack_require__(208); // Reasonable defaults var PIXEL_STEP = 10; var LINE_HEIGHT = 40; var PAGE_HEIGHT = 800; /** * Mouse wheel (and 2-finger trackpad) support on the web sucks. It is * complicated, thus this doc is long and (hopefully) detailed enough to answer * your questions. * * If you need to react to the mouse wheel in a predictable way, this code is * like your bestest friend. * hugs * * * As of today, there are 4 DOM event types you can listen to: * * 'wheel' -- Chrome(31+), FF(17+), IE(9+) * 'mousewheel' -- Chrome, IE(6+), Opera, Safari * 'MozMousePixelScroll' -- FF(3.5 only!) (2010-2013) -- don't bother! * 'DOMMouseScroll' -- FF(0.9.7+) since 2003 * * So what to do? The is the best: * * normalizeWheel.getEventType(); * * In your event callback, use this code to get sane interpretation of the * deltas. This code will return an object with properties: * * spinX -- normalized spin speed (use for zoom) - x plane * spinY -- " - y plane * pixelX -- normalized distance (to pixels) - x plane * pixelY -- " - y plane * * Wheel values are provided by the browser assuming you are using the wheel to * scroll a web page by a number of lines or pixels (or pages). Values can vary * significantly on different platforms and browsers, forgetting that you can * scroll at different speeds. Some devices (like trackpads) emit more events * at smaller increments with fine granularity, and some emit massive jumps with * linear speed or acceleration. * * This code does its best to normalize the deltas for you: * * - spin is trying to normalize how far the wheel was spun (or trackpad * dragged). This is super useful for zoom support where you want to * throw away the chunky scroll steps on the PC and make those equal to * the slow and smooth tiny steps on the Mac. Key data: This code tries to * resolve a single slow step on a wheel to 1. * * - pixel is normalizing the desired scroll delta in pixel units. You'll * get the crazy differences between browsers, but at least it'll be in * pixels! * * - positive value indicates scrolling DOWN/RIGHT, negative UP/LEFT. This * should translate to positive value zooming IN, negative zooming OUT. * This matches the newer 'wheel' event. * * Why are there spinX, spinY (or pixels)? * * - spinX is a 2-finger side drag on the trackpad, and a shift + wheel turn * with a mouse. It results in side-scrolling in the browser by default. * * - spinY is what you expect -- it's the classic axis of a mouse wheel. * * - I dropped spinZ/pixelZ. It is supported by the DOM 3 'wheel' event and * probably is by browsers in conjunction with fancy 3D controllers .. but * you know. * * Implementation info: * * Examples of 'wheel' event if you scroll slowly (down) by one step with an * average mouse: * * OS X + Chrome (mouse) - 4 pixel delta (wheelDelta -120) * OS X + Safari (mouse) - N/A pixel delta (wheelDelta -12) * OS X + Firefox (mouse) - 0.1 line delta (wheelDelta N/A) * Win8 + Chrome (mouse) - 100 pixel delta (wheelDelta -120) * Win8 + Firefox (mouse) - 3 line delta (wheelDelta -120) * * On the trackpad: * * OS X + Chrome (trackpad) - 2 pixel delta (wheelDelta -6) * OS X + Firefox (trackpad) - 1 pixel delta (wheelDelta N/A) * * On other/older browsers.. it's more complicated as there can be multiple and * also missing delta values. * * The 'wheel' event is more standard: * * http://www.w3.org/TR/DOM-Level-3-Events/#events-wheelevents * * The basics is that it includes a unit, deltaMode (pixels, lines, pages), and * deltaX, deltaY and deltaZ. Some browsers provide other values to maintain * backward compatibility with older events. Those other values help us * better normalize spin speed. Example of what the browsers provide: * * | event.wheelDelta | event.detail * ------------------+------------------+-------------- * Safari v5/OS X | -120 | 0 * Safari v5/Win7 | -120 | 0 * Chrome v17/OS X | -120 | 0 * Chrome v17/Win7 | -120 | 0 * IE9/Win7 | -120 | undefined * Firefox v4/OS X | undefined | 1 * Firefox v4/Win7 | undefined | 3 * */ function normalizeWheel( /*object*/event) /*object*/{ var sX = 0, sY = 0, // spinX, spinY pX = 0, pY = 0; // pixelX, pixelY // Legacy if ('detail' in event) { sY = event.detail; } if ('wheelDelta' in event) { sY = -event.wheelDelta / 120; } if ('wheelDeltaY' in event) { sY = -event.wheelDeltaY / 120; } if ('wheelDeltaX' in event) { sX = -event.wheelDeltaX / 120; } // side scrolling on FF with DOMMouseScroll if ('axis' in event && event.axis === event.HORIZONTAL_AXIS) { sX = sY; sY = 0; } pX = sX * PIXEL_STEP; pY = sY * PIXEL_STEP; if ('deltaY' in event) { pY = event.deltaY; } if ('deltaX' in event) { pX = event.deltaX; } if ((pX || pY) && event.deltaMode) { if (event.deltaMode == 1) { // delta in LINE units pX *= LINE_HEIGHT; pY *= LINE_HEIGHT; } else { // delta in PAGE units pX *= PAGE_HEIGHT; pY *= PAGE_HEIGHT; } } // Fall-back if spin cannot be determined if (pX && !sX) { sX = pX < 1 ? -1 : 1; } if (pY && !sY) { sY = pY < 1 ? -1 : 1; } return { spinX: sX, spinY: sY, pixelX: pX, pixelY: pY }; } /** * The best combination if you prefer spinX + spinY normalization. It favors * the older DOMMouseScroll for Firefox, as FF does not include wheelDelta with * 'wheel' event, making spin speed determination impossible. */ normalizeWheel.getEventType = function () /*string*/{ return UserAgent_DEPRECATED.firefox() ? 'DOMMouseScroll' : isEventSupported('wheel') ? 'wheel' : 'mousewheel'; }; module.exports = normalizeWheel; /***/ }), /***/ 207: /***/ (function(module, exports) { /** * Copyright 2004-present Facebook. All Rights Reserved. * * @providesModule UserAgent_DEPRECATED */ /** * Provides entirely client-side User Agent and OS detection. You should prefer * the non-deprecated UserAgent module when possible, which exposes our * authoritative server-side PHP-based detection to the client. * * Usage is straightforward: * * if (UserAgent_DEPRECATED.ie()) { * // IE * } * * You can also do version checks: * * if (UserAgent_DEPRECATED.ie() >= 7) { * // IE7 or better * } * * The browser functions will return NaN if the browser does not match, so * you can also do version compares the other way: * * if (UserAgent_DEPRECATED.ie() < 7) { * // IE6 or worse * } * * Note that the version is a float and may include a minor version number, * so you should always use range operators to perform comparisons, not * strict equality. * * **Note:** You should **strongly** prefer capability detection to browser * version detection where it's reasonable: * * http://www.quirksmode.org/js/support.html * * Further, we have a large number of mature wrapper functions and classes * which abstract away many browser irregularities. Check the documentation, * grep for things, or ask on javascript@lists.facebook.com before writing yet * another copy of "event || window.event". * */ var _populated = false; // Browsers var _ie, _firefox, _opera, _webkit, _chrome; // Actual IE browser for compatibility mode var _ie_real_version; // Platforms var _osx, _windows, _linux, _android; // Architectures var _win64; // Devices var _iphone, _ipad, _native; var _mobile; function _populate() { if (_populated) { return; } _populated = true; // To work around buggy JS libraries that can't handle multi-digit // version numbers, Opera 10's user agent string claims it's Opera // 9, then later includes a Version/X.Y field: // // Opera/9.80 (foo) Presto/2.2.15 Version/10.10 var uas = navigator.userAgent; var agent = /(?:MSIE.(\d+\.\d+))|(?:(?:Firefox|GranParadiso|Iceweasel).(\d+\.\d+))|(?:Opera(?:.+Version.|.)(\d+\.\d+))|(?:AppleWebKit.(\d+(?:\.\d+)?))|(?:Trident\/\d+\.\d+.*rv:(\d+\.\d+))/.exec(uas); var os = /(Mac OS X)|(Windows)|(Linux)/.exec(uas); _iphone = /\b(iPhone|iP[ao]d)/.exec(uas); _ipad = /\b(iP[ao]d)/.exec(uas); _android = /Android/i.exec(uas); _native = /FBAN\/\w+;/i.exec(uas); _mobile = /Mobile/i.exec(uas); // Note that the IE team blog would have you believe you should be checking // for 'Win64; x64'. But MSDN then reveals that you can actually be coming // from either x64 or ia64; so ultimately, you should just check for Win64 // as in indicator of whether you're in 64-bit IE. 32-bit IE on 64-bit // Windows will send 'WOW64' instead. _win64 = !!/Win64/.exec(uas); if (agent) { _ie = agent[1] ? parseFloat(agent[1]) : agent[5] ? parseFloat(agent[5]) : NaN; // IE compatibility mode if (_ie && document && document.documentMode) { _ie = document.documentMode; } // grab the "true" ie version from the trident token if available var trident = /(?:Trident\/(\d+.\d+))/.exec(uas); _ie_real_version = trident ? parseFloat(trident[1]) + 4 : _ie; _firefox = agent[2] ? parseFloat(agent[2]) : NaN; _opera = agent[3] ? parseFloat(agent[3]) : NaN; _webkit = agent[4] ? parseFloat(agent[4]) : NaN; if (_webkit) { // We do not add the regexp to the above test, because it will always // match 'safari' only since 'AppleWebKit' appears before 'Chrome' in // the userAgent string. agent = /(?:Chrome\/(\d+\.\d+))/.exec(uas); _chrome = agent && agent[1] ? parseFloat(agent[1]) : NaN; } else { _chrome = NaN; } } else { _ie = _firefox = _opera = _chrome = _webkit = NaN; } if (os) { if (os[1]) { // Detect OS X version. If no version number matches, set _osx to true. // Version examples: 10, 10_6_1, 10.7 // Parses version number as a float, taking only first two sets of // digits. If only one set of digits is found, returns just the major // version number. var ver = /(?:Mac OS X (\d+(?:[._]\d+)?))/.exec(uas); _osx = ver ? parseFloat(ver[1].replace('_', '.')) : true; } else { _osx = false; } _windows = !!os[2]; _linux = !!os[3]; } else { _osx = _windows = _linux = false; } } var UserAgent_DEPRECATED = { /** * Check if the UA is Internet Explorer. * * * @return float|NaN Version number (if match) or NaN. */ ie: function ie() { return _populate() || _ie; }, /** * Check if we're in Internet Explorer compatibility mode. * * @return bool true if in compatibility mode, false if * not compatibility mode or not ie */ ieCompatibilityMode: function ieCompatibilityMode() { return _populate() || _ie_real_version > _ie; }, /** * Whether the browser is 64-bit IE. Really, this is kind of weak sauce; we * only need this because Skype can't handle 64-bit IE yet. We need to remove * this when we don't need it -- tracked by #601957. */ ie64: function ie64() { return UserAgent_DEPRECATED.ie() && _win64; }, /** * Check if the UA is Firefox. * * * @return float|NaN Version number (if match) or NaN. */ firefox: function firefox() { return _populate() || _firefox; }, /** * Check if the UA is Opera. * * * @return float|NaN Version number (if match) or NaN. */ opera: function opera() { return _populate() || _opera; }, /** * Check if the UA is WebKit. * * * @return float|NaN Version number (if match) or NaN. */ webkit: function webkit() { return _populate() || _webkit; }, /** * For Push * WILL BE REMOVED VERY SOON. Use UserAgent_DEPRECATED.webkit */ safari: function safari() { return UserAgent_DEPRECATED.webkit(); }, /** * Check if the UA is a Chrome browser. * * * @return float|NaN Version number (if match) or NaN. */ chrome: function chrome() { return _populate() || _chrome; }, /** * Check if the user is running Windows. * * @return bool `true' if the user's OS is Windows. */ windows: function windows() { return _populate() || _windows; }, /** * Check if the user is running Mac OS X. * * @return float|bool Returns a float if a version number is detected, * otherwise true/false. */ osx: function osx() { return _populate() || _osx; }, /** * Check if the user is running Linux. * * @return bool `true' if the user's OS is some flavor of Linux. */ linux: function linux() { return _populate() || _linux; }, /** * Check if the user is running on an iPhone or iPod platform. * * @return bool `true' if the user is running some flavor of the * iPhone OS. */ iphone: function iphone() { return _populate() || _iphone; }, mobile: function mobile() { return _populate() || _iphone || _ipad || _android || _mobile; }, nativeApp: function nativeApp() { // webviews inside of the native apps return _populate() || _native; }, android: function android() { return _populate() || _android; }, ipad: function ipad() { return _populate() || _ipad; } }; module.exports = UserAgent_DEPRECATED; /***/ }), /***/ 208: /***/ (function(module, exports, __webpack_require__) { "use strict"; /** * Copyright 2013-2015, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule isEventSupported */ var ExecutionEnvironment = __webpack_require__(209); var useHasFeature; if (ExecutionEnvironment.canUseDOM) { useHasFeature = document.implementation && document.implementation.hasFeature && // always returns true in newer browsers as per the standard. // @see http://dom.spec.whatwg.org/#dom-domimplementation-hasfeature document.implementation.hasFeature('', '') !== true; } /** * Checks if an event is supported in the current execution environment. * * NOTE: This will not work correctly for non-generic events such as `change`, * `reset`, `load`, `error`, and `select`. * * Borrows from Modernizr. * * @param {string} eventNameSuffix Event name, e.g. "click". * @param {?boolean} capture Check if the capture phase is supported. * @return {boolean} True if the event is supported. * @internal * @license Modernizr 3.0.0pre (Custom Build) | MIT */ function isEventSupported(eventNameSuffix, capture) { if (!ExecutionEnvironment.canUseDOM || capture && !('addEventListener' in document)) { return false; } var eventName = 'on' + eventNameSuffix; var isSupported = eventName in document; if (!isSupported) { var element = document.createElement('div'); element.setAttribute(eventName, 'return;'); isSupported = typeof element[eventName] === 'function'; } if (!isSupported && useHasFeature && eventNameSuffix === 'wheel') { // This is the only way to test support for the `wheel` event in IE9+. isSupported = document.implementation.hasFeature('Events.wheel', '3.0'); } return isSupported; } module.exports = isEventSupported; /***/ }), /***/ 209: /***/ (function(module, exports, __webpack_require__) { "use strict"; /** * Copyright (c) 2015, Facebook, Inc. * All rights reserved. * * This source code is licensed under the BSD-style license found in the * LICENSE file in the root directory of this source tree. An additional grant * of patent rights can be found in the PATENTS file in the same directory. * * @providesModule ExecutionEnvironment */ /*jslint evil: true */ var canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement); /** * Simple, lightweight module assisting with the detection and context of * Worker. Helps avoid circular dependencies and allows code to reason about * whether or not they are in a Worker, even if they never include the main * `ReactWorker` dependency. */ var ExecutionEnvironment = { canUseDOM: canUseDOM, canUseWorkers: typeof Worker !== 'undefined', canUseEventListeners: canUseDOM && !!(window.addEventListener || window.attachEvent), canUseViewport: canUseDOM && !!window.screen, isInWorker: !canUseDOM // For now, this is true - might change in the future. }; module.exports = ExecutionEnvironment; /***/ }), /***/ 247: /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; // ESM COMPAT FLAG __webpack_require__.r(__webpack_exports__); // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./components/ScrollSelect/ScrollSelect.vue?vue&type=template&id=8ddaedaa& var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:{ 'kd-scroll-select': true, 'kd-dragging': _vm.moveFlag, 'kd-disabled': _vm.disabled },on:{"click":function($event){$event.stopPropagation();}}},[_c('div',{staticClass:"kd-wrapper",style:({ transform: ("translateY(" + _vm.translateY + "px)"), marginTop: (_vm.marginTop + "px"), }),on:{"mousedown":_vm.moveStart,"wheel":function($event){$event.preventDefault();return _vm.mouseWheel($event)}}},_vm._l((_vm.selectList),function(item,index){return _c('div',{key:index,ref:"item",refInFor:true,class:{ 'kd-scroll-item': true, 'kd-scroll-item-active': _vm.value === item.value, 'kd-scroll-item-disabled': _vm.isItemDisabled(item) },on:{"click":function($event){$event.stopPropagation();return _vm.clickHandler(item, index)}}},[_vm._v("\n "+_vm._s(item.label)+"\n ")])}),0),_c('div',{staticClass:"kd-border"})])} var staticRenderFns = [] // CONCATENATED MODULE: ./components/ScrollSelect/ScrollSelect.vue?vue&type=template&id=8ddaedaa& // EXTERNAL MODULE: ./node_modules/normalize-wheel/index.js var normalize_wheel = __webpack_require__(195); var normalize_wheel_default = /*#__PURE__*/__webpack_require__.n(normalize_wheel); // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./components/ScrollSelect/ScrollSelect.vue?vue&type=script&lang=js& var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // // /* harmony default export */ var ScrollSelectvue_type_script_lang_js_ = ({ name: 'KdScrollSelect', props: { value: { type: [String, Number] }, data: { type: Array, default: function _default() { return [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]; } }, disabled: { type: Boolean, default: false }, // 判断选项是否需要禁用 disable: { type: Function, default: function _default() { return false; } }, count: { // 展示范围, 最好奇数位. 默认5 type: Number, default: function _default() { return 17; } } }, data: function data() { return { translateY: 0, marginTop: 0, curIndex: 0, currentValue: this.data[0].value || this.data[0], // 拖动相关 moveFlag: false, moveStartY: 0 // currentValue: '', // count: 5 // 展示范围, 默认5 // isDisabled: this.disabled }; }, computed: { selectList: function selectList() { var _this = this; var list = []; var curIndex = -1; var data = this.data; // if(typeof data == 'function'){ // data == 'function' 的特殊处理 // data = data(this.currentValue); // } // data 是完整的列表 data = data.map(function (item, index) { var type = typeof item === 'undefined' ? 'undefined' : _typeof(item); // 若为字符串数组, 则处理成对象数组 if (type === 'string' || type === 'number') { item = { value: item, label: item }; } if (item.value === _this.currentValue) { curIndex = index; } return item; }); var length = data.length; var half = Math.floor(this.count / 2); if (length < 1) { return []; } if (!~curIndex) { // ~-1 == 0 curIndex = 0; // eslint-disable-next-line vue/no-side-effects-in-computed-properties this.currentValue = data[0].value; } // list 是能展示出来的几个元素的集合. 与当前选中的 curValue 有关 list = Array(this.count).fill(0).map(function (item, index) { return data[(length + (curIndex - half) % length + index) % length]; }); return list; } }, watch: { value: { immediate: true, handler: function handler(v) { // if (v) { this.currentValue = v; // } } }, currentValue: function currentValue(value, oldValue) { var disable = this.disable; // 判断 currentValue 没有被禁用... // !!value && // value 是假值的时候就不再 emit 事件, 不然会被处理成 00:00:00 if (!!value && !(!!disable && disable.call(this, value))) { this.$emit('input', value); this.$emit('change', value, oldValue); } } }, mounted: function mounted() { this.initPosition(); }, methods: { // 初始化位置信息 initPosition: function initPosition() { var height = this.$el.offsetHeight; // console.log('initPosition marginTop', this.$el.offsetHeight); this.itemHeight = this.$refs.item[0].offsetHeight; // console.log('initPosition itemHeight', this.itemHeight); this.initTranslateY = -(Math.floor(this.count / 2) * this.itemHeight - (height - this.itemHeight) / 2); // console.log('initPosition translateY', this.translateY); this.translateY = this.initTranslateY; this.marginTop = 0; }, moveStart: function moveStart(e) { // 拖动调整 // 设置初始值 if (e.which !== 1) return; if (this.disabled) return; this.moveFlag = true; this.moved = false; this.moveStartY = e.clientY; this.initY = e.clientY; this.itemHeight = this.$refs.item[0].offsetHeight; document.addEventListener('mousemove', this.moving); document.addEventListener('mouseup', this.moveEnd); }, moving: function moving(e) { if (!this.moveFlag) return; var moveY = e.clientY - this.moveStartY; if (!moveY) { return; } var detaY = e.clientY - this.initY; this.moved = !!moveY; var moveIndex = Math.floor(Math.abs(detaY) / this.itemHeight); if (moveIndex) { if (detaY < 0) { moveIndex = -moveIndex; } this.setMoveValue(-moveIndex, -detaY); // console.log('move change', -moveIndex, -detaY); this.initY = e.clientY; } this.moveStartY = e.clientY; this.translateY += moveY; }, // setMoveValue(index, moveY, isSetTranslate) { // const length = this.selectList.length; // const currentIndex = this.selectList.findIndex(item => item.value === this.currentValue); // this.currentValue = this.selectList[(length + currentIndex + index) % length].value; // this.marginTop += moveY || index * this.itemHeight; // if (isSetTranslate) { // this.translateY -= this.itemHeight * index; // } // }, moveEnd: function moveEnd(e) { if (this.moveFlag) { this.moveFlag = false; this.translateY = -this.marginTop + this.initTranslateY; document.removeEventListener('mousemove', this.moving); document.removeEventListener('mouseup', this.moveEnd); } }, mouseWheel: function mouseWheel(e) { if (this.disabled) return; var normalized = normalize_wheel_default()(e); this.setMoveValue(normalized.spinY < 0 ? -1 : 1, null, true); }, // ========= // mouseWheel(e) { // if (this.disabled) return; // // TODO: 拿滚动详细数据 (方向, 距离) // this.setMoveValue(e.deltaY < 0 ? -1 : 1); // }, setMoveValue: function setMoveValue(index, moveY, isSetTranslate) { var _this2 = this; var length = this.selectList.length; var currentIndex = this.selectList.findIndex(function (item) { return item.value === _this2.currentValue; }); // 选中 this.currentValue = this.selectList[(length + currentIndex + index) % length].value; // 支持拖动 this.marginTop += moveY || index * this.itemHeight; // 滚动一节. 上移或者下移 整个 itemHeight // 滚动时 改变 this.translateY 使得选中项在中间 if (isSetTranslate) { this.translateY -= this.itemHeight * index; } }, clickHandler: function clickHandler(selectItem, index) { if (this.moved) return; if (this.disabled) return; if (this.isItemDisabled(selectItem)) return; var half = Math.floor(this.count / 2); var itemHeight = this.$refs.item[0].offsetHeight; this.translateY -= (index - half) * itemHeight; this.marginTop += (index - half) * itemHeight; this.currentValue = selectItem.value; // const length = this.selectList.length; // const currentIndex = this.selectList.findIndex(item => item.value === this.currentValue); // this.currentValue = this.selectList[(length + currentIndex + index - half) % length].value; }, isItemDisabled: function isItemDisabled(item) { // 整个组件被禁用, 或者传入了 验证函数, 且验证后为禁用 var disableFlag = this.disabled || !!this.disable && this.disable(item.value); if (!disableFlag && item.value === this.currentValue && this.currentValue !== this.value) { this.$emit('input', this.currentValue); } return disableFlag; } } }); // CONCATENATED MODULE: ./components/ScrollSelect/ScrollSelect.vue?vue&type=script&lang=js& /* harmony default export */ var ScrollSelect_ScrollSelectvue_type_script_lang_js_ = (ScrollSelectvue_type_script_lang_js_); // EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js var componentNormalizer = __webpack_require__(0); // CONCATENATED MODULE: ./components/ScrollSelect/ScrollSelect.vue /* normalize component */ var component = Object(componentNormalizer["a" /* default */])( ScrollSelect_ScrollSelectvue_type_script_lang_js_, render, staticRenderFns, false, null, null, null ) /* harmony default export */ var ScrollSelect = (component.exports); // CONCATENATED MODULE: ./components/ScrollSelect/index.js ScrollSelect.install = function (Vue) { Vue.component(ScrollSelect.name, ScrollSelect); }; /* harmony default export */ var components_ScrollSelect = __webpack_exports__["default"] = (ScrollSelect); /***/ }) /******/ })["default"];