소스 검색

表单新增单列选择器

zhaoxiaohai 3 년 전
부모
커밋
0662bde30f
2개의 변경된 파일42개의 추가작업 그리고 2개의 파일을 삭제
  1. 22 0
      components/Yl_field/index.js
  2. 20 2
      components/Yl_field/index.wxml

+ 22 - 0
components/Yl_field/index.js

@@ -115,6 +115,28 @@ Component({
             });
             this.confirm();
         },
+        /* 单列选择器 */
+        bindSelectorChange(e) {
+            let {
+                item,
+                index
+            } = e.target.dataset,
+                value = e.detail.value;
+            this.setData({
+                [`form[${index}].value`]: item.range[value][item.rangeKey],
+                [`form[${index}].rangeIndex`]: value,
+                [`form[${index}].error`]: false,
+            });
+            if (item.interrupt) this.triggerEvent("interrupt", {
+                data: this.data.form[index],
+                form: this.data.form,
+                temporary: {
+                    item,
+                    index
+                }
+            });
+            this.confirm();
+        },
         /* 日期,时间 选择器 */
         bindDateChange(e) {
             let item = e.target.dataset.item,

+ 20 - 2
components/Yl_field/index.wxml

@@ -1,8 +1,27 @@
 <view wx:for="{{form}}" wx:key="valueName" data-name="{{item.valueName}}">
     <view hidden="{{ !item.required && !showAll }}">
         <!-- <van-transition show="{{ item.required || showAll }}" name="fade" custom-class="block"> -->
+        <!-- 单列选择器 -->
+        <view class="picker" wx:if="{{item.type=='selector'}}">
+            <view class="label">
+                <text class="need" style="color: {{item.required?'#EE0A24':'rgba(0,0,0,0)'}};">*</text>
+                <text class="text" style="color:{{item.disabled?'#C8C9CC':''}};">{{item.label}}</text>
+            </view>
+            <view style="position: relative;">
+                <view class="picker-slot" wx:if="{{item.slot}}">
+                    <slot name="{{item.slot}}" />
+                </view>
+                <picker mode='selector' range="{{item.range}}" range-key='{{item.rangeKey}}' value="{{item.rangeIndex}}" disabled="{{item.disabled}}" data-item="{{item}}" data-index="{{index}}" bindchange="bindSelectorChange">
+                    <view class="content">
+                        <text wx:if="{{item.value}}" style="color:{{item.disabled?'#C8C9CC':'#000'}};">{{item.value}}</text>
+                        <text wx:else style="color: {{item.error?'#EE4C4E':''}};">{{item.placeholder}}</text>
+                    </view>
+                </picker>
+                <view wx:if="{{item.errMsg}}" class="error-tips">{{item.errMsg}}</view>
+            </view>
+        </view>
         <!-- 日期选择器 -->
-        <view class="picker" wx:if="{{item.type=='date'}}">
+        <view class="picker" wx:elif="{{item.type=='date'}}">
             <view class="label">
                 <text class="need" style="color: {{item.required?'#EE0A24':'rgba(0,0,0,0)'}};">*</text>
                 <text class="text" style="color:{{item.disabled?'#C8C9CC':''}};">{{item.label}}</text>
@@ -44,7 +63,6 @@
                 <view wx:if="{{item.errMsg}}" class="error-tips">{{item.errMsg}}</view>
             </view>
         </view>
-
         <!-- 时间选择器 -->
         <view class="picker" wx:elif="{{item.type=='time'}}">
             <view class="label">