前端是leyui后端sqlserver和maraDB进行分页

项目场景:

前端是leyui后端sqlserver和maraDB进行分页,两种数据库在后端分页的不同写法


解决方案:

前端:

定义table,表格的格式在接口返回时进行创建,根据id进行绑定

 <div class="layui-tab-item layui-show" style="padding-top: 10px"><div class="layui-card-body" style="padding:20px 0px;width: 100%"><table class="layui-hide" id="Distribution" lay-filter="Distribution"></table></div></div>

此处用于定于表格的表头处的按钮

<script type="text/html" id="toolbarDemo"><div class="layui-btn-container"><button type="button" class="layui-btn layui-btn-sm" style="background-color: #1E9FFF" id="button1" lay-event="day">今日配送</button><button type="button" class="layui-btn layui-btn-normal layui-btn-sm" id="button2" style="background-color: #FFB800"  lay-event="week">本周配送</button><button type="button" class="layui-btn layui-btn-normal layui-btn-sm" id="button3"  style="background-color: #FF5722"  lay-event="month">本月配送</button><button type="button" class="layui-btn layui-btn-normal layui-btn-sm" id="button4" lay-event="all">查看全部</button></div>
</script>

 定义url和参数以及table和表头处的id选择集

toolbar: '#toolbarDemo', 接收表头id

elem: '#Distribution', 接收table的id

function loadBottledGasHouse (companyID,distributionPerson,customerName,carNum,distributionType,distributionAddress,startTime,endTime){table.render({elem: '#Distribution',url: 'xxx/xxx',toolbar: '#toolbarDemo',page: true,method: 'post',limit: 10,limits: [10, 30, 50,100,300,500],cellMinWidth: 110,where: {"comID": companyID,"distributionPerson": distributionPerson,"customerName": customerName,"carNum": carNum,"distributionType": distributionType,"distributionAddress": distributionAddress,"startTime": startTime,"endTime": endTime},cols: [[{field: 'id', sort: true, title: 'ID', hide: true},{field: 'companyName', sort: true, title: '所属公司',  align: "center",width:200},{field: 'carNum', sort: true, title: '车牌号',  align: "center",width:120},{field: 'customerName', sort: true, title: '客户姓名',  align: "center",width:120},{field: 'customerPhone', sort: true, title: '客户电话',  align: "center",width:120},{field: 'distributionAddress', sort: true, title: '配送地址',  align: "center",width:150},{field: 'distributionType', sort: true, title: '配送方式',  align: "center",width:120,templet : function(d) {var distributionType = d.distributionType;if(distributionType==1){return '整罐换气'}if(distributionType==2){return '自有钢瓶'}if(distributionType==3){return '现场充气'}}},{field: 'inflationVolumeTotal', sort: true, title: '总加气量',  align: "center",width:120},{field: 'inflationVolume', sort: true, title: '钢瓶标签/加气量',  align: "center",width:300},{field: 'distributionTime', sort: true, title: '配送时间',  align: "center",width:200},{field: 'cylinderTotal', sort: true, title: '钢瓶数量',  align: "center",width:120},{field: 'distributionPersonName', sort: true, title: '配送人员',  align: "center",width:120},{align: 'center', toolbar: '#roleTableBarStreet',  title: '操作', align: "center",fixed:'right',width:200}]],done(res){console.log(res)}});return false;
}

以下是生成的表格样式和分页效果

 

下面是后端分页

同样需要将page和limit传入后端并接收

sqlserver和maraDB一样只是业务层和sql不一样

 

@RequestMapping("/url")
public List<AlarmDisposeRecordVO> selectAlarmDisposeRecord(Integer page, Integer limit) {return villageManageService.selectAlarmDisposeRecord(page,limit);
}

业务层

sqlserver直接传就行

public List<AlarmDisposeRecordVO> selectAlarmDisposeRecord( Integer page, Integer limit) {return villageManageMapper.selectAlarmDisposeRecord(page,limit);
}

maraDB则需要计算一下

public List<AlarmDisposeRecordVO> selectAlarmDisposeRecord(Integer comId, Integer page, Integer limit, String alarmCause) {page = (page-1)*limit; // 修改MariaDB 分页return villageManageMapper.selectAlarmDisposeRecord(comId,page,limit,alarmCause);
}

最后是sql的不同

sqlserver

select top ${limit} * from (SELECTISNULL( CAST ( a.disposeStatus AS VARCHAR ), '--' ) AS disposeStatus,COALESCE(CONVERT(VARCHAR(100), a.alarmTime, 120), '--') AS alarmTime,ISNULL( CAST ( b.concNumber AS VARCHAR ), '--' ) AS concNumber,ISNULL( CAST ( a.alarmValue AS VARCHAR ), '--' ) AS alarmValue,ISNULL( CAST ( a.alarmCause AS VARCHAR ), '--' ) AS alarmCauseFROMDKGasRun.dbo.AlarmDis AS a,DKGovtGas.dbo.Concentration AS bWHEREa.equipID = b.IDAND b.companyID = #{comId}<if test="alarmCause=''||alarmCause!=null">AND a.alarmCause LIKE'%' + #{alarmCause} + '%'</if>) nwhere rownumber > ((${page} - 1)*${limit})

maraDB

  SELECTISNULL( CAST ( a.disposeStatus AS VARCHAR ), '--' ) AS disposeStatus,COALESCE(CONVERT(VARCHAR(100), a.alarmTime, 120), '--') AS alarmTime,ISNULL( CAST ( b.concNumber AS VARCHAR ), '--' ) AS concNumber,ISNULL( CAST ( a.alarmValue AS VARCHAR ), '--' ) AS alarmValue,ISNULL( CAST ( a.alarmCause AS VARCHAR ), '--' ) AS alarmCauseFROMdkgasrun.alarmd AS a,dkgovtgas.concentration AS bWHEREa.equipID = b.IDAND b.companyID = #{comId}<if test="alarmCause=''||alarmCause!=null">AND a.alarmCause LIKE CONCAT('%', #{alarmCause}, '%')</if>limit #{page},#{limit};

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/63103.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

@XmlType,@XmlRootElement,@XmlAttribute的作用与区别

XmlType、XmlRootElement 和 XmlAttribute 都是 Java 标准库中 javax.xml.bind.annotation 包提供的注解&#xff0c;用于在使用 JAXB&#xff08;Java Architecture for XML Binding&#xff09;或其他 XML 绑定技术时&#xff0c;控制 Java 类与 XML 数据之间的映射关系。 它…

C++的基类和派生类构造函数

基类的成员函数可以被继承&#xff0c;可以通过派生类的对象访问&#xff0c;但这仅仅指的是普通的成员函数&#xff0c;类的构造函数不能被继承。构造函数不能被继承是有道理的&#xff0c;因为即使继承了&#xff0c;它的名字和派生类的名字也不一样&#xff0c;不能成为派生…

rate-based 拥塞控制吞吐测量

要点&#xff1a;一个方法无法精确刻画链路画像&#xff0c;就用多种方法组合刻画&#xff0c;设计一个 “自定义平均”。 当前 Linux kernel TCP 实现的 TCP delivery rate 测量机制(BBR 有使用到)如下图&#xff1a; 简略后可展示为下图&#xff1a; 详见 net/ipv4/tcp_…

5G NR:RACH流程 -- Msg1发送时RA-RNTI的计算及功率控制

前言 如果阅读了这两篇博文《如何产生PRACH preamble》和《如何选择合适的时频资源发送preamble》&#xff0c;那么对msg1有了基本了解&#xff0c;但是真到了Msg1发送的时候&#xff0c;该怎么处理呢&#xff0c;这里涉及到两个问题&#xff1a; 问题1&#xff1a;发…

数据结构:排序解析

文章目录 前言一、常见排序算法的实现1.插入排序1.直接插入排序2.希尔排序 2.交换排序1.冒泡排序2.快速排序1.hoare版2.挖坑版3.前后指针版4.改进版5.非递归版 3.选择排序1.直接选择排序2.堆排序 4.归并排序1.归并排序递归实现2.归并排序非递归实现 5.计数排序 二、排序算法复杂…

安装cx_Oracle

1&#xff0c;好久不使用的环境安装cx_Oracle 执行 conda install cx_Oracle 报 Invalid version spec: 2. 7 我都python版本是>3.7的 然后根据博客&#xff0c;执行了 conda create -n conda_env_name python3.7 conda4.9.2 下载了一大堆东西。然后重新执行&#xff0c;还…

训练简单的线性模型,预测电影评分和票房收入

文章目录 训练简单的线性模型&#xff0c;预测电影评分和票房收入数据集加载数据可视化数据分割数据集训练模型可视化结果应用模型保存和加载模型 训练简单的线性模型&#xff0c;预测电影评分和票房收入 这是一个简单的线性模型&#xff0c;用于预测电影的评分和票房收入。不…

idea全局搜索失效,Ctrl+shift+F快捷键不起作用

方法1&#xff1a;是否与搜狗等输入法软件存在快捷键冲突&#xff0c;当然也可能是你新下载的什么软件导致的快捷键冲突导致IDEA全局搜索失效。比如下图&#xff1a; 可以改掉输入法的快捷键或者直接关闭输入法的快捷键&#xff0c;这样idea的全局搜索功能就恢复了。 方法2&…

1.9 动态解密ShellCode反弹

动态解密执行技术可以对抗杀软的磁盘特征查杀。其原理是将程序代码段中的代码进行加密&#xff0c;然后将加密后的代码回写到原始位置。当程序运行时&#xff0c;将动态解密加密代码&#xff0c;并将解密后的代码回写到原始位置&#xff0c;从而实现内存加载。这种技术可以有效…

【Cookie和Session的那些事儿】

&#x1f320;作者&#xff1a;TheMythWS. &#x1f386;专栏&#xff1a;《集合与数据结构》 &#x1f387;座右铭&#xff1a;不走心的努力都是在敷衍自己&#xff0c;让自己所做的选择&#xff0c;熠熠发光。 目录 认识Cookie和Session Cookie Cookie对象的特点 Cookie对…

session、cookie、webstorage的区别

Cookie Cookie实际上是一小段的文本信息&#xff0c;是服务器发送到用户浏览器并保存在本地的一小块数据。客户端请求服务器&#xff0c;如果服务器需要记录该用户状态&#xff0c;就使用response向客户端浏览器颁发一个Cookie。客户端会把Cookie保存起来。当浏览器下次向同一…

Unity 之 参数类型之值类型参数的用法

文章目录 基本数据类型结构体结构体的进一步补充 总结&#xff1a; 当谈论值类型参数时&#xff0c;我们可以从基本数据类型和结构体两个方面详细解释。值类型参数指的是以值的形式传递给函数或方法的数据&#xff0c;而不是引用。 基本数据类型 基本数据类型的值类型参数&…

数据库介绍

一.什么是数据库&#xff1f; 通俗的来讲数据库就是用来存放数据的地方&#xff0c;可以理解为和冰箱一样 官方&#xff1a; 数据库&#xff08;Database&#xff09;是按照数据结构来组织、存储和管理数据的仓库。 每个数据库都有一个或多个不同的 API 用于创建&#xff0c;…

说说Flink双流join

分析&回答 Flink双流JOIN主要分为两大类 一类是基于原生State的Connect算子操作另一类是基于窗口的JOIN操作。其中基于窗口的JOIN可细分为window join和interval join两种。 基于原生State的Connect算子操作 实现原理&#xff1a;底层原理依赖Flink的State状态存储&…

第四课:C++实现压缩包破解密码

这里提供一种基于暴力破解的方法: 安装一个压缩工具,比如WinRAR或7-Zip。 使用C++编写程序,读取需要破解密码的压缩包文件。 利用循环和字符串的特性,生成所有可能的密码组合,并逐个尝试打开压缩包。 如果成功打开,则说明找到了正确的密码,程序停止运行并输出密码。 如果…

11.添加侧边栏,并导入数据

修改CommonAside的代码&#xff1a; <template><div><el-menu default-active"1-4-1" class"el-menu-vertical-demo" open"handleOpen" close"handleClose":collapse"isCollapse"><!--<el-menu-it…

Matlab在编码中增加CRC和交织功能

定义CRC生成和检验的类&#xff08;包括函数&#xff09; 我们在MATLAB中定义一个类&#xff08;class&#xff09;&#xff0c;包含了CRC生成函数和检验函数&#xff08;囊括了常用的CRC多项式&#xff09; classdef CRCpropertiesCRCbit_LenpolynomialCRCgenCRCdetendmetho…

高教社杯数模竞赛特辑论文篇-2012年D题:机器人避障问题(附获奖论文及MATLAB代码实现)

目录 摘要 一、问题重述 二、问题分析 2.1 求取最短路径的分析 2.2 最短时间路径的分析 <

UE5打完包后,启动程序不能全屏

最近看到ue5的打包程序后不能默认自动全屏&#xff0c;效果如下&#xff0c;发现并不是全屏的&#xff0c;而且就算点击放大也不是全屏 解决办法&#xff1a;设置如下之后在打包就可以了 但是会一直打印错误的日志&#xff0c;不过这个不影响使用

JS -RSA 明文加密--用户密码加密

1 配置文件引入 加密包 package.json "jsencrypt": "^3.0.0-rc.1",2 加密公钥配置 import { JSEncrypt } from jsencrypt import request from "/utils/request";const RSA_PUBLIC_KEY "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCJVol0cJ…