12abc/pages/call_roll/call_roll.js

// pages/call_roll/call_roll.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    className: "",
    students:[
      {
        id: "102201",
        name: "Jhon",
        point: 3
      },
      {
        id: "102202",
        name: "Kun",
        point: 2
      },
      {
        id: "102203",
        name: "Tom",
        point: 2
      },
    ],
    rolling: false, // 控制是否滚动
    currentStudentIndex: 0, // 当前选中学生索引
    currentStudentName: "", // 当前显示的学生名称
    rollInterval: null, // 随机点名的定时器
    point: 1, // 设置的积分
  },
  onLoad: function (options) {
    clearInterval(this.data.rollInterval);//清除定时器，防止内存泄漏 
    console.log(options); 
    // options 参数包含了从上一个页面传递过来的数据  
    const receivedClassName = options.className; // 获取传递过来的 className，默认为空字符串  
    // 更新页面的数据  
    this.setData({  
      className: receivedClassName // 将接收到的 className 赋值给页面的 data 属性  
    });

    // const url = `https://your-backend-server.com/api/students?className=${this.data.className}`
    //根据className向后端请求数据
    wx.request({
      url: `http://192.168.152.1:8090/student/${this.data.className}`,
      method: 'GET',  
      success: function(res) {  
        // 后端返回的数据格式如下：  
        // {  
        //   students: [  
        //     { id: "102201", name: "Jhon", point: 3 },  
        //     { id: "102202", name: "Kun", point: 2 },  
        //     { id: "102203", name: "Tom", point: 1 }  
        //   ]  
        // }  
        if (res.statusCode === 200 && Array.isArray(res.data)) {  
          // 使用setData方法更新data内的students数组  
          this.setData({  
            students: res.data
          });  
        } else {  
          console.error('请求成功但数据格式不正确或数据不是数组');  
        }  
      }.bind(this), // 注意这里使用.bind(this)来确保this指向当前页面实例  
      fail: function(err) {  
        console.error('请求失败', err);  
      }
    });
  },

  setPoint: function(e) {
    const value = e.detail.value;  
    // 简单的正则表达式验证，允许负号和数字  
    if (/^-?\d+(\.\d+)?$/.test(value)) {  
      this.setData({  
        point: value  //string类型
      });  
    } else {  
      // 如果输入无效，可以重置输入框的内容或显示提示  
      wx.showToast({  
        title: '请输入有效的数字',  
        icon: 'none'  
      });  
    }
  },

  // 切换随机点名
  toggleRoll: function() {
    const { rolling, students, point } = this.data;
    if (!rolling) {
      this.setData({
        currentStudentName: students[0].name, // 设置初始显示的学生名称
      });
    }
    const newRolling = !rolling;
    if (newRolling) {
      this.startRoll();
    } else {
      console.log(this.data.currentStudentName)
      clearInterval(this.data.rollInterval);
    }
    this.setData({
      rolling: newRolling
    });
  },

  // 开始随机点名
  startRoll: function() {
    const { students, point } = this.data;
    let { currentStudentIndex } = this.data;
    const rollInterval = setInterval(() => {
      const totalPoints = students.reduce((acc, student) => acc + student.point, 0);
      let randomPoint = Math.random() * totalPoints;
      let sum = 0;
      for (let i = 0; i < students.length; i++) {
        sum += students[i].point;
        if (randomPoint < sum) {
          currentStudentIndex = i;
          break;
        }
      }
      this.setData({
        currentStudentIndex,
        currentStudentName: students[currentStudentIndex].name
      });
    }, 100); // 每100毫秒更新一次
    this.setData({
      rollInterval
    });
  },

  confirmPoint: function() {
    const Point = parseInt(this.data.point);
    const id = this.data.students[this.data.currentStudentIndex].id;
    const finalPoint = this.data.students[this.data.currentStudentIndex].point + Point;
    if(finalPoint % 13 === 0){
      finalPoint += 1;  //积分等于13的整数倍加一分
    }
    // this.data.students[this.data.currentStudentIndex].point += point; 不会重新渲染视图
    this.setData({
      ['students[' + this.data.currentStudentIndex + '].point']: finalPoint //会重新更新并渲染视图
    });
    const newStu = this.data.students[this.data.currentStudentIndex];
    //发送请求更新后端数据
    console.log(newStu);
    wx.request({
      url: 'http://192.168.152.1:8090/student/update',
      method: 'PUT',
      data: {
        point: newStu.point,
        name: newStu.name  //只发送修改对象
      },
      header: {  
        'Content-Type': 'application/json' // 设置请求头，指定数据格式为JSON  
      },
      success: function(res) {  
        // 处理后端返回的响应  
        console.log('发送成功', res.data);  
        // 根据需要更新小程序页面的数据或执行其他操作  
      },  
      fail: function(err) {  
        // 处理请求失败的情况  
        console.error('发送失败', err);  
        // 可以向用户显示错误信息或执行其他错误处理操作  
      }  
    });
  },


  goTofunction:function(){
    wx.navigateTo({
      url: '/pages/function/function',
    });
  },
})