添加AGENTS.md
This commit is contained in:
73
AGENTS.md
Normal file
73
AGENTS.md
Normal file
@@ -0,0 +1,73 @@
|
||||
# JY1.0 项目 Agent 规则
|
||||
|
||||
## 项目概述
|
||||
|
||||
你正在参与「景耀 JY1.0」制造执行系统(MES)的前端开发工作。本项目是江苏高精机械设备有限公司的管理信息系统,基于 Vue 2 + Element UI 构建,后端为 ASP.NET(.ashx 通用处理程序)。
|
||||
|
||||
## 技术栈识别
|
||||
|
||||
本项目使用 Vue 2.5.17 + Vuex 3.0.1 + Vue Router 3.0.7 + Element UI 2.13 + Axios 0.18.0 + ECharts 4 + Webpack 4。不使用 TypeScript,不使用 Composition API,不使用 Vue 3 语法。所有代码均为 JavaScript + Vue 2 Options API 风格。
|
||||
|
||||
## API 通信规范
|
||||
|
||||
所有业务请求统一 POST 到单一端点 `MESCommonBase.ashx`,URL 字段留空(由 baseURL 统一代理)。通过 `name` 字段(中文命名,格式为`模块_子模块_操作_查询/增加/编辑/删除数据`)路由到后端不同存储过程。通过 `type` 字段区分操作:`'1'` 为查询,`'2'` 为增删改,`'7'` 为批量提交。参数通过 `param` 字段以 `key=value&key2=value2` 字符串拼接传递,非 JSON 对象。每个请求必须携带 `UserID`(从 Cookie 取)和 `ModularID`(当前路由路径)。
|
||||
|
||||
## 数据字段命名
|
||||
|
||||
后端返回的数据库字段名为中文,如 `状态`、`订单编号`、`零件名称`、`图号`、`投产日期` 等。前端模板中直接使用中文属性访问,如 `scope.row.状态`、`scope.row.订单号`。新增字段时必须使用中文命名以保持与后端一致。
|
||||
|
||||
## 视图组件结构
|
||||
|
||||
每个页面视图遵循统一布局模式:外层 `div.app-container` > `el-card` > 搜索栏 + 数据表格。搜索栏使用 `el-input`、`el-select`、`el-date-picker` 等组件,数据表格使用 `el-table` + `el-table-column`,固定高度(如 `height="750px"`),尺寸为 `size="mini"`,带 `border` 属性。状态列使用 `el-tag` 组件,通过 `:type` 属性区分不同状态颜色。
|
||||
|
||||
## 全局工具方法
|
||||
|
||||
项目通过 `Vue.prototype` 挂载了以下全局方法,在组件中通过 `this.xxx` 直接调用:`CreateData(type, name, data, pageSize, pageList)` 构建请求参数、`ExecDatabase(num)` 发送请求、`addForm(form, callback)` 重置并打开新增表单、`editForm(row, form, callback)` 填充行数据到编辑表单、`getSelect(requestData, select, carrier, param)` 获取下拉框数据、`getData(requestData, carrier, param)` 获取普通数据、`getTable(requestData, param, e)` 获取分页表格数据、`addTable(requestData, param, form, callback)` 新增表格行、`editTable(requestData, param, form, callback)` 编辑表格行、`deleteRow(requestData, id, callback)` 删除表格行。新增/编辑操作必须使用这些全局方法,不要自行封装。
|
||||
|
||||
## 状态管理
|
||||
|
||||
Vuex 采用 modules 模式,包含 `app`、`user`、`tagsView`、`permission` 四个模块。用户信息(token、name、id、userId)通过 `js-cookie` 持久化,有效期 1 天。权限控制采用静态路由 + 动态路由注入模式,`getRouter.js` 根据后端返回的菜单数据递归构建路由树。登录后通过 `store.dispatch('GetInfo')` 获取用户信息,再通过 `store.dispatch('GenerateRoutes', asyncRouterMap)` 动态添加路由。
|
||||
|
||||
## 路由配置
|
||||
|
||||
静态路由定义在 `src/router/index.js` 的 `constantRouterMap` 中,仅包含登录页、404页和首页。动态路由通过 `src/router/getRouter.js` 根据后端返回的菜单数据(含 pid 父子关系)递归构建,组件路径映射到 `src/views` 目录下对应的 `.vue` 文件。路由 meta 中包含 `title`(中文标题)和 `icon`(SVG 图标名称)。
|
||||
|
||||
## API 文件组织
|
||||
|
||||
API 文件按业务模块组织在 `src/api/` 目录下,子目录与业务模块一一对应:`BasicData`(基础数据)、`SalesManagement`(销售管理)、`ManufacturingCenter`(制造中心)、`Assembly`(装配管理)、`Inventory`(仓储管理)、`Outsourcing`(外协管理)、`PurchasingCenter`(采购中心)、`TechnologyCenter`(技术中心)、`WorkshopProcurement`(车间采购)、`MarketingCenter`(营销中心)、`ProjectManagement`(项目管理)。每个 API 文件导出多个命名函数,函数名以操作语义命名。
|
||||
|
||||
## 视图目录组织
|
||||
|
||||
视图文件按业务模块组织在 `src/views/` 目录下,与 API 目录结构对应。主要模块包括:`BasicData`(基础数据)、`SalesManagement`(销售管理)、`SeikoWorkshop`(精工车间)、`AssemblyManagement`(装配管理)、`DeviceManagement`(设备管理)、`PurchasingManagement`(采购管理)、`WarehouseManagement`(仓储管理)、`TechnologyCenter`(技术中心)、`ManufacturingCenter`(制造中心)。每个页面为独立文件夹 + `index.vue`。
|
||||
|
||||
## 配置管理
|
||||
|
||||
环境配置集中在 `static/config.js` 中,通过导出常量供 `src/utils/request.js` 引用。包含主服务地址、立库接口地址、文件上传下载路径、WebSocket 地址等。环境切换通过注释切换 IP 地址实现,不使用 `.env` 文件。修改配置时需同时关注 `request.js` 中的引用。
|
||||
|
||||
## 文件上传下载
|
||||
|
||||
文件上传使用多个专用处理器:`uploadFile.ashx`(通用上传)、`MESUploadFile.ashx`(MES 系统上传)、`uploadOP.ashx`(工序上传)、`uploadPerson.ashx`(人员上传)等。文件下载使用 `downloadFile.ashx` 和 `MESDownloadFile.ashx`。Excel 导出使用 `ExcelDownLoad` 配置指向 `MESCommonBase.ashx`,前端通过 `this.exportExcel_NPOI(param)` 触发下载。图片查看使用 `v-viewer` 插件。
|
||||
|
||||
## 样式规范
|
||||
|
||||
全局样式位于 `src/styles/` 目录,包含 `element-ui.scss`(Element UI 覆写)、`variables.scss`(SCSS 变量)、`mixin.scss`(混入)、`sidebar.scss`(侧边栏)、`transition.scss`(过渡动画)。组件内样式使用 `<style scoped>`,深度选择器使用 `>>>` 而非 `/deep/` 或 `::v-deep`。Element UI Dialog 的 `closeOnClickModal` 已全局设为 `false`。
|
||||
|
||||
## 国际化
|
||||
|
||||
项目集成了 `vue-i18n`,Element UI 组件已绑定 i18n。语言包位于 `src/lang/` 目录,包含 `zh.js`(中文)和 `en.js`(英文)。但实际业务代码中大量使用中文硬编码,国际化支持有限。
|
||||
|
||||
## 图标系统
|
||||
|
||||
SVG 图标位于 `src/icons/svg/` 目录,通过 `svg-sprite-loader` 自动注册。在模板中使用 `<svg-icon icon-class="xxx" />` 引用。图标文件名与路由 meta 中的 icon 字段对应,命名采用英文帕斯卡命名法(如 `ProcessPlanning.svg`、`AssemblyExecution.svg`)。
|
||||
|
||||
## 代码风格约束
|
||||
|
||||
不使用 ES6 解构导入组件,使用 `import Vue from 'vue'` 风格。不使用 `async/await`,使用 `.then().catch()` 链式调用。变量命名允许中文拼音或英文,但数据库字段必须使用中文。不添加 ESLint 忽略注释(`// eslint-disable-next-line`)除非绝对必要。不使用箭头函数作为 Vue 生命周期钩子。不引入项目中未使用的第三方库。
|
||||
|
||||
## 新增页面开发流程
|
||||
|
||||
新增页面时:1)在 `src/views/对应模块/` 下创建文件夹和 `index.vue`;2)在 `src/api/对应模块/` 下创建或追加 API 函数;3)后端配置菜单数据后,前端通过动态路由自动加载;4)页面结构遵循搜索栏 + 数据表格的标准布局;5)使用全局工具方法(`CreateData`、`ExecDatabase`、`getTable` 等)进行数据操作;6)表格列字段名使用中文与后端保持一致。
|
||||
|
||||
## 调试与排错
|
||||
|
||||
请求拦截器中会检查 Cookie 中的 `id` 是否存在,不存在则强制登出并刷新页面。登录 API(`name` 为 `菜单系统模块_用户名密码_查询数据_new2` 和 `菜单系统模块_获取角色模块_查询数据`)跳过此检查。控制台日志使用 `console.log`,不使用 `console.error` 输出调试信息。Vue Router 的 `replace` 方法已全局捕获异常避免重复导航报错。
|
||||
Reference in New Issue
Block a user