物流仓储领域,APP开发示范和指引
发表时间:2023-11-06 14:02:09
文章来源:炫佑科技
浏览次数:185
菏泽炫佑科技
物流仓储领域,APP开发示范和指引
本文主要针对物流仓储领域,提供APP开发演示和指南,希望能为大家的实际开发提供参考。
1.前端思维导图
2.项目原型图(UI图)
**版原型地址原型链接“外贸类”涉及20+页左右。 如果有兴趣的话可以招人做UI。
3.APP项目创建
3.1 后台创建APP:创建混合开发的APP【官方教程传送门】
3.2 下载调试工具自定义安装包
定制是或iOS安装包,可以安装在采集端进行js开发,并将代码同步到原生APP中,完成快速开发。
3. 拉取代码
是一款用于开发代码并与手机APP同步的开发工具。 我们还可以用它来管理代码、同步到云端、安装git插件、安装断点调试等。
点击项目即可导出云结帐。
3.4 创建证书
一键创建 证书。 这个技巧可以用在其他或者其他证书开发中,这样可以节省创建证书的时间。
3.5 真实设备同步功能
该功能是步骤2和步骤3的集合,通过自定义并将手机和电脑放置在同一个WIFI下,使其处于同一频段下,两者通过IP地址和端口号进行连接。 您可以一起同步您的代码。 (注意,可能会遇到问题,有的需要APP设备有权限才能读取存储)
3.6 项目开发使用的框架
本项目是使用Vue Cli开发的。 Vue Cli 创建一个单页面项目并将 API 方法集成到 Vue 框架中。 = () => { (APP).use().use(Vant) .mount('#APP') } 每个页面都可以使用这个API方法,还有一个打开页面的方法,api。 ({ name: "index",url: "./index",}); 这样就可以打开索引路由的页面了。 通过页面引入let api = .api; 将所有API方法引入页面。
4. APP功能说明
4.1 APP多语言开发
主要思想是对页面的所有元素进行多语言处理。 例如,tip对应英语、中文、韩语,共有三个文件:tip英语文件、tip中文文件、tip韩语文件。
当我们选择中文的时候,我们选择tip中文文件,对应的文件都是中文的。 如果我们选择韩文,则选择提示韩文文件,所有对应的文件都是韩文。
请看源码Chan/vue多语言示例:
中国人
韩国人
4.2 扫描功能
首先在后台将扫描模块添加到项目中,然后添加插件app开发,重新定制,重新安装到手机上。
按照模块文档提供的方法使用模块,即可在js代码中调用该模块。 对于我们的项目来说,可以使用订单号和货架号来识别货物,这对于操作员来说非常简单。
4.3 卡列表
卡列表以水平划分的方式设置界面。 该页面可以通过各个UI的插件库轻松实现。 如果你想自己写的话,总体思路是等分应用块元素,set and,就可以快速搭建起兼容性好的CSS。
4.4 封装预测
包裹预测页面比较难写:
(1) 涉及星号和单词的对齐——可以使用 来实现。
(2)在选择发货仓库和快递公司时,如果想快速选择,可以使用内置的底部弹出框。 可以参考【官方文档】。
(3)利用Vue的双向绑定和数据的地址传递可以实现添加商品。
4.5 传入包裹状态
入库未入库、已入库、待出库、已出库的入库包裹的状态变化很难写。 这个一般是使用vue class的绑定来实现的,也可以使用伪类后的css来实现。 如果需要学习的伪类很少,那么可以关注这里的内容。
4.6 我的地址
我的地址页面是一个很常见的列表页面,我们可以通过UI插件来实现。 这是这个背景的渐变色:-(,#0%,#100%),有机会的话看一下。
4.7 云修复
首先修改xml文件中的文件,设置启用云修复,然后提交到打包后端。 注意一定要提交到打包后端物流仓储领域,APP开发示范和指引,否则不生效。 然后我们就可以发布正常的包了。
如果遇到页面修改问题,可以将修改后的文件上传到云修复后端,然后同步发送,对原版本下的页面进行更改,从而实现云修复。
4.8 闪屏广告侧设置
请注意,启用自定义广告页面时,启用此功能后,应用程序的启动页面将动态显示为您在此处提交的图片。 关闭此功能后,应用程序默认显示“终端设置”中设置的启动页面。
4.9 云端编译
登录您的账户,云编译对应应用下刚刚提交的代码(测试)。 云编译完成后,会出现APP下载的二维码。 用手机扫描下载并安装。 正式版的或iOS软件编译也是在云端编译位置进行的。