Merge branch 'master' of gitlab.qima-inc.com:fe/oxygen

.eslintignore

@@ -1,3 +1,4 @@
 lib/
 dist/
 node_modules/
+build/

docs/examples/switch.md

@@ -12,11 +12,7 @@ export default {
   },
   methods: {
     updateState(newState) {
-      console.log('changing');
       this.switchState = newState;
-    },
-    handleClick() {
-      alert('click');
     }
   }
 };
@@ -26,12 +22,15 @@ export default {
     @component switch {
       padding: 0 15px 15px;
 
-      @descendent sample {
+      @descendent wrapper {
-        margin: 0 15px;
+        margin: 30px;
+        width: 100px;
+        float: left;
+        text-align: center;
       }
 
       @descendent text {
-        margin-right: 20px;
+        margin: 20px 0;
       }
     }
   }
@@ -44,9 +43,14 @@ export default {
 :::demo 样例代码
 ```html
 <div class="page-switch">
-  <span class="page-switch-text">Switch state: {{switchStateText}}</span>
+  <div class="page-switch-wrapper">
-  <z-switch class="page-switch-sample" :checked="switchState" :on-change="updateState"></z-switch>
+    <o2-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></o2-switch>
-  <z-switch class="page-switch-sample" :checked="false" :disabled="true"></z-switch>
+    <div class="page-switch-text">{{switchStateText}}</div>
+  </div>
+  <div class="page-switch-wrapper">
+    <o2-switch class="some-customized-class" :checked="true" :disabled="true"></o2-switch>
+    <div class="page-switch-text">OFF, DISABLED</div>
+  </div>
 </div>
 ```
 
@@ -55,17 +59,16 @@ export default {
 export default {
   data() {
     return {
-      switchState: false
+      switchState: true
     };
   },
   computed: {
     switchStateText() {
-      return this.switchState ? 'on' : 'off';
+      return this.switchState ? ' ON' : 'OFF';
     }
   },
   methods: {
     updateState(newState) {
-      console.log('changing');
       this.switchState = newState;
     }
   }

packages/button/src/button.vue

@@ -32,15 +32,13 @@
  * @example
  * <z-button size="large" type="primary">按钮</z-button>
  */
+
+const allowedSize = ['mini', 'small', 'normal', 'large'];
+const allowedType = ['default', 'danger', 'primary'];
+
 export default {
   name: 'z-button',
 
-  methods: {
-    handleClick(e) {
-      this.$emit('click', e);
-    }
-  },
-
   props: {
     disabled: Boolean,
     loading: Boolean,
@@ -49,23 +47,14 @@ export default {
       type: String,
       default: 'default',
       validator(value) {
-        return [
+        return allowedSize.indexOf(value) > -1;
-          'default',
-          'danger',
-          'primary'
-        ].indexOf(value) > -1;
       }
     },
     size: {
       type: String,
       default: 'normal',
       validator(value) {
-        return [
+        return allowedType.indexOf(value) > -1;
-          'mini',
-          'small',
-          'normal',
-          'large'
-        ].indexOf(value) > -1;
       }
     }
   }

packages/switch/src/switch.vue

@@ -1,12 +1,12 @@
 <template>
-  <div class="z-switch" :class="['is-' + switchState]" @click="toggleState">
+  <div class="o2-switch" :class="['is-' + switchState]" @click="toggleState">
-    <div class="z-switch-node"></div>
+    <div class="o2-switch-node" :class="['is-' + switchState]"></div>
   </div>
 </template>
 
 <script>
 /**
- * z-switch
+ * o2-switch
  * @module components/switch
  * @desc 开关
  * @param {boolean} [checked=false] - 开关状态
@@ -15,10 +15,10 @@
  * @param {callback} [onChange] - 开关状态改变回调函数。
  *
  * @example
- * <z-switch checked="true" disabled="false"></z-switch>
+ * <o2-switch checked="true" disabled="false"></o2-switch>
  */
 export default {
-  name: 'z-switch',
+  name: 'o2-switch',
   props: {
     checked: {
       type: Boolean,

packages/zanui/src/button.pcss

@@ -28,16 +28,19 @@
     @modifier default {
       color: $button-default-color;
       background-color: $button-default-background-color;
+      border: 1px solid $button-default-border-color;
     }
 
     @modifier primary {
       color: $button-primary-color;
       background-color: $button-primary-background-color;
+      border: 1px solid $button-primary-border-color;
     }
 
     @modifier danger {
       color: $button-danger-color;
       background-color: $button-danger-background-color;
+      border: 1px solid $button-danger-border-color;
     }
 
     @modifier large {

packages/zanui/src/common/var.pcss

@@ -17,12 +17,15 @@ $c-blue: #38f;
 $c-background: #f8f8f8;
 
 /* 按钮颜色 */
-$button-default-color: $c-white;
+$button-primary-color: $c-white;
-$button-default-background-color: $c-green-wx;
+$button-primary-background-color: $c-green-wx;
-$button-primary-color: $c-black;
+$button-primary-border-color: #0a0;
-$button-primary-background-color: $c-white;
+$button-default-color: $c-black;
+$button-default-background-color: $c-white;
+$button-default-border-color: #bbb;
 $button-danger-color: $c-white;
 $button-danger-background-color: #f44;
+$button-danger-border-color: #e33;
 
 :root{
 

packages/zanui/src/switch.pcss

@@ -28,11 +28,17 @@
     @when on {
       background-color: #44db5e;
       border-color: #44db5e;
+      @descendent node {
+        left: 0;
+      }
     }
 
     @when off {
       background-color: #fff;
       border-color: rgba(0, 0, 0, .1);
+      @descendent node {
+        right: 0;
+      }
     }
 
     @when loading {