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

客官°小女子只卖身不卖艺 2022-10-17 00:52 401阅读 0赞

### 目录 ###

*  1.工程目录
 *  2.代码
 *  3.结果
 *  6.获取资源

<table> 
 <tbody> 
  <tr> 
   <td><font>这篇文章废话不多，直接上代码</font></td> 
  </tr> 
 </tbody> 
</table>

![20210531202435276.jpg][]

# 1.工程目录 #

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NmOTA5MA_size_16_color_FFFFFF_t_70_pic_center]

<table> 
 <tbody> 
  <tr> 
   <td><font>需要改动的文件 上图已经标出来了</font></td> 
  </tr> 
 </tbody> 
</table>

# 2.代码 #

<table> 
 <tbody> 
  <tr> 
   <td><font>index.js</font></td> 
  </tr> 
 </tbody> 
</table>

// 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
          })
        }
      },
      
      
    })

<table> 
 <tbody> 
  <tr> 
   <td><font>index.wxml</font></td> 
  </tr> 
 </tbody> 
</table>

--------------------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>

<table> 
 <tbody> 
  <tr> 
   <td><font>index.wxss</font></td> 
  </tr> 
 </tbody> 
</table>

/* 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({
        
      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.结果 #

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NmOTA5MA_size_16_color_FFFFFF_t_70_pic_center 1]

<table> 
 <tbody> 
  <tr> 
   <td><font>更多讲解观看文章</font></td> 
  </tr> 
  <tr> 
   <td><font>微信小程序开发之快递服务专栏（快递运力查询、寄快递、取消订单） </font></td> 
  </tr> 
  <tr> 
   <td><font>也就是笔者的下一篇文章 </font></td> 
  </tr> 
 </tbody> 
</table>

# 6.获取资源 #

1.资源链接：[资源获取][Link 1]  
2.微信后台回复：`快递小程序`

![20210531193735226.jpg][]

<table> 
 <tbody> 
  <tr> 
   <td><font>【关注微信公众号一起来交流】</font></td> 
  </tr> 
 </tbody> 
</table>

![20210519112915276.jpg][]

[20210531202435276.jpg]: /images/20221014/09fa68bf6b674c819a778d4a12e110ae.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NmOTA5MA_size_16_color_FFFFFF_t_70_pic_center]: /images/20221014/5cd409c4f12d4245812d8b55f5405a1c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3NmOTA5MA_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221014/22bf6d13910248eb85a465a2d33cca36.png
[Link 1]: https://download.csdn.net/download/sf9090/19001113
[20210531193735226.jpg]: /images/20221014/f1bb166a9e4c476b925c9b8b3e72029e.png
[20210519112915276.jpg]: /images/20221014/e4f8f31fb36540aea5eab27762e6e195.png