小程序开发
今天要介绍的是「熊猫签证」小程序,「熊猫签证」小程序能为广大用户提供旅游出行签证办理服务,有可能是全球最智能的签证办理小程序,签证资料电子化,一部手机全部搞定,给你简单、快速、省心、安全的签证办理服务。
本文重点分析这款微信小程序的主要功能,以及对应的数据接口和采用的小程序组件/API技术。让我们离小程序更近一点,传递知识,分享收获。
功能1:显示首页
数据接口:进入首页,显示全部签证范围和类型
用到的小程序组件:view,image,text,tab
用到的小程序API: wx.request
功能2:签证列表
数据接口:点击签证范围,进行签证列表,页面定位长期居然地并且显示不同服务的签证
用到的小程序组件:view,text,image
用到的小程序API: wx.request, wx.getLocation
功能3:签证详情
数据接口:进入签证详情,显示签证的详细内容和签证流程
用到的小程序组件:view,text,button,image,scroll-view
用到的小程序API:wx.request
功能4:上传、提交订单
数据接口:
①资料上传:点击开始办理,进行照片、护照、身份证等资料的上传
②订单提交:资料上传之后,进行申请表的填写,最后进行提交
用到的小程序组件:form,view,text,button,image,scroll-view
用到的小程序API: wx.request,wx.chooseImage
功能5:订单
数据接口:
①我的订单:点击“订单”,显示我的全部订单,并且可以进行其他操作
②取消订单:进入我的订单,点击取消订单,进行订单的取消
用到的小程序组件:image,view,text,tab,button
用到的小程序API: wx.request
功能6:登录
数据接口:
①系统登录:进入资料上传,小程序弹出登录请求
②手机验证:进入申请时,需要手机发验证码进行验证
用到的小程序组件:button,input,form
用到的小程序API: wx.login,wx.getUserInfo,wx.request
总结:「熊猫签证」小程序有19个页面,用到的小程序组件有8个,用的小程序API有4个,分别如下:
前端页面个数:19
分别为:
-
首页:pages/index/index
-
订单:pages/order/order
-
签证列表:pages/visaList/visaList
-
签证详情:pages/visaDetail/visaDetail
-
用户评价:pages/evaluation/evaluation
-
绑定手机号:pages/login/login
-
出行信息:pages/travelMsg/travelMsg
-
资料上传:pages/dataUpload/dataUpload
-
照片:pages/photo/photo
-
护照:pages/passport/passport
-
身份证:pages/idCard/idCard
-
户口本:pages/accountBook/accountBook
-
婚姻状况:pages/marriage/marriage
-
机票预订单:pages/airTickets/airTickets
-
酒店预订单:pages/hotelTickets/hotelTickets
-
居住证:pages/residence/residence
-
辅助资产:pages/assets/assets
-
填写申请表:pages/applyFrom/applyFrom
-
订单确认:pages/orderConfirm/orderConfirm
用到的小程序组件:
view,image,text,tab, button, scroll-view, input,form,
用到的小程序API:
wx.login,wx.getUserInfo,wx.request,wx.getLocation
数据接口API:
-
显示首页
-
签证列表
-
签证详情
-
资料上传
-
订单提交
-
我的订单
-
取消订单
-
登录
-
手机验证