mirror of
				https://gitee.com/vant-contrib/vant.git
				synced 2025-10-27 01:32:10 +08:00 
			
		
		
		
	Merge branch 'master' into hotfix/unit_test_init
This commit is contained in:
		
						commit
						ae0f3c041f
					
				| @ -16,7 +16,7 @@ indent_size = 2 | ||||
| [*.vue] | ||||
| indent_size = 2 | ||||
| 
 | ||||
| [*.pcss] | ||||
| [*.css] | ||||
| indent_size = 2 | ||||
| 
 | ||||
| [Makefile] | ||||
|  | ||||
							
								
								
									
										173
									
								
								.eslintrc.js
									
									
									
									
									
								
							
							
						
						
									
										173
									
								
								.eslintrc.js
									
									
									
									
									
								
							| @ -1,39 +1,148 @@ | ||||
| module.exports = { | ||||
|   root: true, | ||||
|   parser: 'babel-eslint', | ||||
|   parserOptions: { | ||||
|     ecmaVersion: 6, | ||||
|     ecmaFeatures: { | ||||
|       experimentalObjectRestSpread: true, | ||||
|       jsx: true | ||||
|     }, | ||||
|     sourceType: 'module' | ||||
|   }, | ||||
|   // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
 | ||||
|   extends: 'standard', | ||||
|   // required to lint *.vue files
 | ||||
|   plugins: [ | ||||
|     'html' | ||||
|   ], | ||||
|   // add your custom rules here
 | ||||
|   'rules': { | ||||
|     // allow paren-less arrow functions
 | ||||
|     'arrow-parens': 0, | ||||
|     // allow async-await
 | ||||
|     'generator-star-spacing': 0, | ||||
|     // allow debugger during development
 | ||||
|     'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, | ||||
|     'semi': ['error', 'always'], | ||||
|     'space-before-function-paren': ['error', 'never'], | ||||
| 
 | ||||
|   env: { | ||||
|     es6: true, | ||||
|     node: true | ||||
|   }, | ||||
| 
 | ||||
|   plugins: ['vue'], | ||||
| 
 | ||||
|   globals: { | ||||
|     expect: true, | ||||
|     sinon: true, | ||||
|     zanui: true, | ||||
|     document: false, | ||||
|     navigator: false, | ||||
|     window: false | ||||
|   }, | ||||
| 
 | ||||
|   env: { | ||||
|     mocha: true | ||||
|   }, | ||||
| 
 | ||||
|   rules: { | ||||
|     'accessor-pairs': 2, | ||||
|     'arrow-spacing': [2, { 'before': true, 'after': true }], | ||||
|     'block-spacing': [2, 'always'], | ||||
|     'brace-style': [2, '1tbs', { 'allowSingleLine': true }], | ||||
|     'camelcase': [2, { 'properties': 'always' }], | ||||
|     'comma-dangle': [2, 'never'], | ||||
|     'comma-spacing': [2, { 'before': false, 'after': true }], | ||||
|     'comma-style': [2, 'last'], | ||||
|     'constructor-super': 2, | ||||
|     'curly': [2, 'multi-line'], | ||||
|     'dot-location': [2, 'property'], | ||||
|     'eol-last': 2, | ||||
|     'eqeqeq': [2, 'allow-null'], | ||||
|     'generator-star-spacing': [2, { 'before': true, 'after': true }], | ||||
|     'handle-callback-err': [2, '^(err|error)$' ], | ||||
|     'indent': [2, 2, { 'SwitchCase': 1 }], | ||||
|     'jsx-quotes': [2, 'prefer-single'], | ||||
|     'key-spacing': [2, { 'beforeColon': false, 'afterColon': true }], | ||||
|     'keyword-spacing': [2, { 'before': true, 'after': true }], | ||||
|     'new-cap': [2, { 'newIsCap': true, 'capIsNew': false }], | ||||
|     'new-parens': 2, | ||||
|     'no-array-constructor': 2, | ||||
|     'no-caller': 2, | ||||
|     'no-class-assign': 2, | ||||
|     'no-cond-assign': 2, | ||||
|     'no-const-assign': 2, | ||||
|     'no-control-regex': 2, | ||||
|     'no-delete-var': 2, | ||||
|     'no-dupe-args': 2, | ||||
|     'no-dupe-class-members': 2, | ||||
|     'no-dupe-keys': 2, | ||||
|     'no-duplicate-case': 2, | ||||
|     'no-empty-character-class': 2, | ||||
|     'no-empty-pattern': 2, | ||||
|     'no-eval': 2, | ||||
|     'no-ex-assign': 2, | ||||
|     'no-extend-native': 2, | ||||
|     'no-extra-bind': 2, | ||||
|     'no-extra-boolean-cast': 2, | ||||
|     'no-extra-parens': [2, 'functions'], | ||||
|     'no-fallthrough': 2, | ||||
|     'no-floating-decimal': 2, | ||||
|     'no-func-assign': 2, | ||||
|     'no-implied-eval': 2, | ||||
|     'no-inner-declarations': [2, 'functions'], | ||||
|     'no-invalid-regexp': 2, | ||||
|     'no-irregular-whitespace': 2, | ||||
|     'no-iterator': 2, | ||||
|     'no-label-var': 2, | ||||
|     'no-labels': [2, { 'allowLoop': false, 'allowSwitch': false }], | ||||
|     'no-lone-blocks': 2, | ||||
|     'no-mixed-spaces-and-tabs': 2, | ||||
|     'no-multi-spaces': 2, | ||||
|     'no-multi-str': 2, | ||||
|     'no-multiple-empty-lines': [2, { 'max': 1 }], | ||||
|     'no-native-reassign': 2, | ||||
|     'no-negated-in-lhs': 2, | ||||
|     'no-new-object': 2, | ||||
|     'no-new-require': 2, | ||||
|     'no-new-symbol': 2, | ||||
|     'no-new-wrappers': 2, | ||||
|     'no-obj-calls': 2, | ||||
|     'no-octal': 2, | ||||
|     'no-octal-escape': 2, | ||||
|     'no-path-concat': 2, | ||||
|     'no-proto': 2, | ||||
|     'no-redeclare': 2, | ||||
|     'no-regex-spaces': 2, | ||||
|     'no-return-assign': [2, 'except-parens'], | ||||
|     'no-self-assign': 2, | ||||
|     'no-self-compare': 2, | ||||
|     'no-sequences': 2, | ||||
|     'no-shadow-restricted-names': 2, | ||||
|     'no-spaced-func': 2, | ||||
|     'no-sparse-arrays': 2, | ||||
|     'no-this-before-super': 2, | ||||
|     'no-throw-literal': 2, | ||||
|     'no-trailing-spaces': 2, | ||||
|     'no-undef': 2, | ||||
|     'no-undef-init': 2, | ||||
|     'no-unexpected-multiline': 2, | ||||
|     'no-unmodified-loop-condition': 2, | ||||
|     'no-unneeded-ternary': [2, { 'defaultAssignment': false }], | ||||
|     'no-unreachable': 2, | ||||
|     'no-unsafe-finally': 2, | ||||
|     'no-unused-vars': [2, { 'vars': 'all', 'args': 'none' }], | ||||
|     'no-useless-call': 2, | ||||
|     'no-useless-computed-key': 2, | ||||
|     'no-useless-constructor': 2, | ||||
|     'no-useless-escape': 0, | ||||
|     'no-extra-boolean-cast': 0, | ||||
|     'no-new': 0 | ||||
|   }, | ||||
|   "env": { | ||||
|     "mocha": true | ||||
|   }, | ||||
|   "globals": { | ||||
|     "expect": true, | ||||
|     "sinon": true, | ||||
|     "zanui": true, | ||||
|     "location": true, | ||||
|     "Swiper": true, | ||||
|     "wysihtml5": true, | ||||
|     "wysihtml5ParserRules": true | ||||
|     'no-whitespace-before-property': 2, | ||||
|     'no-with': 2, | ||||
|     'one-var': [2, { 'initialized': 'never' }], | ||||
|     'operator-linebreak': [2, 'after', { 'overrides': { '?': 'before', ':': 'before' } }], | ||||
|     'padded-blocks': [2, 'never'], | ||||
|     'quotes': [2, 'single', { 'avoidEscape': true, 'allowTemplateLiterals': true }], | ||||
|     'semi': [2, 'always'], | ||||
|     'semi-spacing': [2, { 'before': false, 'after': true }], | ||||
|     'space-before-blocks': [2, 'always'], | ||||
|     'space-before-function-paren': [2, 'never'], | ||||
|     'space-in-parens': [2, 'never'], | ||||
|     'space-infix-ops': 2, | ||||
|     'space-unary-ops': [2, { 'words': true, 'nonwords': false }], | ||||
|     'spaced-comment': [2, 'always', { 'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ','] }], | ||||
|     'template-curly-spacing': [2, 'never'], | ||||
|     'use-isnan': 2, | ||||
|     'valid-typeof': 2, | ||||
|     'wrap-iife': [2, 'any'], | ||||
|     'yield-star-spacing': [2, 'both'], | ||||
|     'yoda': [2, 'never'], | ||||
|     'prefer-const': 2, | ||||
|     'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0, | ||||
|     'object-curly-spacing': [2, 'always', { objectsInObjects: false }], | ||||
|     'array-bracket-spacing': [2, 'never'], | ||||
|     'vue/jsx-uses-vars': 2 | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -11,7 +11,7 @@ config.output = { | ||||
| }; | ||||
| 
 | ||||
| config.externals = { | ||||
|   vue: 'Vue' | ||||
|   vue: 'vue' | ||||
| }; | ||||
| 
 | ||||
| delete config.devtool; | ||||
|  | ||||
| @ -20,5 +20,7 @@ | ||||
|   "checkbox-group": "./packages/checkbox-group/index.js", | ||||
|   "badge-group": "./packages/badge-group/index.js", | ||||
|   "badge": "./packages/badge/index.js", | ||||
|   "search": "./packages/search/index.js" | ||||
|   "search": "./packages/search/index.js", | ||||
|   "step": "./packages/step/index.js", | ||||
|   "image-preview": "./packages/image-preview/index.js" | ||||
| } | ||||
|  | ||||
							
								
								
									
										10952
									
								
								docs/build/0.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										10952
									
								
								docs/build/0.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							
							
								
								
									
										1
									
								
								docs/build/0.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								docs/build/0.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										9625
									
								
								docs/build/0.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										9625
									
								
								docs/build/0.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							
							
								
								
									
										2
									
								
								docs/build/0.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								docs/build/0.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										199
									
								
								docs/build/1.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										199
									
								
								docs/build/1.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							| @ -1,199 +0,0 @@ | ||||
| webpackJsonp([1],{ | ||||
| 
 | ||||
| /***/ 169: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| 
 | ||||
| /* styles */ | ||||
| __webpack_require__(263) | ||||
| 
 | ||||
| var Component = __webpack_require__(0)( | ||||
|   /* script */ | ||||
|   __webpack_require__(179), | ||||
|   /* template */ | ||||
|   __webpack_require__(237), | ||||
|   /* scopeId */ | ||||
|   null, | ||||
|   /* cssModules */ | ||||
|   null | ||||
| ) | ||||
| 
 | ||||
| module.exports = Component.exports | ||||
| 
 | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 179: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| "use strict"; | ||||
| 
 | ||||
| 
 | ||||
| Object.defineProperty(exports, "__esModule", { | ||||
|   value: true | ||||
| }); | ||||
| 
 | ||||
| var _navConfig = __webpack_require__(7); | ||||
| 
 | ||||
| var _navConfig2 = _interopRequireDefault(_navConfig); | ||||
| 
 | ||||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||||
| 
 | ||||
| exports.default = { | ||||
|   data: function data() { | ||||
|     return { | ||||
|       highlights: [], | ||||
|       navState: [], | ||||
|       data: _navConfig2.default['zh-CN'], | ||||
|       base: '/component' | ||||
|     }; | ||||
|   } | ||||
| }; //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| //
 | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 197: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| exports = module.exports = __webpack_require__(4)(); | ||||
| // imports
 | ||||
| 
 | ||||
| 
 | ||||
| // module
 | ||||
| exports.push([module.i, ".side-nav{width:100%;box-sizing:border-box;padding:40px 20px;background:#f9fafb}.side-nav li{list-style:none}.side-nav ul{padding:0;margin:0;overflow:hidden}.side-nav .nav-item a{font-size:16px;color:#5e6d82;line-height:40px;height:40px;margin:0;padding:0;text-decoration:none;display:block;position:relative;-webkit-transition:all .3s;transition:all .3s}.side-nav .nav-item a.active{color:#20a0ff}.side-nav .nav-item .nav-item a{display:block;height:40px;line-height:40px;font-size:13px;padding-left:24px}.side-nav .nav-item .nav-item a:hover{color:#20a0ff}.side-nav .nav-group__title{font-size:12px;color:#99a9bf;padding-left:8px;line-height:26px;margin-top:10px}", ""]); | ||||
| 
 | ||||
| // exports
 | ||||
| 
 | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 237: | ||||
| /***/ (function(module, exports) { | ||||
| 
 | ||||
| module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h; | ||||
|   return _c('div', { | ||||
|     staticClass: "side-nav" | ||||
|   }, [_c('ul', _vm._l((_vm.data), function(item) { | ||||
|     return _c('li', { | ||||
|       staticClass: "nav-item" | ||||
|     }, [(!item.path) ? _c('a', [_vm._v(_vm._s(item.name))]) : _c('router-link', { | ||||
|       attrs: { | ||||
|         "active-class": "active", | ||||
|         "to": _vm.base + item.path, | ||||
|         "exact": "" | ||||
|       }, | ||||
|       domProps: { | ||||
|         "textContent": _vm._s(item.title || item.name) | ||||
|       } | ||||
|     }), _vm._v(" "), (item.children) ? _c('ul', { | ||||
|       staticClass: "pure-menu-list sub-nav" | ||||
|     }, _vm._l((item.children), function(navItem) { | ||||
|       return _c('li', { | ||||
|         staticClass: "nav-item" | ||||
|       }, [_c('router-link', { | ||||
|         attrs: { | ||||
|           "active-class": "active", | ||||
|           "to": _vm.base + navItem.path | ||||
|         }, | ||||
|         domProps: { | ||||
|           "textContent": _vm._s(navItem.title || navItem.name) | ||||
|         } | ||||
|       })], 1) | ||||
|     })) : _vm._e(), _vm._v(" "), (item.groups) ? _vm._l((item.groups), function(group) { | ||||
|       return _c('div', { | ||||
|         staticClass: "nav-group" | ||||
|       }, [_c('div', { | ||||
|         staticClass: "nav-group__title" | ||||
|       }, [_vm._v(_vm._s(group.groupName))]), _vm._v(" "), _c('ul', { | ||||
|         staticClass: "pure-menu-list" | ||||
|       }, [_vm._l((group.list), function(navItem) { | ||||
|         return [(!navItem.disabled) ? _c('li', { | ||||
|           staticClass: "nav-item" | ||||
|         }, [_c('router-link', { | ||||
|           attrs: { | ||||
|             "active-class": "active", | ||||
|             "to": _vm.base + navItem.path | ||||
|           }, | ||||
|           domProps: { | ||||
|             "textContent": _vm._s(navItem.title) | ||||
|           } | ||||
|         })], 1) : _vm._e()] | ||||
|       })], 2)]) | ||||
|     }) : _vm._e()], 2) | ||||
|   }))]) | ||||
| },staticRenderFns: []} | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 263: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| // style-loader: Adds some css to the DOM by adding a <style> tag
 | ||||
| 
 | ||||
| // load the styles
 | ||||
| var content = __webpack_require__(197); | ||||
| if(typeof content === 'string') content = [[module.i, content, '']]; | ||||
| if(content.locals) module.exports = content.locals; | ||||
| // add the styles to the DOM
 | ||||
| var update = __webpack_require__(14)("1517d9c0", content, true); | ||||
| // Hot Module Replacement
 | ||||
| if(false) { | ||||
|  // When the styles change, update the <style> tags
 | ||||
|  if(!content.locals) { | ||||
|    module.hot.accept("!!../../node_modules/css-loader/index.js?minimize!../../node_modules/vue-loader/lib/style-rewriter.js?id=data-v-0a10052a!../../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./demo-list.vue", function() { | ||||
|      var newContent = require("!!../../node_modules/css-loader/index.js?minimize!../../node_modules/vue-loader/lib/style-rewriter.js?id=data-v-0a10052a!../../node_modules/vue-loader/lib/selector.js?type=styles&index=0!./demo-list.vue"); | ||||
|      if(typeof newContent === 'string') newContent = [[module.id, newContent, '']]; | ||||
|      update(newContent); | ||||
|    }); | ||||
|  } | ||||
|  // When the module is disposed, remove the <style> tags
 | ||||
|  module.hot.dispose(function() { update(); }); | ||||
| } | ||||
| 
 | ||||
| /***/ }) | ||||
| 
 | ||||
| }); | ||||
| //# sourceMappingURL=1.ce826a4b.js.map
 | ||||
							
								
								
									
										1
									
								
								docs/build/1.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								docs/build/1.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										18
									
								
								docs/build/1.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										18
									
								
								docs/build/1.js
									
									
									
									
										vendored
									
									
								
							| @ -1,17 +1,17 @@ | ||||
| webpackJsonp([1],{ | ||||
| 
 | ||||
| /***/ 169: | ||||
| /***/ 194: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| 
 | ||||
| /* styles */ | ||||
| __webpack_require__(263) | ||||
| __webpack_require__(315) | ||||
| 
 | ||||
| var Component = __webpack_require__(0)( | ||||
|   /* script */ | ||||
|   __webpack_require__(179), | ||||
|   __webpack_require__(204), | ||||
|   /* template */ | ||||
|   __webpack_require__(237), | ||||
|   __webpack_require__(279), | ||||
|   /* scopeId */ | ||||
|   null, | ||||
|   /* cssModules */ | ||||
| @ -23,7 +23,7 @@ module.exports = Component.exports | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 179: | ||||
| /***/ 204: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| "use strict"; | ||||
| @ -95,7 +95,7 @@ exports.default = { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 197: | ||||
| /***/ 225: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| exports = module.exports = __webpack_require__(4)(); | ||||
| @ -110,7 +110,7 @@ exports.push([module.i, ".side-nav{width:100%;box-sizing:border-box;padding:40px | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 237: | ||||
| /***/ 279: | ||||
| /***/ (function(module, exports) { | ||||
| 
 | ||||
| module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h; | ||||
| @ -168,13 +168,13 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 263: | ||||
| /***/ 315: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| // style-loader: Adds some css to the DOM by adding a <style> tag
 | ||||
| 
 | ||||
| // load the styles
 | ||||
| var content = __webpack_require__(197); | ||||
| var content = __webpack_require__(225); | ||||
| if(typeof content === 'string') content = [[module.i, content, '']]; | ||||
| if(content.locals) module.exports = content.locals; | ||||
| // add the styles to the DOM
 | ||||
|  | ||||
							
								
								
									
										2
									
								
								docs/build/1.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								docs/build/1.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										10649
									
								
								docs/build/zanui-docs.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										10649
									
								
								docs/build/zanui-docs.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							
							
								
								
									
										1
									
								
								docs/build/zanui-docs.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								docs/build/zanui-docs.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										111
									
								
								docs/build/zanui-docs.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										111
									
								
								docs/build/zanui-docs.js
									
									
									
									
										vendored
									
									
								
							| @ -137,7 +137,7 @@ | ||||
| /******/ 	__webpack_require__.oe = function(err) { console.error(err); throw err; }; | ||||
| /******/ | ||||
| /******/ 	// Load entry module and return exports
 | ||||
| /******/ 	return __webpack_require__(__webpack_require__.s = 178); | ||||
| /******/ 	return __webpack_require__(__webpack_require__.s = 203); | ||||
| /******/ }) | ||||
| /************************************************************************/ | ||||
| /******/ ({ | ||||
| @ -415,7 +415,7 @@ var registerRoute = function registerRoute(navConfig, isExample) { | ||||
|     route.push({ | ||||
|       path: '/component' + page.path, | ||||
|       component: function component(resolve) { | ||||
|         __webpack_require__.e/* require */(0).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [isExample ? __webpack_require__(158)("./examples" + page.path + '.vue') : __webpack_require__(159)("./examples-docs" + page.path + '.md')]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this)).catch(__webpack_require__.oe); | ||||
|         __webpack_require__.e/* require */(0).then(function() { var __WEBPACK_AMD_REQUIRE_ARRAY__ = [isExample ? __webpack_require__(183)("./examples" + page.path + '.vue') : __webpack_require__(184)("./examples-docs" + page.path + '.md')]; (resolve.apply(null, __WEBPACK_AMD_REQUIRE_ARRAY__));}.bind(this)).catch(__webpack_require__.oe); | ||||
|       } | ||||
|     }); | ||||
|   } | ||||
| @ -2953,7 +2953,7 @@ function applyToTag (styleElement, obj) { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 161: | ||||
| /***/ 186: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| "use strict"; | ||||
| @ -2963,7 +2963,7 @@ Object.defineProperty(exports, "__esModule", { | ||||
|   value: true | ||||
| }); | ||||
| 
 | ||||
| __webpack_require__(168); | ||||
| __webpack_require__(193); | ||||
| 
 | ||||
| var _navConfig = __webpack_require__(7); | ||||
| 
 | ||||
| @ -2992,7 +2992,7 @@ exports.default = { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 162: | ||||
| /***/ 187: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| "use strict"; | ||||
| @ -3064,7 +3064,7 @@ exports.default = { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 163: | ||||
| /***/ 188: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| exports = module.exports = __webpack_require__(4)(); | ||||
| @ -3079,7 +3079,7 @@ exports.push([module.i, ".hljs{display:block;overflow-x:auto;padding:.5em;backgr | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 165: | ||||
| /***/ 190: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| exports = module.exports = __webpack_require__(4)(); | ||||
| @ -3094,7 +3094,7 @@ exports.push([module.i, ".side-nav{width:18%;box-sizing:border-box;padding:40px | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 166: | ||||
| /***/ 191: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| exports = module.exports = __webpack_require__(4)(); | ||||
| @ -3109,13 +3109,13 @@ exports.push([module.i, "a,abbr,acronym,address,applet,article,aside,audio,b,big | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 168: | ||||
| /***/ 193: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| // style-loader: Adds some css to the DOM by adding a <style> tag
 | ||||
| 
 | ||||
| // load the styles
 | ||||
| var content = __webpack_require__(163); | ||||
| var content = __webpack_require__(188); | ||||
| if(typeof content === 'string') content = [[module.i, content, '']]; | ||||
| // add the styles to the DOM
 | ||||
| var update = __webpack_require__(27)(content, {}); | ||||
| @ -3136,7 +3136,7 @@ if(false) { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 170: | ||||
| /***/ 195: | ||||
| /***/ (function(module, exports) { | ||||
| 
 | ||||
| module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h; | ||||
| @ -3155,7 +3155,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 171: | ||||
| /***/ 196: | ||||
| /***/ (function(module, exports) { | ||||
| 
 | ||||
| module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h; | ||||
| @ -3213,7 +3213,7 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 172: | ||||
| /***/ 197: | ||||
| /***/ (function(module, exports) { | ||||
| 
 | ||||
| module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h; | ||||
| @ -3231,13 +3231,13 @@ module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 174: | ||||
| /***/ 199: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| // style-loader: Adds some css to the DOM by adding a <style> tag
 | ||||
| 
 | ||||
| // load the styles
 | ||||
| var content = __webpack_require__(165); | ||||
| var content = __webpack_require__(190); | ||||
| if(typeof content === 'string') content = [[module.i, content, '']]; | ||||
| if(content.locals) module.exports = content.locals; | ||||
| // add the styles to the DOM
 | ||||
| @ -3258,13 +3258,13 @@ if(false) { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 175: | ||||
| /***/ 200: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| // style-loader: Adds some css to the DOM by adding a <style> tag
 | ||||
| 
 | ||||
| // load the styles
 | ||||
| var content = __webpack_require__(166); | ||||
| var content = __webpack_require__(191); | ||||
| if(typeof content === 'string') content = [[module.i, content, '']]; | ||||
| if(content.locals) module.exports = content.locals; | ||||
| // add the styles to the DOM
 | ||||
| @ -3285,7 +3285,7 @@ if(false) { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 178: | ||||
| /***/ 203: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| "use strict"; | ||||
| @ -3299,7 +3299,7 @@ var _vueRouter = __webpack_require__(13); | ||||
| 
 | ||||
| var _vueRouter2 = _interopRequireDefault(_vueRouter); | ||||
| 
 | ||||
| var _ExamplesDocsApp = __webpack_require__(48); | ||||
| var _ExamplesDocsApp = __webpack_require__(49); | ||||
| 
 | ||||
| var _ExamplesDocsApp2 = _interopRequireDefault(_ExamplesDocsApp); | ||||
| 
 | ||||
| @ -3311,11 +3311,11 @@ var _router = __webpack_require__(12); | ||||
| 
 | ||||
| var _router2 = _interopRequireDefault(_router); | ||||
| 
 | ||||
| var _sideNav = __webpack_require__(50); | ||||
| var _sideNav = __webpack_require__(51); | ||||
| 
 | ||||
| var _sideNav2 = _interopRequireDefault(_sideNav); | ||||
| 
 | ||||
| var _mobile = __webpack_require__(49); | ||||
| var _mobile = __webpack_require__(50); | ||||
| 
 | ||||
| var _mobile2 = _interopRequireDefault(_mobile); | ||||
| 
 | ||||
| @ -10450,37 +10450,18 @@ module.exports = function() { | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 48: | ||||
| /***/ 49: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| 
 | ||||
| /* styles */ | ||||
| __webpack_require__(175) | ||||
| __webpack_require__(200) | ||||
| 
 | ||||
| var Component = __webpack_require__(0)( | ||||
|   /* script */ | ||||
|   __webpack_require__(161), | ||||
|   __webpack_require__(186), | ||||
|   /* template */ | ||||
|   __webpack_require__(172), | ||||
|   /* scopeId */ | ||||
|   null, | ||||
|   /* cssModules */ | ||||
|   null | ||||
| ) | ||||
| 
 | ||||
| module.exports = Component.exports | ||||
| 
 | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 49: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| var Component = __webpack_require__(0)( | ||||
|   /* script */ | ||||
|   null, | ||||
|   /* template */ | ||||
|   __webpack_require__(170), | ||||
|   __webpack_require__(197), | ||||
|   /* scopeId */ | ||||
|   null, | ||||
|   /* cssModules */ | ||||
| @ -10495,15 +10476,34 @@ module.exports = Component.exports | ||||
| /***/ 50: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| var Component = __webpack_require__(0)( | ||||
|   /* script */ | ||||
|   null, | ||||
|   /* template */ | ||||
|   __webpack_require__(195), | ||||
|   /* scopeId */ | ||||
|   null, | ||||
|   /* cssModules */ | ||||
|   null | ||||
| ) | ||||
| 
 | ||||
| module.exports = Component.exports | ||||
| 
 | ||||
| 
 | ||||
| /***/ }), | ||||
| 
 | ||||
| /***/ 51: | ||||
| /***/ (function(module, exports, __webpack_require__) { | ||||
| 
 | ||||
| 
 | ||||
| /* styles */ | ||||
| __webpack_require__(174) | ||||
| __webpack_require__(199) | ||||
| 
 | ||||
| var Component = __webpack_require__(0)( | ||||
|   /* script */ | ||||
|   __webpack_require__(162), | ||||
|   __webpack_require__(187), | ||||
|   /* template */ | ||||
|   __webpack_require__(171), | ||||
|   __webpack_require__(196), | ||||
|   /* scopeId */ | ||||
|   null, | ||||
|   /* cssModules */ | ||||
| @ -10520,6 +10520,23 @@ module.exports = Component.exports | ||||
| 
 | ||||
| module.exports = { | ||||
| 	"zh-CN": [ | ||||
| 		{ | ||||
| 			"name": "开发指南", | ||||
| 			"groups": [ | ||||
| 				{ | ||||
| 					"list": [ | ||||
| 						{ | ||||
| 							"path": "/install", | ||||
| 							"title": "安装" | ||||
| 						}, | ||||
| 						{ | ||||
| 							"path": "/quickstart", | ||||
| 							"title": "快速上手" | ||||
| 						} | ||||
| 					] | ||||
| 				} | ||||
| 			] | ||||
| 		}, | ||||
| 		{ | ||||
| 			"name": "ZanUI组件", | ||||
| 			"groups": [ | ||||
|  | ||||
							
								
								
									
										2
									
								
								docs/build/zanui-docs.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								docs/build/zanui-docs.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										15284
									
								
								docs/build/zanui-examples.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										15284
									
								
								docs/build/zanui-examples.ce826a4b.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										1
									
								
								docs/build/zanui-examples.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1
									
								
								docs/build/zanui-examples.ce826a4b.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										1968
									
								
								docs/build/zanui-examples.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										1968
									
								
								docs/build/zanui-examples.js
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										2
									
								
								docs/build/zanui-examples.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								docs/build/zanui-examples.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							
							
								
								
									
										3
									
								
								docs/examples-docs/image-pewview.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										3
									
								
								docs/examples-docs/image-pewview.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,3 @@ | ||||
| ## ImagePreview 图片预览 | ||||
| 
 | ||||
| 
 | ||||
							
								
								
									
										7
									
								
								docs/examples-docs/install.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										7
									
								
								docs/examples-docs/install.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,7 @@ | ||||
| ## 安装 | ||||
| 
 | ||||
| ### ynpm安装 | ||||
| 
 | ||||
| ``` | ||||
| npm i @youzan/zanui-vue -S | ||||
| ``` | ||||
| @ -6,9 +6,41 @@ l## Switch组件 | ||||
| <template> | ||||
|   <div class="page-loading"> | ||||
|     <h1 class="page-title">Loading</h1> | ||||
|     <h2 class="page-sub-title">Loading展示</h2> | ||||
|     <div class="page-loading__example1"> | ||||
|       <zan-loading class="some-customized-class" style="padding-top: 50px; text-align: center;"></zan-loading> | ||||
|     <h2 class="page-sub-title">渐变深色spinner</h2> | ||||
|     <div class="page-loading__example"> | ||||
|       <zan-loading class="some-customized-class"></zan-loading> | ||||
|     </div> | ||||
|     <h2 class="page-sub-title">渐变浅色spinner</h2> | ||||
|     <div class="page-loading__example page-loading__example--with-bg"> | ||||
|       <zan-loading class="some-customized-class" :color="'white'"></zan-loading> | ||||
|     </div> | ||||
|     <h2 class="page-sub-title">单色spinner</h2> | ||||
|     <div class="page-loading__example"> | ||||
|       <zan-loading class="some-customized-class" :type="'circle'" :color="'white'"></zan-loading> | ||||
|     </div> | ||||
|     <h2 class="page-sub-title">单色spinner</h2> | ||||
|     <div class="page-loading__example"> | ||||
|       <zan-loading class="some-customized-class" :type="'circle'" :color="'black'"></zan-loading> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| 
 | ||||
| <style> | ||||
| .page-loading__example{ | ||||
|   width: 30px; | ||||
|   height: 30px; | ||||
|   padding: 20px; | ||||
|   margin: auto; | ||||
|   border-radius: 5px; | ||||
|   border: 1px solid transparent; | ||||
| } | ||||
| 
 | ||||
| .page-loading__example--with-bg { | ||||
|   background-color: rgba(0, 0, 0, 0.5); | ||||
| } | ||||
| 
 | ||||
| .page-loading { | ||||
|   padding: 0 20px; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										23
									
								
								docs/examples-docs/quickstart.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										23
									
								
								docs/examples-docs/quickstart.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,23 @@ | ||||
| ## 快速上手 | ||||
| 
 | ||||
| ### 完整引入 | ||||
| 
 | ||||
| ``` | ||||
| import Vue from 'vue'; | ||||
| import ZanUI from '@youzan/zanui-vue'; | ||||
| import '@youzan/zanui-vue/lib/zanui-css/index.css'; | ||||
| 
 | ||||
| Vue.use(ZanUI); | ||||
| ``` | ||||
| 
 | ||||
| ### 按需引入 | ||||
| 
 | ||||
| ``` | ||||
| import Vue from 'vue'; | ||||
| import { Button, Cell } from '@youzan/zanui-vue'; | ||||
| import '@youzan/zanui-vue/lib/zanui-css/button.css'; | ||||
| import '@youzan/zanui-vue/lib/zanui-css/cell.css'; | ||||
| 
 | ||||
| Vue.component(Button.name, Button); | ||||
| Vue.component(Cell.name, Cell); | ||||
| ``` | ||||
| @ -1,4 +1,57 @@ | ||||
| ## Steps 步骤条 | ||||
| 
 | ||||
| ### 基础用法 | ||||
| 
 | ||||
| ```html | ||||
| <zan-steps :active="active" icon="certificate" icon-class="steps-success" title="等待商家发货" description="等待商家发货等待商家发货等待商家发货等待商家发货等待商家发货"> | ||||
|   <zan-step>买家下单</zan-step> | ||||
|   <zan-step>商家接单</zan-step> | ||||
|   <zan-step>买家提货</zan-step> | ||||
|   <zan-step>交易完成</zan-step> | ||||
| </zan-steps> | ||||
| 
 | ||||
| <script> | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       active: 0 | ||||
|     }; | ||||
|   }, | ||||
| 
 | ||||
|   methods: { | ||||
|     nextStep() { | ||||
|       if (++this.active > 3) this.active = 0; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| ``` | ||||
| 
 | ||||
| ### 只显示步骤条 | ||||
| 
 | ||||
| ```html | ||||
| <zan-steps :active="active"> | ||||
|   <zan-step>买家下单</zan-step> | ||||
|   <zan-step>商家接单</zan-step> | ||||
|   <zan-step>买家提货</zan-step> | ||||
|   <zan-step>交易完成</zan-step> | ||||
| </zan-steps> | ||||
| ``` | ||||
| 
 | ||||
| 
 | ||||
| ### Steps API | ||||
| 
 | ||||
| | 参数       | 说明      | 类型       | 默认值       | 可选值       | | ||||
| |-----------|-----------|-----------|-------------|-------------| | ||||
| | active | 当前激活的步骤,从0开始 | Number  | ''          | ''          | | ||||
| | icon | 当前步骤的icon | string  | ''          | ''          | | ||||
| | iconClass | 当前步骤栏为icon添加的类 | string  | ''          | ''          | | ||||
| | title | 当前步骤从标题 | string  | ''          | ''          | | ||||
| | description | 当前步骤描述 | string  | ''          | ''          | | ||||
| 
 | ||||
| ### Steps Slot | ||||
| 
 | ||||
| | 名称       | 说明      | | ||||
| |-----------|-----------| | ||||
| | message-extra | 状态栏添加额外的元素 | | ||||
| 
 | ||||
|  | ||||
							
								
								
									
										5
									
								
								docs/examples/image-pewview.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								docs/examples/image-pewview.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,5 @@ | ||||
| <template> | ||||
|   <div class="page-image-pewview"> | ||||
|     <h1 class="page-title">Image Preview</h1> | ||||
|   </div> | ||||
| </template> | ||||
| @ -1,9 +1,41 @@ | ||||
| <template> | ||||
|   <div class="page-loading"> | ||||
|     <h1 class="page-title">Loading</h1> | ||||
|     <h2 class="page-sub-title">Loading展示</h2> | ||||
|     <div class="page-loading__example1"> | ||||
|       <zan-loading class="some-customized-class" style="padding-top: 50px; text-align: center;"></zan-loading> | ||||
|     <h2 class="page-sub-title">渐变深色spinner</h2> | ||||
|     <div class="page-loading__example"> | ||||
|       <zan-loading class="some-customized-class"></zan-loading> | ||||
|     </div> | ||||
|     <h2 class="page-sub-title">渐变浅色spinner</h2> | ||||
|     <div class="page-loading__example page-loading__example--with-bg"> | ||||
|       <zan-loading class="some-customized-class" :color="'white'"></zan-loading> | ||||
|     </div> | ||||
|     <h2 class="page-sub-title">单色spinner</h2> | ||||
|     <div class="page-loading__example"> | ||||
|       <zan-loading class="some-customized-class" :type="'circle'" :color="'white'"></zan-loading> | ||||
|     </div> | ||||
|     <h2 class="page-sub-title">单色spinner</h2> | ||||
|     <div class="page-loading__example"> | ||||
|       <zan-loading class="some-customized-class" :type="'circle'" :color="'black'"></zan-loading> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| 
 | ||||
| <style> | ||||
| .page-loading__example{ | ||||
|   width: 30px; | ||||
|   height: 30px; | ||||
|   padding: 20px; | ||||
|   margin: auto; | ||||
|   border-radius: 5px; | ||||
|   border: 1px solid transparent; | ||||
| } | ||||
| 
 | ||||
| .page-loading__example--with-bg { | ||||
|   background-color: rgba(0, 0, 0, 0.5); | ||||
| } | ||||
| 
 | ||||
| .page-loading { | ||||
|   padding: 0 20px; | ||||
| } | ||||
| </style> | ||||
|  | ||||
							
								
								
									
										54
									
								
								docs/examples/steps.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										54
									
								
								docs/examples/steps.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,54 @@ | ||||
| <template> | ||||
|   <div class="page-steps"> | ||||
|     <h1 class="page-title">Steps</h1> | ||||
| 
 | ||||
|     <h2 class="page-sub-title">基础用法</h2> | ||||
|     <zan-steps :active="active" icon="certificate" icon-class="steps-success" title="等待商家发货" description="等待商家发货等待商家发货等待商家发货等待商家发货等待商家发货"> | ||||
|       <zan-step>买家下单</zan-step> | ||||
|       <zan-step>商家接单</zan-step> | ||||
|       <zan-step>买家提货</zan-step> | ||||
|       <zan-step>交易完成</zan-step> | ||||
|     </zan-steps> | ||||
|     <zan-button @click="nextStep">下一步</zan-button> | ||||
| 
 | ||||
|     <h2 class="page-sub-title">只显示步骤条</h2> | ||||
|     <zan-steps :active="active"> | ||||
|       <zan-step>买家下单</zan-step> | ||||
|       <zan-step>商家接单</zan-step> | ||||
|       <zan-step>买家提货</zan-step> | ||||
|       <zan-step>交易完成</zan-step> | ||||
|     </zan-steps> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       active: 0 | ||||
|     }; | ||||
|   }, | ||||
| 
 | ||||
|   methods: { | ||||
|     nextStep() { | ||||
|       if (++this.active > 3) this.active = 0; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| 
 | ||||
| <style> | ||||
| .steps-success { | ||||
|   color: #06bf04; | ||||
| } | ||||
| 
 | ||||
| .page-steps { | ||||
|   .page-sub-title { | ||||
|     padding: 20px 15px; | ||||
|   } | ||||
| 
 | ||||
|   .zan-button { | ||||
|     margin-left: 15px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @ -38,7 +38,6 @@ router.afterEach(route => { | ||||
|     Vue.nextTick(() => { | ||||
|       document.body.scrollTop = indexScrollTop; | ||||
|     }); | ||||
| 
 | ||||
|   } | ||||
| }); | ||||
| 
 | ||||
|  | ||||
| @ -1,5 +1,22 @@ | ||||
| { | ||||
|   "zh-CN": [ | ||||
|     { | ||||
|       "name": "开发指南", | ||||
|       "groups": [ | ||||
|         { | ||||
|           "list": [ | ||||
|             { | ||||
|               "path": "/install", | ||||
|               "title": "安装" | ||||
|             }, | ||||
|             { | ||||
|               "path": "/quickstart", | ||||
|               "title": "快速上手" | ||||
|             } | ||||
|           ] | ||||
|         } | ||||
|       ] | ||||
|     }, | ||||
|     { | ||||
|       "name": "ZanUI组件", | ||||
|       "groups": [ | ||||
| @ -113,8 +130,8 @@ | ||||
|               "title": "Waterfall" | ||||
|             }, | ||||
|             { | ||||
|               "path": "/img-preview", | ||||
|               "title": "Img Preview" | ||||
|               "path": "/image-preview", | ||||
|               "title": "ImagePreview 图片预览" | ||||
|             } | ||||
|           ] | ||||
|         } | ||||
|  | ||||
| @ -1,6 +1,6 @@ | ||||
| { | ||||
|   "name": "@youzan/zanui-vue", | ||||
|   "version": "0.0.7", | ||||
|   "version": "0.0.13", | ||||
|   "description": "有赞vue wap组件库", | ||||
|   "main": "lib/zanui.js", | ||||
|   "style": "lib/zanui-css/index.css", | ||||
| @ -11,7 +11,7 @@ | ||||
|   ], | ||||
|   "scripts": { | ||||
|     "bootstrap": "npm i --registry=http://registry.npm.qima-inc.com", | ||||
|     "dev": "npm run build:file && webpack-dev-server --port 8282 --inline --hot --config build/webpack.config.js", | ||||
|     "dev": "npm run build:file && webpack-dev-server --inline --hot --config build/webpack.config.js", | ||||
|     "build:file": "node build/bin/build-entry.js", | ||||
|     "build:utils": "cross-env BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js", | ||||
|     "build:zanui-css": "gulp build --gulpfile packages/zanui-css/gulpfile.js && cp-cli packages/zanui-css/lib lib/zanui-css", | ||||
| @ -67,6 +67,7 @@ | ||||
|     "eslint-plugin-html": "^1.3.0", | ||||
|     "eslint-plugin-promise": "^1.0.8", | ||||
|     "eslint-plugin-standard": "^1.3.2", | ||||
|     "eslint-plugin-vue": "^2.0.1", | ||||
|     "extract-text-webpack-plugin": "^2.0.0-beta.5", | ||||
|     "file-loader": "^0.9.0", | ||||
|     "file-save": "^0.2.0", | ||||
|  | ||||
| @ -61,9 +61,9 @@ export default { | ||||
|           'zan-button--' + type, | ||||
|           'zan-button--' + size, | ||||
|           { | ||||
|             'is-disabled': disabled, | ||||
|             'is-loading': loading, | ||||
|             'is-block': block | ||||
|             'z-button--disabled': disabled, | ||||
|             'z-button--loading': loading, | ||||
|             'z-button--block': block | ||||
|           } | ||||
|         ]} | ||||
|         onClick={this.handleClick} | ||||
|  | ||||
| @ -11,7 +11,7 @@ | ||||
|     </div> | ||||
|     <div class="zan-cell__value" :class="{ | ||||
|       'is-link': isLink, | ||||
|       'is-alone': !title && !label | ||||
|       'is-alone': !this.$slots.title && !title && !label | ||||
|     }"> | ||||
|       <slot> | ||||
|         <span v-text="value"></span> | ||||
|  | ||||
							
								
								
									
										8
									
								
								packages/image-preview/CHANGELOG.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										8
									
								
								packages/image-preview/CHANGELOG.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,8 @@ | ||||
| ## 0.0.2 (2017-01-20) | ||||
| 
 | ||||
| * 改了bug A | ||||
| * 加了功能B | ||||
| 
 | ||||
| ## 0.0.1 (2017-01-10) | ||||
| 
 | ||||
| * 第一版 | ||||
							
								
								
									
										26
									
								
								packages/image-preview/README.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										26
									
								
								packages/image-preview/README.md
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,26 @@ | ||||
| # @youzan/<%= name %> | ||||
| 
 | ||||
| !!! 请在此处填写你的文档最简单描述 !!! | ||||
| 
 | ||||
| [![version][version-image]][download-url] | ||||
| [![download][download-image]][download-url] | ||||
| 
 | ||||
| [version-image]: http://npm.qima-inc.com/badge/v/@youzan/<%= name %>.svg?style=flat-square | ||||
| [download-image]: http://npm.qima-inc.com/badge/d/@youzan/<%= name %>.svg?style=flat-square | ||||
| [download-url]: http://npm.qima-inc.com/package/@youzan/<%= name %> | ||||
| 
 | ||||
| ## Demo | ||||
| 
 | ||||
| ## Usage | ||||
| 
 | ||||
| ## API | ||||
| 
 | ||||
| | 参数       | 说明      | 类型       | 默认值       | 可选值       | | ||||
| |-----------|-----------|-----------|-------------|-------------| | ||||
| | className | 自定义额外类名 | string  | ''          | ''          | | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| 
 | ||||
| ## License | ||||
| [MIT](https://opensource.org/licenses/MIT) | ||||
							
								
								
									
										3
									
								
								packages/image-preview/index.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										3
									
								
								packages/image-preview/index.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,3 @@ | ||||
| import ImagePreview from './src/image-preview'; | ||||
| 
 | ||||
| export default ImagePreview; | ||||
							
								
								
									
										10
									
								
								packages/image-preview/package.json
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										10
									
								
								packages/image-preview/package.json
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,10 @@ | ||||
| { | ||||
|   "name": "@youzan/zan-image-pewview", | ||||
|   "version": "0.0.1", | ||||
|   "description": "image preview component", | ||||
|   "main": "./index.js", | ||||
|   "author": "zhangmin <zhangmin@youzan.com>", | ||||
|   "license": "MIT", | ||||
|   "devDependencies": {}, | ||||
|   "dependencies": {} | ||||
| } | ||||
							
								
								
									
										18
									
								
								packages/image-preview/src/image-preview.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										18
									
								
								packages/image-preview/src/image-preview.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,18 @@ | ||||
| <template> | ||||
|   <div> | ||||
|     <h2>author: {{ author }}</h2> | ||||
|     <div>Hello {{ name }}</div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'Sample', | ||||
|     props: ['author'], | ||||
|     data() { | ||||
|       return { | ||||
|         name: 'World' | ||||
|       }; | ||||
|     } | ||||
|   }; | ||||
| </script> | ||||
| @ -1,11 +1,30 @@ | ||||
| <template> | ||||
|   <div class="zan-loading"> | ||||
|   	<span class="zan-spinner"></span> | ||||
|     <span class="zan-loading__spinner" :class="['zan-loading__spinner--' + type, 'zan-loading__spinner--' + color]"></span> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
| const VALID_TYPES = ['gradient-circle', 'circle']; | ||||
| const VALID_COLORS = ['black', 'white']; | ||||
| export default { | ||||
|   name: 'zan-loading' | ||||
|   name: 'zan-loading', | ||||
| 
 | ||||
|   props: { | ||||
|     type: { | ||||
|       type: String, | ||||
|       default: 'gradient-circle', | ||||
|       validate(value) { | ||||
|         return VALID_TYPES.indexOf(value) > -1; | ||||
|       } | ||||
|     }, | ||||
|     color: { | ||||
|       type: String, | ||||
|       default: 'black', | ||||
|       validate(value) { | ||||
|         return VALID_COLORS.indexOf(value) > -1; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
|  | ||||
							
								
								
									
										3
									
								
								packages/step/index.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										3
									
								
								packages/step/index.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,3 @@ | ||||
| import Step from 'packages/steps/src/step'; | ||||
| 
 | ||||
| export default Step; | ||||
							
								
								
									
										37
									
								
								packages/steps/src/step.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										37
									
								
								packages/steps/src/step.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,37 @@ | ||||
| <template> | ||||
|   <div class="zan-step" :class="`zan-step--${status}`"> | ||||
|     <div class="zan-step__circle-container"> | ||||
|       <i class="zan-step__circle" v-if="status !== 'process'"></i> | ||||
|       <i class="zan-icon zan-icon-checked" v-else></i> | ||||
|     </div> | ||||
|     <p class="zan-step__title"> | ||||
|       <slot></slot> | ||||
|     </p> | ||||
|     <div class="zan-step__line"></div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
| export default { | ||||
|   name: 'zan-step', | ||||
| 
 | ||||
|   beforeCreate() { | ||||
|     this.$parent.steps.push(this); | ||||
|   }, | ||||
| 
 | ||||
|   computed: { | ||||
|     status() { | ||||
|       let index = this.$parent.steps.indexOf(this); | ||||
|       let active = this.$parent.active; | ||||
| 
 | ||||
|       if (index === -1) { | ||||
|         return ''; | ||||
|       } else if (index < active) { | ||||
|         return 'finish'; | ||||
|       } else if (index === active) { | ||||
|         return 'process'; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
| @ -1,18 +1,51 @@ | ||||
| <template> | ||||
|   <div> | ||||
|     <h2>author: {{ author }}</h2> | ||||
|     <div>Hello {{ name }}</div> | ||||
|   <div class="zan-steps" :class="`zan-steps--${steps.length}`"> | ||||
|     <div class="zan-steps__status" v-if="icon"> | ||||
|       <i class="zan-icon zan-steps__icon" :class="computedIconClass"></i> | ||||
|       <div class="zan-steps__message"> | ||||
|         <div class="zan-steps__message-wrapper"> | ||||
|           <h4 class="zan-steps__title" v-text="title"></h4> | ||||
|           <p class="zan-steps__desc" v-text="description"></p> | ||||
|         </div> | ||||
|       </div> | ||||
|       <slot name="message-extra"> | ||||
|       </slot> | ||||
|     </div> | ||||
|     <div class="zan-steps__items"> | ||||
|       <slot></slot> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
|   export default { | ||||
|     name: 'Sample', | ||||
|     props: ['author'], | ||||
|     data() { | ||||
|       return { | ||||
|         name: 'World' | ||||
|       }; | ||||
| export default { | ||||
|   name: 'zan-steps', | ||||
| 
 | ||||
|   props: { | ||||
|     active: Number, | ||||
|     icon: String, | ||||
|     iconClass: { | ||||
|       type: String, | ||||
|       default: '' | ||||
|     }, | ||||
|     title: String, | ||||
|     description: String | ||||
|   }, | ||||
| 
 | ||||
|   computed: { | ||||
|     computedIconClass() { | ||||
|       let iconName = `zan-icon-${this.icon}`; | ||||
|       let result = this.iconClass.split(' '); | ||||
|       result.push(iconName); | ||||
| 
 | ||||
|       return result; | ||||
|     } | ||||
|   }; | ||||
|   }, | ||||
| 
 | ||||
|   data() { | ||||
|     return { | ||||
|       steps: [] | ||||
|     }; | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
|  | ||||
| @ -1,8 +1,9 @@ | ||||
| <template> | ||||
|   <div class="zan-switch" :class="switchState" @click="toggleState"> | ||||
|     <div class="zan-switch__node" :class="switchState"> | ||||
|   <div class="zan-switch" :class="switchStates" @click="toggleState"> | ||||
|     <div class="zan-switch__node"> | ||||
|       <zan-loading v-if="loading" class="zan-switch__loading"></zan-loading> | ||||
|     </div> | ||||
|     <div class="zan-switch__bg"></div> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| @ -40,13 +41,11 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     switchState: function() { | ||||
|       let switchState = this.checked ? ['is-on'] : ['is-off']; | ||||
|     switchStates: function() { | ||||
|       let switchStates = ['zan-switch--' + (this.checked ? 'on' : 'off'), | ||||
|         'zan-switch--' + (this.disabled ? 'disabled' : '')]; | ||||
| 
 | ||||
|       if (this.disabled) switchState.push('is-disabled'); | ||||
|       if (this.loading) switchState.push('is-loading'); | ||||
| 
 | ||||
|       return switchState; | ||||
|       return switchStates; | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|  | ||||
| @ -1,6 +1,6 @@ | ||||
| { | ||||
|   "name": "@youzan/zanui-css", | ||||
|   "version": "0.0.7", | ||||
|   "version": "0.0.13", | ||||
|   "description": "zanui css.", | ||||
|   "main": "lib/index.css", | ||||
|   "style": "lib/index.css", | ||||
|  | ||||
| @ -75,13 +75,13 @@ | ||||
|       font-size: 10px; | ||||
|     } | ||||
| 
 | ||||
|     @when disabled { | ||||
|     @m disabled { | ||||
|       color: $button-disabled-color; | ||||
|       background-color: $button-disabled-background-color; | ||||
|       border: 1px solid $button-disabled-border-color; | ||||
|     } | ||||
| 
 | ||||
|     @when block { | ||||
|     @m block { | ||||
|       display: block; | ||||
|     } | ||||
|   } | ||||
|  | ||||
| @ -2,6 +2,7 @@ | ||||
|   display: inline-block; | ||||
|   box-sizing: border-box; | ||||
|   padding-right: 10px; | ||||
|   vertical-align: middle; | ||||
|   &:last-child { | ||||
|     padding-right: 0; | ||||
|   } | ||||
|  | ||||
| @ -5,6 +5,7 @@ | ||||
|   @b cell-group { | ||||
|     padding-left: 10px; | ||||
|     position: relative; | ||||
|     background-color: #fff; | ||||
| 
 | ||||
|     &::after { | ||||
|       @mixin border-retina (top, bottom); | ||||
|  | ||||
| @ -63,4 +63,4 @@ | ||||
| .zan-icon-sign:before { content: '\e80d'; } /* '' */ | ||||
| .zan-icon-store:before { content: '\e80e'; } /* '' */ | ||||
| .zan-icon-topay:before { content: '\e80f'; } /* '' */ | ||||
| .zan-icon-tosend:before { content: '\e810'; } /* '' */ | ||||
| .zan-icon-tosend:before { content: '\e810'; } /* '' */ | ||||
|  | ||||
| @ -3,16 +3,19 @@ | ||||
|     -webkit-transform: rotate(0deg); | ||||
|             transform: rotate(0deg); | ||||
|   } | ||||
| 
 | ||||
|   to { | ||||
|     -webkit-transform: rotate(360deg); | ||||
|             transform: rotate(360deg); | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| @keyframes loading { | ||||
|   from { | ||||
|     -webkit-transform: rotate(0deg); | ||||
|             transform: rotate(0deg); | ||||
|   } | ||||
| 
 | ||||
|   to { | ||||
|     -webkit-transform: rotate(360deg); | ||||
|             transform: rotate(360deg); | ||||
| @ -25,17 +28,41 @@ | ||||
|     height: 30px; | ||||
|     line-height: 0; | ||||
|     font-size: 0; | ||||
|   } | ||||
|    | ||||
|     @e spinner {  | ||||
|       display: inline-block; | ||||
|       height: 100%; | ||||
|       width: 100%; | ||||
|        | ||||
|       -webkit-animation: loading 0.8s linear; | ||||
|       -webkit-animation-iteration-count: infinite; | ||||
|       animation: loading 0.8s linear; | ||||
|       animation-iteration-count: infinite; | ||||
| 
 | ||||
|   @b spinner {  | ||||
|     display: inline-block; | ||||
|     height: 100%; | ||||
|     width: 100%; | ||||
|     background: url('data:image/png;base64,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'); | ||||
|     background-size: contain; | ||||
|     -webkit-animation: loading 0.8s linear; | ||||
|     -webkit-animation-iteration-count: infinite; | ||||
|     animation: loading 0.8s linear; | ||||
|     animation-iteration-count: infinite; | ||||
|       @m circle { | ||||
|         border-radius: 100%; | ||||
|         border: 3px solid transparent; | ||||
|         box-sizing: border-box; | ||||
|         &.zan-loading__spinner--black { | ||||
|           border-color: $c-gray; | ||||
|           border-top-color: $c-gray-darker; | ||||
|         } | ||||
|         &.zan-loading__spinner--white { | ||||
|           border-color: rgba(0, 0, 0, .5); | ||||
|           border-top-color: transparent; | ||||
|         } | ||||
|       } | ||||
| 
 | ||||
|       @m gradient-circle { | ||||
|         &.zan-loading__spinner--black { | ||||
|           background: url('data:image/png;base64,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'); | ||||
|           background-size: contain; | ||||
|         } | ||||
|         &.zan-loading__spinner--white { | ||||
|           background: url('data:image/png;base64,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'); | ||||
|           background-size: contain; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -1,5 +1,149 @@ | ||||
| @import "./common/var.css"; | ||||
| @import "./mixins/ellipsis.css"; | ||||
| 
 | ||||
| @component-namespace zan { | ||||
|   @b steps { | ||||
|     color: red; | ||||
|     overflow: hidden; | ||||
|     padding: 0 10px; | ||||
| 
 | ||||
|     @m 4 { | ||||
|       .zan-step { | ||||
|         width: 33.2%; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     @m 3 { | ||||
|       .zan-step { | ||||
|         width: 50%; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     @e icon { | ||||
|       font-size: 40px; | ||||
|       line-height: 1; | ||||
|       float: left; | ||||
|       margin-right: 10px; | ||||
|     } | ||||
| 
 | ||||
|     @e message { | ||||
|       display: table; | ||||
|       height: 40px; | ||||
|       margin: 15px 0; | ||||
| 
 | ||||
|       .zan-steps__message-wrapper { | ||||
|         display: table-cell; | ||||
|         vertical-align: middle; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     @e title { | ||||
|       font-size: 14px; | ||||
|       color: $c-black; | ||||
|     } | ||||
| 
 | ||||
|     @e desc { | ||||
|       font-size: 12px; | ||||
|       line-height: 1.5; | ||||
|       color: $c-gray-dark; | ||||
|       max-height: 18px; | ||||
|       @mixin multi-ellipsis 1; | ||||
|     } | ||||
| 
 | ||||
|     @e items { | ||||
|       margin: 0 0 10px; | ||||
|       overflow: hidden; | ||||
|       padding-bottom: 20px; | ||||
|     } | ||||
|   } | ||||
| 
 | ||||
|   @b step { | ||||
|     font-size: 14px; | ||||
|     float: left; | ||||
|     position: relative; | ||||
|     color: $c-gray-dark; | ||||
| 
 | ||||
|     @m finish { | ||||
|       color: $c-black; | ||||
| 
 | ||||
|       .zan-step__circle, | ||||
|       .zan-step__line { | ||||
|         background-color: $c-green; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     @m process { | ||||
|       color: $c-black; | ||||
| 
 | ||||
|       .zan-step__circle-container { | ||||
|         top: 24px; | ||||
|       } | ||||
| 
 | ||||
|       .zan-icon { | ||||
|         font-size: 12px; | ||||
|         color: $c-green; | ||||
|         line-height: 1; | ||||
|         display: block; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     &:first-child { | ||||
|       .zan-step__title { | ||||
|         transform: none; | ||||
|         margin-left: 0; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     &:last-child { | ||||
|       position: absolute; | ||||
|       right: 10px; | ||||
|       width: auto; | ||||
| 
 | ||||
|       .zan-step__title { | ||||
|         transform: none; | ||||
|         margin-left: 0; | ||||
|       } | ||||
| 
 | ||||
|       .zan-step__circle-container { | ||||
|         left: auto; | ||||
|         right: -6px; | ||||
|       } | ||||
| 
 | ||||
|       .zan-step__line { | ||||
|         width: 0; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     .zan-step__circle-container { | ||||
|       position: absolute; | ||||
|       top: 28px; | ||||
|       left: -8px; | ||||
|       padding: 0 8px; | ||||
|       background-color: #fff; | ||||
|       z-index: 1; | ||||
|     } | ||||
| 
 | ||||
|     @e circle { | ||||
|       display: block; | ||||
|       width: 5px; | ||||
|       height: 5px; | ||||
|       background-color: #888; | ||||
|       border-radius: 50%; | ||||
|     } | ||||
| 
 | ||||
|     @e title { | ||||
|       font-size: 12px; | ||||
|       transform: translate3d(-50%, 0, 0); | ||||
|       display: inline-block; | ||||
|       margin-left: 3px; | ||||
|     } | ||||
| 
 | ||||
|     @e line { | ||||
|       position: absolute; | ||||
|       left: 0px; | ||||
|       top: 30px; | ||||
|       width: 100%; | ||||
|       height: 1px; | ||||
|       background-color: $c-gray-light; | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -1,28 +1,32 @@ | ||||
| @import "./mixins/border_retina.css"; | ||||
| 
 | ||||
| @component-namespace zan { | ||||
|   @b switch {  | ||||
|     height: 29px; | ||||
|     width: 49px; | ||||
|     height: 31px; | ||||
|     width: 51px; | ||||
|     display: inline-block; | ||||
|     border-radius: 16px; | ||||
|     position: relative; | ||||
|     border: 1px solid; | ||||
|     background: #fff; | ||||
|     border-radius: 16px; | ||||
|     &::after{ | ||||
|       @mixin border-retina (top, right, bottom, left), rgba(0, 0, 0, .1); | ||||
|       border-width: 3px; | ||||
|       border-radius: 32px; | ||||
|     } | ||||
| 
 | ||||
|     @e node { | ||||
|       width: 27px; | ||||
|       height: 27px; | ||||
|       border-radius: 100%; | ||||
|       width: 28px; | ||||
|       height: 28px; | ||||
|       border-radius: 13.5px; | ||||
|       background-color: #fff; | ||||
|       border: .5px solid rgba(0, 0, 0, .1); | ||||
|       position: absolute; | ||||
|       box-shadow: 0 3px 1px 0 rgba(0, 0, 0, .05), 0 2px 2px 0 rgba(0, 0, 0, .1), 0 3px 3px 0 rgba(0, 0, 0, .05); | ||||
|       @when on { | ||||
|         left: 20px; | ||||
|         transition: all .5s ease-in-out; | ||||
|       } | ||||
| 
 | ||||
|       @when off { | ||||
|         left: 0; | ||||
|         transition: all .5s ease-in-out; | ||||
|       left: 1px; | ||||
|       top: 1px; | ||||
|       z-index: 2; | ||||
|       &::after { | ||||
|         @mixin border-retina (top, right, bottom, left), rgba(0, 0, 0, .1); | ||||
|         border-radius: 27px; | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
| @ -35,17 +39,20 @@ | ||||
|       transform: translate3d(-50%, -50%, 0); | ||||
|     } | ||||
| 
 | ||||
|     @when on { | ||||
|     @m on { | ||||
|       background-color: #44db5e; | ||||
|       border-color: #44db5e; | ||||
|       &::after { border-color: #44db5e; } | ||||
|       .zan-switch__node { | ||||
|         transform: translateX(20px); | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     @when off { | ||||
|     @m off { | ||||
|       background-color: #fff; | ||||
|       border-color: rgba(0, 0, 0, .1); | ||||
|     } | ||||
| 
 | ||||
|     @when disabled { | ||||
|     @m disabled { | ||||
|       opacity: .4; | ||||
|     } | ||||
|   } | ||||
|  | ||||
							
								
								
									
										10
									
								
								src/index.js
									
									
									
									
									
								
							
							
						
						
									
										10
									
								
								src/index.js
									
									
									
									
									
								
							| @ -20,6 +20,8 @@ import CheckboxGroup from '../packages/checkbox-group/index.js'; | ||||
| import BadgeGroup from '../packages/badge-group/index.js'; | ||||
| import Badge from '../packages/badge/index.js'; | ||||
| import Search from '../packages/search/index.js'; | ||||
| import Step from '../packages/step/index.js'; | ||||
| import ImagePreview from '../packages/image-preview/index.js'; | ||||
| 
 | ||||
| const install = function(Vue) { | ||||
|   if (install.installed) return; | ||||
| @ -44,6 +46,8 @@ const install = function(Vue) { | ||||
|   Vue.component(BadgeGroup.name, BadgeGroup); | ||||
|   Vue.component(Badge.name, Badge); | ||||
|   Vue.component(Search.name, Search); | ||||
|   Vue.component(Step.name, Step); | ||||
|   Vue.component(ImagePreview.name, ImagePreview); | ||||
| }; | ||||
| 
 | ||||
| // auto install
 | ||||
| @ -53,7 +57,7 @@ if (typeof window !== 'undefined' && window.Vue) { | ||||
| 
 | ||||
| module.exports = { | ||||
|   install, | ||||
|   version: '0.0.7', | ||||
|   version: '0.0.13', | ||||
|   Button, | ||||
|   Switch, | ||||
|   Field, | ||||
| @ -75,5 +79,7 @@ module.exports = { | ||||
|   CheckboxGroup, | ||||
|   BadgeGroup, | ||||
|   Badge, | ||||
|   Search | ||||
|   Search, | ||||
|   Step, | ||||
|   ImagePreview | ||||
| }; | ||||
|  | ||||
| @ -1,4 +1,3 @@ | ||||
| import Vue from 'vue'; | ||||
| import merge from 'src/utils/merge'; | ||||
| import PopupManager from './popup-manager'; | ||||
| 
 | ||||
|  | ||||
| @ -1,6 +1,6 @@ | ||||
| import { addClass, removeClass } from 'src/utils/dom'; | ||||
| import { addClass } from 'src/utils/dom'; | ||||
| 
 | ||||
| let hasModal = false; | ||||
| let hasModal = false; // eslint-disable-line
 | ||||
| 
 | ||||
| const getModal = function() { | ||||
|   let modalDom = PopupManager.modalDom; | ||||
|  | ||||
| @ -14,7 +14,7 @@ describe('Switch', () => { | ||||
|     vm.mount(); | ||||
| 
 | ||||
|     expect(vm.el.classList.contains('zan-switch')).to.true; | ||||
|     expect(vm.el.classList.contains('is-on')).to.true; | ||||
|     expect(vm.el.classList.contains('zan-switch--on')).to.true; | ||||
|   }); | ||||
| 
 | ||||
|   it('create off switch', () => { | ||||
| @ -42,11 +42,11 @@ describe('Switch', () => { | ||||
|     }); | ||||
|     vm.mount(); | ||||
|     expect(vm.el.classList.contains('zan-switch')).to.true; | ||||
|     expect(vm.el.classList.contains('is-off')).to.true; | ||||
|     expect(vm.el.classList.contains('zan-switch--off')).to.true; | ||||
|     vm.el.click(); | ||||
| 
 | ||||
|     setTimeout(() => { | ||||
|       expect(vm.el.classList.contains('is-off')).to.true; | ||||
|       expect(vm.el.classList.contains('zan-switch--off')).to.true; | ||||
|       done(); | ||||
|     }); | ||||
|   }); | ||||
| @ -72,11 +72,11 @@ describe('Switch', () => { | ||||
|     }); | ||||
|     vm.mount(); | ||||
|     expect(vm.el.classList.contains('zan-switch')).to.true; | ||||
|     expect(vm.el.classList.contains('is-off')).to.true; | ||||
|     expect(vm.el.classList.contains('zan-switch--off')).to.true; | ||||
|     vm.el.click(); | ||||
| 
 | ||||
|     setTimeout(() => { | ||||
|       expect(vm.el.classList.contains('is-on')).to.true; | ||||
|       expect(vm.el.classList.contains('zan-switch--on')).to.true; | ||||
|       done(); | ||||
|     }); | ||||
|   }); | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user