Switch add large size and optimize style

Switch add large size and optimize style

test/app.vue

@@ -35,6 +35,7 @@ li + li {
                 <li><a v-link="'/select'">Select</a></li>
                 <li><a v-link="'/slider'">Slider</a></li>
                 <li><a v-link="'/step'">Step</a></li>
+                <li><a v-link="'/switch'">Switch</a></li>
             </ul>
         </nav>
         <router-view></router-view>

test/main.js

@@ -65,6 +65,11 @@ router.map({
         component: function (resolve) {
             require(['./routers/step.vue'], resolve);
         }
+    },
+    '/switch': {
+        component: function (resolve) {
+            require(['./routers/switch.vue'], resolve);
+        }
     }
 });
 

test/routers/switch.vue

@@ -0,0 +1,34 @@
+<template>
+    <Switch @on-change="change"></Switch>
+    <Switch>
+        <span slot="open">开</span>
+        <span slot="close">关</span>
+    </Switch>
+    <Switch size="large">
+        <span slot="open">ON</span>
+        <span slot="close">OFF</span>
+    </Switch>
+    <Switch>
+        <Icon type="android-done" slot="open"></Icon>
+        <Icon type="android-close" slot="close"></Icon>
+    </Switch>
+    <Switch :disabled="disabled"></Switch>
+    <i-button type="primary" @click="disabled = !disabled">Toggle Disabled</i-button>
+    <Switch size="small"></Switch>
+</template>
+<script>
+    import { Switch, Message, iButton, Icon } from 'iview';
+    export default {
+        components: { Switch, Message, iButton, Icon },
+        data () {
+            return {
+                disabled: true
+            }
+        },
+        methods: {
+            change (status) {
+                Message.info('开关状态：' + status);
+            }
+        }
+    }
+</script>