《仿盒马》app开发技术分享-- 订单提交逻辑完善(74)
## 技术栈Appgallery connect## 开发准备上一节我们实现了兑换订单的提交功能,并且成功的把数据提交到云端,但是我们的业务逻辑并没有完全实现,我们只是把数据提交到了云端,但我们的积分还存在,我们回到积分数据查看的页面也没有消费积分的记录,这一节我们要实现的就是完善订单提交的业务逻辑## 功能分析首先我们要在兑换完成后把用户信息的积分给扣除掉,点击按钮后进行云端交互修改用户信息表
《仿盒马》app开发技术分享-- 兑换订单提交(73)
## 技术栈Appgallery connect## 开发准备上一节我们实现了兑换提交前的准备页面,向用户展示了兑换相关的所有信息,这一节我们就可以实现兑换订单的提交了## 功能分析订单提交我们需要创建对应的兑换商品订单提交信息表,我们需要把地址,商品信息,积分,备注,订单状态,订单创建时间,订单取消时间,订完完成时间等信息都进行存储## 代码实现首先我们创建兑换订单表```css{
《仿盒马》app开发技术分享-- 兑换提交准备(72)
## 技术栈Appgallery connect## 开发准备上一节我们实现了地址的选择,商品数据的展示,我们页面中需要的提交的内容还有所欠缺,我们还需要新增一些展示兑换细节的组件,同时在提交之前还需要实现备注功能,我们还要在页面中展示一些积分相关的内容,告知用户积分的详细情况## 功能分析兑换细节我们可以从商品详情里直接获取展示,备注功能我们需要创建一个自定义弹窗来实现,积分相关的内容我们需要
《仿盒马》app开发技术分享-- 兑换页地址商品展示(71)
## 技术栈Appgallery connect## 开发准备上一节我们实现了商品兑换的校验功能,这能很好的帮助用户节省更多的时间,同时也能减小服务器的开销,同时我们的业务逻辑也会更加的完善功能也更加的丰富了,这一节我们实现校验通过后的内容,实现地址的选择和兑换商品信息的展示## 功能分析地址的选择我们通过获取地址管理页的地址来实现,商品兑换信息的展示我们通过传递详情页的商品id来这个页面继续进行
《仿盒马》app开发技术分享-- 商品兑换校验(70)
## 技术栈Appgallery connect## 开发准备上一节我们实现了可兑换商品的详情,我们能够查看到商品更多的信息,这一节我们来实现商品兑换相关的功能,在进行商品兑换之前,我们在兑换详情页面,点击立即兑换按钮之后我们需要跳转到兑换详情页,但是用户的积分可能达不到我们当前商品的兑换标准,这时候如果我们进入了下个页面,在用户点击确认的时候去校验,就让用户多操作了一步,这样的操作体验非常的不
《仿盒马》app开发技术分享-- 兑换商品详情(69)
## 技术栈Appgallery connect## 开发准备上一节我们实现了兑换商品列表的展示,用户可以在回收之后通过积分页面进入兑换列表页查看当前能够兑换的商品了,我们距离一个完整的app又更近了一步,现在我们要实现的就是当用户点击列表条目的时候能够查看数据详情。## 功能分析在数据列表展示的时候其实我们已经获取到了当前商品的大部分数据,但是为了获取内容的实时性,保证跟云端能够匹配,我们还是通
《仿盒马》app开发技术分享-- 兑换列表展示(68)
## 技术栈Appgallery connect## 开发准备上一节我们创建了积分相关的商品表,我们现在可以针对积分进行更多的操作了,我们首先添加了对应的数据到我们的云数据库中,这一节我们就要把我们存储的数据查询出来展示给用户## 功能分析首先我们需要在进入页面后进行数据查询,数据查出后我们定义对应的集合,然后我们新建一个瀑布流组件,把数据传递进去,进行数据的展示,在引用组件的地方我们传递数据##
《仿盒马》app开发技术分享-- 兑换商品数据插入(67)
## 技术栈Appgallery connect## 开发准备上一节我们实现了积分列表的展示,我们可以更直观的查看当前用户积分的收支情况,但是现在我们只有积分收入并没有消费的地方,所以现在我们开始着手积分兑换相关的内容。这一节我们来实现积分兑换商品的内容## 功能分析首先我们需要创建对应的积分商品表、实体类、db类,现在我们的表是空的,在进行数据展示之前我们先要添加数据,我们创建一个空页面,在生
《仿盒马》app开发技术分享-- 积分信息展示(66)
## 技术栈Appgallery connect## 开发准备上一节我们实现了数据的插入,现在我们需要在tabs中展示我们积分的详细情况了,现在我们只需要从云端进行数据的查询,在页面中拿到数据进行展示就能实现我们想要的效果## 功能分析数据的展示我们通过用自定义组件的方式实现,这样我们的页面不会那么的臃肿,首先在进入页面后我们判断用户信息是否存在,如果用户信息存在,我们通过userid进行数据查
《仿盒马》app开发技术分享-- 插入积分信息(65)
## 技术栈Appgallery connect## 开发准备上一节我们实现了积分页面的大概框架,那么现在我们开始进行数据的填充和查询,积分相关的内容现在之后当回收订单结算之后才会进行积分数据的添加,那我们想查询出对应的积分数据,还需要新增一张积分信息表## 功能分析现在积分相关的有订单结算以及后续的积分兑换功能,我们先实现订单结算的积分新增以及用户信息表的积分总额计算。首先在回收单待完成页面点击
《仿盒马》app开发技术分享-- 积分页组件新增(64)
## 技术栈Appgallery connect## 开发准备上一节我们创建了积分页,给页面添加了标题栏和积分展示的组件。这一节我们继续丰富积分页的内容,添加引导栏,积分明细展示等区域## 功能分析因为页面的关联不强,我们采用组件引入的方式实现引导栏,同时,在下方继续添加对应的tabs组件,方便我们积分明细的展示和查看## 代码实现首先我们实现引导栏的内容```cssimport router f
《仿盒马》app开发技术分享-- 我的积分页(63)
## 技术栈Appgallery connect## 开发准备上一节我们实现了个人中心页面的业务逻辑优化,成功的在用户登陆退出状态下展示对应的组件内容,这一节我们来实现app中另外一个比较重要的模块---积分模块。## 功能分析因为我们的回收订单是跟回收金积分是绑定的,我们在完成回收订单时把对应的金额跟积分已经添加到了用户的个人信息表中,这里我们能够取出总的积分金额。积分的其他信息我们也可以通过
《仿盒马》app开发技术分享-- 个人中心页优化(62)
技术栈Appgallery connect开发准备上一节我们实现了订单逻辑的优化,现在我们的app功能更加的完善了,并且随着我们的迭代逻辑疏漏越来越少,现在我们继续进行优化,在之前的业务逻辑中我们的个人中心页面展示了用户的余额以及积分商城入口,这里我们要展示余额准确的值,积分商城的入口我们修改为积分相关的功能入口。并且展示当前账号的积分余额功能分析因为我们的tabs切换之后会触发组件内的刷新请求逻
《仿盒马》app开发技术分享--未完成订单列表展示逻辑优化(61)
## 技术栈Appgallery connect## 前言:上一节我们实现订单与优惠券的联合提交时,我去到订单列表页面查看生成的订单信息,发现现在的订单从信息展示到价格计算全都是有问题的。所以紧急的把对应的问题修改一下。问题来源:```cssasync aboutToAppear(): Promise<void> { const value = await S
《仿盒马》app开发技术分享-- 订单结合优惠券结算(60)
## 技术栈Appgallery connect## 开发准备上一节我们已经实现了优惠券的选择,并且成功的把券后的价格也展示给用户,不能使用的优惠券我们也用友好的方式告知用户,这一节我们来实现优惠券内容的下一步,优惠券内容结合订单进行结算提交## 功能分析因为我们之前的订单列表是订单相关商品相关是分开的,所以在这里我们同样要把优惠券的内容分开,只存储id进去后续再查询出对应的券金额,我们首先就是要
《仿盒马》app开发技术分享--确认订单选择优惠券(59)
## 技术栈Appgallery connect## 开发准备在上一节我们实现了在确认订单页查询优惠券,但是我们并没有其他优惠券相关的逻辑,我们的目的还是在订单结算的时候去使用我们对应的优惠券,现在我们要在确认订单页去进行优惠券的选择,为了方便用户操作,我们以弹窗的形式展现## 功能分析要实现在弹窗中展示优惠券首先,我们要创建一个自定义弹窗,在弹窗中我们要查询的数据应该是全部的数据,这样我们就能实
《仿盒马》app开发技术分享-- 优惠券逻辑优化(58)
## 技术栈Appgallery connect## 开发准备我们已经实现了优惠券的领取和展示,现在已经趋近于一个完整的电商应用了,但是这时候问题又来了,我们领取完优惠券之后,我们的新用户优惠券模块依然存在,他并没有消失,既然我们是从云数据库中查询的数据,那么我们需要找到一个字段跟他对应起来,来实现新用户领券后关闭这个模块的展示,同时我们在未登录的时候他也要保持隐藏,登录后能实现优惠券的领取。然后
《仿盒马》app开发技术分享-- 优惠券展示页(57)
## 技术栈Appgallery connect## 开发准备上一节我们实现了优惠券的领取功能,并且在云端已经成功查询出优惠券信息,那么我们需要来实现一个优惠券展示的页面来向用户展示当前账号下的优惠券信息,辅助用户更好的去购买需要的商品,因为优惠券会有多种状态,在展示时也要注意不同状态的区分如何处理## 功能分析要实现优惠券的展示我们首先要获取当前登录的用户,因为我们在领取优惠券的时候插入了领券用
《仿盒马》app开发技术分享-- 领取优惠券(56)
## 技术栈Appgallery connect## 开发准备在之前的功能开发中,我们有些功能只有展示的能力并没有与云端产生任何的交互,后续经过我们的迭代,更多的能力有了交互能力,这一节我们就要开始着手给那些静态展示的模块添加业务逻辑,我们现在要实现的是首页的新人优惠券的领取## 功能分析新人优惠券我们在创建的时候给他赋予了一些字段,分别对应了优惠券的id,面额,最小可用金额等,那我们既然需要跟用
《仿盒马》app开发技术分享-- 回收金提现安全锁校验(55)
## 技术栈Appgallery connect## 开发准备上一节我们实现了回收金提现记录的展示功能,我们回收金相关的内容更加的丰富了,在之前的业务逻辑中我们添加了一个设置安全锁的功能,虽然我们成功设置了安全锁,也把对应的表信息提交到云端,但是我们并没有在提现的流程中去使用安全锁相关的内容,这一节我们就把安全锁相关的内容跟提现流程关联起来,让我们的功能安全性更高## 功能分析首先我们在进入提现页