Merge branch 'master' into hotfix/unit_test_init

This commit is contained in:
pangxie1991 2017-03-03 15:12:45 +08:00
commit ae0f3c041f
55 changed files with 8471 additions and 41259 deletions

View File

@ -16,7 +16,7 @@ indent_size = 2
[*.vue]
indent_size = 2
[*.pcss]
[*.css]
indent_size = 2
[Makefile]

View File

@ -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
}
}

View File

@ -11,7 +11,7 @@ config.output = {
};
config.externals = {
vue: 'Vue'
vue: 'vue'
};
delete config.devtool;

View File

@ -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

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

9625
docs/build/0.js vendored

File diff suppressed because it is too large Load Diff

2
docs/build/0.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -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

File diff suppressed because one or more lines are too long

18
docs/build/1.js vendored
View File

@ -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

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -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": [

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,3 @@
## ImagePreview 图片预览

View File

@ -0,0 +1,7 @@
## 安装
### ynpm安装
```
npm i @youzan/zanui-vue -S
```

View File

@ -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>

View 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);
```

View File

@ -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 | 状态栏添加额外的元素 |

View File

@ -0,0 +1,5 @@
<template>
<div class="page-image-pewview">
<h1 class="page-title">Image Preview</h1>
</div>
</template>

View File

@ -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
View 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>

View File

@ -38,7 +38,6 @@ router.afterEach(route => {
Vue.nextTick(() => {
document.body.scrollTop = indexScrollTop;
});
}
});

View File

@ -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 图片预览"
}
]
}

View File

@ -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",

View File

@ -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}

View File

@ -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>

View File

@ -0,0 +1,8 @@
## 0.0.2 (2017-01-20)
* 改了bug A
* 加了功能B
## 0.0.1 (2017-01-10)
* 第一版

View 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)

View File

@ -0,0 +1,3 @@
import ImagePreview from './src/image-preview';
export default ImagePreview;

View 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": {}
}

View 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>

View File

@ -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
View File

@ -0,0 +1,3 @@
import Step from 'packages/steps/src/step';
export default Step;

View 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>

View File

@ -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>

View File

@ -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: {

View File

@ -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",

View File

@ -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;
}
}

View File

@ -2,6 +2,7 @@
display: inline-block;
box-sizing: border-box;
padding-right: 10px;
vertical-align: middle;
&:last-child {
padding-right: 0;
}

View File

@ -5,6 +5,7 @@
@b cell-group {
padding-left: 10px;
position: relative;
background-color: #fff;
&::after {
@mixin border-retina (top, bottom);

View File

@ -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'; } /* '' */

View File

@ -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;
}
}
}
}
}

View File

@ -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;
}
}
}

View File

@ -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;
}
}

View File

@ -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
};

View File

@ -1,4 +1,3 @@
import Vue from 'vue';
import merge from 'src/utils/merge';
import PopupManager from './popup-manager';

View File

@ -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;

View File

@ -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();
});
});