# 若依优化模板

**Repository Path**: vtchain/ruoyi-optimize-template

## Basic Information

- **Project Name**: 若依优化模板
- **Description**: 优化若依首页
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2024-12-27
- **Last Updated**: 2024-12-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# README

## 前端规范
### 技术

| 技术                | 名称                     | 官网                                                        |
| ----------------- | ---------------------- | --------------------------------------------------------- |
| jQuery            | 函式库                    | <http://jquery.com/>                                      |
| RuoYi             | 若依框架                   | <http://doc.ruoyi.vip/>                                   |
| Vue               | Vue                    | <https://v2.cn.vuejs.org/v2/guide/>            |
| Element-Ui        | Element-Ui前端组件库        | <https://element.eleme.cn/#/zh-CN/component/installation> |
| Ant Design of Vue | Ant Design of Vue前端组件库 | <http://antdv.cdqianyun.com/docs/vue/getting-started-cn/> |
| DataV             | DataV大屏组件库             | <http://datav.jiaminghi.com/guide/>                       |
| ECharts           | ECharts图表组件            | <https://echarts.apache.org/zh/index.html>                |

### VsCode插件依赖

| 插件名             | 用途              |
| --------------- | --------------- |
| ESLint          | ESLint          |
| PreTTier ESLint | 基于ESLint代码格式化工具 |

### 组织结构

```lua
Vue
├── bin -- 执行脚本
├── build -- 构建相关
├── node_modules -- 依赖文件
├── public -- 公共文件
|    ├── favicon.ico -- favicon网站头部图标
|    ├── index.html -- html模板
|    └── robots.txt -- 反爬虫
├── src -- 源代码
|    ├── api -- 所有请求接口（务必与视图view文件夹结构相同）
|    ├── assets -- 主题 字体等静态资源（尽量与视图view文件夹结构相同）
|    ├── components -- 全局公用组件（高复用率组件存放处，以文件夹命名）
|    |    ├── example -- 举例组件名
|    |    |    └── index.vue -- 固定命名index
|    ├── directive -- 全局指令
|    ├── layout -- 基础布局
|    ├── plugins -- 通用方法
|    ├── router -- 路由
|    ├── store -- 全局store管理（高复用率）
|    ├── utils -- 全局公用方法（高复用率）
|    ├── views -- 视图views
|    |    ├── business -- business模块
|    |    |    ├── business-list.vue -- business列表页面
|    |    |    ├── business-add.vue -- business新建页面
|    |    |    ├── business-update.vue -- business更新页面
|    |    |    └── components -- business模块通用组件文件夹
|    |    ├── components -- 视图公用组件
|    |    ├── dashboard -- 仪表盘
|    |    ├── error -- 401、404错误页面
|    |    ├── monitor -- 监控
|    |    ├── system -- 系统管理
|    |    ├── tool -- 工具方法
|    |    ├── index.vue -- 首页
|    |    ├── login.vue -- 登录
|    |    ├── redirect.vue -- 转发
|    |    └── register.vue -- 注册
|    ├── App.vue -- 入口文件
|    ├── main.js -- 入口 加载组件 初始化等
|    ├── permission.js -- 权限管理
|    └── settings.js -- 系统配置
├── .editorconfig -- 编码格式
├── .env.development -- 开发环境配置
├── .env.production -- 生产环境配置
├── .env.staging -- 测试环境配置
├── .eslintignore -- ESLint忽略语法检查（不允许擅自修改）
├── .eslintrc.js -- ESLint配置项（不允许擅自修改）
├── .gitignore -- git忽略项
├── babel.config.js -- 
├── package.json -- 
└── vue.config.js -- 
```

### 基础规范

https://v2.cn.vuejs.org/v2/style-guide/
```

1.1.1 项目命名
全部采用小写方式， 以中划线分隔。
正例：mall-management-system
反例：mall_management-system / mallManagementSystem

1.1.2 目录命名
全部采用小写方式， 以中划线分隔，有复数结构时，要采用复数命名法， 缩写不用复数
正例： scripts / styles / components / images / utils / layouts / demo-styles / demo-scripts / img / doc
反例： script / style / demo_scripts / demoStyles / imgs / docs
【特殊】VUE 的项目中的 components 中的组件目录
单文件组件的文件名应该要么始终是单词大写开头 (PascalCase)，要么始终是横线连接 (kebab-case)。
正例： head-search / page-loading / authorized / notice-icon / HeadSearch / PageLoading
反例： Head-Search
【特殊】基础组件名
应用特定样式和约定的基础组件 (也就是展示类的、无逻辑的或无状态的组件) 应该全部以一个特定的前缀开头，比如 Base、App 或 V。
正例： BaseButton / BaseIcon / AppButton / AppIcon / VButton / VIcon
反例： MyButton / Icon

1.1.3 JS、CSS、SCSS、HTML、PNG 文件命名
全部采用小写方式， 以中划线分隔
正例： render-dom.js / signup.css / index.html / company-logo.png
反例： renderDom.js / UserManagement.html

1.1.4 命名严谨性
代码中的命名严禁使用拼音与英文混合的方式，更不允许直接使用中文的方式。 说明：正确的英文拼写和语法可以让阅读者易于理解，避免歧义。注意，即使纯拼音命名方式也要避免采用
正例：henan / luoyang / rmb 等国际通用的名称，可视同英文。
反例：DaZhePromotion [打折] / getPingfenByName() [评分] / int 某变量 = 3
杜绝完全不规范的缩写，避免望文不知义：
反例：AbstractClass“缩写”命名成 AbsClass；condition“缩写”命名成 condi，此类随意缩写严重降低了代码的可阅读性。

1.1.5 组件命名
组件名应该始终是多个单词的，根组件 App 以及 <transition>、<component> 之类的 Vue 内置组件除外。
这样做可以避免跟现有的以及未来的 HTML 元素相冲突，因为所有的 HTML 元素名称都是单个单词的。
正例：TodoItem / todo-item
反例：todo / Todo

1.1.6 组件名中的单词顺序
组件名应该以高级别的 (通常是一般化描述的) 单词开头，以描述性的修饰词结尾。
正例：
components/
|- SearchButtonClear.vue
|- SearchButtonRun.vue
└─ SearchInputQuery.vue
反例：
components/
|- ClearSearchButton.vue
|- ExcludeFromSearchInput.vue
└─ LaunchOnStartupCheckbox.vue

Javascript 规范
1.5.1 命名
1) 采用小写驼峰命名 lowerCamelCase，代码中的命名均不能以下划线，也不能以下划线或美元符号结束
反例： _name / name_ / name$
2) 方法名、参数名、成员变量、局部变量都统一使用 lowerCamelCase 风格，必须遵从驼峰形式。
正例： localValue / getHttpMessage() / inputUserId
*其中 method 方法命名必须是 动词 或者 动词+名词 形式*
正例：saveShopCarData /openShopCarInfoDialog
反例：save / open / show / go

*特此说明，增删查改，详情统一使用如下 5 个单词，不得使用其他（目的是为了统一各个端）*
add / update / delete / detail / get

附： 函数方法常用的动词:
get 获取/set 设置,
add 增加/remove 删除
create 创建/destory 移除
start 启动/stop 停止
open 打开/close 关闭,
read 读取/write 写入
load 载入/save 保存,
create 创建/destroy 销毁
begin 开始/end 结束,
backup 备份/restore 恢复
import 导入/export 导出,
split 分割/merge 合并
inject 注入/extract 提取,
attach 附着/detach 脱离
bind 绑定/separate 分离,
view 查看/browse 浏览
edit 编辑/modify 修改,
select 选取/mark 标记
copy 复制/paste 粘贴,
undo 撤销/redo 重做
insert 插入/delete 移除,
add 加入/append 添加
clean 清理/clear 清除,
index 索引/sort 排序
find 查找/search 搜索,
increase 增加/decrease 减少
play 播放/pause 暂停,
launch 启动/run 运行
compile 编译/execute 执行,
debug 调试/trace 跟踪
observe 观察/listen 监听,
build 构建/publish 发布
input 输入/output 输出,
encode 编码/decode 解码
encrypt 加密/decrypt 解密,
compress 压缩/decompress 解压缩
pack 打包/unpack 解包,
parse 解析/emit 生成
connect 连接/disconnect 断开,
send 发送/receive 接收
download 下载/upload 上传,
refresh 刷新/synchronize 同步
update 更新/revert 复原,
lock 锁定/unlock 解锁
check out 签出/check in 签入,
submit 提交/commit 交付
push 推/pull 拉,
expand 展开/collapse 折叠
begin 起始/end 结束,
start 开始/finish 完成
enter 进入/exit 退出,
abort 放弃/quit 离开
obsolete 废弃/depreciate 废旧,
collect 收集/aggregate 聚集

3) 常量命名全部大写，单词间用下划线隔开，力求语义表达完整清楚，不要嫌名字长。
正例： MAX_STOCK_COUNT
反例： MAX_COUNT

```

## 后端规范

```
- 安装 Alibaba Java Coding Guidelines 插件，根据规范编写代码，并对代码进行格式化

- 方法前加明确、完善的注释说明

- 接口方法除了获取用get请求，其他一律用post

- 变量和函数名驼峰命令，尽量避免出现数字

- 类文件前加注册 注明开发者

- 独立的大块功能单独建包，包名小写

- 每天下班前尽量把代码提交到git

- service类，需要在叫名`service`的包下，并以`Service`结尾，如`CmsArticleServiceImpl`

- controller类，需要在以`controller`结尾的包下，类名以Controller结尾，如`CmsArticleController.java`，并继承`BaseController`

- spring task类，需要在叫名`task`的包下，并以`Task`结尾，如`TestTask.java`

- mapper.xml，需要在名叫`mapper`的包下，并以`Mapper.xml`结尾，如`CmsArticleMapper.xml`

- mapper接口，需要在名叫`mapper`的包下，并以`Mapper`结尾，如`CmsArticleMapper.java`

- model实体类，需要在名叫`model`的包下，命名规则为数据表转驼峰规则，如`CmsArticle.java`

- spring配置文件，命名规则为`applicationContext-*.xml`

- 类名：首字母大写驼峰规则；方法名：首字母小写驼峰规则；常量：全大写；变量：首字母小写驼峰规则，尽量非缩写

- springmvc配置加到对应模块的`springMVC-servlet.xml`文件里

- 配置文件放到`src/main/resources`目录下

- 静态资源文件放到`src/main/webapp/resources`目录下

- jsp文件，需要在`/WEB-INF/jsp`目录下

- `RequestMapping`和返回物理试图路径的url尽量写全路径，如：`@RequestMapping("/manage")`、`return "/manage/index"`

- `RequestMapping`指定method

- 模块命名为`项目`-`子项目`-`业务`，如`zheng-cms-admin`

- 数据表命名为：`子系统`_`表`，如`cms_article`

```

>-于2023.3.8创建（补充更新往下迭代）