creat
<view bindtap="selectLocation" class=\'add-cont\'>
<view class=\'add-list\'>
<view class=\'add-list-left\'>打卡地点</view>
<view class=\'add-list-right\'>{{location}}</view>
</view>
</view>
onShow: function () { var selectStudent = app.globalData.selectStudent; var selectLocation = app.globalData.selectLocation; var selectdate = app.globalData.selectdate; console.log(selectStudent); console.log(selectLocation); console.log(selectdate); var student = ""; var location = ""; var date = ""; var reg = /,$/gi; if (selectStudent != null && selectStudent.length > 0) { for (var i = 0; i < selectStudent.length; i++) { if (selectStudent[i].checked) { student += selectStudent[i].name + "," ; } } } if (selectLocation != null && selectLocation.length > 0) { for (var i = 0; i < selectLocation.length; i++) { if (selectLocation[i].checked) { location += selectLocation[i].name + ","; } } } if (selectdate != null && selectdate.length > 0) { for (var i = 0; i < selectdate.length; i++) { if (selectdate[i].checked) { date += selectdate[i].name + ","; } } } this.setData({ student: selectStudent == null ?"请选择打卡学生":student.replace(reg, ""), location: selectLocation == null ? "请选择打卡地点" :location.replace(reg, ""), date: selectdate == null ? "请选择打卡日期" :date.replace(reg, "") }) },
selectLocation
js
// pages/manage/punch/selectStudent/index.js var app = getApp(); var host = app.data.server; var utils = require(\'../../../../utils/util.js\') Page({ /** * 页面的初始数据 */ data: { selectLocation: [ { id: 1, name: "长安校区",details:"长安详情" }, { id: 2, name: "雁塔校区", details: "雁塔详情"}, { id: 3, name: "高新校区", details: "高新详情" }, ] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { this.getData(); }, getData: function () { wx.showLoading({ title: \'加载中\', }) var that = this; wx.request({ url: host + \'/punch/getBuilding.json\', method: \'GET\', data: { miniSession: wx.getStorageSync("session") }, success: function (res) { if (res.statusCode == 200) { if (res.data.code == 0) { var d = res.data.data; console.log(d); that.setData({ selectLocation: d }) } else { utils.alert("抱歉", res.data.message + \'\'); } } else { utils.alert("抱歉", \'服务器出错(\' + res.statusCode + \')\'); } }, fail: function () { utils.alert("抱歉", \'请求失败!\'); }, complete: function () { wx.hideLoading() } }) }, //全选择 checkAll: function (e) { var selectedAll; var s; selectedAll = this.data.selectedAllGrade; s = this.data.selectLocation; selectedAll = !selectedAll; if (selectedAll) { for (var i = 0; i < s.length; i++) { s[i].checked = true; } } else { for (var i = 0; i < s.length; i++) { s[i].checked = false; } } console.log(s); console.log(selectedAll); this.setData({ selectLocation: s, selectedAllGrade: selectedAll }); }, checkOneGrade: function (e) { var selectLocation = this.data.selectLocation; var ids = e.detail.value; console.log(ids); console.log(selectLocation); for (var i = 0; i < selectLocation.length; i++) { selectLocation[i].checked = false; console.log(ids.length); for (var j = 0; j < ids.length; j++) { if (selectLocation[i].id == ids[j]) { selectLocation[i].checked = true; break; } } } console.log(selectLocation); this.setData({ selectLocation: selectLocation }); }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { }, /** * 生命周期函数--监听页面显示 */ onShow: function () { }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { }, /** * 生命周期函数--监听页面卸载 */ onUnload: function () { app.globalData.selectLocation = this.data.selectLocation; }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh: function () { }, /** * 页面上拉触底事件的处理函数 */ onReachBottom: function () { }, /** * 用户点击右上角分享 */ onShareAppMessage: function () { } })
html
<!--pages/manage/punch/selectStudent/index.wxml--> <view class=\'allbody\' bindtouchmove=\'move\'> <view class="weui-tab__panel"> <!-- 选项卡1 --> <view class="" > <checkbox-group bindchange="checkAll" data-type=\'grade\'> <label class="weui-cell weui-check__label"> <checkbox class="weui-check" value="0" checked="{{selectedAllGrade}}" /> <view class="weui-cell__hd weui-check__hd_in-checkbox"> <icon class="weui-icon-checkbox_circle" type="circle" size="23" wx:if="{{!selectedAllGrade}}"></icon> <icon class="weui-icon-checkbox_success" type="success" size="23" wx:if="{{selectedAllGrade}}"></icon> </view> <view class="weui-cell__bd">全选</view> </label> </checkbox-group> <checkbox-group bindchange="checkOneGrade"> <label class="weui-cell weui-check__label" wx:for="{{selectLocation}}" wx:key="value"> <checkbox class="weui-check" value="{{item.id}}" checked="{{item.checked}}" /> <view class="weui-cell__hd weui-check__hd_in-checkbox"> <icon class="weui-icon-checkbox_circle" type="circle" size="23" wx:if="{{!item.checked}}"></icon> <icon class="weui-icon-checkbox_success" type="success" size="23" wx:if="{{item.checked}}"></icon> </view> <view class="weui-cell__bd twoCk"> <view class=\'twoCk-top\'>{{item.name}}</view> <view class=\'twoCk-foot\'>{{item.area}}</view> </view> </label> </checkbox-group> </view> </view> </view>
css
/* pages/manage/punch/selectStudent/index.wxss */ page { background: #f2f2f2; height: 100%; } checkbox-group { background: #fff; } checkbox-group .weui-check__label { border-bottom: 1rpx solid #ccc; height: 50rpx; } .weui-check__hd_in-checkbox{ height: 50rpx; } .weui-cells:before { border: none; } .weui-cells:after, .weui-cells:before { content: " "; position: absolute; left: 0; right: 0; height: 0px; color: #d9d9d9; } .weui-cells:after { border: none; } .weui-cell { position: static; height: 50rpx; } .weui-tab__panel { padding-top: 0rpx; } .weui-navbar { background: #fff; color: #000; position: fixed; top: 0; left: 0; height: 90rpx; } .page__bd { padding-bottom: 0; } .weui-tab__content { padding-top: 60px; text-align: center; } .weui-cell__bd { font-size: 30rpx; color: black; } .twoCk{ display: flex; flex-direction: column; } .twoCk-top{ font-size: 30rpx; } .twoCk-foot{ line-height:1.2; font-size:24rpx; color:#808080; margin-bottom: 10rpx; }