【前端项目笔记】8 订单管理

订单管理

效果展示:
在这里插入图片描述

在开发功能之前先创建分支order
cls 清屏
git branch 查看所有分支(*代表当前分支)
git checkout -b order 新建分支order
git push -u origin order 将本地的当前分支提交到云端仓库origin中命名为order

通过路由方式加载订单列表界面+基础布局

加载订单列表界面:
在这里插入图片描述
在这里插入图片描述
基础布局:
面包屑导航区域+卡片视图区域(搜索区域+Table+分页)
在这里插入图片描述

获取订单列表的数据

在这里插入图片描述

渲染订单的列表数据

在这里插入图片描述

实现订单列表的分页功能

在这里插入图片描述
在这里插入图片描述

实现搜索订单的功能

在这里插入图片描述
写法是这样,但是后台没写模糊搜索接口,无法真正实现

实现修改订单地址的效果

主要实现省市联动效果
由于API文档未提供修改地址的接口,故此处无法实现
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
调整级联选择器宽度:
在这里插入图片描述
效果展示:
在这里插入图片描述

实现物流进度的查询

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
bug:但是一点击查询物流进度按钮后台就崩了
查询了网上的解决方案黑马 Vue 电商后台管理项目中获取物流地址问题解决方法
在这里插入图片描述

将物流进度以时间轴的形式展示到物流进度的面板中

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
效果展示:
在这里插入图片描述
PS:这个接口每次点开显示地数据都不同哈哈哈哈哈

提交订单管理代码

git branch 查看当前所有分支
git status 查看当前文件状态
git add . 将所有已修改和添加文件放到暂存区
git commit -m "完成订单功能的开发" 本地提交代码到当前分支
本地order代码提交已完成
git push 将本地当前分支提交到云端
master还是旧代码
git checkout master 切换到master分支
git merge order 合并order代码
git push 将master分支推送到云端

  • 5
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值