高浪校园小程序

一.项目背景

1.项目地址

wx小程序中搜索  高浪校园 即可快速使用

2.开发过程

本人从零学习并且开发wx小程序,边学边开发,加上后期修改bug等,共计开发时长30天左右。

3.技术栈

微信开发者工具+Vant Weapp+微信云开发(云函数、云数据库、云存储等)+百度智能云数字识别接口+微信开发者文档

4.项目介绍

       该小程序是致力于服务校园内学生生活便利而开发。我所开发的版本主要业务为校园内学生们快递代取服务。该小程序的快递代取不同于以往简单的用户下单,然后我们接到提醒去取,然后送到用户手中。我们具有很大的创新点。我们的业务流程是  快递站快递到达之后---快递站用小程序进行手机号的扫描----扫描完成之后会推送到用户手机上,显示取件码以及快递的一些信息----用户可以选择自己对着发来的取件信息去自行取件,也可以选择我们所提供的一键代取服务---支付费用之后会对应生成一个签收码----只有当我们的骑手送到用户手中,用手机输入签收码,才算本次服务结束-----我们的骑手有负责不同公寓的人员,可以做到更加快捷的送到用户手中。既安全又快速,也减少了用户自己去输入取件信息来影响体验。当然我们也可以自助下单,填写好您要取得快递信息,同样也会生成签收码来确保您的本次安全。

二.项目功能介绍

1.功能流程图

 2.不同身份的功能

(1)快递站身份

快递站扫描手机号,修改默认取件码,修改默认快递大小。修改取件码递增递减规制。一键推送到用户手机上消息提示。删除掉已经扫描上的快递信息。获取用户下单需分拣出的快递。查看今日上架的所有快递信息。查看今天需要代取的所有快递信息。将分拣好的快递修改状态为未分拣。搜索功能模糊匹配手机号显示相关快递详细信息。也可以根据状态码去查询,也可以用签收码去查询。

(2)用户身份

用户首页可以查看到所有自己手机号买的已经到达快递中心的快递信息。也可以查看自己已经签收过的快递信息。删除快递信息。一键代取需要代取的快递。完成微信支付功能后生成一个签收码进入到订单页面。当自己去快递站取回时,可以点击确认签收。也可以像快递站电话质询。

如果快递下单后,用户可以在订单页面实时的查看到快递的状态,可以知道自己的快递已经到了谁的手里,如果有疑问,也可电话咨询快递当前状态。点击签收码可以弹出自己每一个快递专属的签收码。快递员需凭输入该签收码才算完成本次服务。快递状态结束之后,会自动跑到已送达页面处,用户也可以对骑手进行打赏,也可进行删除订单操作。

用户也可以进行自助下单,当输入好快递的取件码,快递站名,快递大小之后,我们会根据快递大小收取一定的费用。然后也会进入到订单页面,但是状态会有所不同,其余功能都和一键代取一样,因为走的不是一个逻辑。

(3)骑手身份

用于获取由一键下单的快递代取服务。

主要功能获取已经分拣好的快递列表,然后分好每一层楼层的快递。点击确认分拣按钮,用户状态就会变成派送中,然后送入到对应的寝室,像用户索取签收码,输入签收码,本次订单完成。如果遇到无法送到用户手中的情况时,可以打电话商量,或者点击派送失败,交给下一位骑手去派送。

(4)超级骑手身份

用于获取由自助下单的快递代取服务。

主要功能获取需要代取的快递列表,然后将快递从快递站中取回来。点击确认分拣按钮,用户状态就会变成运送中,然后送入到对应的寝室,像用户索取签收码,输入签收码,本次订单完成。如果遇到无法送到用户手中的情况时,可以打电话商量,或者点击派送失败,交给下一位骑手去派送。

(5)老板身份

功能有查看今日所有快递站上架的快递,查看今天需要代取的所有订单信息。查看所有的骑手信息,查看所有的快递站信息。查看待分拣的快递,已分拣的快递,派送中的快递,已签收的快递,取件中的快递和运送中的快递。

查看今日的营业额,查看骑手完成订单数量排行榜。查看骑手的完成单数量详情。

三.项目页面展示

快递站的工作页面:                                                修改签收码:

 点击扫描进行手机号的识别:扫描好之后可以修改取件码和尺寸大小等

 

 个人主页界面:                                                      收货地址管理界面:

                         用户首页:                     已签收:                  一键代取:

 用户订单页面:                                                自助下单页面:

 骑手操作界面:                                骑手进行取件:                      骑手进行派送: 

 老板工作台:

 四.项目主要关键功能代码介绍

   部分核心功能及算法设计:

1.取件码递增递减算法

由于我们校园的取件码具有一定的规律,故该算法是只适用于该规制下的取件码递增递减。

核心思想是提取出来末尾不是数字的之前的字符串与后面的数字组成俩个字符串,在将后面加工过的数字最后重新进行一个拼接,返回出去即可得到结果。但是这里会有一个特殊情况就是以0XX数字结尾的字符串。当让数字进行加一的时候,零就会被自动抹去。于是要对这个情况进行一个特殊处理。得到以下得算法。

    var code = "M-1-123";
    var code1 = "A-5-888";
    var code2 = "Y976";
    var code3 = "2C-15";

    var code4 = '12A075';

    var reg = /([a-zA-Z]|\-)\d\d/
    function takeC(code2) {
      var reg = /([a-zA-Z]|\-)\d\d/
      var front1 = code2.slice(0, code2.match(reg).index + 1)
      var behind2 = code2.slice(code2.match(reg).index + 1)
      // console.log(code2.match(reg));
      // console.log(behind2);
      var behind1 = (code2.slice(code2.match(reg).index + 1) * 1 - 1).toString()
      console.log(behind1);
      for (var i = behind1.length; i < behind2.length; i++) {
        behind1='0'+ behind1;
      }
      console.log(front1 + behind1);
    }
    takeC(code4)

2.基于数字识别之后的手机号识别算法

在利用百度智能云数字识别接口之后会返回给我们一个所有数字得数组。然后利用正则表达式匹配规则去匹配符合我们手机号规则得结果返回出去。

   var arr555=[
{words: "2", location: {obj:25}},
 {words: "7", location: {obj:25}},
 {words: "55", location: {obj:25}},
 {words: "901220150", location: {obj:25}},
 {words: "13940928316", location: {obj:25}},
{words: "2112", location: {obj:25}},
{words: "15732292008", location: {obj:25}},
{words: "75358686760163", location: {obj:25}},
 {words: "2", location: {obj:25}},
{words: "20200604", location: {obj:25}},
 {words: "2", location: {obj:25}},
 {words: "153034", location: {obj:25}},
{words: "11", location: {obj:25}},
 {words: "6", location: {obj:25}},
{words: "75358686760", location: {obj:25}},
 {words: "398316", location: {obj:25}},
 {words: "2112", location: {obj:25}},
 {words: "49531", location: {obj:25}}
]

function checkAdult(obj) {
  if(obj.words.match(/^1([358][0-9]|4[579]|66|7[0135678]|9[89])[0-9]{8}$/)){
      return obj
  }
}

console.log(arr555.find(checkAdult).words);

3.数组中同类合并

将数组中apart_number字段相同得放入到同一个对象当中,并且给其添加一个属性childer数组类型来存放他们各自得数据。

        var arr = [{
            apart_number: "十一公寓",
            courier_id: "2b96267b15b005b7edf48d72768",
            istask: true,
            money: 1.58,
            parcel_id: "626679626fe2b500b83a7006a4bd4f",
            push_phone: "",
            room_number: "323",
            sign_date: "2022-05-03T10:58:13.386Z",
            size: "大件",
            state: "待分拣",
            stock_date: "2022-05-02T13:54:59.979Z",
            takeCode: "M-1-123",
            _id: "8f75309d6271f0840139995f1d622d97"

        },
        {
            apart_number: "十一公寓",
            courier_id: "65a2b96267b15b005b7edf48d72768",
            istask: true,
            money: 1.58,
            parcel_id: "684679626fe2b500b83a715aa6c6a6",
            push_phone: "15832045754",
            room_number: "323",
            sign_date: "2022-05-03T06:22:51.322Z",
            size: "小件",
            state: "待分拣",
            stock_date: "2022-05-02T13:54:59.979Z",
            takeCode: "M-1-125",
            _id: "058dfefe62722b2f014dbed13ac90bc3"
        }
        ]
        function formatTreeData(arr){
            var result=[];
            for(let i=0;i<arr.length;i++){
                for(var j=0;j<result.length;j++){
                    if(arr[i].size==result[j].size){
                        result[j].childer.push(arr[i])
                        break
                    }
                }
                if(j==result.length){
                    let arr1={
                 _id: arr[i]._id,
                 childer:[arr[i]],
                 size:arr[i].size
                    }
                    result.push(arr1)
                }
            }
            return result
        }
        console.log(formatTreeData(arr));

4.0-1000随机数

生成一个0-1000得随机数,比较简单啦,没什么解释得

 function random(min, max) {
 
 return Math.floor(Math.random() * (max - min)) + min;

}
random(1,1000)
console.log(random(1,1000));

5.随机生成六位数

这块是为了生成签收码而写出来得算法。也称不上叫算法。我生成数据之后,在浏览器复制下来,以json得格式将数据导入到我建得一个数据库当中,我一共生成了是40000条不重复得数据,每当一个数据被使用,isuse属性就会变为true,这样就可以保证每一快递订单都是唯一得签收码。

function MathRand() {
            var Num = "";
            for (var i = 0; i < 6; i++) {
                Num += Math.floor(Math.random() * 10);
            }
            return Num
        }
        var arr = [];
        for (var j = 0; j < 40000; j++) {
            arr[j] = {
                code: MathRand(),
                isUse: false
            }
            // arr[j].code=MathRand();
            // arr[j].isUse=false;
        }
    //过滤函数,独一无二。使得上述生成得随机数没有重复得第二个
        function unique(arr) {

            for (var i = 0; i < arr.length; i++) {

                for (var j = i + 1; j < arr.length; j++) {

                    if (arr[i].code == arr[j].code) {         //第一个等同于第二个,splice方法删除第二个

                        arr.splice(j, 1);

                        j--;

                    }

                }

            }

            return arr;

        }

6.找寻骑手id

从如下一个对象当中,找出与输入得姓名和密码相同得骑手id

    var arr = {
            apart_number: "一公寓",
            room_number: "458",
            _id: "684266796267c6280033cffb0a6ef26a",
            ride: [
                {
                    cell_number: "15465237755",
                    password: "123456",
                    ride_id: 1,
                    ride_name: "张幻云",
                },
                {
                    cell_number: "98745612356",
                    password: "123456",
                    ride_id: 2,
                    ride_name: "张小小",
                }]
        }

        var username="张幻云";
        var password="kkk";
        function searchId(arr,username,password){
        let result={}; 
        for(let i=0;i<arr.ride.length;i++){
            if(arr.ride[i].ride_name==username&&arr.ride[i].password==password){
                result.ride_id=arr.ride[i].ride_id;
                result.ride_name=arr.ride[i].ride_name;
                result.cell_number=arr.ride[i].cell_number;
                break;
            }
        }
        return result
        }
       let res= searchId(arr,username,password);
       if(JSON.stringify(res)=="{}"){
        console.log("我是空的");
       }else{
           console.log(res);
       }

 五.wx小程序常用功能实现方法总结

1.微信点击即可打电话的方法

 <text class="phone-number" bindtap="clickPhone" 
    data-number='123456'>拨打电话</text>
  //打电话的方法
  clickPhone(e) {
    wx.makePhoneCall({
      phoneNumber: e.target.dataset.number //仅为示例,并非真实的电话号码
    })
  },

2.小程序获取手机号

wxml获取手机号代码

 <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">获取手机号</button>

获取手机号js代码段

  //获取手机号
  getPhoneNumber(e) {
    let cloudID = e.detail.cloudID;
    if (!cloudID) {
      wx.showToast({
        title: '用户未授权',
        icon: 'none',
        duration: 1000
      })
      return
    }
    //loading
    wx.showLoading({
      title: '请稍等',
    })
    wx.cloud.callFunction({
      name: 'userOperation',
      data: {
        type: 'getPhoneNumber',
        cloudID: cloudID
      }
    }).then(res => {
      let phone = res.result.list[0].data.phoneNumber
      wx.hideLoading({
        success: (res) => {
          if (phone) {
            wx.setStorageSync('phone', phone)
            //更新UI
            this.setData({
              phone: phone,
              isbtn: false
            })
            Toast.success('手机号获取成功,请登录');
          }
        },
      })

    }).catch(error => {
      Toast.fail('手机号获取失败');
    })
  },

云函数获取手机号代码段

const cloud = require('wx-server-sdk')

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
  const res=await cloud.getOpenData({
    list:[event.cloudID]
  })
  return res;
}

3.小程序授权登录

<button bindtap="getUserProfile" >授权登录</button>
//获取用户信息
  getUserProfile(e) {
 if(checkNumber(this.data.phone)){
  wx.setStorageSync('phone', this.data.phone)
  wx.getUserProfile({
    desc: '必须授权才能使用', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
    success: (res) => {
      wx.showLoading({
        title: '请稍等',
      })

      if (res.userInfo) {
        let user = res.userInfo;
        //先查询一下是否存在该用户
        db.collection('t_user').where({
          cell_phone: this.data.phone
        }).get().then(res => {
          //存在该用户,直接存本地信息之后跳转
          if (res.data.length > 0) {
            let id = res.data[0]._id;
            wx.hideLoading({
              success: (res) => {
                wx.setStorageSync('id', id)
                wx.setStorageSync('user', user)
                Toast.success('授权成功');
                wx.switchTab({
                  url: '/pages/index/index'
                })
              },
            })
          } else if (res.data.length == 0) {
            //不存在该用户,向数据库中添加新的数据信息
            db.collection('t_user').add({
                data: {
                  cell_phone: this.data.phone,
                  avatar: user.avatarUrl,
                  user_name: user.nickName
                }
              })
              .then(res => {
                if (res.errMsg == "collection.add:ok") {
                  db.collection('t_user')
                    .where({
                      cell_phone: this.data.phone
                    })
                    .field({
                      _id: true
                    })
                    .get().then(res => {
                      let _id = res.data[0]._id;
                      wx.hideLoading({
                        success: (res) => {
                          wx.setStorageSync('user', user)
                          wx.setStorageSync('id', _id)
                          Toast.success('授权成功');
                          wx.switchTab({
                            url: '/pages/index/index'
                          })
                        },
                      })
                    })

                } else {
                  wx.hideLoading({
                    success: (res) => {
                      Toast.fail('用户授权失败,请重新授权');
                    },
                  })
                }
              })
              .catch(console.error)
          }
        })
      } else {
        wx.hideLoading({
          success: (res) => {
            Toast.fail('用户授权失败');
          },
        })
      }
    },
    fail: (res) => {
      Toast.fail('用户授权失败');
    }
  })
 }else{
  wx.showToast({
    title: '手机号格式不对',
    icon: 'none',
    duration: 1000
  })
 }
  },

4.小程序发送订阅消息

  //确认推送方法
  confirmPush() {
    if (this.data.scanedate.length == 0) {
      wx.showToast({
        title: '请勿推送空信息',
        icon: "none"
      })
      return
    }
    wx.showLoading({
      title: '请稍等',
    })
    let newArr = [];
    for (let i = 0; i < data.length; i++) {
      db.collection('t_user')
        .where({
          cell_phone: data[i].push_phone
        })
        .field({
          _openid: true
        })
        .get().then(res => {
          if (res.data[0]) {
            newArr.push(res.data[0])
          }
        })
    }
        //发送订阅消息

        for (let i = 0; i < newArr.length; i++) {
          wx.cloud.callFunction({
            name: 'courierOperation',
            data: {
              type: 'sendMessage',
              courier: wx.getStorageSync('courier').courier,
              date: time.formatTime(new Date(), 'yyyy-MM-dd hh:mm:ss'),
              openid: newArr[i]._openid
            }
        wx.hideLoading({
          success: (res) => {
            wx.showToast({
              title: '上传成功',
              icon: "none"
            })
            this.setData({
              scanedate: []
            })
          },
        })
      } else {
        wx.hideLoading({
          success: (res) => {
            wx.showToast({
              title: '上传失败了',
              icon: "none"
            })
          },
        })
      }
    })
  },

云函数sendMessage代码

const cloud = require('wx-server-sdk')
cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
})
// 云函数入口函数
exports.main = async (event, context) => {
  try {
    const result = await cloud.openapi.subscribeMessage.send({
      "touser": event.openid,           //要发送用户的openid
      "page": 'pages/index/index',        //用户通过消息通知点击进入小程序的页面
      "lang": 'zh_CN',      //进入小程序查看”的语言类型,支持zh_CN(简体中文)、en_US(英文)、zh_HK(繁体中文)、zh_TW(繁体中文),默认为zh_CN
      "data": {           //要发送的数据,这里需要注意的事项,我在下面说
        "thing7": {
          "value": event.courier
        },
        "thing1": {
          "value": '理工大学西区体育馆一楼'
        },
        "time8": {
          "value": event.date
        },
        "thing5": {
          "value": '请在晚六点之前取走哦,点击查看取件码~'
        },
      },
      "templateId": 'jqoGZvWz8tcG5DHoW49IBjj4yp6ZxUGTeszwS9X6aLo',   //订阅消息模板ID
      "miniprogramState": 'formal'   //跳转小程序类型:developer为开发版;trial为体验版;formal为正式版;默认为正式版
    })
    return result.errCode
  } catch (err) {
    console.log(err)
    return err
  }
}

5.小程序云开发云函数的建立

微信云开发当中,建议是可以将所有的调用写到同一个云函数当中,因为微信小程序有云函数创建上限限制20个。具体写法如下,在目录结构中如下所示:

获取用户openid在该目录index.js.文件中正常去写自己的业务逻辑,eg:

const cloud = require('wx-server-sdk');

cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
});

// 获取openId云函数入口函数
exports.main = async (event, context) => {
  // 获取基础信息
  const wxContext = cloud.getWXContext();

  return {
    openid: wxContext.OPENID,
    appid: wxContext.APPID,
    unionid: wxContext.UNIONID,
  };
};

 云函数的主入口文件index.js中使用switch函数来选择调用哪一块的业务逻辑

const getOpenId = require('./getOpenId/index');
const getMiniProgramCode = require('./getMiniProgramCode/index');
const createCollection = require('./createCollection/index');
const selectRecord = require('./selectRecord/index');
const updateRecord = require('./updateRecord/index');
const sumRecord = require('./sumRecord/index');


// 云函数入口函数
exports.main = async (event, context) => {
  switch (event.type) {
    case 'getOpenId':
      return await getOpenId.main(event, context);
    case 'getMiniProgramCode':
      return await getMiniProgramCode.main(event, context);
    case 'createCollection':
      return await createCollection.main(event, context);
    case 'selectRecord':
      return await selectRecord.main(event, context);
    case 'updateRecord':
      return await updateRecord.main(event, context);
    case 'sumRecord':
      return await sumRecord.main(event, context);
  }
};

6.微信支付功能

    wx.cloud.callFunction({
      name: 'userOperation',
      data: {
       type:"payMoney",
      //  outTradeNo:this.data.id,
      body:"高浪校园-打赏骑手", //支付标题,内容
      outTradeNo:'15635'+new Date().getTime(), //订单号,需要保证不重复
       money:this.data.money*100, //支付金额
      },
      success: res => {

        const payment = res.result.payment
        wx.requestPayment({
          ...payment,
          success (res) {
            console.log('支付成功');
                //支付之后
            wx.showLoading({
              title: '请稍等',
            })
                //写自己的功能逻辑
                  wx.hideLoading({
                    success: (res) => {
                      wx.showToast({
                        title: '支付成功',
                        icon: "success"
                      })
                      xxx.setData({
                        rewardShow: false,
                        money: ''
                      })
                    },
                  })
                  })
                }
            
          },
          fail (err) {
            console.log('支付失败');
           wx.showToast({
             title: '取消支付',
             icon:"none"
           })
          }
        })
      },
      fail: console.error,
    })
const cloud = require('wx-server-sdk')
cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
})

exports.main = async (event, context) => {
  const res = await cloud.cloudPay.unifiedOrder({
    "body" : event.body,//商品名称或者商品描述 
    "outTradeNo" : event.outTradeNo,//订单号
    "spbillCreateIp" : "127.0.0.1",
    "subMchId" : "1625011794",//商户号
    "totalFee" : event.money,
    "envId": "cloud1-2ga3je69bf69eb9e",
    "functionName": "paycallback" //支付成功回调函数
  })
  return res
}

7.小程序云数据库的一些操作

聚合操作:将两张表关联起来。详情请见微信文档。按照官方文档搞懂下面的代码之后,剩下的其他任何关于数据库的操作你都可以很容易的写出。

// 云函数入口函数
const cloud = require('wx-server-sdk')
cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
})
const db = cloud.database();
const $ = db.command.aggregate;
const _ = db.command;
exports.main = async (event, context) => {
  return await  db.collection("t_parcel").aggregate() //选择我的审批表
  .match({
    istask:true,
    courier_id:event.courier_id,
    state:_.neq("已签收")
  })
  .lookup({
    from: "t_order", //把t_parcel快递表关联上
    let: {
      parcel_id: '$_id', //快递员的关联字段
    },
    pipeline: $.pipeline() //快递表的关联字段
      .match(
        _.expr($.and([
          $.eq(['$parcel_id', '$$parcel_id']),
          $.eq(['$isdeal', false]),
          // $.eq(['$auto', false]),
        ]))).done(),
    as: 'contect' //匹配的结果作为uapproval相当于起个别名
  })
  .replaceRoot({
    newRoot: $.mergeObjects([ $.arrayElemAt(['$contect', 0]), '$$ROOT' ])
  })
  .project({
    contect: 0
  })
.end({
    success: function (res) {
      return res;
    },
    fail(error) {
      return error;
    }
  })
}

8.小程序格式化日期

一共是有两种方式使用日期格式化函数:

(1)在js中引用日期格式化函数

新建一个文件为Time.js。代码如下:在需要使用的地方直接引入即可使用,eg:

 // 在需要使用的js文件中,导入js  
var util = require('../../utils/util.js');  
Page({  
  data: {  
  time:util.formatTime(new Date())
  },  
  onLoad: function () {  
    // 调用函数时,传入new Date()参数,返回值是日期和时间  
    var time = util.formatTime(new Date());  
    // 再通过setData更改Page()里面的data,动态更新页面的数据  
    this.setData({  
      time: time  
    });  
  }    
})  

const formatTime = (time, option) => {
  const date = new Date(time)
  const year = date.getFullYear()
  const month = date.getMonth() + 1
  const day = date.getDate()
  const week = date.getDay()
  const hour = date.getHours()
  const minute = date.getMinutes()
  const second = date.getSeconds()
  
  //获取 年月日
  if (option == 'YY-MM-DD') return [year, month, day].map(formatNumber).join('-')

  //获取 年月
  if (option == 'YY-MM') return [year, month].map(formatNumber).join('-')

  //获取 年
  if (option == 'YY') return [year].map(formatNumber).toString()

  //获取 月
  if (option == 'MM') return  [mont].map(formatNumber).toString()

  //获取 日
  if (option == 'DD') return [day].map(formatNumber).toString()

  //获取 年月日 周一 至 周日
  if (option == 'YY-MM-DD Week')  return [year, month, day].map(formatNumber).join('-') + ' ' + getWeek(week)

  //获取 月日 周一 至 周日
  if (option == 'MM-DD Week')  return [month, day].map(formatNumber).join('-') + ' ' + getWeek(week)

  //获取 周一 至 周日
  if (option == 'Week')  return getWeek(week)

  //获取 时分秒
  if (option == 'hh-mm-ss') return [hour, minute, second].map(formatNumber).join(':')

  //获取 时分
  if (option == 'hh-mm') return [hour, minute].map(formatNumber).join(':')

  //获取 分秒
  if (option == 'mm-dd') return [minute, second].map(formatNumber).join(':')

  //获取 时
  if (option == 'hh')  return [hour].map(formatNumber).toString()

  //获取 分
  if (option == 'mm')  return [minute].map(formatNumber).toString()

  //获取 秒
  if (option == 'ss') return [second].map(formatNumber).toString()

  //默认 时分秒 年月日
  return [year, month, day].map(formatNumber).join('-') + ' ' + [hour, minute, second].map(formatNumber).join(':')
}

const formatNumber = n => {
  n = n.toString()
  return n[1] ? n : '0' + n
}

const getWeek = n => {
  switch(n) {
    case 1:
      return '星期一'
    case 2:
      return '星期二'
    case 3:
      return '星期三'
    case 4:
      return '星期四'
    case 5:
      return '星期五'
    case 6:
      return '星期六'
    case 7:
      return '星期日'
  }
}

module.exports = {
  formatTime: formatTime
}

(2)在wxml中使用日期格式化函数

新建一个文件为filter.wxs。在wxml中使用方法和代码如下:

	引入:<wxs module="filter" src="/utils/filter.wxs"></wxs>
使用:<text class='valid-text'>有效期:{
   
   {filter.formatTime(data.startTime, 'yyyy-MM-dd')}}</text>

function format(ts, option) {
  var date = getDate(ts)
  var year = date.getFullYear()
  var month = date.getMonth() + 1
  var day = date.getDate()
  var week = date.getDay()
  var hour = date.getHours()
  var minute = date.getMinutes()
  var second = date.getSeconds()
  
  //获取 年月日
  if (option == 'YY-MM-DD') return [year, month, day].map(formatNumber).join('-')

  //获取 年月
  if (option == 'YY-MM') return [year, month].map(formatNumber).join('-')

  //获取 年
  if (option == 'YY') return [year].map(formatNumber).toString()

  //获取 月
  if (option == 'MM') return  [mont].map(formatNumber).toString()

  //获取 日
  if (option == 'DD') return [day].map(formatNumber).toString()

  //获取 年月日 周一 至 周日
  if (option == 'YY-MM-DD Week')  return [year, month, day].map(formatNumber).join('-') + ' ' + getWeek(week)

  //获取 月日 周一 至 周日
  if (option == 'MM-DD Week')  return [month, day].map(formatNumber).join('-') + ' ' + getWeek(week)

  //获取 周一 至 周日
  if (option == 'Week')  return getWeek(week)

  //获取 时分秒
  if (option == 'hh-mm-ss') return [hour, minute, second].map(formatNumber).join(':')

  //获取 时分
  if (option == 'hh-mm') return [hour, minute].map(formatNumber).join(':')

  //获取 分秒
  if (option == 'mm-dd') return [minute, second].map(formatNumber).join(':')

  //获取 时
  if (option == 'hh')  return [hour].map(formatNumber).toString()

  //获取 分
  if (option == 'mm')  return [minute].map(formatNumber).toString()

  //获取 秒
  if (option == 'ss') return [second].map(formatNumber).toString()

  //默认 时分秒 年月日
  return [year, month, day].map(formatNumber).join('-') + ' ' + [hour, minute, second].map(formatNumber).join(':')
}

function formatNumber(n) {
  n = n.toString()
  return n[1] ? n : '0' + n
}

function getWeek(n) {
  switch(n) {
    case 1:
      return '星期一'
    case 2:
      return '星期二'
    case 3:
      return '星期三'
    case 4:
      return '星期四'
    case 5:
      return '星期五'
    case 6:
      return '星期六'
    case 7:
      return '星期日'
  }
}

module.exports.format = format

 六.项目总结与收获

  1. 学会了使用微信开发者工具和微信云开发服务开发小程序。

  2. 通过本次项目,使得自己快速学习一门新知识的能力有大幅度得提升,通过对微信开发者文档的阅读,学会了许多微信官方提供的接口和数据库相关操作。

  3. 大量使用vant-weapp组件,加快了开发的效率,大部分常用的组件都已经学会了如何去灵活的去使用,有了开发手机端软件界面的经验。

  4. 学会了解决兼容性问题,项目当中多次出现IOS系统和Android系统组件使用效果不一样的问题,通过一 一的排查,最后解决问题。还有对于不同操作系统手机调取手机部分内容时,比如手机端时间,不同系统仍会有相异问题。也都相对应得想到了办法去解决。

  5. 运用 iconfont 图标库和 icomoon 将图标的使用方式从对图片png的处理改为对字体的处理,使得http请求减少了60%,并且方便性大大的提升。

  6. 学会了在小程序内部去调用百度智能云得数字识别接口,并且配置小程序,使得其可以访问外部网站,不会对其进行拦截。

  7. 对于小程序得项目配置有了深刻得理解,懂得json文件发挥的重要作用。懂得分包处理的含义,懂得如何上传文件到云存储当中。

  8. 对于后端非关系型数据库得设计有了较深的认知,无论是多表连查的聚合语句还是一些提供计算的运算符操作都较为熟悉,对于非关系型数据库的数据类型有了很深刻的理解。

  9. 体验到了商业项目的开发全部过程,面对面跟客户对接,去了解需求。期间有多次需求变更,给到了我的十足的压力。通过不断的去理解需求,去更改代码逻辑,以及多次的自我开导,也算是顺利的完成了开发。通过这次一人之力完成一个盈利项目,大大增强了我的抗压能力。

  10. 从零开始部署微信小程序,从开发到上传成测试版本,然后审核通过后发布为正式版本,都是自己亲手操作的,懂得了很多得新知识。

猜你喜欢

转载自blog.csdn.net/m0_55315930/article/details/126664514