《程序猿入职必会(5) · CURD 页面细节规范 》

📢 大家好,我是 【战神刘玉栋】,有10多年的研发经验,致力于前后端技术栈的知识沉淀和传播。 💗
🌻 CSDN入驻不久,希望大家多多支持,后续会继续提升文章质量,绝不滥竽充数,欢迎多多交流。👍

文章目录

  • 写在前面的话
  • CURD 共性问题
    • 操作体验
    • 查询条件部
    • 主体表格部
    • 表单弹窗部
    • 字典翻译问题
    • 其他前端问题
    • 后端规约问题
  • 总结陈词

CSDN.gif

写在前面的话

本系列博文已连载到第五篇,通过前四篇博文,我们已完成了教师信息的基础增删改查功能,在介绍其他知识专栏之前,先来谈一谈CURD页面的规范问题。
企业实战开发中,后台管理系统的大部分页面都是CURD的配置页,通常由查询条件+主体表格+弹窗表单三个部分组成,代码生成器基本也帮忙生成了大部分代码,但是不能过分依赖代码生成器,很多细节还是要调整的。
刚入职的程序猿往往也会被安排以这一任务作为练手,在完成任务后,主管会审核其功能完成质量。那双方参考什么规范确认完成质量呢,博主为公司新员工整理了《CURD 页面共性问题》研发文档,新人和主管都需要掌握,这里挑选部分内容,放置到博客上来分享。
加油,程序猿,保持住Tempo,开干,玩的就是真实!

关联文章:
《程序猿入职必会(1) · 搭建拥有数据交互的 SpringBoot 》
《程序猿入职必会(2) · 搭建具备前端展示效果的 Vue》
《程序猿入职必会(3) · SpringBoot 各层功能完善 》
《程序猿入职必会(4) · Vue 完成 CURD 案例 》
《程序猿入职必会(5) · CURD 页面细节规范 》
《程序猿入职必会(6) · 返回结果统一封装》


CURD 共性问题

操作体验

1、删除和批量删除操作必须提示是否删除,如“是否确定删除该行数据?”“请先选择需要删除的记录?”“是否批量删除选中的5行数据?”;
2、弹窗提示性文字应该带上问号,中文的问号,例如下面不符合规范:
image.png
image.png
3、搜索框的input或者select都应该加上clearable方便用户点击清空而不是还要长按删除键猜清空

4、对于提示内容,验证通过的应该用绿色,不通过的才用红色,区分开来

5、对于新增弹窗中的一些有效标志什么的,应该根据实际情况设置默认值,如有效标志应该默认有效

6、对于有效标志在列表界面应该采用switch按钮来实现快速设置


7、界面的按钮大小要统一,有的按钮用size=normal有的用size=small就显得很突兀


查询条件部

1、查询条件不能仅有一个代码生成器生成的文本输入框,原则上一些字段若是字典类型,也需要使用下拉框作为查询条件(如状态、类型等),具体情况自行分析;
2、当下拉框条件过多时,要使用可搜索的下拉框;
3、查询条件自带的文本框尽量使用模糊搜索,若多个字段需要模糊搜索,可以分开多个文本框,也可以同一个;
4、后台管理的CURD也页面通常都应该有查询条件部;
5、时间条件要注意和后端约定,不应该出现搜索“当日-当日”,搜索不到数据的场景;
6、输入框应该具有清空功能;
7、搜索尽量可以使用Enter快捷键替代,下拉框直接切换就触发搜索;


主体表格部

说明:代码生成器生成的页面,表的全部字段都显示了,没这个必要,表格显示重要列即可,不然太挤了。

1、表格部分,显示的字段太多,导致表头很多两行,而且内容过于拥挤开发人员应该要自行判断哪些字段不需要显示在表格上,不重要的字段麻烦放置到编辑框去,如描述等,当且仅当表格部分要显示的字段本身就不多才全部显示),原则上显示在表格上的内容要保住可以显示全;
2、有的页面翻页按钮下移到看不见的位置,这里就是搜索内容比较多,导致到了第二行,而没有同时调整表格的高度导致;
3、关键信息的长度要单独设置长一点,不要使用均分,这样用户体验不好;
4、对于数据显示不全的应该做样式调整;
5、对于要输入大段内容的输入框,例如备注等,应当使用textarea
6、自动生成时,表格序号一般从0计数,要修改为从1计数;
7、操作栏的按钮应该能清晰知道含义;


表单弹窗部

说明:表单通常在新增和编辑弹窗里面,由文本框、下拉框等表单项组成。
说明:安排封装校验工具类,校验常用的表单项,如常用正则等。

1、表单要防止重复提交,提交后关闭;
2、表单不要全部使用一行两列布局,部分字段内容多的可以单独一行,要美观;
3、表单需要做好校验工作,校验工具应该封装;
4、表单验证时取消或关闭弹窗时,应当清空规则校验提示及表单内容;
5、新增数据,通常要进行名称查重,对于字典表的新增,都要进行名称查重,编码也需要;
6、描述类型的字段,通常使用textarea,并且要单独占用一行;
7、一些表单项新增的时候,可以把默认值带过来,例如有效标志位,可以默认有效;
8、例如排序号等数字类型输入框,要对输入进行限制,只能输入数字,并且非必填情况下后端应该自动补上且不重复。
9、新增和编辑要确保有效,不要出现点击新增或者编辑提示成功了缺什么变化也没有。
10、更新的时候要确保主键设置为disable,不然如果把主键字段修改了,update会失效。
11、编辑弹窗里面各表单项长度应该要一致;
12、要注意哪些字段新增或编辑的时候是不可以编辑的,特别是编码和名称;
13、表单输入时长度没有控制,当输入的内容非常长,超过数据库设置的字段长度,会报“SQL_ERROR”,最好一些特殊字段和后端人员核对一下输入长度;
14、对于新增页面涉及到编码或者id时,重复时的提示信息都是类似“IS_EXIST”这种,是否需要转成中文提示;


字典翻译问题

说明:字典就是拥有编码和对应名称的表,例如性别字典,0男1女,除了性别字典自身的维护页面外,其他页面上需要使用性别字典,显示的都应该是名称,并且获取的字典列表数据必须加上validFlag=“1”,即有效的数据。

1、表格列里面某列,使用字典,但没有翻译成名称;
2、表单里面某个表单项,使用了字典,但没有用下拉选择框,或者没有翻译成名称;
3、通常需要翻译的字典项,需要考虑是否应该作为查询下拉框;


其他前端问题

1、前端请求的异常不用提示两次,代码生成器要整改一下;
2、异常提示信息要做国际化处理,并且信息提示要准确;
3、debugger没有删除,影响他人开发;
4、弹窗里面涉及到JSON和SQL显示的,尽量用格式化插件优化展示;
5、加载动画效果要有;


后端规约问题

说明:规约文档里面介绍的很清楚了,而且大部分是代码生成器生成的,这边不多强调,但是需要额外写逻辑的一定要遵循规约。

1、关键变量或者逻辑需进行注释;
2、与业务相关的不要放在controller,与业务无关的应该放在controller,如时间戳转换等;
3、方法注释,文件头注释要有;
4、无用import、代码块及时删除,可以通过设置自动清除无用包;
5、对于用户信息直接用前端传过来的信息不好,应该加密之类的;
6、Service 应该定义为接口,具体实现写在 ServiceImpl;
7、代码一行内过长,应该换行,不要超过idea的辅助线;
8、出现魔法值,应该用常量定义起来;
9、方法参数过多,建议用类封装;
10、转String的四种写法中,直接加空串效率最低,不建议使用,建议改成toString或String.valueOf;
QQ图片20200618170437.png


总结陈词

此篇文章介绍了CURD页面的共性问题,仅供学习参考。
💗 后续会逐步分享企业实际开发中的实战经验,有需要交流的可以联系博主。

CSDN_END.gif

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

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

相关文章

为 Laravel 提供生产模式下的容器化环境:打造现代开发环境的终极指南

为 Laravel 提供生产模式下的容器化环境:打造现代开发环境的终极指南 在现代开发中,容器化已经成为一种趋势。使用 Docker 可以让我们轻松地管理和部署应用程序。本文将带你一步步构建一个高效的 Laravel 容器化环境,确保你的应用程序在开发…

一些Kafka面试题

Kafka是如何保证消息不丢失? 1.生产者发送消息到Broker丢失: 设置异步发送:发送失败则使用回调进行记录或者重发 消息重试:参数配置,可以设置重试次数 2.消息在broker中存储丢失 发送确认机制acks acks0&#xf…

谷粒商城实战笔记-MySQL踩坑记录

文章目录 1, Public Key Retrieval is not allowed问题描述解决办法 2,1044 -Access denied for user root% to database解决方案 1, Public Key Retrieval is not allowed 问题描述 打开DBeaver连接MySQL提示“Public Key Retrieval is no…

4款免费且安全:常用的PDF转Word在线转换工具推荐

现在办公越来越离不开电脑了,PDF文件和Word文档来回转换的需求也越来越大。作为一个天天跟文件打交道的上班族,我特别明白找个好用、靠谱的PDF转Word在线转换工具有多重要。今儿个,给大家说说五个免费的转换工具,都是我试过觉得挺…

多微信管理不再难:聚合聊天神器助你轻松应对!

在当今社交媒体高度发达的时代,很多人都在使用多个微信账号来管理个人与工作联系。面对如此众多的信息沟通,如何高效管理成了一个难题。 幸运的是,聚合聊天神器的出现,彻底改变了这一局面,让我们轻松应对多微信账号的…

接口测试框架中测试用例管理模块的优化与思考!

引言 在当今软件开发的快速迭代环境中,接口自动化测试不仅是确保软件质量的基石,更是推动持续集成(CI)和持续交付(CD)的核心环节。测试用例管理作为自动化测试中的重要模块,直接影响着测试的效…

【Python】面向对象的程序设计

一、面向对象的介绍 1.对象 对象是一种抽象概念,表示客观世界存在的实物,现实世界中能够看到的、触碰到的都可以成为对象,如:人、大象、小猫等。 对象通常分为两个部分,即静态部分和动态部分。静态部分为“属性”&a…

从教学到分享,2024精选录屏工具

如果你在公司里承担会议记录的职责,那录屏这项技能你一定要学会。像录屏大师这样的工具可以帮你在远程会议中进行录屏操作,方便你后期整理会议内容。 1.福昕录屏大师 链接直达:https://www.foxitsoftware.cn/REC/ 这款录屏工具提供了多种…

【Python】pandas:排序、重复值、缺省值处理、合并、分组

pandas是Python的扩展库(第三方库),为Python编程语言提供 高性能、易于使用的数据结构和数据分析工具。 pandas官方文档:User Guide — pandas 2.2.2 documentation (pydata.org) 帮助:可使用help(...)查看函数说明文…

MyBatis入门如何使用操作数据库及常见错误(yml配置)

一,什么是MyBatis 是一款优秀的持久层框架,用于简化jdbc的开发 持久层:指的就是持久化操作的层,通常也就是数据访问层(dao),也就是用来操作数据库。 也就是MyBatis是让你更加简单完成程序与数…

详细记录swfit微调interVL2-8B多模态大模型进行目标检测(附代码)

大模型相关目录 大模型,包括部署微调prompt/Agent应用开发、知识库增强、数据库增强、知识图谱增强、自然语言处理、多模态等大模型应用开发内容 从0起步,扬帆起航。 RAGOnMedicalKG:大模型结合知识图谱的RAG实现DSPy:变革式大模…

PRD: Peer Rank and Discussion Improve Large Language Model based Evaluations

文章目录 题目摘要相关工作方法实验与分析指标进一步分析结论 题目 PRD:同行排名和讨论改善基于大型语言模型的评估 论文地址:https://arxiv.org/abs/2307.02762 项目地址:https://openreview.net/forum?idYVD1QqWRaj 摘要 如今&#xff0c…

大模型深度神经网络(Deep Neural Network, DNN)

大模型深度神经网络(Deep Neural Network, DNN)是一种复杂的机器学习模型,其特点在于包含多个隐藏层,从而赋予模型强大的非线性表达能力和对复杂数据模式的学习能力。以下是对大模型DNN的详细介绍: 一、基本概念 深度…

第一阶段面试问题(前半部分)

1. 进程和线程的概念、区别以及什么时候用线程、什么时候用进程? (1)线程 线程是CPU任务调度的最小单元、是一个轻量级的进程 (2)进程 进程是操作系统资源分配的最小单元 进程是一个程序动态执行的过程,包…

MATLAB(6)水纹碰撞覆盖地形

前言 在MATLAB中模拟水纹(如水波)碰撞并覆盖地形的效果涉及到几个复杂的步骤,包括地形的生成、水波的模拟(通常使用波动方程)以及两者的交互。下面我将给出一个简化的示例,展示如何在MATLAB中创建一个基本的…

文献综述过程如何有助于综合各种来源的信息

VersaBot生成文献综述 文献综述过程在通过几个关键机制综合各种来源的信息方面发挥着至关重要的作用; 1. 批判性评估和比较: 你不能简单地单独总结每个来源;你积极地比较和对比他们的发现、方法和理论观点。这可以帮助您识别每个来源的共性…

安卓项目结构与日志工具

文章目录 安卓的项目结构app目录下的结构安卓的日志工具 安卓的项目结构 首先需要切换称Project模式。 .gradle和.idea :这两个目录下放置的都是Android Studio自动生成的一些文件,我们无须关心,也不用编辑。 app :项目中的代码、…

齿轮表面缺陷检测方案

齿轮是一种机械传动元件,通常由具有齿条的圆盘或圆柱体组成,用于传递动力和运动。齿轮通过齿与齿之间的啮合,将动力从一个轴传递到另一个轴,实现速度和扭矩的传递。齿轮通常用于机械设备、车辆传动系统和各种工业机械中。 齿轮通…

【网络世界】传输层协议

🌈前言🌈 欢迎收看本期【网络世界】,本期内容讲解TCP/IP协议栈中的传输层协议,即UDP协议和TCP协议。包含了他们的协议格式,特点等。介绍他们的应用场景,最后对比TCP与UDP协议。此外,还将介绍套接…

电商 API 接口的最佳实践与案例分析

在当今数字化的商业世界中,电商平台的发展日新月异,而 API 接口在其中扮演着至关重要的角色。通过合理地利用电商 API 接口,企业能够实现更高效的运营、更优质的用户体验以及更强大的业务拓展能力。本文将深入探讨电商 API 接口的最佳实践&am…