👨‍💻 编码规范

代码检测和格式化

组件模板：A-TEMPLATE文件夹下为常见组件模板，大部分页面应参考该模板代码的风格和使用习惯，以此做到统一风格。
代码片段：项目中的vue.code-snippets文件，已预设了很多Element UI的代码片段，它将会给你带来很多便捷。
注释：
- 当某段代码量足够多时应该注释其每小段的步骤意图和功能，尽量清晰、简洁。
- tool.js里的工具函数应填写详细的注释包括：概述其功能、入参数据类型+数据描述、返回的数据类型、步骤意图和功能。

NOTE

变量和函数名使用小驼峰命名法，类名和组件命名使用大驼峰命名法。

除特殊情况，禁止使用拼音，英文首字母简写或其他不明确表述等命名变量和函数。
let/const：变量创建使用let小驼峰命名，常量创建使用const创建并单词使用大写命名。
query/get: 获取请求接口数据的函数使用：queryXXX 命名 , getXXX 用于获取非接口的数据。
open/close：按钮打开/关闭dialog弹窗或者滑动的组件时使用，如openDialog、openDetail、openExport 等。
add/delete/close：分别为添加数据/删除数据/关闭（结案）数据，在单个组件下没有其他的同样操作时，不需写明操作的是xx的数据如（添加产品 addProduct），应使用通用的写法addRow/addData等
save：保存按钮命名为 saveEdit/saveData/saveDetial等。在单个组件下没有其他的保存操作时，不需要写明保存的是xx的数据。
英文名缩写参考

禁止在html代码中使用行内样式编写style，优先考虑使用我们自己制定的全局class变量,类似于tailwind，css原子类在class上写样式。
在使用动态样式时，应优先考虑使用动态class，如根据状态变化颜色 :class="['green', 'red', 'orange'][scope.row.status] 这样会更直观
选择器命名: id (大驼峰) class (小驼峰 "-"拼接) ，可参考BEM架构(BEM是指block、element、modifier的缩写，分别为块层、元素层、修饰符层，element UI 也使用的是这种架构)。

css

<style>
  .block {}

  .block__element {}

  .block--modifier {}
</style>

  computed: {
    filteredData() {
      return this.tableData.filter((item) => !item.disable);
    },
  },