From dafb6a0d9abaf3f9c595d8259664e2bb70786156 Mon Sep 17 00:00:00 2001 From: whycq <whycq> Date: 星期五, 01 四月 2022 09:29:27 +0800 Subject: [PATCH] # --- pages/basics/demo.vue | 77 ++++++++++++++++++++++++++------------ 1 files changed, 52 insertions(+), 25 deletions(-) diff --git a/pages/basics/demo.vue b/pages/basics/demo.vue index 40a3e86..18ce165 100644 --- a/pages/basics/demo.vue +++ b/pages/basics/demo.vue @@ -3,15 +3,19 @@ <scroll-view> <view class="demo-tab"> <checkbox-group @change="checkbox"> - <label v-for="(item,index) in data" :key="index" class="demo-list" :class="'bg-'+ item.checked"> - <view class="demo-list-left"><checkbox :value="index+''" :checked="item.checked" /> - </view> - <view class="demo-list-right"> - <view><text style="width: 90rpx;">璁㈠崟 | </text>{{item.orderNo}}<text>搴忓彿锛歿{index+1}}</text></view> - <view><text >鍟嗗搧缂栫爜锛�</text>{{item.matnr}}</view> - <view :class="'bg-'+item.checked"><text>搴斿叆鏁伴噺锛�</text><view class="text-num">{{item.anfme}}</view><text>鍟嗗搧鍚嶇О锛�</text>{{item.maktx}}</view> - <view><text>宸插叆鏁伴噺锛�</text><view class="text-num">{{item.inQty}}</view><text>璁㈠崟鐘舵�侊細</text>{{item.state$}}</view> - </view> + <label v-for="(item,index) in data" :key="index" + @click="changeClass(index)" class="demo-list" :class="{'active':add_class==index}" > + + <view :class="'bg-'+item.checked"> + <view class="demo-list-left"><checkbox :value="item.id+''" :checked="item.checked" /> + </view> + <view class="demo-list-right"> + <view><text style="width: 90rpx;">璁㈠崟 | </text>{{item.orderNo}}<text>搴忓彿锛歿{index+1}}</text></view> + <view><text >鍟嗗搧缂栫爜锛�</text>{{item.matnr}}</view> + <view ><text>搴斿叆鏁伴噺锛�</text><view class="text-num">{{item.anfme}}</view><text>鍟嗗搧鍚嶇О锛�</text>{{item.maktx}}</view> + <view><text>宸插叆鏁伴噺锛�</text><view class="text-num">{{item.inQty}}</view><text>璁㈠崟鐘舵�侊細</text>{{item.state$}}</view> + </view> + </view> </label> </checkbox-group> </view> @@ -29,7 +33,8 @@ return { data: [], background:'unCheck', - color:'' + color:'', + add_class:'' } }, mounted() { @@ -61,28 +66,50 @@ var res = res.data if (res.code === 200) { that.data = res.data.records - that.setCheck() + // that.setCheck() } } }) }, - setCheck() { - for (var i = 0; i < this.data.length; i++) { - var key = 'checked', - value = false - this.data[i][key] = value - } - }, + // setCheck() { + // for (var i = 0; i < this.data.length; i++) { + // var key = 'checked', + // value = false + // this.data[i][key] = value + // } + // }, checkbox: function (e) { - var val = e.detail.value - for (var i = 0; i < val.length; i++) { - val[i] = parseInt(val[i]) - this.data[val[i]].checked = true - + + var items = this.data, + values = e.detail.value; + for (var i = 0, lenI = items.length; i < lenI; ++i) { + const item = items[i] + console.log(values) + console.log(values.indexOf(item.value)) + if(values.indexOf(item.id) >= 0){ + this.$set(item,'checked',true) + }else{ + this.$set(item,'checked',false) + } } - console.log(this.data) + + + // var val = e.detail.value + // for (var j = 0; j < this.data.length;j++) { + // this.data[j].checked = false + // } + // for (var i = 0; i < val.length; i++) { + // val[i] = parseInt(val[i]) + // this.data[val[i]].checked = true + // console.log(val) + // console.log(this.data) + // } }, + changeClass(index) { + + this.add_class=index + } } } </script> @@ -92,7 +119,7 @@ background-color: #FFFFFF; } .bg-true { - background-color: #55ffff; + background-color: #d6d6d6; } .demo-tab { } -- Gitblit v1.9.1