From 93d2705ea9d3807689d42224ae387176c3b52cab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A7=A6=E6=B3=BD=E6=97=BA?= <2413898818@qq.com>
Date: Mon, 16 Dec 2024 18:51:28 +0800
Subject: [PATCH] Default Changelist

---
 frontend/src/components/global.less |  5 ++++-
 frontend/src/components/index.js    | 32 +++++++++++++++++++++--------
 frontend/src/components/index.less  | 10 ++++++++-
 3 files changed, 37 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/global.less b/frontend/src/components/global.less
index 71f5539..d4cce6e 100644
--- a/frontend/src/components/global.less
+++ b/frontend/src/components/global.less
@@ -1,16 +1,19 @@
 @import './index.less';
 
 html {
+  // 设置 html 元素的溢出行为为自动，即当内容超出可视区域时会自动出现滚动条，方便用户查看全部内容。
   overflow: auto;
 }
 
 body {
-  // 打开滚动条固定显示
+  // 强制显示垂直方向的滚动条，确保页面在垂直方向内容较多时可以滚动查看，避免内容被隐藏而无法访问。
   overflow-y: scroll;
 
+  // 当 body 元素具有 "colorWeak" 类名时，应用以下样式规则，通过滤镜（filter）属性将页面颜色反相 80%，可能用于模拟色弱等视觉辅助功能下的页面显示效果。
   &.colorWeak {
     filter: invert(80%);
   }
+  // 当 body 元素具有 "userLayout" 类名时，设置其溢出行为为自动，与 html 元素的 overflow:auto 类似，根据页面具体布局需求对该状态下的整体页面溢出进行控制。
   &.userLayout {
     overflow: auto;
   }
diff --git a/frontend/src/components/index.js b/frontend/src/components/index.js
index 2fcfe9c..0053dad 100644
--- a/frontend/src/components/index.js
+++ b/frontend/src/components/index.js
@@ -1,19 +1,35 @@
 // pro components
-import STable from '../components/Table'
-import MultiTab from '../components/MultiTab'
-import Result from '../components/Result'
-import TagSelect from '../components/TagSelect'
-import ExceptionPage from '../components/Exception'
-import StandardFormRow from '../components/StandardFormRow'
-import DescriptionList from '../components/DescriptionList'
+// 以下是一系列从相对路径 '../components' 下导入不同组件的语句。
+// 导入名为 STable 的组件，从命名推测该组件可能是一个自定义的表格组件，用于在项目中展示表格形式的数据，具体功能和样式取决于其组件内部的实现代码。
+import STable from '../components/Table';
+// 导入名为 MultiTab 的组件，大概率是实现多标签页切换相关功能的组件，方便在页面中切换不同的内容板块或者视图等，同样其具体行为由组件自身代码定义。
+import MultiTab from '../components/MultiTab';
+// 导入名为 Result 的组件，可能是用于展示操作结果、查询结果等相关信息的组件，比如成功、失败、提示等各类结果反馈展示场景会用到它。
+import Result from '../components/Result';
+// 导入名为 TagSelect 的组件，应该是一个用于选择标签（可能是文本标签、分类标签等）的交互组件，提供给用户进行相应的选择操作，具体的标签数据来源和选择交互逻辑在组件内部实现。
+import TagSelect from '../components/TagSelect';
+// 导入名为 ExceptionPage 的组件，从名字可推测是用于展示异常页面的组件，当系统出现错误、异常情况或者某些特定的不符合预期的状况时，会展示该组件对应的页面内容，告知用户相关情况。
+import ExceptionPage from '../components/Exception';
+// 导入名为 StandardFormRow 的组件，可能是用于构建表单中标准行的组件，比如包含输入框、标签等元素组成的一行表单结构，方便统一表单的样式和布局等方面的构建。
+import StandardFormRow from '../components/StandardFormRow';
+// 导入名为 DescriptionList 的组件，或许是用于展示描述列表信息的组件，像一些配置项及其对应说明、功能列表等以列表形式展示的内容可以使用它来呈现。
+import DescriptionList from '../components/DescriptionList';
 
 export {
+  // 将导入的 ExceptionPage 组件原样导出，使得在其他模块中可以通过导入该模块来使用 ExceptionPage 组件，用于处理异常页面展示相关的功能需求。
   ExceptionPage,
+  // 导出 Result 组件，方便其他模块引入该组件来展示各种结果信息，实现结果反馈相关的功能逻辑。
   Result,
+  // 导出 STable 组件，其他地方可以使用它来构建和展示表格数据，满足表格展示相关的业务场景需求。
   STable,
+  // 导出 MultiTab 组件，以实现在不同模块中创建多标签页切换的页面功能，让用户能够方便地切换不同的内容视图等。
   MultiTab,
+  // 导出 TagSelect 组件，供其他模块使用来提供标签选择的交互功能，满足根据标签筛选、分类等业务操作需求。
   TagSelect,
+  // 导出 StandardFormRow 组件，有助于在其他模块构建表单时统一标准行的样式和结构，提高表单构建的效率和规范性。
   StandardFormRow,
   // 兼容写法，请勿继续使用
+  // 这里将导入的 DescriptionList 组件以一个别名 DetailList 进行导出，这可能是为了兼容旧的代码或者模块调用方式，
+  // 不过注释提醒了后续不要再继续使用这种写法，意味着未来可能会有更合适的方式来处理该组件的导出和使用，避免潜在的问题或不符合新的代码规范要求。
   DescriptionList as DetailList
-}
+}
\ No newline at end of file
diff --git a/frontend/src/components/index.less b/frontend/src/components/index.less
index d8c97bb..e34d602 100644
--- a/frontend/src/components/index.less
+++ b/frontend/src/components/index.less
@@ -1,4 +1,12 @@
 @import "~ant-design-vue/lib/style/index";
+/*
+这是一条 CSS 的 `@import` 规则，用于引入外部的 CSS 样式文件。在这里，它引入了 `ant-design-vue` 库中 `lib/style/index` 路径下的样式文件。
+`~` 符号通常在一些构建工具（比如 Webpack 等）中有特殊含义，它表示模块的相对路径解析方式，会根据模块的配置去准确找到对应的文件资源，通过导入这个文件，项目可以复用 `ant-design-vue` 库所提供的基础样式，如组件的默认样式、布局样式等，使得项目中的组件能够按照 `ant-design-vue` 的设计风格来呈现外观。
+*/
 
 // The prefix to use on all css classes from ant-pro.
-@ant-pro-prefix             : ant-pro;
\ No newline at end of file
+@ant-pro-prefix             : ant-pro;
+/*
+这是一条 CSS 变量（也叫自定义属性）的声明语句，定义了一个名为 `@ant-pro-prefix` 的变量，并将其值设置为 `ant-pro`。
+在后续的 CSS 代码中（如果遵循相应的规范使用），这个变量可以作为类名等的前缀使用，目的通常是为了给项目中属于 `ant-pro` 相关的 CSS 类名添加一个统一的标识前缀，方便进行样式的管理、区分以及避免类名冲突等情况。例如，后续可能会基于这个前缀去构建一系列带有该前缀的自定义类名，用于特定的样式覆盖、扩展或者组件样式的个性化定制等操作，同时也使得整体样式结构更加清晰、有条理，一眼就能看出哪些样式是和 `ant-pro` 相关的。
+*/
\ No newline at end of file