10.2 黑马Vue电商后台管理系统 完善订单模块--搜索订单(修改后端)
效果如下:
搜索时列表动态变化,在我专栏下另一篇文章写了,这篇文章不再讲述,这篇文章只讲述如何从后端(打开vue_api_server这个文件夹,而不是vue_shop)修改代码来实现这个功能
我的思路:
1.我在订单的搜索栏中和用户管理模块的搜索栏中进行搜索,发现了订单搜索的sql语句和用户管理的sql语句略微不同。
2.我再去搜索一下商品,发现商品搜索的sql语句和订单的是类似的,都有引号括起来:
3.我又发现了Dao文件夹下面正好没有订单和商品的文件:
4.因此我觉得他们应该放在同一个文件夹下面,并且二者的搜索代码应该是类似的,只是订单模块可能少了代码,导致没办法只在前端调用接口就能实现搜索。
于是,我去找service
文件夹,对比了OrderService.js
和GoodService.js
,发现OrderService.js真的少了一句代码,于是加上了那句代码:
即,在module.exports.getAllOrders
下加入下面这句代码:
if(params.query) {conditions["columns"]["order_number"] = orm.like("%" + params.query + "%");}
仅仅加入这一句代码,其实就完善了前端的getOrderList()这个函数啦!
module.exports.getAllOrders = function(params,cb){var conditions = {};if(!params.pagenum || params.pagenum <= 0) return cb("pagenum 参数错误");if(!params.pagesize || params.pagesize <= 0) return cb("pagesize 参数错误"); conditions["columns"] = {};if(params.query) {conditions["columns"]["order_number"] = orm.like("%" + params.query + "%");}if(params.user_id) {conditions["columns"]["user_id"] = params.user_id;}if(params.pay_status) {conditions["columns"]["pay_status"] = params.pay_status;}if(params.is_send) {if(params.is_send == 1) {conditions["columns"]["is_send"] = '是';} else {conditions["columns"]["is_send"] = '否';}}
之后再找到 routes/orders.js
文件,修改订单列表,加入下面这句代码:
// 订单列表
router.get("/",// 参数验证function(req,res,next) {// 参数验证if(!req.query.pagenum || req.query.pagenum <= 0) return res.sendResult(null,400,"pagenum 参数错误");if(!req.query.pagesize || req.query.pagesize <= 0) return res.sendResult(null,400,"pagesize 参数错误"); next();},// 业务逻辑function(req,res,next) {var conditions = {"pagenum" : req.query.pagenum,"pagesize" : req.query.pagesize};if(req.query.query) {conditions["query"] = req.query.query;}if(req.query.user_id) {conditions["user_id"] = req.query.user_id;}if(req.query.pay_status) {conditions["pay_status"] = req.query.pay_status;}if(req.query.is_send) {conditions["is_send"] = req.query.is_send;}if(req.query.order_fapiao_title) {conditions["order_fapiao_title"] = req.query.order_fapiao_title;}if(req.query.order_fapiao_company) {conditions["order_fapiao_company"] = req.query.order_fapiao_company;}if(req.query.order_fapiao_content) {conditions["order_fapiao_content"] = req.query.order_fapiao_content;}if(req.query.consignee_addr) {conditions["consignee_addr"] = req.query.consignee_addr;}orderServ.getAllOrders(conditions,function(err,result){if(err) return res.sendResult(null,400,err);res.sendResult(result,200,"获取成功");})(req,res,next);}
);
当然不要忘记在前端的Order.vue
中给按钮添加点击事件:
10.2 黑马Vue电商后台管理系统 完善订单模块--搜索订单(修改后端)相关推荐
- 10.1 黑马Vue电商后台管理系统之完善订单管理模块--加入修改订单模块
效果如下: 实现如下: 1.我仍然保留了添加地址这一个对话框,但只是绑定在另一个按钮上面,而点击左侧第一个按钮就会跳转到"修改订单"模块 <template v-slot=& ...
- 9.1黑马Vue电商后台管理系统商品管理模块完善:编辑商品的功能
在原视频中,老师跳过了这个功能,我觉得自己去实现也可以锻炼自己,于是自己补充了编辑功能 同用户管理,权限管理等之前各个模块的编辑功能不同,因为商品具有很多可编辑的选项,所以选择像添加商品一样,单独放在 ...
- Vue电商后台管理系统(1)
Vue电商后台管理系统(1) 登录 在components文件夹下创建登录组件,Login.vue,并快速生成template.script和style骨架. 配置路由,进入router文件夹,导入L ...
- Vue项目实战之电商后台管理系统(二) 主页模块
前言 目录 前言 一.主页布局 1.1 整体布局 1.2 头部区域布局 1.3 左侧菜单布局 1.3.1 静态布局 1.3.2 通过axios请求拦截器来进行权限验证 1.3.3 通过axios获取左 ...
- Vue电商后台管理系统项目开发实战(一)
前言 当下根据不同的应用场景,电商系统一般都提供了PC端,移动APP,移动Web,微信等多种访问方式.如下图. 不同的客户端共用同一个服务器,数据库,API.本次项目着重设计PC后台管理,供电商后台管 ...
- vue电商后台管理系统--订单管理篇
渲染订单table表格 <!-- 订单列表数据 --><el-table :data="orderList" border stripe><el-ta ...
- 关于黑马-Vue电商后台项目管理(2)
2.2 后台项目的环境安装配置 安装MySQL数据库 关于数据库文件,黑马教程有提供一个叫phpstudy的软件,可以按照视频流程进行配置,但是之后可能会经常出现在该软件无法启动mysql.因此我们这 ...
- 10.4 Vue电商后台管理 完善订单模块--用Tab切换对订单进行分类
1. 效果如下: 2. 实现代码 四个el-tab-pane中,< el-table >是一样的: <el-tab-pane name="all" label=& ...
- Vue全家桶 - 电商后台管理系统项目开发实录(详)
目录 1. 项目概述 1.1 电商项目基本业务概述 1.2 电商后台管理系统的功能 1.3 电商后台管理系统的开发模式(前.后端分离) 2. 项目初始化 2.1 前端项目初始化步骤 码云相关操作 2. ...
最新文章
- A标签中通过href和onclick传递的this对象实现思路
- 神经网络与机器学习 笔记—LMS(最小均方算法)和学习率退火
- CTFshow 爆破 web27
- arcgis9.2的安装方法
- cfd计算linux windows,CFD计算分析时常用的数值模拟方法 | 坐倚北风
- SQL2005备份集中的数据库备份与现有的数据库不同,错误号码:3154,解决方法...
- PDH光端机的作用及其特点
- 开放开源 | DeepKE:基于深度学习的开源中文关系抽取工具
- python模拟猫狗大战_tensorflow实现猫狗大战(分类算法)-阿里云开发者社区
- ajax定时器怎么写,js定时器怎么写?就是在特定时间执行某段程序
- mysql如何给数据增加tab_怎么往mysql表里添加数据
- 一步步实现SDDC-vSphere Auto Deploy的妙用
- 从rpm包中提取文件的命令
- Test.ai完成1100万美元A轮融资,Google人工智能基金领投
- python中面向对象的ui_Python面向对象和图形用户界面(一)---- 面向对象
- 苍穹影视双端千月app源码,全新后台
- 字符串匹配算法:从这段代码判断你是不是在大气层
- 如何更换我的密钥对?
- 国产操作系统突破重围,中兴新支点系统宣布:30万+,并发布服务器模式
- adobe captivate 5.5 中文教程