微信小程序单双周选择排序有效果图

效果图

.wxml

<view class="group-box">
  <label class="radio" wx:for="{{['单周','双周','全选']}}" wx:key="index" bind:tap="radioChange"
  data-index="{{index}}">
      <radio checked="{{index === zcTem.index}}"/>{{item}}
  </label>
</view>
<view class="week-box">
  <view wx:for="{{zcArray}}" wx:key="index" class="week-item {{zcTem.arr[index]?'active':''}}"
  bind:tap="zcSelect" data-index="{{index}}">
    {{item}}
  </view>
</view>
<view class="label">{{zcTem.label}}</view>

.wxss

view{box-sizing: border-box;}
.group-box{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30rpx 0;
}
.group-box>label{
  display: flex;
  align-items: center;
}
.group-box>label:nth-child(2){
  margin: 0 50rpx;
}
.week-box{
  padding: 0 50rpx;
}
.week-item{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc((100% - 64rpx) / 5);
  height: 68rpx;
  margin: 10rpx 0 0 16rpx;
  background-color: #F3F5F7;
  border-radius: 10rpx;
  transition: background-color 0.3s;
}
.week-item:nth-child(5n + 1){
  margin-left: 0;
}
.active{
  background-color:#07C160;
  color: white;
}
.label{
  text-align: center;
  padding: 30rpx;
}

.js

Page({
  data: {
    zcCount:25,
    zcTem:{
      label: '',
      index: -1,
      arr: []
    },
    zcArray:[],
    zcSingle:[],
    zcDouble:[],
  },
  onLoad(){
    const arr = []
    const single = []
    const double = []
    const zcCount = this.data.zcCount
    const zcTem = this.data.zcTem
    for (let i = 1; i <= zcCount; i++) {
      arr.push(`${i}`)
      zcTem.arr.push('')
      if (i % 2 !== 0) {
        single.push(`${i}`)
        double.push('')
        continue
      }
      single.push('')
      double.push(`${i}`)
    }
    this.setData({
      zcTem,
      zcArray:arr,
      zcSingle:single,
      zcDouble:double,
    })
  },
  radioChange(e){
    const index = e.currentTarget.dataset.index
    const o = this.data.zcTem
    if (index === o.index) {
      o.index = -1
      o.label = ''
      o.arr = []
      this.setData({
        zcTem:o,
      })
      return
    }
    o.index = index
    let tem
    if (index === 0) {
      const d = this.data.zcSingle
      o.label = `第${d[0]}-${d[d.length - 1]}周(单周)`
      tem = JSON.stringify(d)
    } else if (index === 1) {
      const d = this.data.zcDouble
      o.label = `第${d[1]}-${d[d.length - 2]}周(双周)`
      tem = JSON.stringify(d)
    } else {
      const d = this.data.zcArray
      o.label = `第1-${d[d.length - 1]}周`
      tem = JSON.stringify(d)
    }
    o.arr = JSON.parse(tem)
    this.setData({
      zcTem:o,
    })
  },
  zcSelect(e){
    const index = e.currentTarget.dataset.index
    const o = this.data.zcTem
    o.arr[index] = o.arr[index] ? '' : `${index + 1}`
    if (JSON.stringify(o.arr) === JSON.stringify(this.data.zcArray)) {
      o.index = 2
      const d = this.data.zcArray
      o.label = `第1-${d[d.length - 1]}周`
      this.setData({
        zcTem:o
      })
      return
    }
    if (JSON.stringify(o.arr) === JSON.stringify(this.data.zcSingle)) {
      o.index = 0
      const d = this.data.zcSingle
      o.label = `第${d[0]}-${d[d.length - 1]}周(单周)`
      this.setData({
        zcTem:o
      })
      return
    }
    if (JSON.stringify(o.arr) === JSON.stringify(this.data.zcDouble)) {
      o.index = 1
      const d = this.data.zcDouble
      o.label = `第${d[1]}-${d[d.length - 2]}周(双周)`
      this.setData({
        zcTem:o
      })
      return
    }
    const len = o.arr.length
    let arr = ''; let start = ''; let end = '周'; let or = 0; let name = ''
    for (let i = 0; i < len; i++) {
      if (o.arr[i]) {
        if (end === '周') {
          name = parseInt(o.arr[i]) % 2 !== 0 ? '单周' : '双周'
          start = arr ? `,第${o.arr[i]}` : `第${o.arr[i]}`
        }
        if (o.arr[i + 1]) {
          if (or === 2) {
            or = 0
            arr += start + end
            start = ''
            end = '周'
            continue
          }
          or = 1
          end = `-${o.arr[i + 1]}周`
          continue
        }
        if (or !== 1 && o.arr[i + 2]) {
          i += 1
          or = 2
          end = `-${o.arr[i + 1]}${name}`
          continue
        }
        i += or === 1 ? 1 : 2
        or = 0
        if (start) {
          arr += start + end
          start = ''
          end = '周'
        }
      }
    }
    o.index = -1
    o.label = arr
    this.setData({
      zcTem:o
    })
  }
})

遇到问题可以看我主页加我Q，很少看博客，对你有帮助别忘记点赞收藏。