fix label-width=0 not work bug for field.

mulholland0318 · Nov 12, 2015 · e24f807 · e24f807
1 parent 3900144
commit e24f807
Show file tree

Hide file tree

Showing 7 changed files with 17 additions and 7 deletions.
diff --git a/examples/form/field.vue b/examples/form/field.vue
@@ -5,7 +5,7 @@
     <d-text-field label="密码" type='password' property='password'></d-text-field>
   </d-form>
 
-  <d-field label="Custom" required>
+  <d-field label="Custom" required :label-width="0">
     我是Custom的内容<br/>
     我是Custom的内容<br/>
     我是Custom的内容

diff --git a/src/form/fields/check.vue b/src/form/fields/check.vue
@@ -1,6 +1,6 @@
 <template>
   <div class='d-field d-checkboxfield' :class="{ 'validate-error': hintType === 'error', required: isRequired }">
-    <label :style="{ width: labelWidth ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
+    <label :style="{ width: labelWidth != null ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
     <div>
       <editor></editor>
       <div class="d-field-hint">

diff --git a/src/form/fields/field.vue b/src/form/fields/field.vue
@@ -1,6 +1,6 @@
 <template>
   <div class='d-field' :class="{ 'validate-error': hintType === 'error', required: isRequired }">
-    <label :style="{ width: labelWidth ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
+    <label :style="{ width: labelWidth != null ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
     <div>
       <slot></slot>
       <div class="d-field-hint">

diff --git a/src/form/fields/radio.vue b/src/form/fields/radio.vue
@@ -1,6 +1,6 @@
 <template>
   <div class='d-field d-radiogroupfield' :class="{ 'validate-error': hintType === 'error', required: isRequired }">
-    <label :style="{ width: labelWidth ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
+    <label :style="{ width: labelWidth != null ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
     <div>
       <d-radio-group v-ref:group :value.sync="editorValue"><d-radio v-for="(key, val) in mapping" :value="val">{{key}}</d-radio><slot></slot></d-radio-group>
       <div class="d-field-hint">

diff --git a/src/form/fields/select.vue b/src/form/fields/select.vue
@@ -1,6 +1,6 @@
 <template>
   <div class='d-field d-selectfield' :class="{ 'validate-error': hintType === 'error', required: isRequired }" @click="$event.stopPropagation()">
-    <label :style="{ width: labelWidth ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
+    <label :style="{ width: labelWidth != null ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
     <div>
       <div @click="toggleSelect($event)" class="d-selectfield-box" :class="{ active: selectVisible }">
         {{ textValue }}<span class="d-selectfield-trigger d-icon icon-select-arrow-down"></span>

diff --git a/src/form/fields/text.vue b/src/form/fields/text.vue
@@ -1,6 +1,6 @@
 <template>
   <div class='d-field d-textfield' :class="{ 'validate-error': hintType === 'error', required: isRequired }">
-    <label :style="{ width: labelWidth ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
+    <label :style="{ width: labelWidth != null ? labelWidth + 'px' : '' }" v-show="!hideLabel">{{ label || '' }}</label>
     <div>
       <editor></editor>
       <slot></slot>

diff --git a/src/form/text-editor.vue b/src/form/text-editor.vue
@@ -163,6 +163,11 @@
         set(value) {
           if (this.type === 'date' && !(value instanceof Date)) return;
           if (this.type === 'number') {
+            if (value === null || value === undefined || value === '') {
+              this.value = null;
+              return;
+            }
+
             value = Number(value);
             if (!isNaN(value)) {
               this.value = value;
@@ -195,7 +200,7 @@
           if (type === 'date' || type === 'number') {
             this.$options.template = `<input lazy @change="$parent.handleChange($event)" @focus="$parent.handleFocus()" type="${parent.editorType}" v-model="$parent.visualValue" placeholder="{{$parent.placeholder}}" readonly="{{$parent.readonly}}" :style="{ height: $parent.height ? $parent.height + 'px' : '' }"/>`;
           } else if (type !== 'textarea') {
-            this.$options.template = `<input type="${parent.editorType}" v-model="$parent.visualValue" ${ type === 'number' ? 'number' : '' } placeholder="{{$parent.placeholder}}" :style="{ height: $parent.height ? $parent.height + 'px' : '' }" readonly="{{$parent.readonly}}" />`;
+            this.$options.template = `<input type="${parent.editorType}" v-model="$parent.visualValue" placeholder="{{$parent.placeholder}}" :style="{ height: $parent.height ? $parent.height + 'px' : '' }" readonly="{{$parent.readonly}}" />`;
           } else {
             this.$options.template = `<textarea placeholder="{{$parent.placeholder}}" readonly="{{$parent.readonly}}" v-model="$parent.visualValue" :style="{ height: $parent.height ? $parent.height + 'px' : '' }"></textarea>`;
           }
@@ -217,6 +222,11 @@
           }
           this.hideDatePicker();
         } else if (type === 'number') {
+          if (value === undefined || value === null || value === '') {
+            this.value = null;
+            return;
+          }
+
           value = Number(value);
           if (!isNaN(value)){
             this.value = value;