微信小程序开发2
后续完整记事本代码记录
app.js
//app.js
App({
onLaunch: function () {
//调用API从本地缓存中获取数据
var logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
},
getUserInfo:function(cb){
var that = this
if(this.globalData.userInfo){
typeof cb == "function" && cb(this.globalData.userInfo)
}else{
//调用登录接口
wx.login({
success: function () {
wx.getUserInfo({
success: function (res) {
that.globalData.userInfo = res.userInfo
typeof cb == "function" && cb(that.globalData.userInfo)
}
})
}
})
}
},
globalData:{
userInfo:null,
backgroundAudioPlaying:true
}
})
util.js
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 [hour,minute];
// return [ month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
}
function formatNumber(n) {
n = n.toString()
return n[1] ? n : '0' + n
}
function halfHour(){
let timeArr = [];
for (let i =0; i<=48; i++){
if(i % 2==0){
timeArr.push(formatNumber(i/2) +':00');
}else{
timeArr.push(formatNumber(Math.floor(i/2))+":30")
}
}
return timeArr;
}
let timeArr = halfHour();
function setTimeHalf(){
var thisDate = new Date(), thisTime = formatTime(thisDate),lastTimeArr = [],index = 0;
timeArr.map(function(t,i){
let tArr = t.split(":");
if (thisTime[0] >= Number(tArr[0])){
index = thisTime[1]<=30?i:i+1;
}
})
lastTimeArr = timeArr.slice(index);
if (thisTime[1] !== 0 && thisTime[1]!==30){
lastTimeArr.unshift(thisTime[0]+":"+thisTime[1]);
}
return lastTimeArr;
}
module.exports = {
formatTime: formatTime,
setTimeHalf:setTimeHalf
}
index.js
//index.js
var dataUrl = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'
var util = require("../../utils/util.js");
//更改数组 第三个参数是对象
function editArr(arr,i,editCnt){
let newArr = arr,editingObj = newArr[i];
for (var x in editCnt){
editingObj[x]= editCnt[x];
}
return newArr;
}
//获取应用实例
var app = getApp()
Page({
data: {
userInfo: {},
curIpt:'',
showAll:true,
lists:[],
curRange:[],
curBegin:0,
curFinish:1,
remind:[]
},
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function () {
var that = this;
//获取之前保留在缓存里的数据
wx.getStorage({
key: 'todolist',
success: function(res) {
if(res.data){
that.setData({
lists:res.data
})
}
}
})
//获取用户信息
app.getUserInfo(function(userInfo){
that.setData({
userInfo:userInfo
})
})
},
iptChange(e){
let timeArr = util.setTimeHalf();
this.setData({
curIpt:e.detail.value,
curRange:timeArr
})
},
formReset(){
this.setData({
curIpt:'',
curRange:[]
})
},
formSubmit(){
let cnt = this.data.curIpt,newLists = this.data.lists,i = newLists.length,begin=this.data.curRange[this.data.curBegin],finish = this.data.curRange[this.data.curFinish];
if (cnt){
newLists.push({id:i,content:cnt,done:false,beginTime:begin,finishTime:finish,editing:false});
this.setData({
lists:newLists,
curIpt:''
})
}
},
beginChange(e){
this.setData({
curBegin: e.detail.value,
curFinish: Number(e.detail.value)+1
})
},
finishChange(e){
this.setData({
curFinish: e.detail.value
})
},
//修改备忘录
toChange(e){
let i = e.target.dataset.id;
this.setData({
lists:editArr(this.data.lists,i,{editing:true})
})
},
iptEdit(e){
let i = e.target.dataset.id;
this.setData({
lists:editArr(this.data.lists,i,{curVal:e.detail.value})
})
},
saveEdit(e){
let i = e.target.dataset.id;
this.setData({
lists:editArr(this.data.lists,i,{content:this.data.lists[i].curVal,editing:false})
})
},
setDone(e){
let i = e.target.dataset.id,originalDone = this.data.lists[i].done;
this.setData({
lists:editArr(this.data.lists,i,{done:!originalDone})
})
},
toDelete(e){
let i = e.target.dataset.id,newLists = this.data.lists;
newLists.map(function(l,index){
if (l.id == i){
newLists.splice(index,1);
}
})
this.setData({
lists:newLists
})
},
doneAll(){
let newLists = this.data.lists;
newLists.map(function(l){
l.done = true;
})
this.setData({
lists:newLists
})
},
deleteAll(){
this.setData({
lists:[],
remind:[]
})
},
showUnfinished (){
this.setData({
showAll:false
})
},
showAll(){
//显示全部事项
this.setData({
showAll:true
})
},
saveData(){
let listsArr = this.data.lists;
wx.setStorage({
key:'todolist',
data:listsArr
})
}
})
index.wxml
<!--index.wxml-->
<view class="container">
<view bindtap="bindViewTap" class="header">
欢迎<text class="userinfo-nickname">{{userInfo.nickName}}</text>使用
</view>
<form bindsubmit="formSubmit" bindreset="formReset">
<view class="input-wrap">
<input type="text" value='{{curIpt}}' returnKeyType='send' placeholder="请输入待做的事" class="ipt-main" bindinput='iptChange' />
<view class="flex-row flex-time" wx:if="{{curIpt}}">
<picker range='{{curRange}}' value='{{curBegin}}' bindchange='beginChange' class="pick-time time">
<text>
开始时间:{{curRange[curBegin]}}
</text>
</picker>
<picker range='{{curRange}}' value='{{curFinish}}' bindchange='finishChange' class="pick-time time">
<text>
结束时间:{{curRange[curFinish]}}
</text>
</picker>
<label class="time"><switch class="switch" checked bindchange="switch1Change" />提醒</label>
</view>
<view class="flex-row" wx:if="{{curIpt}}">
<button class="btn btn-submit" formType="submit" hover-class="btn-hover">提交</button>
<button class="btn btn-cancel" formType="reset">清空</button>
</view>
</view>
</form>
<view class="list-wrap" wx:if="{{lists.length>0}}">
<view wx:for="{{lists}}" wx:if="{{showAll ||(!showAll && !item.done)}}" id="{{item.id}}" class="{{item.done?'done list':'list'}}">
<text>{{index+1}}:</text>
<text data-id ="{{index}}" class="cnt" bindtap="toChange" >{{item.content}}</text>
<view hidden="{{!item.editing}}" class="edit-wrap">
<input class="ipt-edit" value="{{item.content}}" data-id="{{index}}" bindinput='iptEdit' />
<button class="btn btn-edit" data-id="{{index}}" bindtap="saveEdit">修改</button>
</view>
<text class="time"> {{item.beginTime}}-{{item.finishTime}}</text>
<icon class="ico-done" bindtap="setDone" data-id="{{index}}" type="success_no_circle" size='18' color="{{item.done?'#d7d7d7':'#6fa6cf'}}" />
<icon class="ico-delete" bindtap="toDelete" data-id="{{index}}" type='cancel' size='20' color="#6fa6cf" />
</view>
<view class="footer">
<view class="ft-area">
<text>{{lists.length}}条</text>
</view>
<view class="ft-area ft-mid">
<text wx:if="{{showAll}}" bindtap="showUnfinished" class="ft-action">显示未完成</text>
<text wx:else bindtap="showAll" class="ft-action">显示全部</text>
</view>
<view class="ft-area">
<text bindtap="doneAll" class="ft-action">全部完成</text>
<text bindtap="deleteAll" class="ft-action">全删</text>
</view>
</view>
</view>
<view class="input-wrap mt" wx:if="{{lists.length>0}}">
<button class="btn btn-save" bindtap="saveData">保存数据</button>
</view>
</view>
其他json样式部分未上传
发表评论
要发表评论,您必须先登录。