【JSON2WEB】02 JSON2WEB初步UI设计

JSON2WEB的UI初步设计,包括草图、登录、主页、导航树JSON2TREEE组件、表格JSON2GRID组件、表单JSON2FORM组件等。

1草图

在这里插入图片描述

  • 表单作为抽屉从右边拉出。
  • LOGO行和导航树为固定区域,导航树可以折叠。
    在这里插入图片描述

2 登录页

在这里插入图片描述

  • 找回账号:可以给邮箱(找回时输入)发送账号和重置密码链接,也可以通过短信找回,需要账号和邮箱、手机号绑定。

3 主页

在这里插入图片描述

  • 主操作区可以有滚动条,滚动到最下面出现页脚区,页脚区放置一个按钮可回到顶部。

4 导航树JSON2TREE组件

在这里插入图片描述

  • 导航树分2级就够了,一级可以在主操作区链接导航卡和二级的详细说明。
  • 二级链接到具体的页面,在主操作区打开,一般是信息一个表格GRID。

5 表格JSON2GRID组件

在这里插入图片描述

  • 创建和行内编辑可拉出表单抽屉
  • 查询框默认对所有显示列进行过滤或查询,可以选择所有显示列精确组合查询

6 表单JSON2FORM组件

在这里插入图片描述

  • 表单抽屉里可以创建新记录,删除一行记录、修改当前记录。

就这些了,其它的再逐步完善吧。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

宝塔+nextcloud+docker+Onlyoffice 全开启https

折腾了我三天的经验分享 1.宝塔创建网站 nextcloud版本为28.0.1 php8.2 ,导入nextcloud绑定域名对应的证书 ,不用创建mysql 因为nextcloud 要求是mariadb:10.7 宝塔里没有,就用docker安装一个 端口设置为3307 将数据库文件映射出来/ww…

安卓开发之自动缩放布局

AutoScalingLayout 适用于 Android 的自动缩放布局。 替换布局: 我们只需要替换根布局所需的自动缩放,子布局也将实现自动缩放。 原始布局AutoScalingLayout相对布局ASRelativeLayout线性布局ASLinearLayoutFrameLayout(框架布局&#xff…

Shell 虚拟机基线配置脚本示例

这是一个配置虚拟机基线的示例,包含关闭防火墙、禁用SElinux、设置时区、安装基础软件等。 这只是一个简单的模板,基线配置方面有很多,后续可以按照这个模板去逐步添加 代码示例 [rootbogon ~]# cat bastic.sh #!/bin/bashRED\E[1;31m GRE…

低功耗DC-DC电源模块的精细化PCB设计

在电子设备中,电源模块是核心组件,将输入直流电压转为设备所需的各种直流电压。DC-DC电源转换器,特别是基于开关方式的转换器,因其高效、小体积和轻重量等优点被广泛应用。但设计优秀的DC-DC电源转换器并不容易。布局、电磁兼容性…

web安全学习笔记【06】——http\https抓包

思维导图放最后 #知识点: 1、Web常规-系统&中间件&数据库&源码等 2、Web其他-前后端&软件&Docker&分配站等 3、Web拓展-CDN&WAF&OSS&反向&负载均衡等 ----------------------------------- 1、APP架构-封装&原生态&…

k8s-基础知识(Service,NodePort,CusterIP,NameSpace,资源限制)

Node Node 是 Pod 真正运行的主机,可以是物理机,也可以是虚拟机。 Annotations 原文链接 Annotations 是 key/value 形式附加于对象的注解。不同于 Labels 用于标志和选择对象,Annotations 则是用来记录一些附加信息,用来辅助应…

windows .vscode的json文件配置 CMake 构建项目 调试窗口中文设置等

一、CMake 和 mingw64的安装和环境配置 二、tasks.json和launch.json文件配置 tasks.json {"version": "2.0.0","options": {"cwd": "${workspaceFolder}/build"},"tasks": [{"type": "shell&q…

Intel NUC x15电池独立显卡功耗异常解决办法

买了Intel NUC x15,所有驱动都是安装的官方的驱动,但是电池续航一直尿崩。经过查找资料,发现是独立显卡功耗异常导致,也有用户给出了解决办法,参考NUC X15 显卡待机功耗异常解决方案 - 哔哩哔哩 (bilibili.com)。https…

洗地机哪个品牌最好用?智能洗地机推荐

在当前社会对清洁和卫生越来越重视的背景下,家用洗地机已经成为许多家庭不可或缺的清洁工具之一。这不仅因为它在功能上非常丰富,而且在使用体验上也极为强大。洗地机的自清洁功能使得清洁过程中无需亲手脏手,而且一些机型还支持消毒杀菌&…

17β-Estradiol high sensitivity ELISA kit

高灵敏ELISA试剂盒,可检测到低至14 pg/ml的17β-雌二醇 雌二醇(estradiol) 是由卵巢内卵泡的颗粒细胞分泌的类固醇激素,是主要的雌激素,负责调节女性特征、附属性器官的成熟和月经-排卵周期,促进乳腺导管系统的产生,有…

虚拟歌姬学习:DiffSinger,让GitHub下载快的方法!

《三分钟上手DiffSinger》系列 ——基础篇https://www.bilibili.com/video/BV1ug4y1S7Dk/?spm_id_from333.337.search-card.all.click&vd_source124076d7d88eee393a1d8bf6fc787efa 下载DiffSinger 建议用edge浏览器还有steam,有时只是慢,但是还是…

使用Electron打包vue文件变成exe应用程序

文章目录 一、下载Electron二、修改下载的Electron项目1.修改index.html文件2.修改main.js文件3.修改package.json文件 三、修改vue项目1.修改vite.config.js文件2.修改.env.production文件3.修改auth.js文件4.修改router下得index.js文件6.修改Navbar.vue文件 四、Electron打包…

存内计算引领新一代技术革新,开启算力新时代

文章目录 存内计算与传统计算的区别 存内计算与传统计算的区别 存内计算芯片的优势 存内计算在各个领域的应用 存内计算技术对未来发展的影响 CSDN存内计算开发者社区:引领新一代技术革新的最前沿 社区内容专业度 社区具备的资源 社区的开放性 社区招募令…

JavaEE-微服务-Vuex

Vuex 2.1 什么是Vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。 Vuex在组件之间共享数据。 2.2 使用 vue cli 构建项目 2.3 入门案例 2.3.1 定义数据 export default new Vuex.Store({state: { // 状态区域(定义变量区域)user: ,toke…

“高级SPA项目构建与路由实现“

目录 引言1. SPA项目构建1.1 安装vue-cli,webpack1.2 创建 Vue.js项目1.3 “一问一答”模式1.4 启动项目 2. SPA项目完成路由3. 基于SPA项目完成嵌套路由总结 引言 在现代Web开发中,单页应用(SPA)已经成为一种流行的开发模式。SPA通过在前端…

8 容器化微服务

文章目录 DockerSpring Boot和Buildpacks在Docker中运行系统Docker化微服务Docker化前端Docker化配置导入器Docker Compose使用Docker扩展系统共享Docker镜像小结 前面的文章: 1、1 一个测试驱动的Spring Boot应用程序开发 2、2 使用React构造前端应用 3、3 试驱动的…

RabbitMQ系列之交换机的使用

🎉🎉欢迎来到我的CSDN主页!🎉🎉 🏅我是君易--鑨,一个在CSDN分享笔记的博主。📚📚 🌟推荐给大家我的博客专栏《RabbitMQ系列之交换机的使用》。🎯&…

大白话解析LevelDB 3: SST Compaction

SST Compaction SST Compaction 什么是Compact SST什么时候触发Compact SST 第一处 读取 Key 的时候第二处 使用迭代器遍历数据库时第三处 写入 Key 时第四处 刚打开数据库时 如何进行Compact SST 计算Compaction范围进行Compaction 创建一个迭代器用于读取Compaction范围内的…

【linux】Debian挂起和休眠

一、挂起和休眠 在Debian桌面系统中,挂起和休眠是两种不同的状态,它们之间有一些区别。 挂起(Suspend)是将当前系统的状态保存到RAM(内存)中,然后关闭所有硬件设备,除了RAM之外。在…

(2)(2.4) CRSF/ELRS Telemetry

文章目录 前言 1 ArduPilot 参数编辑器 前言 !Note ELRS(ExpressLRS)遥控系统使用穿越火线协议,连接方式类似。不过,它不像穿越火线那样提供双向遥测。 TBS CRSF 接收机与 ArduPilot 的接口中包含遥测和遥控信息。…
最新文章