微信小程序一周时间表

Posted 前端开发

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序一周时间表相关的知识,希望对你有一定的参考价值。

   <view class="dateView">
        <image class="dateLeft" bindtap="prevWeek" src="../../res/imgs/dateLeft.png"></image>
        <view>{{dateStart}} 至 {{dateEnd}}</view>
        <image class="dateRight" bindtap="nextWeek" src="../../res/imgs/dateRight.png"></image>
      </view>
.dateView{
  padding:0 32rpx;
  height:98rpx;
  display: flex;
  align-items: center;
  background:#fff;
}
.dateView>image{
  width:50rpx;
  height:50rpx;
}
.dateView>view{
  flex: 1;
  text-align: center;
  color:#333;
  font-size: 34rpx;
}
const GetPeriod = require("../../utils/getperiod.js");
Page({

  /**
   * 页面的初始数据
   */
  data: {
    currentTab: 1,
    dateStart:\'2019-10-16\',
    dateEnd: \'2019-10-16\',
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    let that = this;
  
    that.getWeekStartDate(0)
  },

  //获取本周的开始日期
  getWeekStartDate(numDay) {
    let that = this;
    this.now = new Date();
    this.nowYear = this.now.getYear(); //当前年 
    this.nowMonth = this.now.getMonth(); //当前月 
    this.nowDay = this.now.getDate(); //当前日 
    this.nowDayOfWeek = this.now.getDay(); //今天是本周的第几天 
    this.nowYear += (this.nowYear < 2000) ? 1900 : 0;
    let dateStart = GetPeriod.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay - this.nowDayOfWeek + 1 + numDay));
    let dateEnd = GetPeriod.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay - this.nowDayOfWeek + 7 + numDay));
    // console.log(dateStart)
    // 获取今天日期
    let now = GetPeriod.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay));
    now = now.replace(/-/g, "/");
    now = now.substring(5);
    this.setData({
      dateStart: dateStart,
      dateEnd: dateEnd,
      now: now,
      dates: now,
    })
    // 初始化数据(历史纪录)
    var timestamp = Date.parse(new Date(this.data.dateStart));
    timestamp = timestamp / 1000;
    // console.log(timestamp);
    that.setData({
      timestamp: timestamp
    })
   

  },
// 点击上一周
prevWeek: function(e) {
this.data.num = this.data.num - 7;
this.getWeekStartDate(this.data.num);
},
// 点击下一周
nextWeek: function(e) {
this.data.num = this.data.num + 7;
this.getWeekStartDate(this.data.num);

},

})
function constructor1 (){
  this.now = new Date();
  this.nowYear = this.now.getYear(); //当前年 
  this.nowMonth = this.now.getMonth(); //当前月 
  this.nowDay = this.now.getDate(); //当前日 
  this.nowDayOfWeek = this.now.getDay(); //今天是本周的第几天 
  this.nowYear += (this.nowYear < 2000) ? 1900 : 0;
}
//格式化数字
function formatNumber (n) {
  n = n.toString()
  return n[1] ? n : \'0\' + n
}
//格式化日期
function formatDate(date){
  let myyear = date.getFullYear();
  let mymonth = date.getMonth() + 1;
  let myweekday = date.getDate();
  return [myyear, mymonth, myweekday].map(this.formatNumber).join(\'-\');
}
//获取某月的天数
function getMonthDays (myMonth) {
  let monthStartDate = new Date(this.nowYear, myMonth, 1);
  let monthEndDate = new Date(this.nowYear, myMonth + 1, 1);
  let days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
  return days;
}
//获取本季度的开始月份
function getQuarterStartMonth (){
  let startMonth = 0;
  if (this.nowMonth < 3) {
    startMonth = 0;
  }
  if (2 < this.nowMonth && this.nowMonth < 6) {
    startMonth = 3;
  }
  if (5 < this.nowMonth && this.nowMonth < 9) {
    startMonth = 6;
  }
  if (this.nowMonth > 8) {
    startMonth = 9;
  }
  return startMonth;
}
//获取本周的开始日期
function getWeekStartDate() {
  return this.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay - this.nowDayOfWeek + 1));
}
//获取本周的结束日期
function getWeekEndDate() {
  return this.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay + (6 - this.nowDayOfWeek + 1)));
}
//获取今天的日期
function getNowDate() {
  return this.formatDate(new Date(this.nowYear, this.nowMonth, this.nowDay));
}
function formatTime(date) {
  var year = date.getFullYear()
  var month = date.getMonth() + 1
  var day = date.getDate()
  var hour = date.getHours()
  var minute = date.getMinutes()
  var second = date.getSeconds()
  return [year, month, day].map(formatNumber).join(\'/\') + \' \' + [hour, minute, second].map(formatNumber).join(\':\')
}
module.exports = {
  formatNumber: formatNumber,
  constructor1: constructor1,
  formatDate: formatDate,
  getMonthDays: getMonthDays,
  getQuarterStartMonth: getQuarterStartMonth,
  getWeekStartDate: getWeekStartDate,
  getNowDate: getNowDate,
  getWeekEndDate: getWeekEndDate,
  formatTime: formatTime
}

效果展示

 

以上是关于微信小程序一周时间表的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序一周时间表

微信小程序视图层WXML_模板

7-微信小程序 模板(template)

vscode 开发微信小程序环境配置

微信小程序json数据如何处理?

微信小程序第七天WXML语法之模板用法