微信小程序开发之快递服务专栏(快递运力查询、寄快递、取消订单)代码篇

这篇文章废话不多,直接上代码

1.工程目录

在这里插入图片描述

需要改动的文件 上图已经标出来了

2.代码

index.js
// index.js
// 获取应用实例
const app = getApp()

Page({

  onShareAppMessage() {
    return {
      title: 'cover-view',
      path: 'page/component/pages/cover-view/cover-view'
    }
  },
  data: {
/*经纬度*/
      latitude: 30.658619,
      longitude: 104.188941,
 /*图标*/
 iconSize: [20, 30, 40, 50, 60, 70],
 iconColor: [
   'red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple' ],
 iconType: [
   'success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear'
 ],

 imageUrl:"http://81.71.14.198/meixiangdao.jpg"  ,
    motto: 'Hello World',
    userInfo:{},
   expressNu:null,
   expressNu1:null,
   expressNu2:null,
   expressNu3:null,
   expressNu4:null,
   expressNu5:null,
   expressNu6:null,
   expressNu7:null,
   expressNu8:null,
   expressNu9:null,
   expressNu10:null,
   expressNu11:null,
   expressNu12:null,
   expressNu13:null,
   expressNu14:null,
   expressNu15:null,
   expressNu16:null,
   expressNu17:null,
   expressNu18:null,
   expressNu19:null,

   expressInfo:null,
   expressInfo1:null,
   expressInfo2:null
  },
  // 事件处理函数
  bindViewTap() {
    wx.navigateTo({
      url: '../logs/logs'
    })
  },
  input:function(e){

    this.setData({expressNu:e.detail.value})
  },
  btnClick:function(){
   // console.log(this.data.expressNu)
   var thispage = this;
    app.getExpressInfo(this.data.expressNu,function(data){
      console.log(data)
   thispage.setData({expressInfo:data})
   });
  },
  input1:function(e){

    this.setData({expressNu1:e.detail.value})
  },  
  input2:function(e){

    this.setData({expressNu2:e.detail.value})
  }, 
   input3:function(e){

    this.setData({expressNu3:e.detail.value})
  },
    input4:function(e){

    this.setData({expressNu4:e.detail.value})
  },  
  input5:function(e){

    this.setData({expressNu5:e.detail.value})
  },  
  input6:function(e){

    this.setData({expressNu6:e.detail.value})
  },  
  input7:function(e){

    this.setData({expressNu7:e.detail.value})
  },  
  input8:function(e){

    this.setData({expressNu8:e.detail.value})
  },  
  input9:function(e){

    this.setData({expressNu9:e.detail.value})
  },  
  input10:function(e){

    this.setData({expressNu10:e.detail.value})
  },  
  input11:function(e){

    this.setData({expressNu11:e.detail.value})
  },  
  input12:function(e){

    this.setData({expressNu12:e.detail.value})
  },  
  input13:function(e){

    this.setData({expressNu13:e.detail.value})
  },  
  input14:function(e){

    this.setData({expressNu14:e.detail.value})
  },  
  input15:function(e){

    this.setData({expressNu15:e.detail.value})
  }, 
   input16:function(e){

    this.setData({expressNu16:e.detail.value})
  },
  btnClick1:function(){
    // console.log(this.data.expressNu)
    var thispage1 = this;
     app.getExpressInfo1(this.data.expressNu1,this.data.expressNu2,this.data.expressNu3,this.data.expressNu4,this.data.expressNu5,this.data.expressNu6,this.data.expressNu7,this.data.expressNu8,this.data.expressNu9,this.data.expressNu10,this.data.expressNu11,this.data.expressNu12,this.data.expressNu13,this.data.expressNu14,this.data.expressNu15,this.data.expressNu16,function(data){
   //  app.getExpressInfo1('四川省成都市龙泉驿区十陵镇成都大学','http://xxx.com/calback','123456','09:00','10:00','黑龙江省佳木斯市汤原县鹤立林业局','2','haha','1777789456','后天','jia','xuexiao','SHIPPER','shunfeng','文件','13845460366',function(data){
   //  app.getExpressInfo1(function(data){
    console.log(data)
    thispage1.setData({expressInfo1:data})
    });
   },
/*取消订单*/
input17:function(e){

  this.setData({expressNu17:e.detail.value})
},
input18:function(e){

  this.setData({expressNu18:e.detail.value})
},
input19:function(e){

  this.setData({expressNu19:e.detail.value})
},
btnClick2:function(){

  var thispage2 = this;
   app.getExpressInfo2(this.data.expressNu17,this.data.expressNu18,this.data.expressNu19,function(data){

  console.log(data)
  thispage2.setData({expressInfo2:data})
  });
 },
  onLoad() {
    if (wx.getUserProfile) {
      this.setData({
        canIUseGetUserProfile: true
      })
    }
  },
  
  
})

index.wxml
  --------------------sf9090的快递服务--------------
<view style="white-space:pre-wrap">
  <image src="{{imageUrl}}" mode="aspectFill">  
</image>  
二维码关注微信公众号!!!更多惊喜 
</view>
<view class="container"style="flex-direction:row;">
  <view class="page-body">
    <view class="page-section page-section-gap">
      <map
        style="width: 1500%; height: 300px;"
        latitude="{{latitude}}"
        longitude="{{longitude}}"
      >     
      </map>
    </view>
  </view>
</view>
  <view class="container1">
    <br style="font-size:20px" > 查询某地快递运力\n</br>    
          <input placeholder="最大输入长度为10" bindinput="input" /> 
            <button type="primary" bindtap = "btnClick"style="position:relative;right:10%; padding:5%;width:100%;height:10%;font-size:80%;background-color:#07c160;color:white;margin-bottom:10%;">查询</button>
              <scroll-view scroll-y="true" style="height:300px;">{{expressInfo.message}}<view wx:for="{{expressInfo.data.details}}" > 
                      {{item.comCode}}{{item.type}}</view>
              </scroll-view>           
      </view>
<view class="container2">
          <br style="font-size:20px" >寄件</br>
          <text>\n</text>
            收件人完整地址 <input placeholder="收件人完整地址,包含省、市、区、街道等" bindinput="input1" /> 
            订单信息回调地址  <input placeholder="订单信息回调地址" bindinput="input2" /> 
            随机数  <input placeholder="随机数" bindinput="input3" /> 
            预约时间    <input placeholder="预约起始时间(HH:mm),例如:09:00" bindinput="input4" /> 
            预约截止时间    <input placeholder="预约截止时间(HH:mm),例如:10:00" bindinput="input5" /> 
            寄件人所在完整地址     <input placeholder="寄件人所在完整地址,包含省、市、区、街道等" bindinput="input6" /> 
            物品总重量     <input placeholder="物品总重量KG,例:1.5,单位kg" bindinput="input7" /> 
            备注      <input placeholder="备注" bindinput="input8" /> 
            收件人手机号  <input placeholder="收件人的手机号,手机号和电话号二者其一必填" bindinput="input9" /> 
            预约日期  <input placeholder="预约日期,例如:今天/明天/后天" bindinput="input10" /> 
            寄件人姓名 <input placeholder="寄件人姓名" bindinput="inpu11" /> 
            收件人姓名<input placeholder="收件人姓名" bindinput="input12" /> 
            支付方式<input placeholder="支付方式,SHIPPER: 寄付(默认),CONSIGNEE: 到付" bindinput="input13" /> 
            快递公司编码<input placeholder="快递公司的编码,一律用小写字母" bindinput="input14" /> 
            物品种类    <input placeholder="物品名称,例:文件(公司编码为jd时,cargo必填)" bindinput="input15" /> 
            寄件人手机号   <input placeholder="寄件人的手机号,手机号和电话号二者其一必填" bindinput="input16" /> 
            <button type="primary" bindtap = "btnClick1"style="position:relative;right:10%; padding:5%;width:100%;height:10%;font-size:80%;background-color:#07c160;color:white;margin-bottom:10%;">寄件</button>
              <scroll-view scroll-y="true" style="height:300px;">
                  <view>
                    [taskId:   {{expressInfo1.data.detail.taskId}} ] [orderId:{{expressInfo1.data.detail.orderId}}][messages:{{expressInfo1.message}}]
                  </view>
              </scroll-view>                         
                   <br style="font-size:20px" > 快递订单取消</br>        
       <text>\n</text>
        cancelMsg:  <input placeholder="取消原因" bindinput="input17" /> 
          orderId:   <input placeholder="订单ID" bindinput="input18" /> 
        taskID:        <input placeholder="任务ID" bindinput="input19" /> 
            <button type="primary" bindtap = "btnClick2"style="position:relative;right:10%; padding:5%;width:100%;height:10%;font-size:80%;background-color:#07c160;color:white;margin-bottom:10%;">确定</button>
              <scroll-view scroll-y="true" style="height:300px;">
                  <view > 
                      {{expressInfo2.data.result}}{{expressInfo2.data.description}}</view>
              </scroll-view>                     
  <view class="icon-box">
    <icon class="icon-box-img" type="success" size="93"></icon>
    <view class="icon-box-ctn">
      <view class="icon-box-title">成功</view>
      <view class="icon-box-desc">用于表示操作顺利完成</view>
    </view>
    </view>
  </view>   

index.wxss
/* pages/chakuaidi/kuaidi.wxss */
input{
  border:2px solid red;
  width:90%;
  margin:5%;
  padding:5px
}
.container1{
  height: 100%;
  width:100%;
  background-color:beige;
}
.container2{
  height: 100%;
  width:100%;
  background-color:beige;
}
.container3{
  height: 100%;
  width:100%;
  background-color:beige;
}
.cover-view {
  position: absolute;
  top: calc(50% - 150rpx);
  left: calc(50% - 300rpx);
  /* opacity: .7; */
}

.flex-wrp{
  display:flex;
}

.flex-item{
  width: 200rpx;
  height: 300rpx;
  font-size: 26rpx;
}

.demo-text-1 {
  background: rgba(26, 173, 25, 0.7);
}

.demo-text-2 {
  background: rgba(39, 130, 215, 0.7);
}

.demo-text-3 {
  background: rgba(255, 255, 255, 0.7);
}
app.js
// app.js
App({
  onLaunch() {
    // 展示本地存储能力
    const logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)

    // 登录
    wx.login({
      success: res => {
        // 发送 res.code 到后台换取 openId, sessionKey, unionId
      }
    })
  },
  /*快递运力查询*/
  getExpressInfo:function(address,cb){
    wx.request({
      url: 'http://gwgp-wat4svkuskr.n.bdcloudapi.com/kdyl/get?address='+address, //仅为示例,并非真实的接口地址
      data: {
        x: '',
        y: ''
      }, 
      header: {
        'Content-Type': 'application/json;charset=UTF-8' ,// 默认值
        'X-Bce-Signature':'AppCode/8a6b23ce2a194b689c7afd96ae539bb8'
      },
      success (res) {
        cb(res.data)
      //  console.log(res.data)
      }
    })
  },
  /*寄快递*/
  getExpressInfo1:function(recManPrintAddr,callBackUrl,salt,pickupStartTime,pickupEndTime,sendManPrintAddr,weight,remark,recManMobile,dayType,sendManName,recManName,payment,comCode,cargo,sendManMobile,cb1){
 wx.request({
      url: 'http://gwgp-wat4svkuskr.n.bdcloudapi.com/kdjj?recManPrintAddr='+recManPrintAddr+'&callBackUrl='+callBackUrl+'&salt='+salt+'&pickupStartTime='+pickupStartTime+'&pickupEndTime='+pickupEndTime+'&sendManPrintAddr='+sendManPrintAddr+'&weight='+weight+'&remark='+remark+'&recManMobile='+recManMobile+'&dayType='+dayType+'&sendManName='+sendManName+'&recManName='+recManName+'&payment='+payment+'&comCode='+comCode+'&cargo='+cargo+'&sendManMobile='+sendManMobile, //仅为示例,并非真实的接口地址
    //url:'http://gwgp-wat4svkuskr.n.bdcloudapi.com/kdjj?recManPrintAddr=天安门前大街xx号xx栋&callBackUrl=http://xxx.com/calback&salt=123456&pickupStartTime=09:00&pickupEndTime=10:00&sendManPrintAddr=贵阳市**区**街道**号&weight=1&remark=xxx&recManMobile=131********&dayType=今天&sendManName=李四&recManName=张三&payment=SHIPPER&comCode=shunfeng&cargo=文件&sendManMobile=130********',
    data: {
        x: '',
        y: ''
      }, 
      method:'post',//
      header: {
        'Content-Type': 'application/json;charset=UTF-8' ,// 默认值
        'X-Bce-Signature':'AppCode/8a6b23ce2a194b689c7afd96ae539bb8'
      },
      success (res) {
        cb1(res.data)
      //  console.log(res.data)
      }
    })
  },
/*取消订单*/
  getExpressInfo2:function(cancelMsg,orderId,taskId,cb){
    wx.request({
      url: 'http://gwgp-wat4svkuskr.n.bdcloudapi.com/order_cancel/get?cancelMsg='+cancelMsg+'&orderId='+orderId+'&taskId='+taskId, //仅为示例,并非真实的接口地址
      data: {
        x: '',
        y: ''
      }, 
   
      header: {
        'Content-Type': 'application/json;charset=UTF-8' ,// 默认值
        'X-Bce-Signature':'AppCode/8a6b23ce2a194b689c7afd96ae539bb8'
      },
      success (res) {
        cb(res.data)
      //  console.log(res.data)
      }
    })
  },
  globalData: {
    userInfo: null
  }
})

3.结果

在这里插入图片描述

更多讲解观看文章
微信小程序开发之快递服务专栏(快递运力查询、寄快递、取消订单)
也就是笔者的下一篇文章

6.获取资源

【获取资源】

1.资源链接:资源获取
2.微信后台回复:快递小程序

【关注微信公众号一起来交流】
  • 0
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

sf9090

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值