js根据开始时间计算时间差
DateDifference(item){ var new_date = new Date(); //新建一个日期对象,默认现在的时间 var itemBeginDate = item.begintime ? item.begintime : item.beginTime; itemBeginDate = itemBeginDate.indexOf("|") > 0 ? itemBeginDate.split("|")[0] : itemBeginDate; var old_date = new Date(itemBeginDate); //设置过去的一个时间点,"yyyy-MM-dd HH:mm:ss"格式化日期 var difftime = (new_date - old_date)/1000; //计算时间差,并把毫秒转换成秒 var days = parseInt(difftime/86400); // 天 24*60*60*1000 var hours = parseInt(difftime/3600)-24*days; // 小时 60*60 总小时数-过去的小时数=现在的小时数 var minutes = parseInt(difftime%3600/60); // 分钟 -(day*24) 以60秒为一整份 取余 剩下秒数 秒数/60 就是分钟数 var seconds = parseInt(difftime%60); // 以60秒为一整份 取余 剩下秒数 if(days > 0){ var obj = { text:"已停留:"+days+"天"+hours+"小时"+minutes+"分钟", showicon:true, } return obj }else if(hours > 0){ var obj = { text:"已停留:"+hours+"小时"+minutes+"分钟", showicon:false, } return obj }else if(minutes > 0){ var obj = { text:minutes+"分钟前", showicon:false, } return obj }else{ var obj = { text:"刚刚", showicon:false, } return obj } }
效果图:
在组件中的使用方式:
<el-table-column class-name="table-status" prop="processGroupId" label="状态" width="230"> <template slot-scope="scope"> <div v-if="activeName =='todo' || activeName =='unreadNotice'"> <img class="process-warnicon" src="../assets/img/chaoshi.png" alt="" v-if="DateDifference(scope.row).showicon"> <span style="margin-left: 10px;" :class="{'warn-text':DateDifference(scope.row).showicon}">{{DateDifference(scope.row).text}}</span> </div> </template> </el-table-column>