【JSON2WEB】 13 基于REST2SQL 和 Amis 的 SQL 查询分析器

【JSON2WEB】01 WEB管理信息系统架构设计

【JSON2WEB】02 JSON2WEB初步UI设计

【JSON2WEB】03 go的模板包html/template的使用

【JSON2WEB】04 amis低代码前端框架介绍

【JSON2WEB】05 前端开发三件套 HTML CSS JavaScript 速成

【JSON2WEB】06 JSON2WEB前端框架搭建

【JSON2WEB】07 Amis可视化设计器CRUD增删改查

【JSON2WEB】08 Amis的事件和校验

【JSON2WEB】09 Amis-editor的代码移植到json2web

【JSON2WEB】10 基于 Amis 做个登录页面login.html

【JSON2WEB】11 基于 Amis 角色功能权限设置页面

【JSON2WEB】 12基于Amis-admin的动态导航菜单树


关于数据的问题没有一句SQL不能解决的,如果有就两句。
我设计开发的所有信息系统 内嵌 SQL 查询分析器是标配,可执行CRUD的操作,也就是SQL的Insert、Select、Update、Delete操作。号称SQL的四大基本操作。

SQL才是做完美的存在。BS前端就不吐槽了,知识点太多,比上下五千年的历史事件还多,比地球上的乡村还多。

1 数据库端设计

针对Oracle数据设计,创建2个视图。

1.1 用户表视图

create or replace view user_tabs as
select t.table_name, tab_cnt(t.table_name) as row_count ,c.comments
from user_all_tables t --用户表视图
left join user_tab_comments c on c.table_name = t.table_name
order by t.table_name;

在这里插入图片描述

1.2 用户表和视图的视图

create or replace view user_table_view_v as
select table_name as s_name,comments, 'TABLE' as s_type from user_tabs
union all -- 用户表和视图的视图
select view_name as s_name,'' as comments, 'VIEW' as s_type from user_views
;

在这里插入图片描述

2 REST2SQL的微调

只修改一下 REST2SQL - dothing.go 文件的 doSQL()函数即可。

2.1 doSQL()的代码

// 根据请求参数执行不同的SQL操作 //
func doSQL(w http.ResponseWriter, req map[string]interface{}) {//w.Write([]byte("\ndoSQL()\n"))//w.Write([]byte("\"data\":"))//资源名sql语句resSQL := req["ResName"].(string)fmt.Println("SQL://", resSQL)sqlToUpper := strings.ToUpper(resSQL)sql6 := sqlToUpper[:6]var result stringswitch sql6 {case "SELECT":result = Icrud.SelectData(resSQL)case "INSERT":result = "[" + Icrud.InsertData(resSQL) + "]"case "UPDATE":result = "[" + Icrud.UpdateData(resSQL) + "]"case "DELETE":result = "[" + Icrud.DeleteData(resSQL) + "]"default:// 过滤sql ,只能执行 SELECT INSERT UPDATE DELETEresult = "\"只能执行 SELECT INSERT UPDATE DELETE\""}logger.Alog(true, fmt.Sprint("SQL:", resSQL))// w.Write([]byte(result))// w.Write([]byte("}"))var dataset []map[string]interface{}// json串反序列化err := json.Unmarshal([]byte(result), &dataset)if err != nil {fmt.Println("Error:", err)return}// 返回数据rows := make(map[string]interface{})rows["rows"] = dataset//data := make(map[string]interface{})rw := returnMap()rw["data"] = rows// 输出到 http.ResponseWriterhttpResWriter(w, rw)
}

重点就是所有的查询返回结果统一化。

2.2 SELECT 的返回结果

http://127.0.0.1:5217/sql/select * from s_role

{"data": {"rows": [{"P_ID": "R010","S_NAME": "开发测试role","S_NOTE": null,"TIME_STAMP": null},{"P_ID": "R100","S_NAME": "测试10","S_NOTE": "1000","TIME_STAMP": "2024-04-09T17:08:42.794Z"},{"P_ID": "R020","S_NAME": "系统管理","S_NOTE": null,"TIME_STAMP": null},{"P_ID": "R030","S_NAME": "静态数据","S_NOTE": null,"TIME_STAMP": null},{"P_ID": "R040","S_NAME": "动态数据","S_NOTE": null,"TIME_STAMP": "2024-04-09T17:21:18.603Z"},{"P_ID": "R050","S_NAME": "管输排产","S_NOTE": null,"TIME_STAMP": null},{"P_ID": "S520","S_NAME": "BS静态数据","S_NOTE": null,"TIME_STAMP": "2024-04-08T15:39:58.489Z"},{"P_ID": "S510","S_NAME": "BS系统管理","S_NOTE": null,"TIME_STAMP": "2024-04-10T15:33:15.739Z"}]},"msg": "","status": 0
}

2.3 INSERT 的返回结果

http://127.0.0.1:5217/sql/insert into s_role (p_id,s_name) values (‘RRR’,‘测试数据随后就删除’)

{"data": {"rows": [{"Insert rowsAffected": 1}]},"msg": "","status": 0
}

2.4 UPDATE 的返回结果

http://127.0.0.1:5217/sql/update s_role set s_name = ‘SSSS’ where p_id = ‘RRR’

{"data": {"rows": [{"Update rowsAffected": 1}]},"msg": "","status": 0
}

2.5 DELETE 的返回结果

http://127.0.0.1:5217/sql/delete s_role where p_id = ‘RRR’

{"data": {"rows": [{"Delete rowsAffected": 1}]},"msg": "","status": 0
}

3 基于Amis-Editor的 SQL 查询分析器页面

3.1 页面布局 在这里插入图片描述

左边栏列出用户表和视图,右上未 SQL 输入编辑区域,右下为 SQL 执行结果JSON输出区域。

3.2 左边栏

放一个 crud2 设置及代码如下:

{"type": "crud2","id": "u:2350a7316069","mode": "table2","dsType": "api","syncLocation": true,"primaryField": "s_name","loadType": "","api": {"url": "http://127.0.0.1:5217/rest/user_table_view_v","method": "get"},"filter": {"type": "form","title": "表或视图查询","mode": "inline","columnCount": 1,"clearValueOnHidden": true,"behavior": ["SimpleQuery"],"body": [{"name": "S_NAME","label": "名称","type": "input-text","size": "full","required": false,"behavior": "SimpleQuery","id": "u:120b4ef2515e"},{"name": "COMMENTS","label": "备注","type": "input-text","size": "full","required": false,"behavior": "SimpleQuery","id": "u:201a4c336663"}],"actions": [{"type": "reset","label": "重置","id": "u:1c5e9794de0a"},{"type": "submit","label": "查询","level": "primary","id": "u:4bd7edd74974"}],"id": "u:714d678e7896","feat": "Insert"},"headerToolbar": [{"type": "flex","direction": "row","justify": "flex-start","alignItems": "stretch","items": [{"type": "container","align": "left","behavior": ["Insert","BulkEdit","BulkDelete"],"body": [{"type": "tpl","tpl": "鼠标双击行可以生成 SELECT 查询语句","inline": true,"wrapperComponent": "","id": "u:81c3176e9478"}],"wrapperBody": false,"id": "u:e754ddc5a2a5"},{"type": "container","align": "right","behavior": ["FuzzyQuery"],"body": [],"wrapperBody": false,"id": "u:81f562752dea"}],"id": "u:21f94630ae3e","isFixedHeight": false,"isFixedWidth": false}],"footerToolbar": [{"type": "flex","direction": "row","justify": "flex-start","alignItems": "stretch","style": {"position": "static"},"items": [{"type": "container","align": "left","body": [],"wrapperBody": false,"style": {"flexGrow": 1,"flex": "1 1 auto","position": "static","display": "flex","flexBasis": "auto","flexDirection": "row","flexWrap": "nowrap","alignItems": "stretch","justifyContent": "flex-start"},"id": "u:ad6a4c49cf11"},{"type": "container","align": "right","body": [{"type": "pagination","behavior": "Pagination","layout": ["total","perPage","pager"],"perPage": 50,"perPageAvailable": [10,20,50,100,500],"align": "right","id": "u:0fac899d9be2"}],"wrapperBody": false,"style": {"flexGrow": 1,"flex": "1 1 auto","position": "static","display": "flex","flexBasis": "auto","flexDirection": "row","flexWrap": "nowrap","alignItems": "stretch","justifyContent": "flex-end"},"id": "u:1307d8ea5a6b"}],"id": "u:c01dcade7257"}],"columns": [{"type": "tpl","title": "名称","name": "S_NAME","id": "u:e8cb1c25ee76","placeholder": "-"},{"type": "tpl","title": "备注","name": "COMMENTS","id": "u:d09e124643fc","placeholder": "-"},{"type": "tpl","title": "类型","name": "S_TYPE","id": "u:d25820de66dd","placeholder": "-"}],"editorSetting": {"mock": {"enable": true,"maxDisplayRows": 5}},"loadDataOnce": true,"onEvent": {"rowDbClick": {"weight": 0,"actions": [{"componentId": "u:e92cb0a1b8d7","ignoreError": false,"actionType": "setValue","args": {"value": "${\"select * from \" + event.data.item.S_NAME}"}}]}},"matchFunc": ""
}

这里重点是加了一个行双击事件生成Select查询语句并赋值给 SQL 编辑框。

"onEvent": {"rowDbClick": {"weight": 0,"actions": [{"componentId": "u:e92cb0a1b8d7","ignoreError": false,"actionType": "setValue","args": {"value": "${\"select * from \" + event.data.item.S_NAME}"}}]}}

3.3 右上区域

先放一个面板panel,再在面板的内容去放一多行文本框即可,相关设置代码如下:

{"type": "panel","title": "SQL编辑器","body": [{"type": "textarea","label": "","name": "sql","id": "u:e92cb0a1b8d7","minRows": 6,"maxRows": 10,"value": "select sysdate from dual","validateOnChange": false,"clearable": true}],"id": "u:9d0e47e56bfb","affixFooter": true,"actions": [{"type": "button","label": "执行","onEvent": {"click": {"actions": [{"componentId": "","ignoreError": false,"actionType": "ajax","args": {},"outputVar": "responseResult","options": {},"api": {"url": "http://127.0.0.1:5217/sql/${sql}","method": "get","requestAdaptor": "","adaptor": "","messages": {}}},{"componentId": "u:505178345a09","ignoreError": false,"actionType": "setValue","args": {"value": "${event.data.responseResult.responseData|json}"}}]}},"id": "u:6ded52fac842","size": "lg","block": false,"level": "warning","themeCss": {"className": {"font:default": {"fontSize": "var(--fonts-size-7)","text-align": "center"},"padding-and-margin:default": {}}}},{"type": "button","label": "复制SQL","onEvent": {"click": {"actions": [{"ignoreError": false,"actionType": "copy","args": {"copyFormat": "text/plain","content": "${sql}"}}]}},"id": "u:eee1cae708cb","themeCss": {"className": {"padding-and-margin:default": {}}},"block": false,"size": "md","level": "info"},{"type": "button","label": "复制结果JSON","onEvent": {"click": {"actions": [{"ignoreError": false,"actionType": "copy","args": {"copyFormat": "text/plain","content": "${result}"}}]}},"id": "u:a2396ccdb96b","level": "success"}],"subFormMode": "","actionsClassName": "m-xs","className": "Panel--info","headerClassName": "","bodyClassName": "m-xs","footerClassName": "","subFormHorizontal": {"leftFixed": "normal"}
}

这里重点是执行按钮上的2个点击事件,第一个是数据请求,这里要调用REST2SQL 的API,参数就是SQL 多行文本框输入的全部内容,第二个事件是把返回结果赋值给执行结果JSON的多行问文本框:

"type": "button","label": "执行","onEvent": {"click": {"actions": [{"componentId": "","ignoreError": false,"actionType": "ajax","args": {},"outputVar": "responseResult","options": {},"api": {"url": "http://127.0.0.1:5217/sql/${sql}","method": "get","requestAdaptor": "","adaptor": "","messages": {}}},{"componentId": "u:505178345a09","ignoreError": false,"actionType": "setValue","args": {"value": "${event.data.responseResult.responseData|json}"}}]}}

在这里插入图片描述
另 : 【复制SQL】按钮的事件就是把 sql 多行文本框的内容复制到剪贴板;

"onEvent": {"click": {"actions": [{"ignoreError": false,"actionType": "copy","args": {"copyFormat": "text/plain","content": "${sql}"}}]}}

【复制结果JSON】按钮的事件就是把 result 多行文本框的内容复制到剪贴板;

"onEvent": {"click": {"actions": [{"ignoreError": false,"actionType": "copy","args": {"copyFormat": "text/plain","content": "${result}"}}]}}

3.4 右下区域

先放一个面板panel,面板的内容区域放一个多行文本框:

{"type": "panel","title": "执行结果JSON","body": [{"type": "textarea","label": "","name": "result","id": "u:505178345a09","minRows": 17,"maxRows": 30}],"id": "u:dac15e24efb3","affixFooter": false,"className": "Panel--success","bodyClassName": "m-xs"
}

4 实操演练

4.1 SELECT

在这里插入图片描述

4.2 INSERT

在这里插入图片描述

4.3 UPDATE

在这里插入图片描述

4.4 DELETE

在这里插入图片描述

SQL 查询分析器的功能主要是开发和运维人员使用,应急处理数据问题。


本文完。

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

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

相关文章

微信跳转页面时发生报错

报错如下图所示: 解决方法:(从下面四种跳转方式中任选一种,哪种能实现效果就用哪个) 带历史回退 wx.navigateTo() //不能跳转到tabbar页面 不带历史回退 wx.redirectTo() //跳转到另一个页面wx.switchTab() //只能…

【LAMMPS学习】八、基础知识(1.8)键的断裂

8. 基础知识 此部分描述了如何使用 LAMMPS 为用户和开发人员执行各种任务。术语表页面还列出了 MD 术语,以及相应 LAMMPS 手册页的链接。 LAMMPS 源代码分发的 examples 目录中包含的示例输入脚本以及示例脚本页面上突出显示的示例输入脚本还展示了如何设置和运行各…

【MySQL】:深入解析多表查询(下)

🎥 屿小夏 : 个人主页 🔥个人专栏 : MySQL从入门到进阶 🌄 莫道桑榆晚,为霞尚满天! 文章目录 📑前言一. 自连接1.1 自连接查询1.2 联合查询 二. 子查询2.1 概述2.2 分类2.3 标量子查…

【第6章】spring转换器

文章目录 前言一、手工处理二、自定义转换器1. 新建bean2. 新建转换器类3. spring配置4. 测试5. 测试结果 总结 前言 不知道大家有没有注意到,我们【第4章】依赖注入和自动装配,我们注入了String、Integer、Date等类型的参数,其实都是通过配置value标签注入的,本质上都一样,那…

Towards IP Geolocation Using Delay and TopologyMeasurements(TBG)(2006年)

下载地址:Towards IP geolocation using delay and topology measurements | Proceedings of the 6th ACM SIGCOMM conference on Internet measurement 被引次数:492 Katz-Bassett E, John J P, Krishnamurthy A, et al. Towards IP geolocation using delay and topology …

FreeRTOS创建第一个程序

使用freeRTOS创建任务时使用如下函数 函数的参数 创建一个FreeRTOS任务点亮led灯实现led灯500毫秒翻转一次 具体的代码实现 #include "stm32f10x.h" // Device header #include "Delay.h" #include "freeRTOS.h" #include &quo…

linux进阶篇:性能分析工具: iostat命令详细讲解

Linux 性能分析工具: iostat命令详细讲解 Linux系统出现了性能问题,一般我们可以通过top、iostat、free、vmstat等命令来查看初步定位问题。在一个以前看到系统监控工具,总在想那些监控工具的代理,如何收集系统性能信息&#xff0…

GitHub repository - Pulse - Contributors - Network

GitHub repository - Pulse - Contributors - Network 1. Pulse2. Contributors3. NetworkReferences 1. Pulse 显示该仓库最近的活动信息。该仓库中的软件是无人问津,还是在火热地开发之中,从这里可以一目了然。 2. Contributors 显示对该仓库进行过…

c语言中声明的问题【求个关注!】

文章目录 1 变量的声明与定义(1)定义与声明的区别:(2)为什么要区分定义与声明?(3)extern是什么 ?(4)举例: 2 函数的声明:函数声明的格…

Springboot整合nacos报错无法连接nacos

报错信息:Nacos com.alibaba.nacos.api.exception.NacosException: Client not connected, current status:STARTING 关于这个报错的原因有很多:如Nacos未启动、网络问题、配置问题、版本不兼容问题等,我的报错原因主要是版本不兼容。 下面…

GPT演变:从GPT到ChatGPT

Transformer 论文 Attention Is All You Need The dominant sequence transduction models are based on complex recurrent or convolutional neural networks in an encoder-decoder configuration. The best performing models also connect the encoder… https://arxiv.o…

STM32无刷电机全套开发资料(源码、原理图、PCB工程及说明文档)

目录 1、原理图、PCB、BOOM表 2、设计描述 2.1 前言 2.2 设计电路规范 3、代码 4、资料清单 资料下载地址:STM32无刷电机全套开发资料(源码、原理图、PCB工程及说明文档) 1、原理图、PCB、BOOM表 2、设计描述 2.1 前言 经过一个星期的画PCB,今…