#小程序云开发挑战赛#-tusake Today--404
发布于 4 年前 作者 gsun 2428 次浏览 来自 分享

·应用场景

该小程序会将当天的天气提供给用户,用户还可以再小程序中设置一天的行程

·目标用户

主要面向办公人士

·实现思路

通过云开发中的云函数以及数据库等功能来为相应模块提供信息,同时方便后期添加修改信息

·架构图

·效果图

·主要代码

//history
Page({
  data:{
    historyData:[],
    nowDate:'',
    flag:0
  },
  callFunction:function(){
    this.setData({
      flag:1
    })
    console.log("ok");
    wx.cloud.callFunction({
      name:"queryData"
    }).then(res=>{
      console.log(res)
      this.setData({
        historyData:res.result.data
      })
    })  
  },
  onLoad(){
    let nowDate=this.getTime()
    this.setData({
      nowDate:nowDate,
    })
  },
   //获取时间函数
   getTime(){
    let date=new Date()
    let month=date.getMonth()+1
    if(month<10){
      month= '0' +month
    }
    let day=date.getDate()
    if(day<10){
      day= '0' +day
    }
    let monthDay=month+'月'+day+'日'
    console.log(monthDay)
    return monthDay
  },
})
​
//todo1
const db=wx.cloud.database();
const todos=db.collection('toDos');
Page({
  data: {
    task:{},
​
  },
  pageData:{
​
  },
  onLoad:function(options){//options为跳转前页面传来的id
    this.pageData.id=options.id
    todos.doc(options.id).get().then(res=>{
      console.log(res);
      this.setData({
        task:res.data
      })
    })
  },
  //展示小地图的函数
  viewLocation:function(){
    wx.openLocation({
      latitude: this.data.task.location.latitude,
      longitude: this.data.task.location.longitude,
      name: this.data.task.location.name,
      address: this.data.task.location.address
    })
  },
  //完成任务函数
  finishTask:function(){
    console.log(this.data.task._id);
    let id=this.data.task._id
   wx.cloud.callFunction({
     name:'updataData',
     data:{
       //将这条list所对应的_id(数据库)传给云函数让其处理
         id:this.data.task._id
     },
   }).then(console.log)
  },
  //删除任务函数
  deleteTask:function(){
    let id=this.data.task._id
    wx.cloud.callFunction({
      name:'deleteData',
      data:{
          id:this.data.task._id
      },
    }).then(console.log)
  }
 })
​
//todo2
const db=wx.cloud.database();
const todos=db.collection('toDos');
Page({
  data:{
    tasks:[],
    image:'',
  },
    pageData:{//collection.skip()方法是在多条数据的情况下为了实现分页方法
      skip:0,
      locationOnobj:{}
    },
  //-----------------onXXX方法都是生命周期函数-----------------------
  onLoad:function(options){
    this.getData()
 },
  //加载到页面底部的函数
  onReachBottom:function(){
    this.getData()
  },
  //下拉刷新函数
  onPullDownRefresh:function(){
    this.getData(res=>{
      wx.stopPullDownRefresh();
      this.pageData.skip=0;
    })
  },
  //提交表单信息到云端数据库
  onSubmit:function(event){
    todos.add({
      data:{
        status:'进行中',
        title:event.detail.value.title,
        image:this.data.image,
        location:this.pageData.locationOnobj
      }
    }).then(res=>{
      console.log(res)
      wx.showToast({
        title:"添加成功",
        icon:"success",
        success:res2=>{
          wx.redirectTo({
            url: `../toDoInfo/toDoInfo?id=${res._id}`,
          })
        }
      })
    })
  },
  //----------------------以上为 生命周期函数----------------------
  //获取云端数据库数据
  getData:function(callback){
    if(!callback){
      callback=res=>{}
    }
    wx.showLoading({
      title: '数据加载中',
    })
    todos.skip(this.pageData.skip).get().then(res=>{
      let oldData=this.data.tasks;
      this.setData({
        tasks:oldData.concat(res.data)
      },res=>{
        this.pageData.skip=this.pageData.skip+10
        wx.hideLoading()
        callback();
      })
    })
  },
  //选择地址的函数
  chooseLocation:function(e){
     wx.chooseLocation({
       success:res=>{
         console.log(res);
         let locationOnobj={
           latitude:res.latitude,
           longitude:res.longitude,
           name:res.name,
           address:res.address,
         }
         this.pageData.locationOnobj=locationOnobj
       }
     })
  },
  //选择图片函数
  selectImage:function(e){
    wx.chooseImage({
      success:res=>{
        console.log(res.tempFilePaths[0]);
        wx.cloud.uploadFile({//将图片传到云端
           cloudPath:`${Math.floor(Math.random()*10000)}.png`,//云端的图片路径名称(名称要随机生成避免重复)
           filePath:res.tempFilePaths[0]//图片的根路径
        }).then(res=>{
          this.setData({
            image:res.fileID
          })
        }).catch(err=>{
          console.error(err)
        })
      }
    })
  },
})
​
//天气
Page({
  data: {
    address: "暂无",
    latitude: "暂无",
    longitude: "暂无",
    weather: "暂无",
    number: null
  },
  chooselocation: function () {
    wx.chooseLocation({
      latitude: 0,
      longitude: 0,
      success: (result) => {
        wx.showLoading({
          title: 'Loading',
        })
        let i = Math.floor(Math.random() * 10)
        this.setData({
          address: result.address,
          latitude: result.latitude,
          longitude: result.longitude,
        })
        wx.hideLoading()
      },
      fail: () => {
        this.setData({
          address: "出现错误"
        })
      },
    })
​
    wx.cloud.callFunction({
      name:"getWeather"
    }).then(res=>{
      let i = Math.floor(Math.random()*100)%res.result.data[0].weather.length;
      this.setData({
        weather:res.result.data[0].weather[i],
        number:i
      })
    })
  },
})

·视频展示

腾讯视频:https://v.qq.com/x/page/q315339jwmz.html

·源码展示

github:https://github.com/tusake/wx

·体验版

·参赛人员

两只随处可见的大学生

1 回复

现在大学生都论【只】的么

回到顶部