Просмотр исходного кода

优化slot,添加自定义颜色,点击右侧图标触发事件暂时与点击事件一致

xiaohaizhao 2 лет назад
Родитель
Сommit
cea7b4c67d

+ 12 - 2
components/Yl_ReportForms/index.js

@@ -1,11 +1,18 @@
 Component({
     properties: {
-        list: {type:Array},
+        list: {
+            type: Array
+        },
         showAll: { //是否显示全部(包含值为空项)
             type: Boolean,
             value: true
         },
-        clickItem: {type:Function}
+        clickItem: {
+            type: Function
+        }
+    },
+    options: {
+        multipleSlots: true
     },
     methods: {
         /* 单击项目 */
@@ -14,12 +21,15 @@ Component({
                 item
             } = e.currentTarget.dataset;
             this.triggerEvent("clickItem", item)
+            getApp().globalData.previewClick && getApp().globalData.previewClick(item)
         },
         /* 单击补充区域 */
         clickRep(e) {
             const {
                 item
             } = e.currentTarget.dataset;
+            this.triggerEvent("clickItem", item)
+            getApp().globalData.previewClick && getApp().globalData.previewClick(item)
         }
     }
 })

+ 9 - 9
components/Yl_ReportForms/index.wxml

@@ -1,11 +1,11 @@
 <block wx:for="{{list}}" wx:key="index">
-  <van-transition show="{{ showAll || item.value }}" name="fade" custom-class="block">
-    <navigator url="#" class="box" bindtap="clickItem" data-item="{{item}}">
-      <view class="label">{{item.label}}</view>
-      <view class="value">{{item.value||'--'}}</view>
-      <view class="replenish" catchtap="clickRep" data-item="{{item}}" wx:if="{{item.slot}}">
-        <slot name='{{item.slot}}' />
-      </view>
-    </navigator>
-  </van-transition>
+    <van-transition show="{{ showAll || item.value }}" name="fade" custom-class="block">
+        <navigator url="#" class="box" bindtap="clickItem" data-item="{{item}}">
+            <view class="label">{{item.label}}</view>
+            <view class="value" style="color:{{item.color||'#333'}} ;">{{item.value||'--'}}</view>
+            <view class="replenish" catchtap="clickRep" data-item="{{item}}" wx:if="{{item.slot}}">
+                <slot name='{{item.slot}}' />
+            </view>
+        </navigator>
+    </van-transition>
 </block>

+ 25 - 23
components/Yl_ReportForms/index.wxss

@@ -1,34 +1,36 @@
 .box {
-  display: flex;
-  width: 100vw;
-  word-break: break-all;
-  white-space: pre-wrap;
-  border-bottom: 2rpx solid #DDDDDD;
-  font-size: 28rpx;
-  font-family: PingFang SC-Regular, PingFang SC;
-  background-color: #fff;
+    display: flex;
+    width: 100vw;
+    word-break: break-all;
+    white-space: pre-wrap;
+    border-bottom: 2rpx solid #DDDDDD;
+    font-size: 28rpx;
+    font-family: PingFang SC-Regular, PingFang SC;
+    background-color: #fff;
 }
 
 .box .label {
-  color: #666666;
-  width: 310rpx;
-  padding: 0 20rpx;
-  padding-top: 26rpx;
-  box-sizing: border-box;
-  padding-bottom: 22rpx;
+    color: #666666;
+    width: 310rpx;
+    padding: 0 20rpx;
+    padding-top: 26rpx;
+    box-sizing: border-box;
+    padding-bottom: 22rpx;
 }
 
 .box .value {
-  flex: 1;
-  width: 0;
-  color: #333333;
-  padding-top: 26rpx;
-  padding-bottom: 22rpx;
+    flex: 1;
+    width: 0;
+    padding-top: 26rpx;
+    padding-bottom: 22rpx;
 }
 
 .box .replenish {
-  width: 90rpx;
-  height: 90rpx;
-  margin: 0 15rpx 0;
-  flex-shrink: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 90rpx;
+    height: 90rpx;
+    margin: 0 15rpx 0;
+    flex-shrink: 0;
 }