From 1d5194ad9c34f17a92555f5142e6285db97e5285 Mon Sep 17 00:00:00 2001 From: whycq <whycq> Date: 星期四, 07 四月 2022 09:08:21 +0800 Subject: [PATCH] # --- pages/basics/pakin.vue | 82 ++++++++++++++++++++++++++++------------ 1 files changed, 57 insertions(+), 25 deletions(-) diff --git a/pages/basics/pakin.vue b/pages/basics/pakin.vue index 52dd1c4..d72bd8c 100644 --- a/pages/basics/pakin.vue +++ b/pages/basics/pakin.vue @@ -25,28 +25,20 @@ <view class="color-block-blue"></view> <text class="title">鍟嗗搧鍒楄〃</text> </view> - <checkbox-group @change="checkbox"> - <label v-for="(item,index) in data" :key="index" class="data-list bg-false" :class="'bg-'+item.checked" > - <view class="demo-list-left"> - <checkbox :value="item.id+''" :checked="item.checked" style="display: block;" /> - </view> - <view class="demo-list-right"> - <!-- <view><text style="font-weight: bold;">搴忓彿锛歿{index+1}}</text></view> --> - <view class="order-ditel"><text class="index">No.{{index+1}}</text><text class="orderNo">{{item.orderNo}}</text></view> - <view><text style="width: 400rpx;">鍟嗗搧缂栫爜锛歿{item.matnr}}</text></view> - <view> - <text>搴斿叆鏁伴噺锛歿{item.anfme}}</text> - <text>鍟嗗搧鍚嶇О锛歿{item.maktx}}</text> - </view> - <view> - <text>宸插叆鏁伴噺锛歿{item.inQty}}</text> - <text style="width: auto;">璁㈠崟鐘舵�侊細</text><text :class="state$"> {{item.state$}}</text> - </view> - </view> - </label> - </checkbox-group> + </view> - + <checkbox-group @change="checkbox"> + <label v-for="(item,index) in data" :key="index" class="data-list bg-false" :class="'bg-'+item.checked" > + <view class="data-list-left"> + <checkbox :value="item.id+''" :checked="item.checked" style="display: block;" /> + </view> + <view class="data-list-right"> + <view><text style="width: 400rpx;">缂栫爜锛歿{item.matnr}}</text></view> + <view><text style="width: 400rpx;">鍝佸悕锛歿{item.maktx}}</text></view> + <view><text style="width: 400rpx;">鎵瑰彿锛歿{item.anfme}}</text></view> + </view> + </label> + </checkbox-group> </scroll-view> <view class="footer flex justify-around"> <view> @@ -155,7 +147,7 @@ searchBox: 'hide', pick:'hide', data:[ - {matnr:'123456',anfme:'1',maktx:'鏄剧ず鍣�',inQty:'2022鎵�'} + {matnr:'123456',anfme:'1',maktx:'鏄剧ず鍣�',inQty:'2022鎵�',id:21} ] } }, @@ -183,6 +175,27 @@ this.type = type // open 鏂规硶浼犲叆鍙傛暟 绛夊悓鍦� uni-popup 缁勪欢涓婄粦瀹� type灞炴�� this.$refs.goodsSearch.open(type) + }, + checkbox: function (e) { + var items = this.data, + values = e.detail.value; + for (var i = 0, lenI = items.length; i < lenI; ++i) { + const item = items[i] + item.id = item.id + '' + if(values.indexOf(item.id) >= 0){ + this.$set(item,'checked',true) + }else{ + this.$set(item,'checked',false) + } + } + if (values.length == items.length) { + this.check = true + this.checkText = "鍙栨秷鍏ㄩ��" + } else { + this.check = false + this.checkText = "鍏ㄩ��" + } + uni.vibrateShort(); }, } } @@ -251,17 +264,22 @@ background-color: #1E9FFF; } .pak-data-box { - background-color: #FFFFFF; + background-color: #F1F1F1; margin: 15rpx 15rpx 0rpx 15rpx; width: 96%; height: 800rpx; border-radius: 20rpx; } + .pak-data-box .box-top { + background-color: #FFFFFF; + height: 70rpx; + border-radius: 20rpx 20rpx 20rpx 20rpx; + } .bg-false { - background-color: #ebebeb; + background-color: #FFFFFF; } .bg-true { - background-color: #FFFFFF; + background-color: #ebebeb; } .data-list { border-bottom: 1px solid #d8d8d8; @@ -275,6 +293,20 @@ .data-list:last-child { margin-bottom: 120rpx; } + .data-list-left { + display: inline-block; + float: left; + text-align: center; + width: 100rpx; + height: 180rpx; + line-height: 180rpx; + } + .data-list-right { + display: inline-block; + float: left; + height: 180rpx; + color: #828282; + } /* 閬僵灞� */ .search-box-show { display: block; -- Gitblit v1.9.1