From 4d5454208340462d4a483ccca24205e2e2d66fdf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=81=E7=81=8F?= <admin@aresn.com>
Date: Thu, 24 Aug 2017 17:50:30 +0800
Subject: [PATCH] Radio add size prop

---
 examples/routers/radio.vue           | 56 +++++++++++++++++++---------
 src/components/radio/radio-group.vue |  3 +-
 src/components/radio/radio.vue       | 10 ++++-
 src/styles/components/radio.less     | 24 ++++++++++++
 src/styles/mixins/checkbox.less      |  1 -
 5 files changed, 73 insertions(+), 21 deletions(-)

diff --git a/examples/routers/radio.vue b/examples/routers/radio.vue
index a495fcf7..b4e6e215 100644
--- a/examples/routers/radio.vue
+++ b/examples/routers/radio.vue
@@ -1,32 +1,54 @@
 <template>
     <div>
-        <Radio true-value="true" false-value="false" v-model="testValue">test</Radio> {{ testValue }}
-        <Radio-group v-model="date.sex">
-            <div v-if="show">
-                <Radio label="male" true-value="true" false-value="false"></Radio>
-                <Radio label="female" true-value="true" false-value="false"></Radio>
-            </div>
+        <Radio size="large" v-model="single">Radio</Radio>
+        <Radio size="default" v-model="single">Radio</Radio>
+        <Radio size="small" v-model="single">Radio</Radio>
+        <br><br>
+        <Radio-group v-model="phone">
+            <Radio label="apple">
+                <Icon type="social-apple"></Icon>
+                <span>Apple</span>
+            </Radio>
+            <Radio label="android">
+                <Icon type="social-android"></Icon>
+                <span>Android</span>
+            </Radio>
+            <Radio label="windows">
+                <Icon type="social-windows"></Icon>
+                <span>Windows</span>
+            </Radio>
+        </Radio-group>
+        <Radio-group v-model="button2" type="button" size="large">
+            <Radio label="北京"></Radio>
+            <Radio label="上海" disabled></Radio>
+            <Radio label="深圳"></Radio>
+            <Radio label="杭州"></Radio>
+        </Radio-group>
+        <Radio-group v-model="button2" type="button" size="default">
+            <Radio label="北京"></Radio>
+            <Radio label="上海" disabled></Radio>
+            <Radio label="深圳"></Radio>
+            <Radio label="杭州"></Radio>
+        </Radio-group>
+        <Radio-group v-model="button2" type="button" size="small">
+            <Radio label="北京"></Radio>
+            <Radio label="上海" disabled></Radio>
+            <Radio label="深圳"></Radio>
+            <Radio label="杭州"></Radio>
         </Radio-group>
-        {{ date }}
-        <Button @click="handleChange">change</Button>
     </div>
 </template>
 <script>
     export default {
         data () {
             return {
-                date: {
-                    sex: 'male'
-                },
-                show: false,
-                testValue: null
+                single: true,
+                phone: 'apple',
+                button2: '北京',
             }
         },
         methods: {
-            handleChange () {
-//                this.date.sex = 'male form';
-                this.show = true;
-            }
+
         }
     }
 </script>
diff --git a/src/components/radio/radio-group.vue b/src/components/radio/radio-group.vue
index 5f161942..a6e8b806 100644
--- a/src/components/radio/radio-group.vue
+++ b/src/components/radio/radio-group.vue
@@ -19,7 +19,7 @@
             },
             size: {
                 validator (value) {
-                    return oneOf(value, ['small', 'large']);
+                    return oneOf(value, ['small', 'large', 'default']);
                 }
             },
             type: {
@@ -44,6 +44,7 @@
                     `${prefixCls}`,
                     {
                         [`${prefixCls}-${this.size}`]: !!this.size,
+                        [`ivu-radio-${this.size}`]: !!this.size,
                         [`${prefixCls}-${this.type}`]: !!this.type,
                         [`${prefixCls}-vertical`]: this.vertical
                     }
diff --git a/src/components/radio/radio.vue b/src/components/radio/radio.vue
index 32a6e470..9d17ac76 100644
--- a/src/components/radio/radio.vue
+++ b/src/components/radio/radio.vue
@@ -12,7 +12,7 @@
     </label>
 </template>
 <script>
-    import { findComponentUpward } from '../../utils/assist';
+    import { findComponentUpward, oneOf } from '../../utils/assist';
     import Emitter from '../../mixins/emitter';
 
     const prefixCls = 'ivu-radio';
@@ -39,6 +39,11 @@
             disabled: {
                 type: Boolean,
                 default: false
+            },
+            size: {
+                validator (value) {
+                    return oneOf(value, ['small', 'large', 'default']);
+                }
             }
         },
         data () {
@@ -55,7 +60,8 @@
                     {
                         [`${prefixCls}-group-item`]: this.group,
                         [`${prefixCls}-wrapper-checked`]: this.currentValue,
-                        [`${prefixCls}-wrapper-disabled`]: this.disabled
+                        [`${prefixCls}-wrapper-disabled`]: this.disabled,
+                        [`${prefixCls}-${this.size}`]: !!this.size
                     }
                 ];
             },
diff --git a/src/styles/components/radio.less b/src/styles/components/radio.less
index 82962919..fc5e929c 100644
--- a/src/styles/components/radio.less
+++ b/src/styles/components/radio.less
@@ -73,6 +73,30 @@
             transform: scale(0);
         }
     }
+    &-large{
+        font-size: @font-size-base;
+        & .@{radio-inner-prefix-cls}{
+            width: 16px;
+            height: 16px;
+            &:after{
+                width: 10px;
+                height: 10px;
+            }
+        }
+        &.@{radio-prefix-cls}-wrapper, & .@{radio-prefix-cls}-wrapper{
+            font-size: @font-size-base;
+        }
+    }
+    &-small{
+        & .@{radio-inner-prefix-cls}{
+            width: 12px;
+            height: 12px;
+            &:after{
+                width: 6px;
+                height: 6px;
+            }
+        }
+    }
 
     &-input {
         position: absolute;
diff --git a/src/styles/mixins/checkbox.less b/src/styles/mixins/checkbox.less
index dfc71c2b..0d00c3a1 100644
--- a/src/styles/mixins/checkbox.less
+++ b/src/styles/mixins/checkbox.less
@@ -49,7 +49,6 @@
             }
         }
         &-large{
-            font-size: 16px;
             & .@{checkbox-inner-prefix-cls} {
                 width: 16px;
                 height: 16px;