当前位置: 首页 > news >正文

【前端项目笔记】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分支推送到云端

相关文章:

  • python笔记
  • 详细分析Oracle修改默认的时间格式(四种方式)
  • Anaconda创建虚拟环境+Pycharm和Jupyter使用虚拟环境
  • 数据结构--顺序表
  • flink使用StatementSet降低资源浪费
  • 深入探讨JavaScript中的队列,结合leetcode全面解读
  • nvm安装以及idea下vue启动项目过程和注意事项
  • 华为仓颉编程语言
  • SOLID:软件系统设计的五个基本原则
  • [笔记] 高等数学在各工程门类的典型应用场景
  • adb push 报错 ...error: failed to copy...
  • 数据识别概述
  • Linux多进程和多线程(一)-进程的概念和创建
  • CSS Border(边框)
  • IO多路复用学习
  • 《用数据讲故事》作者Cole N. Knaflic:消除一切无效的图表
  • Invalidate和postInvalidate的区别
  • MySQL数据库运维之数据恢复
  • MySQL主从复制读写分离及奇怪的问题
  • Selenium实战教程系列(二)---元素定位
  • Spring Boot快速入门(一):Hello Spring Boot
  • 服务器从安装到部署全过程(二)
  • 机器学习中为什么要做归一化normalization
  • 区块链技术特点之去中心化特性
  • 扫描识别控件Dynamic Web TWAIN v12.2发布,改进SSL证书
  • 限制Java线程池运行线程以及等待线程数量的策略
  • 一个完整Java Web项目背后的密码
  • 你学不懂C语言,是因为不懂编写C程序的7个步骤 ...
  • ​iOS实时查看App运行日志
  • ​一、什么是射频识别?二、射频识别系统组成及工作原理三、射频识别系统分类四、RFID与物联网​
  • #中的引用型是什么意识_Java中四种引用有什么区别以及应用场景
  • (6)【Python/机器学习/深度学习】Machine-Learning模型与算法应用—使用Adaboost建模及工作环境下的数据分析整理
  • (6)设计一个TimeMap
  • (C语言版)链表(三)——实现双向链表创建、删除、插入、释放内存等简单操作...
  • (k8s中)docker netty OOM问题记录
  • (附源码)spring boot校园拼车微信小程序 毕业设计 091617
  • (三)Kafka 监控之 Streams 监控(Streams Monitoring)和其他
  • (一)Linux+Windows下安装ffmpeg
  • (转)项目管理杂谈-我所期望的新人
  • *** 2003
  • .gitignore文件—git忽略文件
  • .mysql secret在哪_MySQL如何使用索引
  • .NET CF命令行调试器MDbg入门(三) 进程控制
  • .NET Core 版本不支持的问题
  • .net core 的缓存方案
  • .NET LINQ 通常分 Syntax Query 和Syntax Method
  • @cacheable 是否缓存成功_Spring Cache缓存注解
  • @Valid和@NotNull字段校验使用
  • [20150904]exp slow.txt
  • [20180312]进程管理其中的SQL Server进程占用内存远远大于SQL server内部统计出来的内存...
  • [5] CUDA线程调用与存储器架构
  • [Android学习笔记]ScrollView的使用
  • [asp.net core]project.json(2)
  • [bbk5179]第66集 第7章 - 数据库的维护 03
  • [EFI]Lenovo ThinkPad X280电脑 Hackintosh 黑苹果引导文件