border field

build/webpack.config.js

@@ -85,7 +85,8 @@ if (process.env.NODE_ENV === 'production') {
     }),
     new webpack.optimize.UglifyJsPlugin({
       compress: {
-        warnings: false
+        warnings: false,
+        console: false
       },
       output: {
         comments: false

docs/examples-docs/field.md

@@ -1,3 +1,13 @@
+<style>
+@component-namespace demo {
+  @b field {
+    .zan-field-wrapper {
+      padding: 0 10px;
+    }
+  }
+}
+</style>
+
 <script>
 export default {
   data() {
@@ -38,6 +48,18 @@ export default {
 ```
 :::
 
+### 带border的输入框
+
+传入一个`border`属性。
+
+:::demo 带border的输入框
+```html
+<div class="zan-field-wrapper">
+  <zan-field type="text" placeholder="请输入用户名" border></zan-field>
+</div>
+```
+:::
+
 ### 禁用的输入框
 
 传入`disabled`属性即可。

packages/field/src/field.vue

@@ -6,7 +6,8 @@
       'zan-field--hastextarea': type === 'textarea',
       'zan-field--nolabel': !label,
       'zan-field--disabled': disabled,
-      'zan-field--error': error
+      'zan-field--error': error,
+      'zan-field--border': border
     }">
     <textarea
       v-if="type === 'textarea'"
@@ -51,7 +52,8 @@ export default {
     disabled: Boolean,
     error: Boolean,
     readonly: Boolean,
-    maxlength: [String, Number]
+    maxlength: [String, Number],
+    border: Boolean
   },
 
   data() {

packages/radio/src/radio.vue

@@ -44,7 +44,6 @@ export default {
 
     currentValue: {
       get() {
-        console.log(this.value);
         return this.isGroup && this.parentGroup ? this.parentGroup.value : this.value;
       },
 

packages/zanui-css/src/field.css

@@ -36,6 +36,20 @@
       }
     }
 
+    @m border {
+      .zan-field__control {
+        padding-left: 10px;
+      }
+
+      &::after {
+        @mixin border-retina (top, right, bottom, left);
+      }
+
+      &:last-child::after {
+        @mixin border-retina (bottom);
+      }
+    }
+
     .zan-cell__title,
     .zan-cell__value {
       float: none;