微信小程序 拼团商品倒计时(拼团列表、拼团商品详情)
直接上图:
拼团列表、拼团详情-倒计时

//单个倒计时,适用用于单个商品的倒计时
js文件:
//倒计时
function countDown(that) {
var endTime = new Date(that.data.end_time.replace(/-/g, '/')).getTime();
var nowTime = new Date().getTime();
var total_second = endTime - nowTime;
that.setData({
clock: dateformat(total_second)
});
if (total_second <= ) {
that.setData({
clock: "已结束"
});
}
setTimeout(function () {
countDown(that);
}, )
}
// 时间格式化输出,如11:03 25:19 每1s都会调用一次
function dateformat(micro_second) {
// 总秒数
var second = Math.floor(micro_second / );
// 天数
var day = Math.floor(second / / );
// 小时
var hr = Math.floor(second / % );
var hrStr = hr.toString();
if (hrStr.length == ) hrStr = '' + hrStr; // 分钟
var min = Math.floor(second / % );
var minStr = min.toString();
if (minStr.length == ) minStr = '' + minStr; // 秒
var sec = Math.floor(second % );
var secStr = sec.toString();
if (secStr.length == ) secStr = '' + secStr; if (day <= ) {
return "剩 " + hrStr + ":" + minStr + ":" + secStr;
} else {
return "剩 " + day + " 天 " + hrStr + ":" + minStr + ":" + secStr;
}
}
var app=getApp() Page({ /**
* 页面的初始数据
*/
data: {
vieComplete: false,
spellDetail:{},
end_time: '',
clock: '',
servicePhone: ''//咨询电话
}, /**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var that = this wx.request({
url: app.apiRoutes.getGroupBuyDetail,
header: app.apiHeader,
data:{
id:options.id
},
success: function (res) {
var data=res.data.data
var lack_num = data.create_num - data.current_num
data.lack_num = lack_num
var description = data.goods.description == null ? '' : data.goods.description;
WxParse.wxParse('description', 'html', description, that, );
that.setData({
spellDetail:data,
end_time: data.end_time
}) //倒计时
countDown(that);
}
}) })
//适用于商品列表倒计时/** * end_time int 结束时间 * param int 数组键 */
js文件:
//倒计时
function grouponcountdown(that, end_time, param) {
var EndTime = new Date(end_time).getTime();
var NowTime = new Date().getTime(); var total_micro_second = EndTime - NowTime; var groupons = that.data.groupon;
groupons[param].endtime = dateformat(total_micro_second);
if (total_micro_second <= ) {
groupons[param].endtime = "已结束"
}
that.setData({
groupon: groupons
})
setTimeout(function () {
grouponcountdown(that, end_time, param);
}, )
} // 时间格式化输出,每1s都会调用一次
function dateformat(micro_second) {
// 总秒数
var second = Math.floor(micro_second / );
// 天数
var day = Math.floor(second / / );
// 小时
var hr = Math.floor(second / % );
var hrStr = hr.toString();
if (hrStr.length == ) hrStr = '' + hrStr; // 分钟
var min = Math.floor(second / % );
var minStr = min.toString();
if (minStr.length == ) minStr = '' + minStr; // 秒
var sec = Math.floor(second % );
var secStr = sec.toString();
if (secStr.length == ) secStr = '' + secStr; if (day <= ) {
return "剩 " + hrStr + ":" + minStr + ":" + secStr;
} else {
return "剩 " + day + " 天 " + hrStr + ":" + minStr + ":" + secStr;
}
} var app=getApp()
Page({ /**
* 页面的初始数据
*/
data: {
groupon:[]
},
//拼团详情
toSpellingDetail:function(e){
wx.navigateTo({
url: '/pages/spelling/spellingDetail?id='+e.currentTarget.id,
})
}, /**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
app.showLoading();
var that = this wx.request({
url: app.apiRoutes.getGroupBuyList,
header: app.apiHeader,
success:function(res){
var grouponList=res.data.data
for (var i = ; i < grouponList.length; i++) {
var lack_num = grouponList[i].create_num - grouponList[i].current_num
grouponList[i].lack_num = lack_num
} that.setData({
groupon: grouponList
})
var data = that.data.groupon
//列表获取到数据进行遍历
for (var i = ; i < data.length; i++) {
var end_time = data[i].end_time.replace(/-/g, '/')
grouponcountdown(that,end_time, i)
}
app.hideLoading();
},
fail:function(){
app.hideLoading();
}
})
},
本文参考于:https://blog.csdn.net/con_knife/article/details/79506327
微信小程序 拼团商品倒计时(拼团列表、拼团商品详情)的更多相关文章
- 微信小程序 项目实战(三)list 列表页 及 item 详情页
1.项目结构 2.list 列表页 (1)数据(逻辑) list.js // pages/list/list.js Page({ /** * 页面的初始数据 */ data: { title: '加载 ...
- 微信小程序实现按首字母检索城市列表
不说废话,上效果图 因为我有多处要用到,所以我这里是写成自定义组件的,你也可以直接改成在page页面编写: 布局左边一个scroll-view,显示城市列表,右边一个view显示字母列表,城市列表这边 ...
- 微信小程序- 提示不在以下合法域名列表中
第一次开发微信小程序时在访问后台数据时总是提示 提示上面问题主要有两个原因: 1.为配置安全合法域名列表: 微信小程序在开发时需要在官网配置固定的数据来源网站: 登录小程序平台中->设置: 图中 ...
- 微信小程序(12)--倒计时
记录一个常见的效果,倒计时. <text>倒计时:{{content}}</text> Page({ /** * 页面的初始数据 */ data: { endTime: '', ...
- 微信小程序发送手机验证码---倒计时
var currentTime = 59 //倒计时的事件(单位:s)var interval = null //倒计时函数 Page({ data: { time:59 //倒计时 }, onLoa ...
- 微信小程序开发学习资料
作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- 微信小程序学习指南
作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- 微信小程序导航:官方工具+精品教程+DEMO集合(1月7更新)
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=14764346784612:简易教程:https://mp.weixin.qq.com/debug ...
- 微信小程序踩坑集合
1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...
- Odoo 开源微信小程序商城模块
详见:http://oejia.net/blog/2018/09/13/oejia_weshop_about.html oejia_weshop Odoo 微信小程序商城模块 oejia_weshop ...
随机推荐
- 02->交互式图形学--用glut库实现Sierpinski镂垫
Sierpinski图形是一类有趣的图形,本文结合交互式图形学教材,讲解Sierpinski镂垫图形生成,作为入门图形学编程的第一课.为了简便,本文就2D来进行讨论.实验环境见01 算法 主要是根据随 ...
- ARM GNU 专有符号
1. @ 表示注释从当前位置到行尾的字符. 2. # 注释掉一整行. 3. ; 新行分隔符.
- HLS 视频加密小记
我是在ubuntu中,安装好了 ffmpeg 加密用的 key(生成一个encrypt2.key文件) openssl rand 16 > encrypt2.key 另一个是 iv(生成一段字符 ...
- drupal7权限控制之-如何访问未发表的node
在某些特殊需求的情况下,会涉及到匿名用户或非node节点所有者,访问未发表的node节点的需求:或者需要根据不同的用户角色,访问不同的内容类型等,如果不想安装node_access等模块的时候,可以在 ...
- Altera的primary register和secondary register
在Altera的一些IP文档上,提到IP的资源使用情况时,会有primary logic register和secondary logic register这样的术语. 那么什么是primary/se ...
- 线段树逆序对(偏序)——cf1187D好题!
/* 排除掉所有不可能的情况,剩下的就是可行的 1.数的数量不相同 2.对任意一个区间进行排序,等价于可以交换任意逆序对, 那么从1到n扫描b数组,判断是否可以将a数组中等于b[i]的值所在的位置j交 ...
- Ros node启动与关闭
1. ros运行单位: Ros程序运行的单位是ros node. 2. ros 节点的启动: (1)初始化ros节点:通过调用ros::init()接口实现:可以通过参数指定默认节点名字,之所以是默认 ...
- C#实现程序开机启动
如何用c#实现开机启动?其实用c#实现程序的开机启动大致有两种方法,就是写入注册表或者采用服务程序,最近一直研究着用C#来操作注册表,下面介绍的方法便是用注册表来实现程序随开机启动(高手就不用看了,嘿 ...
- 理解云计算三种服务模式——IaaS、PaaS和SaaS
云计算的服务模式仍在不断进化,但业界普遍接受将云计算按照服务的提供方式划分为三个大类: SaaS(Software as a Service–软件即服务) PaaS(Platform as a Ser ...
- PHP 统计数组中所有的值出现的次数 array_count_values 函数
array_count_values() 函数用于统计数组中所有的值出现的次数. array_count_values() PHP array_count_values() 函数用于统计数组中所有的值 ...