Home Explore Help
Register Sign In
DDM
/
aizuda-web-vue3
2
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

feat(conventions): 更新代码规范和最佳实践

更新了代码规范和最佳实践文档，包括TypeScript使用、命名约定、UI和样式指南、性能优化等。
- 增加了对TypeScript接口和类型定义的指导。
- 明确了目录和文件的命名规范。
- 强化了对Vue Composition API的使用建议。
- 引入了Element Plus和Tailwind CSS的使用指南。
- 描述了性能优化的策略，如动态加载和图片优化。
- 强调了Web Vitals的优化重要性。
luoyali 9 months ago
parent
96f73a38a9
commit
b7c4f740d2
3 changed files with 39 additions and 2 deletions
Split View Show Diff Stats
  1. 1 1
      .ai-commit.json
  2. 35 0
      src/.cursorrules
  3. 3 1
      src/views/approve/components/approvedContent.vue

+ 1 - 1
.ai-commit.json
View File 

@@ -123,6 +123,6 @@
 
         }
 
     },
 
     "prompts": {
 
-        "conventional": "Here are some best practices for writing commit messages:\n- Write clear, concise, and descriptive messages that explain the changes made in the commit.\n- Use the present tense and active voice in the message, for example, \"Fix bug\" instead of \"Fixed bug.\"\n- Use the imperative mood, which gives the message a sense of command, e.g. \"Add feature\" instead of \"Added feature\"\n- Limit the subject line to 72 characters or less.\n- Capitalize the subject line.\n- Do not end the subject line with a period.\n- Limit the body of the message to 256 characters or less.\n- Use a blank line between the subject and the body of the message.\n- Use the body of the message to provide additional context or explain the reasoning behind the changes.\n- Avoid using general terms like \"update\" or \"change\" in the subject line, be specific about what was updated or changed.\n- Explain, What was done at a glance in the subject line, and provide additional context in the body of the message.\n- Why the change was necessary in the body of the message.\n- The details about what was done in the body of the message.\n- Any useful details concerning the change in the body of the message.\n- Use a hyphen (-) for the bullet points in the body of the message.\n<type-prompt>\nWrite 1 commit messages that accurately summarizes the changes made in the given `git diff` output, following the best practices listed above and the conventional commit format in chinese.\nPlease provide a response in the form of a valid JSON object and do not include \"Output:\", \"Response:\" or anything similar to those two before it, in the following format:\n{\n    \"subject\": \"<type>(<scope>): <subject>\",\n    \"body\": \"<BODY (bullet points)>\"\n}\n\nHere is the output of the `git diff`:\n<diff>"
 
+        "conventional": "Here are some best practices for writing commit messages:\n- Write clear, concise, and descriptive messages that explain the changes made in the commit.\n- Use the present tense and active voice in the message, for example, \"Fix bug\" instead of \"Fixed bug.\"\n- Use the imperative mood, which gives the message a sense of command, e.g. \"Add feature\" instead of \"Added feature\"\n- Limit the subject line to 72 characters or less.\n- Capitalize the subject line.\n- Do not end the subject line with a period.\n- Limit the body of the message to 256 characters or less.\n- Use a blank line between the subject and the body of the message.\n- Use the body of the message to provide additional context or explain the reasoning behind the changes.\n- Avoid using general terms like \"update\" or \"change\" in the subject line, be specific about what was updated or changed.\n- Explain, What was done at a glance in the subject line, and provide additional context in the body of the message.\n- Why the change was necessary in the body of the message.\n- The details about what was done in the body of the message.\n- Any useful details concerning the change in the body of the message.\n- Use a hyphen (-) for the bullet points in the body of the message.\n<type-prompt>\nWrite 1 commit messages that accurately summarizes the changes made in the given `git diff` output, following the best practices listed above and the conventional commit format in Chinese.\nPlease provide a response in the form of a valid JSON object and do not include \"Output:\", \"Response:\" or anything similar to those two before it, in the following format:\n{\n    \"subject\": \"<type>(<scope>): <subject>\",\n    \"body\": \"<BODY (bullet points)>\"\n}\n\nHere is the output of the `git diff`:\n<diff>"
 
     }
 
 }

+ 35 - 0
src/.cursorrules
View File 

@@ -0,0 +1,35 @@
 
+You are an expert in TypeScript, Node.js, Vite, Vue.js, Vue Router, Pinia, VueUse, Headless UI, Element Plus, and Tailwind, with a deep understanding of best practices and performance optimization techniques in these technologies.
 
+
 
+Code Style and Structure
 
+- Write concise, maintainable, and technically accurate TypeScript code with relevant examples.
 
+- Use functional and declarative programming patterns; avoid classes.
 
+- Favor iteration and modularization to adhere to DRY principles and avoid code duplication.
 
+- Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError).
 
+- Organize files systematically: each file should contain only related content, such as exported components, subcomponents, helpers, static content, and types.
 
+
 
+Naming Conventions
 
+- Use lowercase with dashes for directories (e.g., components/auth-wizard).
 
+- Favor named exports for functions.
 
+
 
+TypeScript Usage
 
+- Use TypeScript for all code; prefer interfaces over types for their extendability and ability to merge.
 
+- Avoid enums; use maps instead for better type safety and flexibility.
 
+- Use functional components with TypeScript interfaces.
 
+
 
+Syntax and Formatting
 
+- Use the "function" keyword for pure functions to benefit from hoisting and clarity.
 
+- Always use the Vue Composition API script setup style.
 
+
 
+UI and Styling
 
+- Use Element UI, Element Plus, and Tailwind for components and styling.
 
+- Implement responsive design with Tailwind CSS; use a mobile-first approach.
 
+
 
+Performance Optimization
 
+- Leverage VueUse functions where applicable to enhance reactivity and performance.
 
+- Wrap asynchronous components in Suspense with a fallback UI.
 
+- Use dynamic loading for non-critical components.
 
+- Optimize images: use WebP format, include size data, implement lazy loading.
 
+- Implement an optimized chunking strategy during the Vite build process, such as code splitting, to generate smaller bundle sizes.
 
+
 
+Key Conventions
 
+- Optimize Web Vitals (LCP, CLS, FID) using tools like Lighthouse or WebPageTest.

+ 3 - 1
src/views/approve/components/approvedContent.vue
View File 

@@ -485,7 +485,7 @@ const getTaskDetail = () => {
 
 						}
 
 						return
 
 					} else {
 
-						formContent = `{"formStructure":${data.formTemplate.content}}` || '{}'
 
+						formContent = data.formContent
 
 					}
 
 				} else {
 
 					formContent = data.formContent
 
@@ -496,6 +496,7 @@ const getTaskDetail = () => {
 
 				cur_formStructure = formStructure // 存储一份
 
 				let newFields = cur_formStructure.fields
 
 				let newFieldsList = cur_formStructure.list
 
+
 
 				// pendingApproval, 除了[待审批]这个状态, 其余只能读取
 
 				if (props.currentTaskType !== 'pendingApproval') {
 
 					newFields.map(item1 => (item1.options.disabled = true))
 
@@ -530,6 +531,7 @@ const getTaskDetail = () => {
 
 				cur_formData = formData
 
 				console.log(cur_formStructure, '=/////====newFormStructure');
 
 				console.log(formData, '=/////====newFormStructure formData');
 
+
 
 				EReditorRef.value.setData(cur_formStructure, formData)
 
 				validateForm.value.rule = newFields
 
 				/* 这里主要是表单设计的逻辑 end */