mirror of
https://github.com/Tencent/tmagic-editor.git
synced 2025-05-01 15:18:47 +08:00
Compare commits
No commits in common. "master" and "v1.5.12" have entirely different histories.
14
.eslintignore
Normal file
14
.eslintignore
Normal file
@ -0,0 +1,14 @@
|
||||
dist
|
||||
coverage
|
||||
node_modules
|
||||
dest
|
||||
types
|
||||
public/entry
|
||||
public/runtime
|
||||
|
||||
comp-entry.ts
|
||||
config-entry.ts
|
||||
value-entry.ts
|
||||
|
||||
magic-admin/web/public/runtime
|
||||
magic-admin/server/static
|
||||
71
.eslintrc.cjs
Normal file
71
.eslintrc.cjs
Normal file
@ -0,0 +1,71 @@
|
||||
module.exports = {
|
||||
env: {
|
||||
node: true,
|
||||
browser: true,
|
||||
es2021: true,
|
||||
},
|
||||
globals: {
|
||||
describe: true,
|
||||
it: true,
|
||||
expect: true,
|
||||
beforeEach: true,
|
||||
},
|
||||
extends: [
|
||||
'eslint-config-tencent',
|
||||
'eslint-config-tencent/ts',
|
||||
'plugin:vue/vue3-essential',
|
||||
'./prettier.cjs',
|
||||
],
|
||||
parser: 'vue-eslint-parser',
|
||||
parserOptions: {
|
||||
ecmaVersion: 12,
|
||||
parser: '@typescript-eslint/parser',
|
||||
extraFileExtensions: ['.vue'],
|
||||
sourceType: 'module',
|
||||
},
|
||||
plugins: [
|
||||
'vue',
|
||||
'@typescript-eslint',
|
||||
'simple-import-sort'
|
||||
],
|
||||
ignorePatterns: ['.eslintrc.cjs'],
|
||||
rules: {
|
||||
'vue/no-mutating-props': 'off',
|
||||
'vue/multi-word-component-names': 'off',
|
||||
'no-param-reassign': 'off',
|
||||
'@typescript-eslint/naming-convention': 'off',
|
||||
'@typescript-eslint/no-require-imports': 'off',
|
||||
"@typescript-eslint/no-misused-promises": [
|
||||
"error",
|
||||
{
|
||||
"checksVoidReturn": false
|
||||
}
|
||||
],
|
||||
'simple-import-sort/imports': [
|
||||
"error", {
|
||||
groups: [
|
||||
['./polyfills'],
|
||||
// Node.js builtins. You could also generate this regex if you use a `.js` config.
|
||||
// For example: `^(${require("module").builtinModules.join("|")})(/|$)`
|
||||
[
|
||||
"^(assert|buffer|child_process|cluster|console|constants|crypto|dgram|dns|domain|events|fs|http|https|module|net|os|path|punycode|querystring|readline|repl|stream|string_decoder|sys|timers|tls|tty|url|util|vm|zlib|freelist|v8|process|async_hooks|http2|perf_hooks)(/.*|$)",
|
||||
],
|
||||
["^(node)(:.*|$)"],
|
||||
// Packages. `react|vue` related packages come first.
|
||||
["^(react|vue|vite)", "^@?\\w"],
|
||||
["^(@tmagic)(/.*|$)"],
|
||||
// Internal packages.
|
||||
["^(@|@editor|@data-source)(/.*|$)"],
|
||||
// Side effect imports.
|
||||
["^\\u0000"],
|
||||
// Parent imports. Put `..` last.
|
||||
["^\\.\\.(?!/?$)", "^\\.\\./?$"],
|
||||
// Other relative imports. Put same-folder imports and `.` last.
|
||||
["^\\./(?=.*/)(?!/?$)", "^\\.(?!/?$)", "^\\./?$"],
|
||||
// Style imports.
|
||||
["^.+\\.s?css$"],
|
||||
],
|
||||
}
|
||||
]
|
||||
},
|
||||
};
|
||||
6
.github/workflows/pages.yml
vendored
6
.github/workflows/pages.yml
vendored
@ -10,16 +10,16 @@ jobs:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- uses: actions/checkout@v2
|
||||
with:
|
||||
fetch-depth: 0
|
||||
ref: dev
|
||||
|
||||
- name: Install pnpm
|
||||
uses: pnpm/action-setup@v4
|
||||
uses: pnpm/action-setup@v2
|
||||
|
||||
- name: Set node version to 18
|
||||
uses: actions/setup-node@v4
|
||||
uses: actions/setup-node@v2
|
||||
with:
|
||||
node-version: 18
|
||||
cache: 'pnpm'
|
||||
|
||||
2
.gitignore
vendored
2
.gitignore
vendored
@ -31,5 +31,3 @@ coverage
|
||||
auto-imports.d.ts
|
||||
components.d.ts
|
||||
docs/.vitepress/cache
|
||||
|
||||
.eslintcache
|
||||
|
||||
59
CHANGELOG.md
59
CHANGELOG.md
@ -1,62 +1,3 @@
|
||||
## [1.5.16](https://github.com/Tencent/tmagic-editor/compare/v1.5.15...v1.5.16) (2025-04-28)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **data-source:** 异步加载数据源后，数据源未初始化 ([378c756](https://github.com/Tencent/tmagic-editor/commit/378c75658d1b50454ceb8cf4072b09beffb86067))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **core:** instance设定不再限制只有方法 ([e5bcd76](https://github.com/Tencent/tmagic-editor/commit/e5bcd762b290a6b58bfd6486628c828207e30c37))
|
||||
* **core:** 添加error hander配置 ([6dc0073](https://github.com/Tencent/tmagic-editor/commit/6dc007388bb28e6501bcb026fce1e2881b87bd82))
|
||||
* **editor:** 组件默认的名称，id配置只要在业务不提供时才加入 ([2dc0bbc](https://github.com/Tencent/tmagic-editor/commit/2dc0bbc679a7ab1ee1b7d368973bcb4abed2c0bb))
|
||||
|
||||
|
||||
|
||||
## [1.5.15](https://github.com/Tencent/tmagic-editor/compare/v1.5.14...v1.5.15) (2025-04-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **editor:** getTMagicApp返回类型错误 ([ba05ecb](https://github.com/Tencent/tmagic-editor/commit/ba05ecbf608785d97c60adbdd6b7381597e6cb6f))
|
||||
|
||||
|
||||
|
||||
## [1.5.14](https://github.com/Tencent/tmagic-editor/compare/v1.5.13...v1.5.14) (2025-04-24)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **dep:** 配置了数据源内部方法无法收集到依赖 ([0e91133](https://github.com/Tencent/tmagic-editor/commit/0e911337b8f88e5e88fecf072395c38d2de1bc08))
|
||||
* **editor:** 编辑数据源/代码块时，列表高亮 ([de52ff4](https://github.com/Tencent/tmagic-editor/commit/de52ff4fe100cb11b73865703b03a0cbcc4e92e7))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **form:** onChange添加setModel参数，用于修改model并添加至修改记录中 ([5e0e776](https://github.com/Tencent/tmagic-editor/commit/5e0e776d4004c9a4ad2ae53d7146353dc088a478))
|
||||
* **utils:** 添加设置删除获取url参数的方法 ([105de9d](https://github.com/Tencent/tmagic-editor/commit/105de9d2c6ba69eb9e7ca9777f16441e5aa4c1f0))
|
||||
* **vue-runtime-help:** app不存在时抛异常，保证app一定存在，避免多余的可选链 ([fd7e737](https://github.com/Tencent/tmagic-editor/commit/fd7e737e8c4f4958c8d59d5f844f40cf1509724f))
|
||||
|
||||
|
||||
|
||||
## [1.5.13](https://github.com/Tencent/tmagic-editor/compare/v1.5.12...v1.5.13) (2025-04-10)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **data-source:** 数据源初始化时机比注册早回出现死循环 ([840c2c3](https://github.com/Tencent/tmagic-editor/commit/840c2c3c7d267f999e229f7720cbbdc1bf5e2436))
|
||||
* 修复表格拖拽排序与表单选字操作冲突的问题 ([f91eb41](https://github.com/Tencent/tmagic-editor/commit/f91eb415dbdf23c8f05bc21617de67aef7bd524c))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **core:** 支持传入env ([0bcd7d0](https://github.com/Tencent/tmagic-editor/commit/0bcd7d075518523809b639e8128583c87b90aa89))
|
||||
* **core:** 支持自定义Node类 ([18524d8](https://github.com/Tencent/tmagic-editor/commit/18524d89fb8086a34307ed17e54da520db92add2))
|
||||
* **editor:** 编辑代码块/数据源时高亮列表中对应的项 ([54e00f2](https://github.com/Tencent/tmagic-editor/commit/54e00f28524e546cecd0691d19fbcb0bee4af35e))
|
||||
|
||||
|
||||
|
||||
## [1.5.12](https://github.com/Tencent/tmagic-editor/compare/v1.5.11...v1.5.12) (2025-03-27)
|
||||
|
||||
|
||||
|
||||
@ -17,7 +17,11 @@
|
||||
<slot name="highlight"></slot>
|
||||
</div>
|
||||
</div>
|
||||
<div class="demo-block-control" ref="control" @click="isExpanded = !isExpanded">
|
||||
<div
|
||||
class="demo-block-control"
|
||||
ref="control"
|
||||
@click="isExpanded = !isExpanded"
|
||||
>
|
||||
<transition name="arrow-slide">
|
||||
<i :class="[iconClass, hovering]"></i>
|
||||
</transition>
|
||||
@ -26,14 +30,23 @@
|
||||
</transition>
|
||||
<el-tooltip effect="dark" :content="'前往 codepen.io 运行此示例'" placement="right">
|
||||
<transition name="text-slide">
|
||||
<el-button size="small" type="primary" text class="control-button" @click.stop="goCodepen">
|
||||
{{ type === 'form' ? '查看结果' : '在线运行' }}
|
||||
<el-button
|
||||
size="small"
|
||||
type="primary"
|
||||
text
|
||||
class="control-button"
|
||||
@click.stop="goCodepen"
|
||||
>
|
||||
{{type === 'form' ? '查看结果' : '在线运行'}}
|
||||
</el-button>
|
||||
</transition>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
<el-dialog v-model="resultVisible" title="result">
|
||||
<el-dialog
|
||||
v-model="resultVisible"
|
||||
title="result"
|
||||
>
|
||||
<pre><code class="language-javascript hljs" v-html="result"></code></pre>
|
||||
</el-dialog>
|
||||
</div>
|
||||
@ -47,9 +60,7 @@
|
||||
transition: 0.2s;
|
||||
|
||||
&.hover {
|
||||
box-shadow:
|
||||
0 0 8px 0 rgba(232, 237, 250, 0.6),
|
||||
0 2px 4px 0 rgba(232, 237, 250, 0.5);
|
||||
box-shadow: 0 0 8px 0 rgba(232, 237, 250, 0.6), 0 2px 4px 0 rgba(232, 237, 250, 0.5);
|
||||
}
|
||||
|
||||
code {
|
||||
@ -208,7 +219,9 @@ export function stripTemplate(content) {
|
||||
}
|
||||
|
||||
export default {
|
||||
props: ['type', 'config'],
|
||||
props: [
|
||||
'type', 'config'
|
||||
],
|
||||
|
||||
data() {
|
||||
return {
|
||||
@ -280,15 +293,12 @@ export default {
|
||||
},
|
||||
|
||||
text() {
|
||||
return this.isStringConfig
|
||||
? hljs.highlight('js', this.config).value
|
||||
: hljs.highlight(
|
||||
'js',
|
||||
serialize(this.config, {
|
||||
space: 2,
|
||||
unsafe: true,
|
||||
}).replace(/"(\w+)":\s/g, '$1: '),
|
||||
).value;
|
||||
return this.isStringConfig ?
|
||||
hljs.highlight('js', this.config).value :
|
||||
hljs.highlight('js', serialize(this.config, {
|
||||
space: 2,
|
||||
unsafe: true,
|
||||
}).replace(/"(\w+)":\s/g, '$1: ')).value;
|
||||
},
|
||||
|
||||
formConfig() {
|
||||
@ -297,7 +307,7 @@ export default {
|
||||
|
||||
isStringConfig() {
|
||||
return typeof this.config === 'string';
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
@ -346,7 +356,7 @@ export default {
|
||||
});
|
||||
},
|
||||
|
||||
beforeUnmount() {
|
||||
beforeDestroy() {
|
||||
this.removeScrollHandler();
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,566 +0,0 @@
|
||||
export default {
|
||||
rules: {
|
||||
/**
|
||||
* 不要在中括号中添加空格
|
||||
*/
|
||||
'array-bracket-spacing': ['error', 'never'],
|
||||
/**
|
||||
* 数组的方法除了 forEach 之外，回调函数必须有返回值
|
||||
*/
|
||||
'array-callback-return': 'warn',
|
||||
/**
|
||||
* 要求箭头函数体使用大括号
|
||||
*/
|
||||
'arrow-body-style': ['warn', 'as-needed'],
|
||||
/**
|
||||
* 要求箭头函数的参数使用圆括号
|
||||
*/
|
||||
'arrow-parens': [
|
||||
'warn',
|
||||
'as-needed',
|
||||
{
|
||||
requireForBlockBody: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 强制箭头函数的箭头前后使用一致的空格
|
||||
*/
|
||||
'arrow-spacing': 'warn',
|
||||
/**
|
||||
* 要求打开的块标志和同一行上的标志拥有一致的间距。此规则还会在同一行关闭的块标记和前边的标记强制实施一致的间距。
|
||||
*/
|
||||
'block-spacing': 'error',
|
||||
/**
|
||||
* 强制在代码块中使用一致的大括号风格
|
||||
*/
|
||||
'brace-style': 'error',
|
||||
/**
|
||||
* 使用驼峰命名法（camelCase）命名对象、函数和实例。
|
||||
*/
|
||||
camelcase: [
|
||||
'error',
|
||||
{
|
||||
ignoreDestructuring: true,
|
||||
properties: 'never',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 添加尾随逗号
|
||||
*/
|
||||
'comma-dangle': ['warn', 'always-multiline'],
|
||||
/**
|
||||
* 强制在逗号前后使用一致的空格
|
||||
*/
|
||||
'comma-spacing': [
|
||||
'error',
|
||||
{
|
||||
before: false,
|
||||
after: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 强制使用一致的逗号风格
|
||||
*/
|
||||
'comma-style': ['error', 'last'],
|
||||
/**
|
||||
* 强制在计算的属性的方括号中使用一致的空格
|
||||
*/
|
||||
'computed-property-spacing': ['warn', 'never'],
|
||||
/**
|
||||
* 禁止使用 foo['bar']，必须写成 foo.bar
|
||||
*/
|
||||
'dot-notation': 'warn',
|
||||
/**
|
||||
* 要求或禁止文件末尾存在空行
|
||||
*/
|
||||
'eol-last': ['error', 'always'],
|
||||
/**
|
||||
* 必须使用 === 或 !==，禁止使用 == 或 !=
|
||||
*/
|
||||
eqeqeq: ['warn', 'always'],
|
||||
/**
|
||||
* 要求或禁止在函数标识符和其调用之间有空格
|
||||
*/
|
||||
'func-call-spacing': ['error', 'never'],
|
||||
/**
|
||||
* 必须只使用函数声明或只使用函数表达式
|
||||
*/
|
||||
'func-style': ['off', 'expression'],
|
||||
/**
|
||||
* 强制在函数括号内使用一致的换行
|
||||
*/
|
||||
'function-paren-newline': ['warn', 'multiline'],
|
||||
/**
|
||||
* 强制 generator 函数中 * 号周围使用一致的空格
|
||||
*/
|
||||
'generator-star-spacing': [
|
||||
'warn',
|
||||
{
|
||||
before: false,
|
||||
after: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 限制变量名长度
|
||||
*/
|
||||
'id-length': 'off',
|
||||
/**
|
||||
* 强制隐式返回的箭头函数体的位置
|
||||
*/
|
||||
'implicit-arrow-linebreak': ['warn', 'beside'],
|
||||
/**
|
||||
* 使用 2 个空格缩进
|
||||
*/
|
||||
indent: [
|
||||
'warn',
|
||||
2,
|
||||
{
|
||||
SwitchCase: 1,
|
||||
VariableDeclarator: 1,
|
||||
outerIIFEBody: 1,
|
||||
FunctionDeclaration: {
|
||||
parameters: 1,
|
||||
body: 1,
|
||||
},
|
||||
FunctionExpression: {
|
||||
parameters: 1,
|
||||
body: 1,
|
||||
},
|
||||
CallExpression: {
|
||||
arguments: 1,
|
||||
},
|
||||
ArrayExpression: 1,
|
||||
ObjectExpression: 1,
|
||||
ImportDeclaration: 1,
|
||||
flatTernaryExpressions: false,
|
||||
ignoredNodes: [
|
||||
'JSXElement',
|
||||
'JSXElement > *',
|
||||
'JSXAttribute',
|
||||
'JSXIdentifier',
|
||||
'JSXNamespacedName',
|
||||
'JSXMemberExpression',
|
||||
'JSXSpreadAttribute',
|
||||
'JSXExpressionContainer',
|
||||
'JSXOpeningElement',
|
||||
'JSXClosingElement',
|
||||
'JSXFragment',
|
||||
'JSXOpeningFragment',
|
||||
'JSXClosingFragment',
|
||||
'JSXText',
|
||||
'JSXEmptyExpression',
|
||||
'JSXSpreadChild',
|
||||
],
|
||||
ignoreComments: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 强制在对象字面量的属性中键和值之间使用一致的间距
|
||||
*/
|
||||
'key-spacing': 'error',
|
||||
/**
|
||||
* 强制在关键字前后使用一致的空格
|
||||
*/
|
||||
'keyword-spacing': [
|
||||
'error',
|
||||
{
|
||||
overrides: {
|
||||
if: {
|
||||
after: true,
|
||||
},
|
||||
for: {
|
||||
after: true,
|
||||
},
|
||||
while: {
|
||||
after: true,
|
||||
},
|
||||
else: {
|
||||
after: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 只允许使用 unix 的 LF 作为换行符，Windows 的 CRLF 不可以使用
|
||||
*/
|
||||
'linebreak-style': ['warn', 'unix'],
|
||||
/**
|
||||
* 强制一行的最大长度，限制单行不能超过100个字符，字符串和正则表达式除外。
|
||||
*/
|
||||
'max-len': [
|
||||
'off',
|
||||
{
|
||||
code: 120,
|
||||
ignoreStrings: true,
|
||||
ignoreUrls: true,
|
||||
ignoreRegExpLiterals: true,
|
||||
ignoreTemplateLiterals: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 只有在命名构造器或者类的时候，才用帕斯卡拼命名法（PascalCase），即首字母大写。
|
||||
*/
|
||||
'new-cap': [
|
||||
'error',
|
||||
{
|
||||
newIsCap: true,
|
||||
newIsCapExceptions: [],
|
||||
capIsNew: false,
|
||||
capIsNewExceptions: ['Immutable.Map', 'Immutable.Set', 'Immutable.List'],
|
||||
properties: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 在编写多个方法链式调用(超过两个方法链式调用)时。 使用前导点，强调这行是一个方法调用，而不是一个语句。
|
||||
*/
|
||||
'newline-per-chained-call': [
|
||||
'warn',
|
||||
{
|
||||
ignoreChainWithDepth: 2,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 使用字面量语法创建数组。
|
||||
*/
|
||||
'no-array-constructor': ['error'],
|
||||
/**
|
||||
* 在 case 和 default 的子句中，如果存在声明 (例如. let, const, function, 和 class)，使用大括号来创建块级作用域。
|
||||
*/
|
||||
'no-case-declarations': 'error',
|
||||
/**
|
||||
* 避免搞混箭头函数符号 (=>) 和比较运算符 (<=, >=)。
|
||||
*/
|
||||
'no-confusing-arrow': 'warn',
|
||||
/**
|
||||
* 禁止对使用 const 定义的常量重新赋值
|
||||
*/
|
||||
'no-const-assign': 'error',
|
||||
/**
|
||||
* 禁止重复定义类的成员
|
||||
*/
|
||||
'no-dupe-class-members': 'error',
|
||||
/**
|
||||
* 禁止在 else 内使用 return，必须改为提前结束
|
||||
*/
|
||||
'no-else-return': [
|
||||
'warn',
|
||||
{
|
||||
allowElseIf: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止使用 eval
|
||||
*/
|
||||
'no-eval': 'error',
|
||||
/**
|
||||
* 不要使用迭代器。
|
||||
* @reason 推荐使用 JavaScript 的高阶函数代替 for-in。
|
||||
*/
|
||||
'no-iterator': 'warn',
|
||||
/**
|
||||
* 禁止在循环内的函数内部出现循环体条件语句中定义的变量
|
||||
*/
|
||||
'no-loop-func': 'error',
|
||||
/**
|
||||
* 禁止混合使用不同的操作符:
|
||||
* - 禁止 `%`, `**` 之间混用
|
||||
* - 禁止 `%` 与其它运算符之间混用
|
||||
* - 禁止乘除运算符之间混用
|
||||
* - 禁止位运算符之间的任何混用
|
||||
* - 禁止比较运算符之间混用
|
||||
* - 禁止 `&&`, `||` 之间混用
|
||||
*/
|
||||
'no-mixed-operators': [
|
||||
'error',
|
||||
{
|
||||
groups: [
|
||||
['%', '**'],
|
||||
['%', '+'],
|
||||
['%', '-'],
|
||||
['%', '*'],
|
||||
['%', '/'],
|
||||
['&', '|', '<<', '>>', '>>>'],
|
||||
['==', '!=', '===', '!=='],
|
||||
['&&', '||'],
|
||||
],
|
||||
allowSamePrecedence: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止连续赋值，比如 foo = bar = 1
|
||||
*/
|
||||
'no-multi-assign': 'error',
|
||||
/**
|
||||
* 不要使用多个空行填充代码。
|
||||
*/
|
||||
'no-multiple-empty-lines': 'error',
|
||||
/**
|
||||
* 禁止使用嵌套的三元表达式，比如 a ? b : c ? d : e
|
||||
*/
|
||||
'no-nested-ternary': 'warn',
|
||||
/**
|
||||
* 禁止使用 new Function
|
||||
* @reason 这和 eval 是等价的
|
||||
*/
|
||||
'no-new-func': 'error',
|
||||
/**
|
||||
* 禁止直接 new Object
|
||||
*/
|
||||
'no-new-object': 'error',
|
||||
/**
|
||||
* 禁止使用 new 来生成 String, Number 或 Boolean
|
||||
*/
|
||||
'no-new-wrappers': 'warn',
|
||||
/**
|
||||
* 禁止对函数的参数重新赋值
|
||||
*/
|
||||
'no-param-reassign': [
|
||||
'warn',
|
||||
{
|
||||
props: true,
|
||||
ignorePropertyModificationsFor: [
|
||||
'acc',
|
||||
'accumulator',
|
||||
'e',
|
||||
'ctx',
|
||||
'req',
|
||||
'request',
|
||||
'res',
|
||||
'response',
|
||||
'$scope',
|
||||
'staticContext',
|
||||
'state',
|
||||
],
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止使用 ++ 或 --
|
||||
*/
|
||||
'no-plusplus': [
|
||||
'error',
|
||||
{
|
||||
allowForLoopAfterthoughts: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止使用 hasOwnProperty, isPrototypeOf 或 propertyIsEnumerable
|
||||
*/
|
||||
'no-prototype-builtins': 'error',
|
||||
/**
|
||||
* 计算指数时，可以使用 ** 运算符。
|
||||
*/
|
||||
'no-restricted-properties': [
|
||||
'warn',
|
||||
{
|
||||
object: 'Math',
|
||||
property: 'pow',
|
||||
message: 'Please use ** instand',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 推荐使用 JavaScript 的高阶函数代替 for-in
|
||||
*/
|
||||
'no-restricted-syntax': [
|
||||
'warn',
|
||||
{
|
||||
selector: 'ForInStatement',
|
||||
message:
|
||||
'for..in loops iterate over the entire prototype chain, which is virtually never what you want. Use Object.{keys,values,entries}, and iterate over the resulting array.',
|
||||
},
|
||||
{
|
||||
selector: 'LabeledStatement',
|
||||
message: 'Labels are a form of GOTO; using them makes code confusing and hard to maintain and understand.',
|
||||
},
|
||||
{
|
||||
selector: 'WithStatement',
|
||||
message: '`with` is disallowed in strict mode because it makes code impossible to predict and optimize.',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 避免在行尾添加空格。
|
||||
*/
|
||||
'no-trailing-spaces': 'error',
|
||||
/**
|
||||
* 变量应先声明再使用，禁止引用任何未声明的变量，除非你明确知道引用的变量存在于当前作用域链上。
|
||||
*/
|
||||
'no-undef': ['error'],
|
||||
/**
|
||||
* 禁止变量名出现下划线
|
||||
*/
|
||||
'no-underscore-dangle': 'warn',
|
||||
/**
|
||||
* 必须使用 !a 替代 a ? false : true
|
||||
*/
|
||||
'no-unneeded-ternary': 'warn',
|
||||
/**
|
||||
* 已定义的变量必须使用
|
||||
* 但不检查最后一个使用的参数之前的参数
|
||||
* 也不检查 rest 属性的兄弟属性
|
||||
*/
|
||||
'no-unused-vars': [
|
||||
'error',
|
||||
{
|
||||
args: 'after-used',
|
||||
ignoreRestSiblings: true,
|
||||
argsIgnorePattern: '^_.+',
|
||||
varsIgnorePattern: '^_.+',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止出现没必要的 constructor
|
||||
*/
|
||||
'no-useless-constructor': 'warn',
|
||||
/**
|
||||
* 禁止出现没必要的转义
|
||||
*/
|
||||
'no-useless-escape': 'error',
|
||||
/**
|
||||
* 禁止使用 var
|
||||
*/
|
||||
'no-var': 'error',
|
||||
/**
|
||||
* 禁止属性前有空白
|
||||
*/
|
||||
'no-whitespace-before-property': 'warn',
|
||||
/**
|
||||
* 强制单个语句的位置
|
||||
*/
|
||||
'nonblock-statement-body-position': ['error', 'beside'],
|
||||
/**
|
||||
* 强制在大括号中使用一致的空格
|
||||
*/
|
||||
'object-curly-spacing': ['warn', 'always'],
|
||||
/**
|
||||
* 将对象方法、属性简写，且间歇属性放在前面。
|
||||
*/
|
||||
'object-shorthand': 'warn',
|
||||
/**
|
||||
* 禁止变量申明时用逗号一次申明多个
|
||||
*/
|
||||
'one-var': ['warn', 'never'],
|
||||
/**
|
||||
* 避免在赋值语句 = 前后换行。如果你的代码单行长度超过了 max-len 定义的长度而不得不换行，那么使用括号包裹。
|
||||
*/
|
||||
'operator-linebreak': [
|
||||
'error',
|
||||
'before',
|
||||
{
|
||||
overrides: {
|
||||
'=': 'none',
|
||||
},
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 要求或禁止块内填充
|
||||
*/
|
||||
'padded-blocks': ['error', 'never'],
|
||||
/**
|
||||
* 要求回调函数使用箭头函数
|
||||
*/
|
||||
'prefer-arrow-callback': 'warn',
|
||||
/**
|
||||
* 申明后不再被修改的变量必须使用 const 来申明
|
||||
*/
|
||||
'prefer-const': [
|
||||
'error',
|
||||
{
|
||||
destructuring: 'any',
|
||||
ignoreReadBeforeAssign: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 优先使用解构赋值
|
||||
*/
|
||||
'prefer-destructuring': [
|
||||
'warn',
|
||||
{
|
||||
VariableDeclarator: {
|
||||
array: false,
|
||||
object: true,
|
||||
},
|
||||
AssignmentExpression: {
|
||||
array: true,
|
||||
object: false,
|
||||
},
|
||||
},
|
||||
{
|
||||
enforceForRenamedProperties: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 必须使用 ...args 而不是 arguments
|
||||
*/
|
||||
'prefer-rest-params': 'warn',
|
||||
/**
|
||||
* 必须使用 ... 而不是 apply，比如 foo(...args)
|
||||
*/
|
||||
'prefer-spread': 'warn',
|
||||
/**
|
||||
* 必须使用模版字符串而不是字符串连接
|
||||
*/
|
||||
'prefer-template': 'error',
|
||||
/**
|
||||
* 要求对象字面量属性名称用引号括起来
|
||||
*/
|
||||
'quote-props': [
|
||||
'error',
|
||||
'as-needed',
|
||||
{
|
||||
keywords: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 使用单引号 '' 定义字符串
|
||||
*/
|
||||
quotes: [
|
||||
'warn',
|
||||
'single',
|
||||
{
|
||||
allowTemplateLiterals: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* parseInt 必须传入第二个参数
|
||||
*/
|
||||
radix: 'warn',
|
||||
/**
|
||||
* 要加分号
|
||||
*/
|
||||
semi: ['error', 'always'],
|
||||
/**
|
||||
* 强制在块之前使用一致的空格
|
||||
*/
|
||||
'space-before-blocks': 'error',
|
||||
/**
|
||||
* 强制在 function 的左括号之前使用一致的空格
|
||||
*/
|
||||
'space-before-function-paren': [
|
||||
'error',
|
||||
{
|
||||
anonymous: 'always',
|
||||
named: 'never',
|
||||
asyncArrow: 'always',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 强制在圆括号内使用一致的空格
|
||||
*/
|
||||
'space-in-parens': ['error', 'never'],
|
||||
/**
|
||||
* 要求操作符周围有空格
|
||||
*/
|
||||
'space-infix-ops': 'error',
|
||||
/**
|
||||
* 注释的斜线或 * 后必须有空格
|
||||
*/
|
||||
'spaced-comment': ['error', 'always'],
|
||||
/**
|
||||
* 要求或禁止模板字符串中的嵌入表达式周围空格的使用
|
||||
*/
|
||||
'template-curly-spacing': ['error', 'never'],
|
||||
/**
|
||||
* 要求立即执行的函数使用括号括起来
|
||||
*/
|
||||
'wrap-iife': ['error', 'outside'],
|
||||
},
|
||||
};
|
||||
@ -1,38 +0,0 @@
|
||||
import simpleImportSort from 'eslint-plugin-simple-import-sort';
|
||||
|
||||
export default {
|
||||
files: ['**/*.{js,mjs,cjs,ts,vue}'],
|
||||
plugins: {
|
||||
'simple-import-sort': simpleImportSort,
|
||||
},
|
||||
rules: {
|
||||
'simple-import-sort/imports': [
|
||||
'error',
|
||||
{
|
||||
groups: [
|
||||
['./polyfills'],
|
||||
['^(node)(:.*|$)'],
|
||||
// Node.js builtins. You could also generate this regex if you use a `.js` config.
|
||||
// For example: `^(${require("module").builtinModules.join("|")})(/|$)`
|
||||
[
|
||||
'^(assert|buffer|child_process|cluster|console|constants|crypto|dgram|dns|domain|events|fs|http|https|module|net|os|path|punycode|querystring|readline|repl|stream|string_decoder|sys|timers|tls|tty|url|util|vm|zlib|freelist|v8|process|async_hooks|http2|perf_hooks)(/.*|$)',
|
||||
],
|
||||
// Packages. `react|vue` related packages come first.
|
||||
['^(react|vue|vite|vitest)', '^@?\\w'],
|
||||
['^(@tencent)(/.*|$)'],
|
||||
['^(@tmagic)(/.*|$)'],
|
||||
// Internal packages.
|
||||
['^(@|@editor|@data-source)(/.*|$)'],
|
||||
// Side effect imports.
|
||||
['^\\u0000'],
|
||||
// Parent imports. Put `..` last.
|
||||
['^\\.\\.(?!/?$)', '^\\.\\./?$'],
|
||||
// Other relative imports. Put same-folder imports and `.` last.
|
||||
['^\\./(?=.*/)(?!/?$)', '^\\.(?!/?$)', '^\\./?$'],
|
||||
// Style imports.
|
||||
['^.+\\.s?css$'],
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
@ -1,37 +0,0 @@
|
||||
import { rules } from 'eslint-plugin-import';
|
||||
|
||||
export default {
|
||||
plugins: {
|
||||
import: {
|
||||
meta: { name: 'eslint-plugin-import' },
|
||||
rules,
|
||||
},
|
||||
},
|
||||
files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],
|
||||
languageOptions: {
|
||||
ecmaVersion: 2018,
|
||||
sourceType: 'module',
|
||||
},
|
||||
rules: {
|
||||
/**
|
||||
* 导入语句前不允许有任何非导入语句
|
||||
*/
|
||||
'import/first': 'error',
|
||||
/**
|
||||
* 禁止重复导入模块
|
||||
*/
|
||||
'import/no-duplicates': 'error',
|
||||
/**
|
||||
* 禁止使用 let 导出
|
||||
*/
|
||||
'import/no-mutable-exports': 'warn',
|
||||
/**
|
||||
* 禁用导入的模块时使用 webpack 特有的语法（感叹号）
|
||||
*/
|
||||
'import/no-webpack-loader-syntax': 'warn',
|
||||
/**
|
||||
* 当只有一个导出时，必须使用 export default 来导出
|
||||
*/
|
||||
'import/prefer-default-export': 'off',
|
||||
},
|
||||
};
|
||||
@ -1,376 +0,0 @@
|
||||
export default {
|
||||
files: ['**/*.ts', '**/*.tsx'],
|
||||
rules: {
|
||||
'brace-style': 'off',
|
||||
'no-empty-function': 'off',
|
||||
// https://github.com/typescript-eslint/typescript-eslint/issues/491
|
||||
'no-invalid-this': 'off',
|
||||
'no-magic-numbers': 'off',
|
||||
'react/sort-comp': 'off',
|
||||
'func-call-spacing': 'off',
|
||||
'comma-spacing': 'off',
|
||||
'dot-notation': 'off',
|
||||
indent: 'off',
|
||||
'keyword-spacing': 'off',
|
||||
camelcase: 'off',
|
||||
'no-underscore-dangle': 'off',
|
||||
'no-array-constructor': 'off',
|
||||
'no-dupe-class-members': 'off',
|
||||
'no-undef': 'off',
|
||||
'no-unused-vars': 'off',
|
||||
'no-useless-constructor': 'off',
|
||||
quotes: 'off',
|
||||
semi: 'off',
|
||||
'space-before-function-paren': 'off',
|
||||
// https://github.com/typescript-eslint/typescript-eslint/issues/600
|
||||
'spaced-comment': ['error', 'always', { markers: ['/'] }],
|
||||
/**
|
||||
* 重载的函数必须写在一起
|
||||
* @reason 增加可读性
|
||||
*/
|
||||
'@typescript-eslint/adjacent-overload-signatures': 'error',
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/ts/brace-style': 'error',
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/comma-spacing': [
|
||||
'error',
|
||||
{
|
||||
before: false,
|
||||
after: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 类型断言必须使用 as Type，禁止使用 <Type>，禁止对对象字面量进行类型断言（断言成 any 是允许的）
|
||||
* @reason <Type> 容易被理解为 jsx
|
||||
*/
|
||||
'@typescript-eslint/consistent-type-assertions': [
|
||||
'error',
|
||||
{
|
||||
assertionStyle: 'as',
|
||||
objectLiteralTypeAssertions: 'never',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 优先使用 interface 而不是 type
|
||||
*/
|
||||
'@typescript-eslint/consistent-type-definitions': 'off',
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@typescript-eslint/dot-notation': 'warn',
|
||||
/**
|
||||
* 必须设置类的成员的可访问性
|
||||
* @reason 将不需要公开的成员设为私有的，可以增强代码的可理解性，对文档输出也很友好
|
||||
*/
|
||||
'@typescript-eslint/explicit-member-accessibility': 'off',
|
||||
/**
|
||||
* 要求或禁止在函数标识符和其调用之间有空格
|
||||
*/
|
||||
'@stylistic/ts/func-call-spacing': ['error', 'never'],
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/ts/indent': [
|
||||
'warn',
|
||||
2,
|
||||
{
|
||||
SwitchCase: 1,
|
||||
VariableDeclarator: 1,
|
||||
outerIIFEBody: 1,
|
||||
FunctionDeclaration: {
|
||||
parameters: 1,
|
||||
body: 1,
|
||||
},
|
||||
FunctionExpression: {
|
||||
parameters: 1,
|
||||
body: 1,
|
||||
},
|
||||
CallExpression: {
|
||||
arguments: 1,
|
||||
},
|
||||
ArrayExpression: 1,
|
||||
ObjectExpression: 1,
|
||||
ImportDeclaration: 1,
|
||||
flatTernaryExpressions: false,
|
||||
ignoredNodes: [
|
||||
'JSXElement',
|
||||
'JSXElement > *',
|
||||
'JSXAttribute',
|
||||
'JSXIdentifier',
|
||||
'JSXNamespacedName',
|
||||
'JSXMemberExpression',
|
||||
'JSXSpreadAttribute',
|
||||
'JSXExpressionContainer',
|
||||
'JSXOpeningElement',
|
||||
'JSXClosingElement',
|
||||
'JSXFragment',
|
||||
'JSXOpeningFragment',
|
||||
'JSXClosingFragment',
|
||||
'JSXText',
|
||||
'JSXEmptyExpression',
|
||||
'JSXSpreadChild',
|
||||
],
|
||||
ignoreComments: false,
|
||||
},
|
||||
],
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/ts/keyword-spacing': [
|
||||
'error',
|
||||
{
|
||||
overrides: {
|
||||
if: {
|
||||
after: true,
|
||||
},
|
||||
for: {
|
||||
after: true,
|
||||
},
|
||||
while: {
|
||||
after: true,
|
||||
},
|
||||
else: {
|
||||
after: true,
|
||||
},
|
||||
},
|
||||
before: true,
|
||||
after: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 指定类成员的排序规则
|
||||
* @reason 优先级：
|
||||
* 1. static > instance
|
||||
* 2. field > constructor > method
|
||||
* 3. public > protected > private
|
||||
*/
|
||||
'@typescript-eslint/member-ordering': [
|
||||
'error',
|
||||
{
|
||||
default: [
|
||||
'public-static-field',
|
||||
'protected-static-field',
|
||||
'private-static-field',
|
||||
'static-field',
|
||||
'public-static-method',
|
||||
'protected-static-method',
|
||||
'private-static-method',
|
||||
'static-method',
|
||||
'public-instance-field',
|
||||
'protected-instance-field',
|
||||
'private-instance-field',
|
||||
'public-field',
|
||||
'protected-field',
|
||||
'private-field',
|
||||
'instance-field',
|
||||
'field',
|
||||
'constructor',
|
||||
'public-instance-method',
|
||||
'protected-instance-method',
|
||||
'private-instance-method',
|
||||
'public-method',
|
||||
'protected-method',
|
||||
'private-method',
|
||||
'instance-method',
|
||||
'method',
|
||||
],
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 接口中的方法必须用属性的方式定义
|
||||
*/
|
||||
'@typescript-eslint/method-signature-style': 'off',
|
||||
/** 代替 JS 规则 camelCase 的 TS 规则 */
|
||||
'@typescript-eslint/naming-convention': [
|
||||
'warn',
|
||||
{
|
||||
selector: 'function',
|
||||
format: ['camelCase', 'PascalCase'],
|
||||
},
|
||||
{
|
||||
selector: 'variable',
|
||||
format: ['camelCase', 'UPPER_CASE'],
|
||||
},
|
||||
{
|
||||
selector: 'variable',
|
||||
modifiers: ['global'],
|
||||
format: ['camelCase', 'PascalCase', 'UPPER_CASE'],
|
||||
},
|
||||
{
|
||||
selector: 'variable',
|
||||
format: ['camelCase', 'PascalCase'],
|
||||
types: ['function'],
|
||||
},
|
||||
{
|
||||
selector: 'variable',
|
||||
modifiers: ['exported'],
|
||||
format: ['UPPER_CASE'],
|
||||
types: ['boolean', 'string', 'number', 'array'],
|
||||
},
|
||||
{
|
||||
selector: 'variable',
|
||||
modifiers: ['exported'],
|
||||
format: ['camelCase', 'PascalCase'],
|
||||
types: ['function'],
|
||||
},
|
||||
{
|
||||
selector: ['class', 'typeLike'],
|
||||
format: ['PascalCase'],
|
||||
},
|
||||
{
|
||||
selector: ['classMethod', 'classProperty'],
|
||||
leadingUnderscore: 'forbid',
|
||||
trailingUnderscore: 'forbid',
|
||||
format: ['camelCase'],
|
||||
},
|
||||
],
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@typescript-eslint/no-array-constructor': 'error',
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@typescript-eslint/no-dupe-class-members': 'error',
|
||||
/**
|
||||
* 禁止定义空的接口
|
||||
*/
|
||||
'@typescript-eslint/no-empty-interface': 'error',
|
||||
/**
|
||||
* 禁止给一个初始化时直接赋值为 number, string 的变量显式的声明类型
|
||||
* @reason 可以简化代码
|
||||
*/
|
||||
'@typescript-eslint/no-inferrable-types': 'warn',
|
||||
/**
|
||||
* 禁止对 promise 的误用，详见示例
|
||||
*/
|
||||
'@typescript-eslint/no-misused-promises': [
|
||||
'error',
|
||||
{
|
||||
checksConditionals: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止使用 namespace 来定义命名空间
|
||||
* @reason 使用 es6 引入模块，才是更标准的方式。
|
||||
* 但是允许使用 declare namespace ... {} 来定义外部命名空间
|
||||
*/
|
||||
'@typescript-eslint/no-namespace': [
|
||||
'error',
|
||||
{
|
||||
allowDeclarations: true,
|
||||
allowDefinitionFiles: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止在 optional chaining 之后使用 non-null 断言（感叹号）
|
||||
* @reason optional chaining 后面的属性一定是非空的
|
||||
*/
|
||||
'@typescript-eslint/no-non-null-asserted-optional-chain': 'error',
|
||||
/**
|
||||
* 禁止给类的构造函数的参数添加修饰符
|
||||
*/
|
||||
'@typescript-eslint/no-parameter-properties': 'off',
|
||||
/**
|
||||
* 禁止使用 require
|
||||
* @reason 统一使用 import 来引入模块，特殊情况使用单行注释允许 require 引入
|
||||
*/
|
||||
'@typescript-eslint/no-require-imports': 'error',
|
||||
/**
|
||||
* 禁止将 this 赋值给其他变量，除非是解构赋值
|
||||
*/
|
||||
'@typescript-eslint/no-this-alias': [
|
||||
'error',
|
||||
{
|
||||
allowDestructuring: true,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止无用的表达式
|
||||
*/
|
||||
'@typescript-eslint/no-unused-expressions': [
|
||||
'error',
|
||||
{
|
||||
allowShortCircuit: true,
|
||||
allowTernary: true,
|
||||
allowTaggedTemplates: true,
|
||||
},
|
||||
],
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@typescript-eslint/no-unused-vars': [
|
||||
'error',
|
||||
{
|
||||
args: 'after-used',
|
||||
ignoreRestSiblings: true,
|
||||
argsIgnorePattern: '^_.+',
|
||||
varsIgnorePattern: '^_.+',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止出现没必要的 constructor
|
||||
*/
|
||||
'@typescript-eslint/no-useless-constructor': 'warn',
|
||||
/**
|
||||
* 使用 for 循环遍历数组时，如果索引仅用于获取成员，则必须使用 for of 循环替代 for 循环
|
||||
* @reason for of 循环更加易读
|
||||
*/
|
||||
'@typescript-eslint/prefer-for-of': 'warn',
|
||||
/**
|
||||
* 使用函数类型别名替代包含函数调用声明的接口
|
||||
*/
|
||||
'@typescript-eslint/prefer-function-type': 'warn',
|
||||
/**
|
||||
* 禁止使用 module 来定义命名空间
|
||||
* @reason module 已成为 js 的关键字
|
||||
*/
|
||||
'@typescript-eslint/prefer-namespace-keyword': 'error',
|
||||
/**
|
||||
* 使用 optional chaining 替代 &&
|
||||
*/
|
||||
'@typescript-eslint/prefer-optional-chain': 'error',
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/ts/quotes': [
|
||||
'warn',
|
||||
'single',
|
||||
{
|
||||
allowTemplateLiterals: false,
|
||||
},
|
||||
],
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/ts/semi': ['error', 'always'],
|
||||
/** 同 JS 规则的 TS 版本 */
|
||||
'@stylistic/ts/space-before-function-paren': [
|
||||
'error',
|
||||
{
|
||||
anonymous: 'always',
|
||||
named: 'never',
|
||||
asyncArrow: 'always',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 禁止使用三斜杠导入文件
|
||||
* @reason 三斜杠是已废弃的语法，但在类型声明文件中还是可以使用的
|
||||
*/
|
||||
'@typescript-eslint/triple-slash-reference': [
|
||||
'error',
|
||||
{
|
||||
path: 'never',
|
||||
types: 'always',
|
||||
lib: 'always',
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 在类型注释周围需要一致的间距
|
||||
*/
|
||||
'@stylistic/ts/type-annotation-spacing': 'error',
|
||||
/**
|
||||
* interface 和 type 定义时必须声明成员的类型
|
||||
*/
|
||||
'@typescript-eslint/typedef': [
|
||||
'error',
|
||||
{
|
||||
arrayDestructuring: false,
|
||||
arrowParameter: false,
|
||||
memberVariableDeclaration: false,
|
||||
objectDestructuring: false,
|
||||
parameter: false,
|
||||
propertyDeclaration: true,
|
||||
variableDeclaration: false,
|
||||
},
|
||||
],
|
||||
/**
|
||||
* 函数重载时，若能通过联合类型将两个函数的类型声明合为一个，则使用联合类型而不是两个函数声明
|
||||
*/
|
||||
'@typescript-eslint/unified-signatures': 'error',
|
||||
},
|
||||
};
|
||||
@ -1,39 +0,0 @@
|
||||
import js from '@eslint/js';
|
||||
import stylistic from '@stylistic/eslint-plugin';
|
||||
import stylisticTs from '@stylistic/eslint-plugin-ts';
|
||||
import parserTs from '@typescript-eslint/parser';
|
||||
import { defineConfig } from 'eslint/config';
|
||||
import eslintPluginPrettierRecommended from 'eslint-plugin-prettier/recommended';
|
||||
import pluginVue from 'eslint-plugin-vue';
|
||||
import globals from 'globals';
|
||||
import tseslint from 'typescript-eslint';
|
||||
|
||||
import tencentEslintBaseConfig from './flat/base.mjs';
|
||||
import tencentEslintImportexport from './flat/import.mjs';
|
||||
import ImportSortConfig from './flat/import-sort.mjs';
|
||||
import tencentEslintPrettierConfig from './flat/prettier.mjs';
|
||||
import tencentEslintTsConfig from './flat/ts.mjs';
|
||||
|
||||
export default (tsconfigRootDir) =>
|
||||
defineConfig([
|
||||
{ files: ['**/*.{js,mjs,cjs}'], plugins: { js }, extends: ['js/recommended'] },
|
||||
{ files: ['**/*.{js,mjs,cjs,ts,vue}'], languageOptions: { globals: { ...globals.browser, ...globals.node } } },
|
||||
...tseslint.config(tencentEslintBaseConfig, tencentEslintImportexport, tseslint.configs.base, {
|
||||
plugins: {
|
||||
'@stylistic': stylistic,
|
||||
'@stylistic/ts': stylisticTs,
|
||||
},
|
||||
languageOptions: {
|
||||
parser: parserTs,
|
||||
parserOptions: {
|
||||
project: tsconfigRootDir,
|
||||
},
|
||||
},
|
||||
...tencentEslintTsConfig,
|
||||
}),
|
||||
pluginVue.configs['flat/essential'],
|
||||
{ files: ['**/*.vue'], languageOptions: { parserOptions: { parser: tseslint.parser } } },
|
||||
eslintPluginPrettierRecommended,
|
||||
tencentEslintPrettierConfig,
|
||||
ImportSortConfig,
|
||||
]);
|
||||
@ -1,29 +0,0 @@
|
||||
{
|
||||
"name": "@tmagic/eslint-config",
|
||||
"version": "0.0.1",
|
||||
"main": "index.mjs",
|
||||
"type": "module",
|
||||
"repository": {
|
||||
"directory": "eslint-config",
|
||||
"type": "git",
|
||||
"url": "https://github.com/Tencent/tmagic-editor.git"
|
||||
},
|
||||
"dependencies": {
|
||||
"@eslint/js": "^9.24.0",
|
||||
"@typescript-eslint/parser": "^8.30.1",
|
||||
"@typescript-eslint/eslint-plugin": "^8.30.1",
|
||||
"@stylistic/eslint-plugin": "^4.2.0",
|
||||
"@stylistic/eslint-plugin-ts": "^4.2.0",
|
||||
"eslint-config-prettier": "^10.1.2",
|
||||
"eslint-plugin-import": "^2.31.0",
|
||||
"eslint-plugin-simple-import-sort": "^12.1.1",
|
||||
"eslint-plugin-vue": "^10.0.0",
|
||||
"eslint-plugin-prettier": "^5.2.6",
|
||||
"globals": "^16.0.0",
|
||||
"typescript-eslint": "^8.30.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"eslint": ">=9.24.0",
|
||||
"prettier": ">=3.5.3"
|
||||
}
|
||||
}
|
||||
@ -1,41 +0,0 @@
|
||||
import path from 'node:path';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
|
||||
import { defineConfig, globalIgnores } from 'eslint/config';
|
||||
|
||||
import eslintConfig from '@tmagic/eslint-config';
|
||||
|
||||
export default defineConfig([
|
||||
globalIgnores([
|
||||
'./docs/**/*',
|
||||
'./packages/cli/lib/**/*',
|
||||
'*/**/auto-imports.d.ts',
|
||||
'*/**/components.d.ts',
|
||||
'*/**/dist/**/*',
|
||||
'*/**/.tmagic/**/*',
|
||||
'*/**/public/**/*',
|
||||
'*/**/types/**/*',
|
||||
'*/**/*.config.ts',
|
||||
'vite-env.d.ts',
|
||||
]),
|
||||
...eslintConfig(path.join(path.dirname(fileURLToPath(import.meta.url)), 'tsconfig.json')),
|
||||
{
|
||||
files: ['**/*.vue'],
|
||||
rules: {
|
||||
'vue/no-mutating-props': 'off',
|
||||
'vue/multi-word-component-names': 'off',
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['**/*.{js,mjs,cjs,ts,vue}'],
|
||||
rules: {
|
||||
'no-param-reassign': 'off',
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['**/*.tsx'],
|
||||
rules: {
|
||||
'@typescript-eslint/naming-convention': 'off',
|
||||
},
|
||||
},
|
||||
]);
|
||||
44
package.json
44
package.json
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "tmagic",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
@ -9,8 +9,8 @@
|
||||
"clean:top": "rimraf */**/dist */**/types */dist coverage dwt* temp packages/cli/lib",
|
||||
"clean:modules": "rimraf node_modules **/node_modules **/**/node_modules",
|
||||
"clean:all": "pnpm clean:top && pnpm clean:modules",
|
||||
"lint": "eslint --cache .",
|
||||
"lint-fix": "eslint --fix --cache .",
|
||||
"lint": "eslint . --ext .js,.vue,.ts,.tsx",
|
||||
"lint-fix": "eslint . --fix --ext .vue,.js,.ts,.tsx",
|
||||
"playground": "pnpm --filter \"runtime-vue3\" build:libs && pnpm --filter \"runtime-vue3\" --filter \"tmagic-playground\" dev",
|
||||
"pg": "pnpm playground",
|
||||
"playground:vue2": "pnpm --filter \"runtime-vue2\" build:libs && pnpm --filter \"runtime-vue2\" --filter \"tmagic-playground\" dev:vue2",
|
||||
@ -46,19 +46,25 @@
|
||||
"@commitlint/cli": "^18.6.1",
|
||||
"@commitlint/config-conventional": "^18.6.3",
|
||||
"@rollup/plugin-alias": "^5.1.1",
|
||||
"@tmagic/eslint-config": "workspace: ^*",
|
||||
"@types/node": "18.19.61",
|
||||
"@vitejs/plugin-vue": "^5.2.3",
|
||||
"@vitest/coverage-v8": "^2.1.9",
|
||||
"@typescript-eslint/eslint-plugin": "^5.62.0",
|
||||
"@typescript-eslint/parser": "^5.62.0",
|
||||
"@vitejs/plugin-vue": "^5.2.1",
|
||||
"@vitest/coverage-v8": "^2.1.8",
|
||||
"@vue/compiler-sfc": "^3.5.13",
|
||||
"c8": "^7.14.0",
|
||||
"commitizen": "^4.3.1",
|
||||
"conventional-changelog-cli": "^4.1.0",
|
||||
"cosmiconfig": "^8.3.6",
|
||||
"cz-conventional-changelog": "^3.3.0",
|
||||
"element-plus": "^2.9.7",
|
||||
"element-plus": "^2.9.3",
|
||||
"enquirer": "^2.4.1",
|
||||
"eslint": "^9.25.0",
|
||||
"eslint": "^8.57.1",
|
||||
"eslint-config-tencent": "^1.1.2",
|
||||
"eslint-plugin-import": "^2.31.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-simple-import-sort": "^10.0.0",
|
||||
"eslint-plugin-vue": "^9.32.0",
|
||||
"execa": "^4.1.0",
|
||||
"highlight.js": "^11.11.1",
|
||||
"husky": "^7.0.4",
|
||||
@ -66,20 +72,20 @@
|
||||
"lint-staged": "^11.2.6",
|
||||
"minimist": "^1.2.8",
|
||||
"picocolors": "^1.1.1",
|
||||
"prettier": "^3.5.3",
|
||||
"recast": "^0.23.11",
|
||||
"prettier": "^2.8.8",
|
||||
"recast": "^0.20.5",
|
||||
"rimraf": "^3.0.2",
|
||||
"rollup": "^4.38.0",
|
||||
"rollup-plugin-dts": "^6.2.1",
|
||||
"semver": "^7.7.1",
|
||||
"rollup": "^4.31.0",
|
||||
"rollup-plugin-dts": "^6.1.1",
|
||||
"semver": "^7.6.3",
|
||||
"serialize-javascript": "^6.0.2",
|
||||
"shx": "^0.3.4",
|
||||
"typescript": "^5.8.2",
|
||||
"vite": "^6.2.4",
|
||||
"vitepress": "^1.6.3",
|
||||
"vitest": "^3.1.1",
|
||||
"typescript": "^5.7.3",
|
||||
"vite": "^6.2.3",
|
||||
"vitepress": "^1.6.1",
|
||||
"vitest": "^3.0.2",
|
||||
"vue": "^3.5.13",
|
||||
"vue-tsc": "^2.2.8"
|
||||
"vue-tsc": "^2.2.0"
|
||||
},
|
||||
"config": {
|
||||
"commitizen": {
|
||||
@ -87,7 +93,7 @@
|
||||
}
|
||||
},
|
||||
"lint-staged": {
|
||||
"*.{js,ts,vue}": "eslint --fix --cache",
|
||||
"*.{js,ts,vue}": "eslint --fix",
|
||||
"*.scss": "prettier --write"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "@tmagic/cli",
|
||||
"main": "lib/index.js",
|
||||
"types": "lib/index.d.ts",
|
||||
@ -31,7 +31,7 @@
|
||||
"esbuild": "^0.21.5",
|
||||
"fs-extra": "^11.2.0",
|
||||
"picocolors": "^1.1.1",
|
||||
"recast": "^0.23.11",
|
||||
"recast": "^0.23.9",
|
||||
"tslib": "^2.8.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import path from 'node:path';
|
||||
import path from 'path';
|
||||
|
||||
import fs from 'fs-extra';
|
||||
|
||||
@ -6,7 +6,6 @@ import { ModuleMainFilePath, UserConfig } from './types';
|
||||
import { prepareEntryFile, resolveAppPackages } from './utils';
|
||||
|
||||
export default class Core {
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
public version = require('../package.json').version;
|
||||
|
||||
public options: UserConfig;
|
||||
|
||||
@ -29,7 +29,6 @@ export const cli = (defaultAppConfig: UserConfig): void => {
|
||||
const program = cac('tmagic');
|
||||
|
||||
// display core version and cli version
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
const versionCli = require('../package.json').version;
|
||||
program.version(`tmagic/cli@${versionCli}`);
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import path from 'node:path';
|
||||
import path from 'path';
|
||||
|
||||
import fs from 'fs-extra';
|
||||
|
||||
|
||||
@ -84,8 +84,6 @@ export interface UserConfig {
|
||||
npmConfig?: NpmConfig;
|
||||
/** 是否使用import()加载组件 */
|
||||
dynamicImport?: boolean;
|
||||
/** 指定组件不使用动态加载，dynamicImport为true时有效 */
|
||||
dynamicIgnore?: string[];
|
||||
hooks?: {
|
||||
beforeWriteEntry?: (genContentMap: Record<string, string>, app: Core) => Promise<Record<string, string>>;
|
||||
};
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import fs from 'node:fs';
|
||||
import path from 'node:path';
|
||||
import fs from 'fs';
|
||||
import path from 'path';
|
||||
|
||||
export const backupFile = (runtimeSource: string, file: string) => {
|
||||
const filePath = path.join(runtimeSource, file);
|
||||
|
||||
@ -10,7 +10,6 @@ export const hasExportDefault = <T = any>(mod: unknown): mod is { default: T } =
|
||||
isPlainObject(mod) && !!mod.__esModule && Object.prototype.hasOwnProperty.call(mod, 'default');
|
||||
|
||||
export const loadUserConfigCjs: UserConfigLoader = async (userConfigPath) => {
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
const required = require(userConfigPath);
|
||||
return hasExportDefault(required) ? required.default : required;
|
||||
};
|
||||
|
||||
@ -5,7 +5,7 @@ import { EntryType } from '../types';
|
||||
|
||||
export const prepareEntryFile = async (app: App) => {
|
||||
const { moduleMainFilePath, options } = app;
|
||||
const { dynamicImport, dynamicIgnore, hooks, useTs = true } = options;
|
||||
const { dynamicImport, hooks, useTs = true } = options;
|
||||
|
||||
let contentMap: Record<string, string> = {
|
||||
'comp-entry': generateContent(
|
||||
@ -20,7 +20,6 @@ export const prepareEntryFile = async (app: App) => {
|
||||
moduleMainFilePath.componentPackage,
|
||||
moduleMainFilePath.componentMap,
|
||||
dynamicImport,
|
||||
dynamicIgnore,
|
||||
),
|
||||
'plugin-entry': generateContent(
|
||||
useTs,
|
||||
@ -96,7 +95,7 @@ export const prepareEntryFile = async (app: App) => {
|
||||
app.writeTemp(fileName, content);
|
||||
} else {
|
||||
fileName = `${file}.js`;
|
||||
app.writeTemp(`${file}.d.ts`, 'const type: Record<string, any>;\n\nexport default type;');
|
||||
app.writeTemp(`${file}.d.ts`, `const type: Record<string, any>;\n\nexport default type;`);
|
||||
}
|
||||
app.writeTemp(fileName, content);
|
||||
});
|
||||
@ -108,7 +107,6 @@ export const generateContent = (
|
||||
packageMap: Record<string, string> = {},
|
||||
map: Record<string, string> = {},
|
||||
dynamicImport = false,
|
||||
dynamicIgnore: string[] = [],
|
||||
) => {
|
||||
const list: string[] = [];
|
||||
const importDeclarations: string[] = [];
|
||||
@ -119,7 +117,7 @@ export const generateContent = (
|
||||
if ([EntryType.CONFIG, EntryType.EVENT, EntryType.VALUE].includes(type) && packagePath === packageMap[key]) {
|
||||
importDeclarations.push(`import { ${type} as ${name} } from '${packageMap[key]}'`);
|
||||
list.push(`'${key}': ${name}`);
|
||||
} else if (dynamicImport && !dynamicIgnore.includes(key)) {
|
||||
} else if (dynamicImport) {
|
||||
list.push(`'${key}': () => import('${packagePath}')`);
|
||||
} else {
|
||||
importDeclarations.push(`import ${name} from '${packagePath}'`);
|
||||
@ -138,7 +136,6 @@ export const generateContent = (
|
||||
};
|
||||
|
||||
export const prettyCode = (code: string) =>
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
recast.prettyPrint(recast.parse(code.replace(/\\/g, '/'), { parser: require('recast/parsers/typescript') }), {
|
||||
tabWidth: 2,
|
||||
trailingComma: true,
|
||||
|
||||
@ -127,7 +127,6 @@ const typeAssertion = function ({
|
||||
|
||||
if (isFile(defaultFile)) {
|
||||
const defaultCode = fs.readFileSync(defaultFile, { encoding: 'utf-8', flag: 'r' });
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
const ast = recast.parse(defaultCode, { parser: require('recast/parsers/typescript') });
|
||||
if (
|
||||
isDatasource(
|
||||
@ -519,7 +518,6 @@ const setPackages = (packages: ModuleMainFilePath, app: App, packagePath: string
|
||||
.replace('\n', '');
|
||||
|
||||
const indexCode = fs.readFileSync(indexPath, { encoding: 'utf-8', flag: 'r' });
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
const ast: Ast = recast.parse(indexCode, { parser: require('recast/parsers/typescript') });
|
||||
const result = typeAssertion({ ast, indexPath, componentFileAffix, datasoucreSuperClass });
|
||||
|
||||
|
||||
@ -7,7 +7,6 @@
|
||||
"rootDir": "./src",
|
||||
"outDir": "./lib",
|
||||
"declaration": true,
|
||||
|
||||
"types": ["node"],
|
||||
},
|
||||
"include": ["./src"],
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "@tmagic/core",
|
||||
"type": "module",
|
||||
"main": "dist/tmagic-core.umd.cjs",
|
||||
|
||||
@ -20,8 +20,8 @@ import { EventEmitter } from 'events';
|
||||
|
||||
import { isEmpty } from 'lodash-es';
|
||||
|
||||
import { createDataSourceManager, type DataSource, DataSourceManager, ObservedDataClass } from '@tmagic/data-source';
|
||||
import type { CodeBlockDSL, DataSourceSchema, Id, JsEngine, MApp, RequestFunction } from '@tmagic/schema';
|
||||
import { createDataSourceManager, DataSourceManager, ObservedDataClass } from '@tmagic/data-source';
|
||||
import type { CodeBlockDSL, Id, JsEngine, MApp, RequestFunction } from '@tmagic/schema';
|
||||
|
||||
import Env from './Env';
|
||||
import EventHelper from './EventHelper';
|
||||
@ -31,15 +31,8 @@ import Node from './Node';
|
||||
import Page from './Page';
|
||||
import { transformStyle as defaultTransformStyle } from './utils';
|
||||
|
||||
export type ErrorHandler = (
|
||||
err: Error,
|
||||
node: DataSource<DataSourceSchema> | Node | undefined,
|
||||
info: Record<string, any>,
|
||||
) => void;
|
||||
|
||||
export interface AppOptionsConfig {
|
||||
ua?: string;
|
||||
env?: Env;
|
||||
config?: MApp;
|
||||
platform?: 'editor' | 'mobile' | 'tv' | 'pc';
|
||||
jsEngine?: JsEngine;
|
||||
@ -52,18 +45,11 @@ export interface AppOptionsConfig {
|
||||
transformStyle?: (style: Record<string, any>) => Record<string, any>;
|
||||
request?: RequestFunction;
|
||||
DataSourceObservedData?: ObservedDataClass;
|
||||
errorHandler?: ErrorHandler;
|
||||
}
|
||||
|
||||
class App extends EventEmitter {
|
||||
[x: string]: any;
|
||||
static nodeClassMap = new Map<string, typeof Node>();
|
||||
|
||||
public static registerNode<T extends typeof Node = typeof Node>(type: string, NodeClass: T) {
|
||||
App.nodeClassMap.set(type, NodeClass);
|
||||
}
|
||||
|
||||
public env!: Env;
|
||||
public env: Env = new Env();
|
||||
public dsl?: MApp;
|
||||
public codeDsl?: CodeBlockDSL;
|
||||
public dataSourceManager?: DataSourceManager;
|
||||
@ -77,21 +63,13 @@ class App extends EventEmitter {
|
||||
public request?: RequestFunction;
|
||||
public transformStyle: (style: Record<string, any>) => Record<string, any>;
|
||||
public eventHelper?: EventHelper;
|
||||
public errorHandler?: ErrorHandler;
|
||||
|
||||
private flexible?: Flexible;
|
||||
|
||||
constructor(options: AppOptionsConfig) {
|
||||
super();
|
||||
|
||||
if (options.env) {
|
||||
this.setEnv(options.env);
|
||||
} else {
|
||||
this.setEnv(options.ua);
|
||||
}
|
||||
|
||||
this.errorHandler = options.errorHandler;
|
||||
|
||||
this.setEnv(options.ua);
|
||||
// 代码块描述内容在dsl codeBlocks字段
|
||||
this.codeDsl = options.config?.codeBlocks;
|
||||
options.platform && (this.platform = options.platform);
|
||||
@ -139,12 +117,8 @@ class App extends EventEmitter {
|
||||
}
|
||||
}
|
||||
|
||||
public setEnv<T extends Env>(ua?: string | T) {
|
||||
if (!ua || typeof ua === 'string') {
|
||||
this.env = new Env(ua);
|
||||
} else {
|
||||
this.env = ua;
|
||||
}
|
||||
public setEnv(ua?: string) {
|
||||
this.env = new Env(ua);
|
||||
}
|
||||
|
||||
public setDesignWidth(width: number) {
|
||||
@ -269,15 +243,7 @@ class App extends EventEmitter {
|
||||
if (!codeId || isEmpty(this.codeDsl)) return;
|
||||
const content = this.codeDsl?.[codeId]?.content;
|
||||
if (typeof content === 'function') {
|
||||
try {
|
||||
await content({ app: this, params, eventParams: args, flowState });
|
||||
} catch (e: any) {
|
||||
if (this.errorHandler) {
|
||||
this.errorHandler(e, undefined, { type: 'run-code', codeId, params, eventParams: args, flowState });
|
||||
} else {
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
await content({ app: this, params, eventParams: args, flowState });
|
||||
}
|
||||
}
|
||||
|
||||
@ -301,15 +267,7 @@ class App extends EventEmitter {
|
||||
if (!method) return;
|
||||
|
||||
if (typeof method.content === 'function') {
|
||||
try {
|
||||
await method.content({ app: this, params, dataSource, eventParams: args, flowState });
|
||||
} catch (e: any) {
|
||||
if (this.errorHandler) {
|
||||
this.errorHandler(e, dataSource, { type: 'data-source-method', params, eventParams: args, flowState });
|
||||
} else {
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
await method.content({ app: this, params, dataSource, eventParams: args, flowState });
|
||||
}
|
||||
}
|
||||
|
||||
@ -321,13 +279,6 @@ class App extends EventEmitter {
|
||||
this.flexible = undefined;
|
||||
|
||||
this.eventHelper?.destroy();
|
||||
|
||||
this.dsl = undefined;
|
||||
|
||||
this.dataSourceManager?.destroy();
|
||||
this.dataSourceManager = undefined;
|
||||
this.codeDsl = undefined;
|
||||
this.components.clear();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -30,11 +30,7 @@ class Env {
|
||||
isWeb = false;
|
||||
isOpenHarmony = false;
|
||||
|
||||
constructor(ua = globalThis.navigator?.userAgent ?? '', options: Record<string, boolean | string> = {}) {
|
||||
if (!ua) {
|
||||
return;
|
||||
}
|
||||
|
||||
constructor(ua = globalThis.navigator.userAgent, options: Record<string, boolean | string> = {}) {
|
||||
this.isIphone = ua.indexOf('iPhone') >= 0;
|
||||
|
||||
this.isIpad = /(iPad).*OS\s([\d_]+)/.test(ua);
|
||||
|
||||
@ -53,8 +53,6 @@ export default class EventHelper extends EventEmitter {
|
||||
public destroy() {
|
||||
this.removeNodeEvents();
|
||||
this.removeAllListeners();
|
||||
this.nodeEventList.clear();
|
||||
this.dataSourceEventList.clear();
|
||||
}
|
||||
|
||||
public bindNodeEvents(node: TMagicNode) {
|
||||
@ -149,7 +147,6 @@ export default class EventHelper extends EventEmitter {
|
||||
*/
|
||||
private async eventHandler(config: EventConfig | number, fromCpt: TMagicNode | DataSource | undefined, args: any[]) {
|
||||
const eventConfig = typeof config === 'number' ? (fromCpt as TMagicNode).events[config] : config;
|
||||
|
||||
if (has(eventConfig, 'actions')) {
|
||||
// EventConfig类型
|
||||
const flowState = new FlowState();
|
||||
@ -166,16 +163,8 @@ export default class EventHelper extends EventEmitter {
|
||||
}
|
||||
flowState.reset();
|
||||
} else {
|
||||
try {
|
||||
// 兼容DeprecatedEventConfig类型 组件动作
|
||||
await this.compActionHandler(eventConfig as unknown as CompItemConfig, fromCpt as TMagicNode, args);
|
||||
} catch (e: any) {
|
||||
if (this.app.errorHandler) {
|
||||
this.app.errorHandler(e, fromCpt, { type: 'action-handler', config: eventConfig, ...args });
|
||||
} else {
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
// 兼容DeprecatedEventConfig类型 组件动作
|
||||
await this.compActionHandler(eventConfig as unknown as CompItemConfig, fromCpt as TMagicNode, args);
|
||||
}
|
||||
}
|
||||
|
||||
@ -185,28 +174,20 @@ export default class EventHelper extends EventEmitter {
|
||||
args: any[],
|
||||
flowState: FlowState,
|
||||
) {
|
||||
try {
|
||||
if (actionItem.actionType === ActionType.COMP) {
|
||||
const compActionItem = actionItem as CompItemConfig;
|
||||
// 组件动作
|
||||
await this.compActionHandler(compActionItem, fromCpt, args);
|
||||
} else if (actionItem.actionType === ActionType.CODE) {
|
||||
const codeActionItem = actionItem as CodeItemConfig;
|
||||
// 执行代码块
|
||||
await this.app.runCode(codeActionItem.codeId, codeActionItem.params || {}, args, flowState);
|
||||
} else if (actionItem.actionType === ActionType.DATA_SOURCE) {
|
||||
const dataSourceActionItem = actionItem as DataSourceItemConfig;
|
||||
if (actionItem.actionType === ActionType.COMP) {
|
||||
const compActionItem = actionItem as CompItemConfig;
|
||||
// 组件动作
|
||||
await this.compActionHandler(compActionItem, fromCpt, args);
|
||||
} else if (actionItem.actionType === ActionType.CODE) {
|
||||
const codeActionItem = actionItem as CodeItemConfig;
|
||||
// 执行代码块
|
||||
await this.app.runCode(codeActionItem.codeId, codeActionItem.params || {}, args, flowState);
|
||||
} else if (actionItem.actionType === ActionType.DATA_SOURCE) {
|
||||
const dataSourceActionItem = actionItem as DataSourceItemConfig;
|
||||
|
||||
const [dsId, methodName] = dataSourceActionItem.dataSourceMethod;
|
||||
const [dsId, methodName] = dataSourceActionItem.dataSourceMethod;
|
||||
|
||||
await this.app.runDataSourceMethod(dsId, methodName, dataSourceActionItem.params || {}, args, flowState);
|
||||
}
|
||||
} catch (e: any) {
|
||||
if (this.app.errorHandler) {
|
||||
this.app.errorHandler(e, fromCpt, { type: 'action-handler', config: actionItem, flowState, ...args });
|
||||
} else {
|
||||
throw e;
|
||||
}
|
||||
await this.app.runDataSourceMethod(dsId, methodName, dataSourceActionItem.params || {}, args, flowState);
|
||||
}
|
||||
}
|
||||
|
||||
@ -225,7 +206,7 @@ export default class EventHelper extends EventEmitter {
|
||||
}
|
||||
|
||||
const toNode = this.app.getNode(to);
|
||||
if (!toNode) throw new Error(`ID为${to}的组件不存在`);
|
||||
if (!toNode) throw `ID为${to}的组件不存在`;
|
||||
|
||||
if (toNode.instance) {
|
||||
if (typeof toNode.instance[methodName] === 'function') {
|
||||
|
||||
@ -73,11 +73,7 @@ class Node extends EventEmitter {
|
||||
const { events, style } = data;
|
||||
this.events = events || [];
|
||||
this.style = style || {};
|
||||
try {
|
||||
this.instance.config = data;
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
} catch (e: any) {}
|
||||
|
||||
this.instance.config = data;
|
||||
this.emit('update-data', data);
|
||||
}
|
||||
|
||||
@ -85,9 +81,6 @@ class Node extends EventEmitter {
|
||||
this.eventQueue.push(event);
|
||||
}
|
||||
|
||||
/**
|
||||
* @deprecated use setInstance instead
|
||||
*/
|
||||
public registerMethod(methods: Methods) {
|
||||
if (!methods) {
|
||||
return;
|
||||
@ -104,10 +97,6 @@ class Node extends EventEmitter {
|
||||
}
|
||||
}
|
||||
|
||||
public setInstance(instance: any) {
|
||||
this.instance = instance;
|
||||
}
|
||||
|
||||
public async runHookCode(hook: string, params?: Record<string, any>) {
|
||||
if (typeof this.data[hook] === 'function') {
|
||||
// 兼容旧的数据格式
|
||||
@ -155,15 +144,11 @@ class Node extends EventEmitter {
|
||||
}
|
||||
|
||||
public destroy() {
|
||||
this.eventQueue.length = 0;
|
||||
this.instance = null;
|
||||
this.events = [];
|
||||
this.style = {};
|
||||
this.removeAllListeners();
|
||||
}
|
||||
|
||||
private listenLifeSafe() {
|
||||
this.once('created', (instance: any) => {
|
||||
this.once('created', async (instance: any) => {
|
||||
this.once('destroy', () => {
|
||||
this.instance = null;
|
||||
if (typeof this.data.destroy === 'function') {
|
||||
@ -174,27 +159,30 @@ class Node extends EventEmitter {
|
||||
});
|
||||
|
||||
if (instance) {
|
||||
this.setInstance(instance);
|
||||
this.registerMethod(instance);
|
||||
if (instance.config) {
|
||||
this.setData(instance.config);
|
||||
}
|
||||
}
|
||||
|
||||
this.runHookCode('created');
|
||||
await this.runHookCode('created');
|
||||
});
|
||||
|
||||
this.once('mounted', (instance: any) => {
|
||||
const handler = async () => {
|
||||
if (instance) {
|
||||
this.setInstance(instance);
|
||||
this.once('mounted', async (instance: any) => {
|
||||
if (instance) {
|
||||
this.registerMethod(instance);
|
||||
if (instance.config) {
|
||||
this.setData(instance.config);
|
||||
}
|
||||
}
|
||||
|
||||
for (let eventConfig = this.eventQueue.shift(); eventConfig; eventConfig = this.eventQueue.shift()) {
|
||||
if (typeof instance[eventConfig.method] === 'function') {
|
||||
await instance[eventConfig.method](eventConfig.fromCpt, ...eventConfig.args);
|
||||
}
|
||||
for (let eventConfig = this.eventQueue.shift(); eventConfig; eventConfig = this.eventQueue.shift()) {
|
||||
if (typeof instance[eventConfig.method] === 'function') {
|
||||
await instance[eventConfig.method](eventConfig.fromCpt, ...eventConfig.args);
|
||||
}
|
||||
}
|
||||
|
||||
this.runHookCode('mounted');
|
||||
};
|
||||
handler();
|
||||
await this.runHookCode('mounted');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
|
||||
import type { Id, MComponent, MContainer, MPage, MPageFragment } from '@tmagic/schema';
|
||||
|
||||
import App from './App';
|
||||
import type App from './App';
|
||||
import IteratorContainer from './IteratorContainer';
|
||||
import type { default as TMagicNode } from './Node';
|
||||
import Node from './Node';
|
||||
@ -53,7 +53,7 @@ class Page extends Node {
|
||||
return;
|
||||
}
|
||||
|
||||
const node = new ((config.type && App.nodeClassMap.get(config.type)) || Node)({
|
||||
const node = new Node({
|
||||
config,
|
||||
parent,
|
||||
page: this,
|
||||
@ -106,16 +106,9 @@ class Page extends Node {
|
||||
}
|
||||
|
||||
public destroy(): void {
|
||||
this.nodes.forEach((node) => {
|
||||
if (node === this) {
|
||||
return;
|
||||
}
|
||||
node.destroy();
|
||||
});
|
||||
super.destroy();
|
||||
|
||||
this.nodes.clear();
|
||||
|
||||
super.destroy();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "@tmagic/data-source",
|
||||
"type": "module",
|
||||
"main": "dist/tmagic-data-source.umd.cjs",
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
/* eslint-disable @typescript-eslint/naming-convention */
|
||||
/*
|
||||
* Tencent is pleased to support the open source community by making TMagicEditor available.
|
||||
*
|
||||
@ -21,8 +20,8 @@ import EventEmitter from 'events';
|
||||
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
|
||||
import type { DataSourceSchema, default as TMagicApp, DisplayCond, Id, MNode } from '@tmagic/core';
|
||||
import { compiledNode, NODE_CONDS_KEY } from '@tmagic/core';
|
||||
import type { DataSourceSchema, default as TMagicApp, DisplayCond, Id, MNode, NODE_CONDS_KEY } from '@tmagic/core';
|
||||
import { compiledNode } from '@tmagic/core';
|
||||
|
||||
import { SimpleObservedData } from './observed-data/SimpleObservedData';
|
||||
import { DataSource, HttpDataSource } from './data-sources';
|
||||
@ -31,22 +30,15 @@ import type { ChangeEvent, DataSourceManagerData, DataSourceManagerOptions, Obse
|
||||
import { compiledNodeField, compliedConditions, compliedIteratorItem, createIteratorContentData } from './utils';
|
||||
|
||||
class DataSourceManager extends EventEmitter {
|
||||
private static dataSourceClassMap = new Map<string, any>([
|
||||
['base', DataSource],
|
||||
['http', HttpDataSource],
|
||||
]);
|
||||
private static dataSourceClassMap = new Map<string, typeof DataSource>();
|
||||
private static ObservedDataClass: ObservedDataClass = SimpleObservedData;
|
||||
private static waitInitSchemaList = new Map<DataSourceManager, Record<string, DataSourceSchema[]>>();
|
||||
private static waitInitSchemaList = new Map<DataSourceManager, DataSourceSchema[]>();
|
||||
|
||||
public static register<T extends typeof DataSource = typeof DataSource>(type: string, dataSource: T) {
|
||||
DataSourceManager.dataSourceClassMap.set(type, dataSource);
|
||||
DataSourceManager.waitInitSchemaList?.forEach((listMap, app) => {
|
||||
const list = listMap[type] || [];
|
||||
DataSourceManager.waitInitSchemaList?.forEach((list, app) => {
|
||||
for (let config = list.shift(); config; config = list.shift()) {
|
||||
const ds = app.addDataSource(config);
|
||||
if (ds) {
|
||||
app.init(ds);
|
||||
}
|
||||
app.addDataSource(config);
|
||||
}
|
||||
});
|
||||
}
|
||||
@ -55,12 +47,6 @@ class DataSourceManager extends EventEmitter {
|
||||
return DataSourceManager.dataSourceClassMap.get(type);
|
||||
}
|
||||
|
||||
public static clearDataSourceClass() {
|
||||
DataSourceManager.dataSourceClassMap.clear();
|
||||
DataSourceManager.dataSourceClassMap.set('base', DataSource);
|
||||
DataSourceManager.dataSourceClassMap.set('http', HttpDataSource);
|
||||
}
|
||||
|
||||
public static registerObservedData(ObservedDataClass: ObservedDataClass) {
|
||||
DataSourceManager.ObservedDataClass = ObservedDataClass;
|
||||
}
|
||||
@ -75,7 +61,7 @@ class DataSourceManager extends EventEmitter {
|
||||
constructor({ app, useMock, initialData }: DataSourceManagerOptions) {
|
||||
super();
|
||||
|
||||
DataSourceManager.waitInitSchemaList.set(this, {});
|
||||
DataSourceManager.waitInitSchemaList.set(this, []);
|
||||
|
||||
this.app = app;
|
||||
this.useMock = useMock;
|
||||
@ -152,25 +138,13 @@ class DataSourceManager extends EventEmitter {
|
||||
return this.dataSourceMap.get(id);
|
||||
}
|
||||
|
||||
public addDataSource(config?: DataSourceSchema) {
|
||||
public async addDataSource(config?: DataSourceSchema) {
|
||||
if (!config) return;
|
||||
|
||||
const DataSourceClass = DataSourceManager.dataSourceClassMap.get(config.type);
|
||||
|
||||
if (!DataSourceClass) {
|
||||
let listMap = DataSourceManager.waitInitSchemaList.get(this);
|
||||
|
||||
if (!listMap) {
|
||||
listMap = {};
|
||||
DataSourceManager.waitInitSchemaList.set(this, listMap);
|
||||
}
|
||||
|
||||
if (listMap[config.type]) {
|
||||
listMap[config.type].push(config);
|
||||
} else {
|
||||
listMap[config.type] = [config];
|
||||
}
|
||||
|
||||
DataSourceManager.waitInitSchemaList.get(this)?.push(config);
|
||||
return;
|
||||
}
|
||||
|
||||
@ -190,8 +164,6 @@ class DataSourceManager extends EventEmitter {
|
||||
ds.on('change', (changeEvent: ChangeEvent) => {
|
||||
this.setData(ds, changeEvent);
|
||||
});
|
||||
|
||||
return ds;
|
||||
}
|
||||
|
||||
public setData(ds: DataSource, changeEvent: ChangeEvent) {
|
||||
@ -329,4 +301,7 @@ class DataSourceManager extends EventEmitter {
|
||||
}
|
||||
}
|
||||
|
||||
DataSourceManager.register('http', HttpDataSource as any);
|
||||
DataSourceManager.register('base', DataSource as any);
|
||||
|
||||
export default DataSourceManager;
|
||||
|
||||
@ -139,7 +139,6 @@ export const compliedDataSourceField = (value: any, data: DataSourceManagerData)
|
||||
|
||||
try {
|
||||
return getValueByKeyPath(fields.join('.'), dsData);
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
} catch (e) {
|
||||
return value;
|
||||
}
|
||||
@ -152,7 +151,6 @@ export const template = (value: string, data?: DataSourceManagerData) =>
|
||||
value.replaceAll(dataSourceTemplateRegExp, (match, $1) => {
|
||||
try {
|
||||
return getValueByKeyPath($1, data);
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
} catch (e: any) {
|
||||
return match;
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { afterAll, describe, expect, test } from 'vitest';
|
||||
import { describe, expect, test } from 'vitest';
|
||||
|
||||
import TMagicApp, { NodeType } from '@tmagic/core';
|
||||
|
||||
@ -28,10 +28,6 @@ const app = new TMagicApp({
|
||||
},
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
DataSourceManager.clearDataSourceClass();
|
||||
});
|
||||
|
||||
describe('DataSourceManager', () => {
|
||||
const dsm = new DataSourceManager({
|
||||
app,
|
||||
|
||||
@ -47,7 +47,5 @@ describe('createDataSourceManager', () => {
|
||||
test('instance', () => {
|
||||
const manager = createDataSourceManager(new TMagicApp({ config: dsl }));
|
||||
expect(manager).toBeInstanceOf(DataSourceManager);
|
||||
|
||||
DataSourceManager.clearDataSourceClass();
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "@tmagic/dep",
|
||||
"type": "module",
|
||||
"main": "dist/tmagic-dep.umd.cjs",
|
||||
|
||||
@ -263,32 +263,20 @@ export const createDataSourceCondTarget = (ds: Pick<DataSourceSchema, 'id' | 'fi
|
||||
isTarget: (key: string | number, value: any) => isDataSourceCondTarget(ds, key, value),
|
||||
});
|
||||
|
||||
export const createDataSourceMethodTarget = (
|
||||
ds: Pick<DataSourceSchema, 'id' | 'methods' | 'fields'>,
|
||||
initialDeps: DepData = {},
|
||||
) =>
|
||||
export const createDataSourceMethodTarget = (ds: Pick<DataSourceSchema, 'id' | 'methods'>, initialDeps: DepData = {}) =>
|
||||
new Target({
|
||||
type: DepTargetType.DATA_SOURCE_METHOD,
|
||||
id: ds.id,
|
||||
initialDeps,
|
||||
isTarget: (_key: string | number, value: any) => {
|
||||
// 使用data-source-method-select 可以配置出来
|
||||
if (!Array.isArray(value)) {
|
||||
if (!Array.isArray(value) || !ds?.methods) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const [dsId, methodName] = value;
|
||||
|
||||
if (!methodName || dsId !== ds.id) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (ds.methods?.find((method) => method.name === methodName)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// 配置的方法名称可能会是数据源类中定义的，并不存在于methods中，所以这里判断如果methodName如果是字段名称，就表示配置的不是方法
|
||||
if (ds.fields?.find((field) => field.name === methodName)) {
|
||||
if (!methodName || dsId !== ds.id || !ds.methods.find((field) => field.name === methodName)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
@ -125,7 +125,7 @@ describe('utils', () => {
|
||||
test('isUseDataSourceField', () => {
|
||||
expect(utils.isUseDataSourceField([`${DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}dsID`, 'field'], 'dsID')).toBeTruthy();
|
||||
expect(utils.isUseDataSourceField([`${DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX}dsID`, 'field'], 'dsID1')).toBeFalsy();
|
||||
expect(utils.isUseDataSourceField(['abcdsID', 'field'], 'dsID')).toBeFalsy();
|
||||
expect(utils.isUseDataSourceField([`abcdsID`, 'field'], 'dsID')).toBeFalsy();
|
||||
expect(utils.isUseDataSourceField([123, 'field'], 123)).toBeFalsy();
|
||||
});
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "@tmagic/design",
|
||||
"type": "module",
|
||||
"sideEffects": [
|
||||
|
||||
@ -42,7 +42,7 @@ const ui = getDesignConfig('components')?.autocomplete;
|
||||
|
||||
const uiComponent = ui?.component || 'el-autocomplete';
|
||||
|
||||
const uiProps = computed<AutocompleteProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'select', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -19,5 +19,5 @@ const props = defineProps<BadgeProps>();
|
||||
const ui = getDesignConfig('components')?.badge;
|
||||
const uiComponent = ui?.component || 'el-badge';
|
||||
|
||||
const uiProps = computed<BadgeProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -22,7 +22,7 @@ const ui = getDesignConfig('components')?.button;
|
||||
|
||||
const uiComponent = ui?.component || 'el-button';
|
||||
|
||||
const uiProps = computed<ButtonProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['click']);
|
||||
|
||||
|
||||
@ -26,5 +26,5 @@ const ui = getDesignConfig('components')?.card;
|
||||
|
||||
const uiComponent = ui?.component || 'el-card';
|
||||
|
||||
const uiProps = computed<CardProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -25,7 +25,7 @@ const ui = getDesignConfig('components')?.cascader;
|
||||
|
||||
const uiComponent = ui?.component || 'el-cascader';
|
||||
|
||||
const uiProps = computed<CascaderProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const cascader = ref<any>();
|
||||
|
||||
|
||||
@ -31,7 +31,7 @@ const ui = getDesignConfig('components')?.checkbox;
|
||||
|
||||
const uiComponent = ui?.component || 'el-checkbox';
|
||||
|
||||
const uiProps = computed<CheckboxProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -26,7 +26,7 @@ const ui = getDesignConfig('components')?.checkboxGroup;
|
||||
|
||||
const uiComponent = ui?.component || 'el-checkbox-group';
|
||||
|
||||
const uiProps = computed<CheckboxGroupProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.col;
|
||||
|
||||
const uiComponent = ui?.component || 'el-col';
|
||||
|
||||
const uiProps = computed<ColProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -26,7 +26,7 @@ const ui = getDesignConfig('components')?.collapse;
|
||||
|
||||
const uiComponent = ui?.component || 'el-collapse';
|
||||
|
||||
const uiProps = computed<CollapseProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -32,7 +32,7 @@ const ui = getDesignConfig('components')?.collapseItem;
|
||||
|
||||
const uiComponent = ui?.component || 'el-collapse-item';
|
||||
|
||||
const uiProps = computed<CollapseItemProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -28,7 +28,7 @@ const ui = getDesignConfig('components')?.colorPicker;
|
||||
|
||||
const uiComponent = ui?.component || 'el-color-picker';
|
||||
|
||||
const uiProps = computed<ColorPickerProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -27,7 +27,7 @@ const ui = getDesignConfig('components')?.datePicker;
|
||||
|
||||
const uiComponent = ui?.component || 'el-date-picker';
|
||||
|
||||
const uiProps = computed<DatePickerProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -32,7 +32,7 @@ const ui = getDesignConfig('components')?.dialog;
|
||||
|
||||
const uiComponent = ui?.component || 'el-dialog';
|
||||
|
||||
const uiProps = computed<DialogProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const closeHandler = (...args: any[]) => {
|
||||
emit('close', ...args);
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.divider;
|
||||
|
||||
const uiComponent = ui?.component || 'el-divider';
|
||||
|
||||
const uiProps = computed<DividerProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -40,7 +40,7 @@ const ui = getDesignConfig('components')?.drawer;
|
||||
|
||||
const uiComponent = ui?.component || 'el-drawer';
|
||||
|
||||
const uiProps = computed<DrawerProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const drawer = ref<any>();
|
||||
|
||||
|
||||
@ -24,7 +24,7 @@ const ui = getDesignConfig('components')?.dropdown;
|
||||
|
||||
const uiComponent = ui?.component || 'el-dropdown';
|
||||
|
||||
const uiProps = computed<DropdownProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['command']);
|
||||
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.dropdownItem;
|
||||
|
||||
const uiComponent = ui?.component || 'el-dropdown-item';
|
||||
|
||||
const uiProps = computed<DropdownItemProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -26,7 +26,7 @@ const ui = getDesignConfig('components')?.form;
|
||||
|
||||
const uiComponent = ui?.component || 'el-form';
|
||||
|
||||
const uiProps = computed<FormProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const form = ref<any>();
|
||||
|
||||
|
||||
@ -23,5 +23,5 @@ const ui = getDesignConfig('components')?.formItem;
|
||||
|
||||
const uiComponent = ui?.component || 'el-form-item';
|
||||
|
||||
const uiProps = computed<FormItemProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -17,5 +17,5 @@ defineOptions({
|
||||
const ui = getDesignConfig('components')?.icon;
|
||||
const uiComponent = ui?.component || 'el-icon';
|
||||
const props = defineProps<IconProps>();
|
||||
const uiProps = computed<IconProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -39,7 +39,7 @@ const ui = getDesignConfig('components')?.input;
|
||||
|
||||
const uiComponent = ui?.component || 'el-input';
|
||||
|
||||
const uiProps = computed<InputProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'input', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@ const ui = getDesignConfig('components')?.inputNumber;
|
||||
|
||||
const uiComponent = ui?.component || 'el-input-number';
|
||||
|
||||
const uiProps = computed<InputNumberProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'input', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.option;
|
||||
|
||||
const uiComponent = ui?.component || 'el-option';
|
||||
|
||||
const uiProps = computed<OptionProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -20,7 +20,7 @@ const ui = getDesignConfig('components')?.optionGroup;
|
||||
|
||||
const uiComponent = ui?.component || 'el-option-group';
|
||||
|
||||
const uiProps = computed<OptionGroupProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const optionGroup = ref<any>();
|
||||
</script>
|
||||
|
||||
@ -27,7 +27,7 @@ const ui = getDesignConfig('components')?.pagination;
|
||||
|
||||
const uiComponent = ui?.component || 'el-pagination';
|
||||
|
||||
const uiProps = computed<PaginationProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const handleSizeChange = (...args: any[]) => {
|
||||
emit('size-change', ...args);
|
||||
|
||||
@ -27,9 +27,9 @@ import type { PopoverProps } from './types';
|
||||
|
||||
defineSlots<{
|
||||
/** 触发 Popover 显示的 HTML 元素 */
|
||||
reference(_props: {}): any;
|
||||
reference(props: {}): any;
|
||||
/** Popover 内嵌 HTML 文本 */
|
||||
default(_props: {}): any;
|
||||
default(props: {}): any;
|
||||
}>();
|
||||
|
||||
defineOptions({
|
||||
@ -130,7 +130,7 @@ const mouseenterHandler = () => {
|
||||
popoverVisible.value = true;
|
||||
};
|
||||
|
||||
let timer: ReturnType<typeof setTimeout> | null = null;
|
||||
let timer: NodeJS.Timeout | null = null;
|
||||
const mouseleaveHandler = () => {
|
||||
if (props.disabled) return;
|
||||
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.radio;
|
||||
|
||||
const uiComponent = ui?.component || 'el-radio';
|
||||
|
||||
const uiProps = computed<RadioProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.radioButton;
|
||||
|
||||
const uiComponent = ui?.component || 'el-radio-button';
|
||||
|
||||
const uiProps = computed<RadioButtonProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -26,7 +26,7 @@ const ui = getDesignConfig('components')?.radioGroup;
|
||||
|
||||
const uiComponent = ui?.component || 'el-radio-group';
|
||||
|
||||
const uiProps = computed<RadioGroupProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -31,7 +31,7 @@ const ui = getDesignConfig('components')?.select;
|
||||
|
||||
const uiComponent = ui?.component || 'el-select';
|
||||
|
||||
const uiProps = computed<SelectProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const select = ref<any>();
|
||||
|
||||
|
||||
@ -26,5 +26,5 @@ const ui = getDesignConfig('components')?.step;
|
||||
|
||||
const uiComponent = ui?.component || 'el-step';
|
||||
|
||||
const uiProps = computed<StepProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.steps;
|
||||
|
||||
const uiComponent = ui?.component || 'el-steps';
|
||||
|
||||
const uiProps = computed<StepsProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -28,7 +28,7 @@ const ui = getDesignConfig('components')?.switch;
|
||||
|
||||
const uiComponent = ui?.component || 'el-switch';
|
||||
|
||||
const uiProps = computed<SwitchProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -26,5 +26,5 @@ const ui = getDesignConfig('components')?.tabPane;
|
||||
|
||||
const uiComponent = ui?.component || 'el-tab-pane';
|
||||
|
||||
const uiProps = computed<TabPaneProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -33,7 +33,7 @@ const ui = getDesignConfig('components')?.table;
|
||||
|
||||
const uiComponent = ui?.component || 'el-table';
|
||||
|
||||
const uiProps = computed<TableProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['select', 'sort-change', 'expand-change', 'cell-click']);
|
||||
|
||||
|
||||
@ -23,5 +23,5 @@ const ui = getDesignConfig('components')?.tableColumn;
|
||||
|
||||
const uiComponent = ui?.component || 'el-table-column';
|
||||
|
||||
const uiProps = computed<TableColumnProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -30,7 +30,7 @@ const ui = getDesignConfig('components')?.tabs;
|
||||
|
||||
const uiComponent = ui?.component || 'el-tabs';
|
||||
|
||||
const uiProps = computed<TabsProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['tab-click', 'tab-add', 'tab-remove', 'update:model-value']);
|
||||
|
||||
|
||||
@ -20,5 +20,5 @@ const ui = getDesignConfig('components')?.tag;
|
||||
|
||||
const uiComponent = ui?.component || 'el-tag';
|
||||
|
||||
const uiProps = computed<TagProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -25,7 +25,7 @@ const ui = getDesignConfig('components')?.timePicker;
|
||||
|
||||
const uiComponent = ui?.component || 'el-time-picker';
|
||||
|
||||
const uiProps = computed<TimePickerProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits(['change', 'update:modelValue']);
|
||||
|
||||
|
||||
@ -23,5 +23,5 @@ const ui = getDesignConfig('components')?.tooltip;
|
||||
|
||||
const uiComponent = ui?.component || 'el-tooltip';
|
||||
|
||||
const uiProps = computed<TooltipProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
</script>
|
||||
|
||||
@ -35,7 +35,7 @@ const ui = getDesignConfig('components')?.tree;
|
||||
|
||||
const uiComponent = ui?.component || 'el-tree';
|
||||
|
||||
const uiProps = computed<TreeProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const emit = defineEmits([
|
||||
'node-click',
|
||||
|
||||
@ -29,7 +29,7 @@ const ui = getDesignConfig('components')?.upload;
|
||||
|
||||
const uiComponent = ui?.component || 'el-upload';
|
||||
|
||||
const uiProps = computed<UploadProps>(() => ui?.props(props) || props);
|
||||
const uiProps = computed(() => ui?.props(props) || props);
|
||||
|
||||
const upload = ref<any>();
|
||||
|
||||
|
||||
@ -9,6 +9,7 @@ import './theme/index.scss';
|
||||
export * from './types';
|
||||
export * from './config';
|
||||
|
||||
/* eslint-disable @typescript-eslint/no-unused-vars */
|
||||
export { default as TMagicAutocomplete } from './Autocomplete.vue';
|
||||
export { default as TMagicBadge } from './Badge.vue';
|
||||
export { default as TMagicButton } from './Button.vue';
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"version": "1.5.16",
|
||||
"version": "1.5.12",
|
||||
"name": "@tmagic/editor",
|
||||
"type": "module",
|
||||
"sideEffects": [
|
||||
|
||||
@ -142,7 +142,7 @@ import codeBlockService from './services/codeBlock';
|
||||
import componentListService from './services/componentList';
|
||||
import dataSourceService from './services/dataSource';
|
||||
import depService from './services/dep';
|
||||
import editorService from './services/editor';
|
||||
import editorService, { type EditorService } from './services/editor';
|
||||
import eventsService from './services/events';
|
||||
import historyService from './services/history';
|
||||
import keybindingService from './services/keybinding';
|
||||
@ -153,9 +153,25 @@ import uiService from './services/ui';
|
||||
import keybindingConfig from './utils/keybinding-config';
|
||||
import { defaultEditorProps, EditorProps } from './editorProps';
|
||||
import { initServiceEvents, initServiceState } from './initService';
|
||||
import type { EditorSlots, EventBus, Services, StageOptions } from './type';
|
||||
import type {
|
||||
EventBus,
|
||||
FrameworkSlots,
|
||||
PropsPanelSlots,
|
||||
Services,
|
||||
SidebarSlots,
|
||||
StageOptions,
|
||||
WorkspaceSlots,
|
||||
} from './type';
|
||||
|
||||
defineSlots<EditorSlots>();
|
||||
defineSlots<
|
||||
FrameworkSlots &
|
||||
WorkspaceSlots &
|
||||
SidebarSlots &
|
||||
PropsPanelSlots & {
|
||||
workspace(props: { editorService: EditorService }): any;
|
||||
'workspace-content'(props: { editorService: EditorService }): any;
|
||||
}
|
||||
>();
|
||||
|
||||
defineOptions({
|
||||
name: 'MEditor',
|
||||
|
||||
@ -59,7 +59,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, inject, nextTick, Ref, ref, useTemplateRef, watch } from 'vue';
|
||||
import { computed, inject, Ref, ref, useTemplateRef } from 'vue';
|
||||
|
||||
import type { CodeBlockContent } from '@tmagic/core';
|
||||
import { TMagicButton, TMagicDialog, tMagicMessage, tMagicMessageBox, TMagicTag } from '@tmagic/design';
|
||||
@ -95,8 +95,6 @@ const props = defineProps<{
|
||||
|
||||
const emit = defineEmits<{
|
||||
submit: [values: CodeBlockContent, eventData: ContainerChangeEventData];
|
||||
close: [];
|
||||
open: [];
|
||||
}>();
|
||||
|
||||
const { codeBlockService, uiService } = useServices();
|
||||
@ -233,7 +231,7 @@ const changeHandler = (values: CodeBlockContent) => {
|
||||
changedValue.value = values;
|
||||
};
|
||||
|
||||
const beforeClose = (done: (_cancel?: boolean) => void) => {
|
||||
const beforeClose = (done: (cancel?: boolean) => void) => {
|
||||
if (!changedValue.value) {
|
||||
done();
|
||||
return;
|
||||
@ -263,16 +261,6 @@ const closedHandler = () => {
|
||||
const parentFloating = inject<Ref<HTMLDivElement | null>>('parentFloating', ref(null));
|
||||
const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, parentFloating);
|
||||
|
||||
watch(boxVisible, (visible) => {
|
||||
nextTick(() => {
|
||||
if (!visible) {
|
||||
emit('close');
|
||||
} else {
|
||||
emit('open');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
async show() {
|
||||
calcBoxPosition();
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, nextTick, onBeforeUnmount, onMounted, type Ref, ref, useTemplateRef } from 'vue';
|
||||
import { computed, nextTick, onBeforeUnmount, onMounted, ref, useTemplateRef } from 'vue';
|
||||
|
||||
import { useZIndex } from '@tmagic/design';
|
||||
|
||||
@ -73,7 +73,7 @@ const menuEl = useTemplateRef<HTMLDivElement>('menu');
|
||||
const buttonRefs = useTemplateRef<InstanceType<typeof ToolButton>[]>('buttons');
|
||||
const subMenuRef = useTemplateRef<any>('subMenu');
|
||||
const visible = ref(false);
|
||||
const subMenuData: Ref<(MenuButton | MenuComponent)[]> = ref<(MenuButton | MenuComponent)[]>([]);
|
||||
const subMenuData = ref<(MenuButton | MenuComponent)[]>([]);
|
||||
const zIndex = useZIndex();
|
||||
const curZIndex = ref<number>(0);
|
||||
|
||||
|
||||
@ -39,7 +39,7 @@ const props = withDefaults(
|
||||
defineProps<{
|
||||
position?: Position;
|
||||
title?: string;
|
||||
beforeClose?: (_done: (_cancel?: boolean) => void) => void;
|
||||
beforeClose?: (done: (cancel?: boolean) => void) => void;
|
||||
}>(),
|
||||
{
|
||||
title: '',
|
||||
|
||||
@ -93,9 +93,7 @@ const scrollBy = (delta: number) => {
|
||||
position: absolute;
|
||||
background-color: transparent;
|
||||
opacity: 0.3;
|
||||
transition:
|
||||
background-color 0.2s linear,
|
||||
opacity 0.2s linear;
|
||||
transition: background-color 0.2s linear, opacity 0.2s linear;
|
||||
|
||||
.m-editor-scroll-bar-thumb {
|
||||
background-color: #aaa;
|
||||
@ -110,9 +108,7 @@ const scrollBy = (delta: number) => {
|
||||
|
||||
.m-editor-scroll-bar-thumb {
|
||||
height: 6px;
|
||||
transition:
|
||||
background-color 0.2s linear,
|
||||
height 0.2s ease-in-out;
|
||||
transition: background-color 0.2s linear, height 0.2s ease-in-out;
|
||||
bottom: 2px;
|
||||
}
|
||||
}
|
||||
@ -124,9 +120,7 @@ const scrollBy = (delta: number) => {
|
||||
|
||||
.m-editor-scroll-bar-thumb {
|
||||
width: 6px;
|
||||
transition:
|
||||
background-color 0.2s linear,
|
||||
width 0.2s ease-in-out;
|
||||
transition: background-color 0.2s linear, width 0.2s ease-in-out;
|
||||
right: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -27,7 +27,7 @@ const emit = defineEmits(['search']);
|
||||
|
||||
const filterText = ref('');
|
||||
|
||||
let timer: ReturnType<typeof setTimeout> | null = null;
|
||||
let timer: NodeJS.Timeout | null = null;
|
||||
const filterTextChangeHandler = () => {
|
||||
timer && clearTimeout(timer);
|
||||
timer = setTimeout(() => {
|
||||
|
||||
@ -38,9 +38,9 @@ import type { LayerNodeStatus, TreeNodeData } from '@editor/type';
|
||||
import TreeNode from './TreeNode.vue';
|
||||
|
||||
defineSlots<{
|
||||
'tree-node-content'(_props: { data: TreeNodeData }): any;
|
||||
'tree-node-label'(_props: { data: TreeNodeData }): any;
|
||||
'tree-node-tool'(_props: { data: TreeNodeData }): any;
|
||||
'tree-node-content'(props: { data: TreeNodeData }): any;
|
||||
'tree-node-label'(props: { data: TreeNodeData }): any;
|
||||
'tree-node-tool'(props: { data: TreeNodeData }): any;
|
||||
}>();
|
||||
|
||||
defineOptions({
|
||||
|
||||
@ -72,9 +72,9 @@ import type { LayerNodeStatus, TreeNodeData } from '@editor/type';
|
||||
import { updateStatus } from '@editor/utils/tree';
|
||||
|
||||
defineSlots<{
|
||||
'tree-node-label'(_props: { data: TreeNodeData }): any;
|
||||
'tree-node-tool'(_props: { data: TreeNodeData }): any;
|
||||
'tree-node-content'(_props: { data: TreeNodeData }): any;
|
||||
'tree-node-label'(props: { data: TreeNodeData }): any;
|
||||
'tree-node-tool'(props: { data: TreeNodeData }): any;
|
||||
'tree-node-content'(props: { data: TreeNodeData }): any;
|
||||
}>();
|
||||
|
||||
defineOptions({
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import type { CodeConfig, FieldProps } from '@tmagic/form';
|
||||
import type { FieldProps, FormItem } from '@tmagic/form';
|
||||
|
||||
import MagicCodeEditor from '@editor/layouts/CodeEditor.vue';
|
||||
|
||||
@ -25,9 +25,23 @@ const emit = defineEmits<{
|
||||
change: [value: string | any];
|
||||
}>();
|
||||
|
||||
withDefaults(defineProps<FieldProps<CodeConfig>>(), {
|
||||
disabled: false,
|
||||
});
|
||||
withDefaults(
|
||||
defineProps<
|
||||
FieldProps<
|
||||
{
|
||||
language?: string;
|
||||
options?: {
|
||||
[key: string]: any;
|
||||
};
|
||||
height?: string;
|
||||
parse?: boolean;
|
||||
} & FormItem
|
||||
>
|
||||
>(),
|
||||
{
|
||||
disabled: false,
|
||||
},
|
||||
);
|
||||
|
||||
const save = (v: string | any) => {
|
||||
emit('change', v);
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
import { computed, reactive, watch } from 'vue';
|
||||
import serialize from 'serialize-javascript';
|
||||
|
||||
import type { CodeLinkConfig, FieldProps } from '@tmagic/form';
|
||||
import type { FieldProps, FormItem } from '@tmagic/form';
|
||||
|
||||
import { getEditorConfig } from '@editor/utils/config';
|
||||
|
||||
@ -14,7 +14,15 @@ defineOptions({
|
||||
name: 'MFieldsCodeLink',
|
||||
});
|
||||
|
||||
const props = defineProps<FieldProps<CodeLinkConfig>>();
|
||||
const props = defineProps<
|
||||
FieldProps<
|
||||
{
|
||||
type: 'code-link';
|
||||
formTitle?: string;
|
||||
codeOptions?: Object;
|
||||
} & FormItem
|
||||
>
|
||||
>();
|
||||
|
||||
const emit = defineEmits(['change']);
|
||||
|
||||
|
||||
@ -21,7 +21,7 @@ import { isEmpty } from 'lodash-es';
|
||||
|
||||
import { HookCodeType, HookType } from '@tmagic/core';
|
||||
import { TMagicCard } from '@tmagic/design';
|
||||
import type { CodeSelectConfig, ContainerChangeEventData, FieldProps, GroupListConfig } from '@tmagic/form';
|
||||
import type { ContainerChangeEventData, FieldProps, FormItem, GroupListConfig } from '@tmagic/form';
|
||||
import { MContainer } from '@tmagic/form';
|
||||
|
||||
import { useServices } from '@editor/hooks/use-services';
|
||||
@ -36,7 +36,16 @@ const emit = defineEmits<{
|
||||
|
||||
const { dataSourceService, codeBlockService } = useServices();
|
||||
|
||||
const props = withDefaults(defineProps<FieldProps<CodeSelectConfig>>(), {});
|
||||
const props = withDefaults(
|
||||
defineProps<
|
||||
FieldProps<
|
||||
{
|
||||
className?: string;
|
||||
} & FormItem
|
||||
>
|
||||
>(),
|
||||
{},
|
||||
);
|
||||
|
||||
const codeConfig = computed<GroupListConfig>(() => ({
|
||||
type: 'group-list',
|
||||
@ -71,11 +80,13 @@ const codeConfig = computed<GroupListConfig>(() => ({
|
||||
{ value: HookCodeType.DATA_SOURCE_METHOD, text: '数据源方法' },
|
||||
],
|
||||
defaultValue: 'code',
|
||||
onChange: (_mForm, v: HookCodeType, { setModel }) => {
|
||||
onChange: (mForm, v: HookCodeType, { model, prop, changeRecords }) => {
|
||||
if (v === HookCodeType.DATA_SOURCE_METHOD) {
|
||||
setModel('codeId', []);
|
||||
model.codeId = [];
|
||||
changeRecords.push({ propPath: prop.replace('codeType', 'codeId'), value: [] });
|
||||
} else {
|
||||
setModel('codeId', '');
|
||||
model.codeId = '';
|
||||
changeRecords.push({ propPath: prop.replace('codeType', 'codeId'), value: '' });
|
||||
}
|
||||
|
||||
return v;
|
||||
@ -86,7 +97,7 @@ const codeConfig = computed<GroupListConfig>(() => ({
|
||||
name: 'codeId',
|
||||
span: 18,
|
||||
labelWidth: 0,
|
||||
display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
|
||||
display: (mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
|
||||
notEditable: () => !codeBlockService.getEditStatus(),
|
||||
},
|
||||
{
|
||||
@ -94,7 +105,7 @@ const codeConfig = computed<GroupListConfig>(() => ({
|
||||
name: 'codeId',
|
||||
span: 18,
|
||||
labelWidth: 0,
|
||||
display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
|
||||
display: (mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
|
||||
notEditable: () => !dataSourceService.get('editable'),
|
||||
},
|
||||
],
|
||||
|
||||
@ -42,7 +42,6 @@ import { isEmpty, map } from 'lodash-es';
|
||||
import type { Id } from '@tmagic/core';
|
||||
import { TMagicButton } from '@tmagic/design';
|
||||
import {
|
||||
type CodeSelectColConfig,
|
||||
type ContainerChangeEventData,
|
||||
createValues,
|
||||
type FieldProps,
|
||||
@ -54,7 +53,7 @@ import {
|
||||
import CodeParams from '@editor/components/CodeParams.vue';
|
||||
import MIcon from '@editor/components/Icon.vue';
|
||||
import { useServices } from '@editor/hooks/use-services';
|
||||
import type { CodeParamStatement, EventBus } from '@editor/type';
|
||||
import type { CodeParamStatement, CodeSelectColConfig, EventBus } from '@editor/type';
|
||||
import { SideItemKey } from '@editor/type';
|
||||
|
||||
defineOptions({
|
||||
@ -122,28 +121,24 @@ const selectConfig = {
|
||||
}
|
||||
return [];
|
||||
},
|
||||
onChange: (formState: any, codeId: Id, { setModel, model }: any) => {
|
||||
onChange: (formState: any, codeId: Id, { model }: any) => {
|
||||
// 通过下拉框选择的codeId变化后修正model的值，避免写入其他codeId的params
|
||||
paramsConfig.value = getParamItemsConfig(codeId);
|
||||
|
||||
if (paramsConfig.value.length) {
|
||||
setModel('params', createValues(formState, paramsConfig.value, {}, model.params));
|
||||
model.params = createValues(formState, paramsConfig.value, {}, model.params);
|
||||
} else {
|
||||
setModel('params', {});
|
||||
model.params = {};
|
||||
}
|
||||
|
||||
return codeId;
|
||||
},
|
||||
};
|
||||
|
||||
const onCodeIdChangeHandler = (value: any, eventData: ContainerChangeEventData) => {
|
||||
const onCodeIdChangeHandler = (value: any) => {
|
||||
props.model.params = value.params;
|
||||
|
||||
emit('change', props.model, {
|
||||
changeRecords: eventData.changeRecords?.map((item) => ({
|
||||
prop: `${props.prop.replace(props.name, '')}${item.propPath}`,
|
||||
value: item.value,
|
||||
})) || [
|
||||
changeRecords: [
|
||||
{
|
||||
propPath: props.prop,
|
||||
value: value[props.name],
|
||||
|
||||
@ -30,9 +30,10 @@
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { getDesignConfig, TMagicSelect } from '@tmagic/design';
|
||||
import type { CondOpSelectConfig, FieldProps } from '@tmagic/form';
|
||||
import type { FieldProps } from '@tmagic/form';
|
||||
|
||||
import { useServices } from '@editor/hooks/use-services';
|
||||
import type { CondOpSelectConfig } from '@editor/type';
|
||||
import { arrayOptions, eqOptions, numberOptions } from '@editor/utils';
|
||||
|
||||
defineOptions({
|
||||
|
||||
@ -44,11 +44,12 @@ import { Coin } from '@element-plus/icons-vue';
|
||||
|
||||
import { DataSchema } from '@tmagic/core';
|
||||
import { TMagicButton, tMagicMessage, TMagicTooltip } from '@tmagic/design';
|
||||
import type { ContainerChangeEventData, DataSourceFieldSelectConfig, FieldProps, FormState } from '@tmagic/form';
|
||||
import type { ContainerChangeEventData, FieldProps, FormState } from '@tmagic/form';
|
||||
import { DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX } from '@tmagic/utils';
|
||||
|
||||
import MIcon from '@editor/components/Icon.vue';
|
||||
import { useServices } from '@editor/hooks/use-services';
|
||||
import type { DataSourceFieldSelectConfig } from '@editor/type';
|
||||
import { removeDataSourceFieldPrefix } from '@editor/utils';
|
||||
|
||||
import FieldSelect from './FieldSelect.vue';
|
||||
|
||||
@ -53,7 +53,6 @@ import type { DataSchema } from '@tmagic/core';
|
||||
import { TMagicButton, tMagicMessage, tMagicMessageBox } from '@tmagic/design';
|
||||
import {
|
||||
type ContainerChangeEventData,
|
||||
type DataSourceFieldsConfig,
|
||||
type FieldProps,
|
||||
type FormConfig,
|
||||
type FormState,
|
||||
@ -66,15 +65,21 @@ import FloatingBox from '@editor/components/FloatingBox.vue';
|
||||
import { useEditorContentHeight } from '@editor/hooks';
|
||||
import { useNextFloatBoxPosition } from '@editor/hooks/use-next-float-box-position';
|
||||
import { useServices } from '@editor/hooks/use-services';
|
||||
import { error } from '@editor/utils/logger';
|
||||
|
||||
defineOptions({
|
||||
name: 'MFieldsDataSourceFields',
|
||||
});
|
||||
|
||||
const props = withDefaults(defineProps<FieldProps<DataSourceFieldsConfig>>(), {
|
||||
disabled: false,
|
||||
});
|
||||
const props = withDefaults(
|
||||
defineProps<
|
||||
FieldProps<{
|
||||
type: 'data-source-fields';
|
||||
}>
|
||||
>(),
|
||||
{
|
||||
disabled: false,
|
||||
},
|
||||
);
|
||||
|
||||
const emit = defineEmits<{
|
||||
change: [v: any, eventData?: ContainerChangeEventData];
|
||||
@ -139,7 +144,6 @@ const fieldColumns: ColumnConfig[] = [
|
||||
try {
|
||||
return JSON.stringify(row.defaultValue);
|
||||
} catch (e) {
|
||||
error(e);
|
||||
return row.defaultValue;
|
||||
}
|
||||
},
|
||||
@ -189,9 +193,9 @@ const dataSourceFieldsConfig: FormConfig = [
|
||||
{ text: 'null', value: 'null' },
|
||||
{ text: 'any', value: 'any' },
|
||||
],
|
||||
onChange: (_formState, v: string, { setModel }) => {
|
||||
onChange: (formState, v: string, { model }) => {
|
||||
if (!['any', 'array', 'object'].includes(v)) {
|
||||
setModel('fields', []);
|
||||
model.fields = [];
|
||||
}
|
||||
return v;
|
||||
},
|
||||
|
||||
@ -53,7 +53,7 @@ import { Coin } from '@element-plus/icons-vue';
|
||||
|
||||
import type { DataSchema, DataSourceSchema } from '@tmagic/core';
|
||||
import { getDesignConfig, TMagicAutocomplete, TMagicTag } from '@tmagic/design';
|
||||
import type { DataSourceInputConfig, FieldProps } from '@tmagic/form';
|
||||
import type { FieldProps, FormItem } from '@tmagic/form';
|
||||
import { getKeysArray, isNumber } from '@tmagic/utils';
|
||||
|
||||
import Icon from '@editor/components/Icon.vue';
|
||||
@ -64,9 +64,18 @@ defineOptions({
|
||||
name: 'MFieldsDataSourceInput',
|
||||
});
|
||||
|
||||
const props = withDefaults(defineProps<FieldProps<DataSourceInputConfig>>(), {
|
||||
disabled: false,
|
||||
});
|
||||
const props = withDefaults(
|
||||
defineProps<
|
||||
FieldProps<
|
||||
{
|
||||
type: 'data-source-input';
|
||||
} & FormItem
|
||||
>
|
||||
>(),
|
||||
{
|
||||
disabled: false,
|
||||
},
|
||||
);
|
||||
|
||||
const emit = defineEmits<{
|
||||
change: [value: string];
|
||||
@ -170,11 +179,7 @@ const curCharIsDot = (dotIndex: number) => dotIndex > -1 && dotIndex === getSele
|
||||
* @param leftCurlyBracketIndex 左大括号字符索引
|
||||
* @param cb 建议的方法
|
||||
*/
|
||||
const dsQuerySearch = (
|
||||
queryString: string,
|
||||
leftCurlyBracketIndex: number,
|
||||
cb: (_data: { value: string }[]) => void,
|
||||
) => {
|
||||
const dsQuerySearch = (queryString: string, leftCurlyBracketIndex: number, cb: (data: { value: string }[]) => void) => {
|
||||
let result: DataSourceSchema[] = [];
|
||||
|
||||
if (curCharIsLeftCurlyBracket(leftCurlyBracketIndex)) {
|
||||
@ -206,7 +211,7 @@ const fieldQuerySearch = (
|
||||
queryString: string,
|
||||
leftAngleIndex: number,
|
||||
dotIndex: number,
|
||||
cb: (_data: { value: string }[]) => void,
|
||||
cb: (data: { value: string }[]) => void,
|
||||
) => {
|
||||
let result: DataSchema[] = [];
|
||||
|
||||
@ -267,7 +272,7 @@ const fieldQuerySearch = (
|
||||
* @param queryString 当前输入框内的字符串
|
||||
* @param cb 建议回调
|
||||
*/
|
||||
const querySearch = (queryString: string, cb: (_data: { value: string }[]) => void) => {
|
||||
const querySearch = (queryString: string, cb: (data: { value: string }[]) => void) => {
|
||||
inputText = queryString;
|
||||
|
||||
const selectionStart = getSelectionStart();
|
||||
|
||||
@ -37,20 +37,12 @@ import { Edit, View } from '@element-plus/icons-vue';
|
||||
|
||||
import type { Id } from '@tmagic/core';
|
||||
import { TMagicButton, TMagicTooltip } from '@tmagic/design';
|
||||
import {
|
||||
createValues,
|
||||
type DataSourceMethodSelectConfig,
|
||||
type FieldProps,
|
||||
filterFunction,
|
||||
type FormState,
|
||||
MContainer,
|
||||
type OnChangeHandlerData,
|
||||
} from '@tmagic/form';
|
||||
import { createValues, type FieldProps, filterFunction, type FormState, MContainer } from '@tmagic/form';
|
||||
|
||||
import CodeParams from '@editor/components/CodeParams.vue';
|
||||
import MIcon from '@editor/components/Icon.vue';
|
||||
import { useServices } from '@editor/hooks/use-services';
|
||||
import type { CodeParamStatement, EventBus } from '@editor/type';
|
||||
import type { CodeParamStatement, DataSourceMethodSelectConfig, EventBus } from '@editor/type';
|
||||
import { SideItemKey } from '@editor/type';
|
||||
|
||||
defineOptions({
|
||||
@ -100,18 +92,14 @@ const getParamItemsConfig = ([dataSourceId, methodName]: [Id, string] = ['', '']
|
||||
|
||||
const paramsConfig = ref<CodeParamStatement[]>(getParamItemsConfig(props.model[props.name || 'dataSourceMethod']));
|
||||
|
||||
const setParamsConfig = (
|
||||
dataSourceMethod: [Id, string],
|
||||
formState: any = {},
|
||||
setModel: OnChangeHandlerData['setModel'],
|
||||
) => {
|
||||
const setParamsConfig = (dataSourceMethod: [Id, string], formState: any = {}) => {
|
||||
// 通过下拉框选择的codeId变化后修正model的值，避免写入其他codeId的params
|
||||
paramsConfig.value = dataSourceMethod ? getParamItemsConfig(dataSourceMethod) : [];
|
||||
|
||||
if (paramsConfig.value.length) {
|
||||
setModel('params', createValues(formState, paramsConfig.value, {}, props.model.params));
|
||||
props.model.params = createValues(formState, paramsConfig.value, {}, props.model.params);
|
||||
} else {
|
||||
setModel('params', {});
|
||||
props.model.params = {};
|
||||
}
|
||||
};
|
||||
|
||||
@ -137,8 +125,8 @@ const cascaderConfig = computed(() => ({
|
||||
name: props.name,
|
||||
options: methodsOptions.value,
|
||||
disable: props.disabled,
|
||||
onChange: (formState: any, dataSourceMethod: [Id, string], { setModel }: OnChangeHandlerData) => {
|
||||
setParamsConfig(dataSourceMethod, formState, setModel);
|
||||
onChange: (formState: any, dataSourceMethod: [Id, string]) => {
|
||||
setParamsConfig(dataSourceMethod, formState);
|
||||
|
||||
return dataSourceMethod;
|
||||
},
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user