From 79e7718a3902f973ddf53fa46df0948cc3c549b4 Mon Sep 17 00:00:00 2001 From: chilingling Date: Tue, 4 Jun 2024 02:33:55 -0700 Subject: [PATCH 01/11] feat(material): add material package --- packages/materials/README.md | 51 +++ packages/materials/buildMaterials.mjs | 222 +++++++++ packages/materials/package.json | 37 ++ .../materials/src/ElementPlus/ElButton.json | 342 ++++++++++++++ .../materials/src/ElementPlus/ElInput.json | 292 ++++++++++++ .../materials/src/TinyVue/TinyButton.json | 357 +++++++++++++++ packages/materials/src/TinyVue/TinyInput.json | 433 ++++++++++++++++++ packages/materials/src/html/Input.json | 289 ++++++++++++ 8 files changed, 2023 insertions(+) create mode 100644 packages/materials/README.md create mode 100644 packages/materials/buildMaterials.mjs create mode 100644 packages/materials/package.json create mode 100644 packages/materials/src/ElementPlus/ElButton.json create mode 100644 packages/materials/src/ElementPlus/ElInput.json create mode 100644 packages/materials/src/TinyVue/TinyButton.json create mode 100644 packages/materials/src/TinyVue/TinyInput.json create mode 100644 packages/materials/src/html/Input.json diff --git a/packages/materials/README.md b/packages/materials/README.md new file mode 100644 index 0000000000..48146250cd --- /dev/null +++ b/packages/materials/README.md @@ -0,0 +1,51 @@ +# TinyEngine 官方物料 + +## 使用 + +### 持续构建 + +```bash +npm run serve +``` + +解释： +1. 会持续监听 src 目录下文件变动，持续构建出来物料产物 +2. 会启动静态服务器。 + +### 将组件库分别进行构建，以及将所有组件库构建成一份物料产物 + +```bash +npm run build + +# 构建成功会得到比如 ElementPlus.json、TinyVue.json 等组件库对应的 json，以及 all.json +``` + +### 将组件库分别进行构建 + +```bash +npm run build:split + +# 构建成功会得到比如 ElementPlus.json、TinyVue.json 等组件库对应的 json +``` + +## 添加自己的物料 + +请先大致了解 TinyEngine 物料协议：https://opentiny.design/tiny-engine#/protocol + +src 目录功能约定结构： + +```bash +src/ +|__ ElementPlus 组件库名称 + |__ Button.json ElementPlus Button组件 + |__ Table.json ElementPlus Table 组件 +``` + +所以，我们添加自己的物料可以大致分为两步： + +1. 根据目录结构约定添加 xxx.json 组件文件 +2. xxx.json 中根据物料协议进行书写。 + +## TODO + +- [ ] 脚本自动生成组件库对应物料。 diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs new file mode 100644 index 0000000000..cf1466fc32 --- /dev/null +++ b/packages/materials/buildMaterials.mjs @@ -0,0 +1,222 @@ +import fsExtra from 'fs-extra' +import path from 'node:path' +import chokidar from 'chokidar' +import fg from 'fast-glob' +import { fileURLToPath } from 'node:url' +import httpServer from 'http-server' +import portFinder from 'portfinder' +import Logger from '../../scripts/logger.mjs' + +const __filename = fileURLToPath(import.meta.url) +const __dirname = path.dirname(__filename) + +const logger = new Logger('buildMaterials') + +// 物料文件存放文件夹名称 +const materialsDir = path.resolve(__dirname, './src') + +/** + * 校验组件文件数据 + * @param {string} file 组件文件路径 + * @param {object} component 组件数据 + * @returns + */ +const validateComponent = (file, component) => { + const requiredFields = ['component'] + const fields = Object.keys(component) + const requiredList = requiredFields.filter((field) => !fields.includes(field)) + + if (requiredList.length) { + logger.error(`组件文件 ${file} 缺少必要字段：${requiredList.join('、')}。`) + + return false + } + + if (!component.npm) { + logger.warn(`组件文件 ${file} 缺少 npm 字段，出码时将不能通过import语句导入组件。`) + + return false + } + + return true +} + +const generateComponents = async (entry) => { + const files = await fg('*.json', { cwd: entry }) + if (!files.length) { + // logger.warn('物料文件夹为空，请先执行`pnpm splitMaterials`命令拆分物料资产包') + return + } + + const bundle = { + componentsMap: [], + components: [], + snippets: [] + } + + files.forEach((file) => { + const material = fsExtra.readJsonSync(path.resolve(entry, file), { throws: false }) + + if (!material) { + const fileFullPath = path.join(process.cwd(), file) + + logger.error(`文件格式有误 (${fileFullPath})`) + + return + } + + const valid = validateComponent(file, material) + + if (!valid) return + + const { snippets: componentSnippets, category, ...componentInfo } = material + + bundle.components.push(componentInfo) + + const snippet = bundle.snippets.find((item) => item.group === category) + + if (snippet) { + componentSnippets && snippet.children.push(componentSnippets[0]) + } else if (category && componentInfo) { + bundle.snippets.push({ + group: category, + children: componentSnippets || [] + }) + } + + const npmInfo = componentInfo.npm + const { package: packageName = '', version = '', exportName = '' } = npmInfo + + const mapItem = { + componentName: componentInfo.component, + package: packageName, + version, + exportName + } + + if (typeof npmInfo.destructuring === 'boolean') { + mapItem.destructuring = componentInfo.npm.destructuring + } + + if (npmInfo.package) { + bundle.componentsMap.push(mapItem) + } + }) + + return bundle +} + +const getFrameworkWithData = (data) => { + return { + data: { + framework: 'Vue', + materials: data + } + } +} + +const buildComponents = async (config = {}) => { + try { + const entries = await fg('*/', { + cwd: materialsDir, + onlyDirectories: true, + deep: 1 + }) + + const { buildCombine = true } = config + + const allBundles = { + components: [], + snippets: [], + componentsMap: [] + } + + for (const entry of entries) { + const res = await generateComponents(path.resolve(materialsDir, `${entry}`)) + + if (res) { + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res), { spaces: 2 }) + + allBundles.components = allBundles.components.concat(res.components) + allBundles.snippets = allBundles.snippets.concat(res.snippets) + allBundles.componentsMap = allBundles.componentsMap.concat(res.componentsMap) + } + } + + if (buildCombine) { + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/all.json`), getFrameworkWithData(allBundles), { spaces: 2 }) + } + + logger.success('物料资产包构建成功') + } catch (error) { + logger.error(`物料资产包构建失败：${error}`) + } +} + +// 持续构建 +async function serve() { + // 监听materials下json文件的变化 + const watcher = chokidar.watch(`${materialsDir}/**/*.json`, { ignoreInitial: true }) + + watcher.on('all', (event, file) => { + const eventMap = { + add: '新增', + change: '更新', + unlink: '删除' + } + const fileFullPath = path.join(process.cwd(), file) + + logger.info(`${eventMap[event]}组件文件 (${fileFullPath})`) + + // 监听物料文件变化，更新物料资产包 + buildComponents() + }) + + // 第一次需要手动出发构建一遍 + await buildComponents() + + const staticServerPort = await portFinder.getPortPromise({ port: 4001 }) + + const server = httpServer.createServer({ + caches: 1, + cors: true, + root: path.resolve(__dirname, './dist') + }) + + server.listen(staticServerPort, () => { + logger.success(`物料服务已启动 http://127.0.0.1:${staticServerPort}`) + }) + +} + +// 单次构建，分组件库 +function buildSplit() { + buildComponents({ buildCombine: false }) +} + +// 单次构建，合并所有组件库 +function build() { + buildComponents() +} + + +function start() { + const commandsMap = { + serve: serve, + build: build, + 'build:split': buildSplit + } + + const command = process.argv.slice(2) + + if (!commandsMap[command]) { + logger.error(`[@opentiny/tiny-engine-materials] 不支持${command}命令`) + + return + } + + commandsMap[command]() +} + + +start() diff --git a/packages/materials/package.json b/packages/materials/package.json new file mode 100644 index 0000000000..ef7e2518e2 --- /dev/null +++ b/packages/materials/package.json @@ -0,0 +1,37 @@ +{ + "name": "@opentiny/tiny-engine-materials", + "version": "1.0.0", + "description": "", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1", + "serve": "node buildMaterials.mjs serve", + "build": "node buildMaterials.mjs build", + "build:split": "node buildMaterials.mjs build:split" + }, + "keywords": [], + "publishConfig": { + "access": "public" + }, + "files": [ + "dist" + ], + "repository": { + "type": "git", + "url": "https://github.com/opentiny/tiny-engine", + "directory": "packages/materials" + }, + "bugs": { + "url": "https://github.com/opentiny/tiny-engine/issues" + }, + "author": "OpenTiny Team", + "license": "MIT", + "homepage": "https://opentiny.design/tiny-engine", + "devDependencies": { + "chokidar": "^3.5.3", + "fast-glob": "^3.3.2", + "fs-extra": "^11.2.0", + "http-server": "^14.1.1", + "portfinder": "^1.0.32" + } +} diff --git a/packages/materials/src/ElementPlus/ElButton.json b/packages/materials/src/ElementPlus/ElButton.json new file mode 100644 index 0000000000..e57ac4ecf8 --- /dev/null +++ b/packages/materials/src/ElementPlus/ElButton.json @@ -0,0 +1,342 @@ +{ + "id": 1, + "version": "2.4.2", + "name": { + "zh_CN": "按钮" + }, + "component": "ElButton", + "icon": "button", + "description": "常用的操作按钮", + "doc_url": "", + "screenshot": "", + "tags": "", + "keywords": "", + "dev_mode": "proCode", + "npm": { + "package": "element-plus", + "version": "2.4.2", + "script": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.full.mjs", + "css": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.css", + "dependencies": null, + "exportName": "ElButton", + "destructuring": true + }, + "group": "基础组件", + "category": "element-plus", + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "isPopper": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["type", "size"] + }, + "contextMenu": { + "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "disable": [] + }, + "invalidity": [""], + "clickCapture": true, + "framework": "Vue" + }, + "schema": { + "properties": [ + { + "name": "0", + "label": { + "zh_CN": "基础属性" + }, + "content": [ + { + "property": "size", + "label": { + "text": { + "zh_CN": "size" + } + }, + "description": { + "zh_CN": "尺寸" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "defaultValue": "default", + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "large", + "value": "large" + }, + { + "label": "default", + "value": "default" + }, + { + "label": "small", + "value": "small" + } + ] + } + } + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "type" + } + }, + "description": { + "zh_CN": "类型" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaInput", + "props": {} + } + }, + { + "property": "plain", + "label": { + "text": { + "zh_CN": "plain" + } + }, + "description": { + "zh_CN": "是否为朴素按钮" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "text", + "label": { + "text": { + "zh_CN": "text" + } + }, + "description": { + "zh_CN": "是否为文字按钮" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "bg", + "label": { + "text": { + "zh_CN": "bg" + } + }, + "description": { + "zh_CN": "是否显示文字按钮背景颜色" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "link", + "label": { + "text": { + "zh_CN": "link" + } + }, + "description": { + "zh_CN": "是否为链接按钮" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "round", + "label": { + "text": { + "zh_CN": "round" + } + }, + "description": { + "zh_CN": "是否为圆角按钮" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "circle", + "label": { + "text": { + "zh_CN": "circle" + } + }, + "description": { + "zh_CN": "是否为圆形按钮" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "loading", + "label": { + "text": { + "zh_CN": "loading" + } + }, + "description": { + "zh_CN": "是否为加载中状态" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "disabled" + } + }, + "description": { + "zh_CN": "是否禁用" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": {}, + "slots": { + "default": { + "label": { + "zh_CN": "default" + }, + "description": { + "zh_CN": "自定义默认内容" + } + }, + "loading": { + "label": { + "zh_CN": "loading" + }, + "description": { + "zh_CN": "自定义加载中组件" + } + } + } + }, + "snippets": [ + { + "name": { + "zh_CN": "按钮" + }, + "icon": "button", + "screenshot": "", + "snippetName": "ElButton", + "schema": { + "children": [ + { + "componentName": "Text", + "props": { + "text": "按钮文本" + } + } + ] + } + } + ] +} diff --git a/packages/materials/src/ElementPlus/ElInput.json b/packages/materials/src/ElementPlus/ElInput.json new file mode 100644 index 0000000000..1b0708c1e7 --- /dev/null +++ b/packages/materials/src/ElementPlus/ElInput.json @@ -0,0 +1,292 @@ +{ + "id": 1, + "version": "2.4.2", + "name": { + "zh_CN": "输入框" + }, + "component": "ElInput", + "icon": "input", + "description": "通过鼠标或键盘输入字符", + "doc_url": "", + "screenshot": "", + "tags": "", + "keywords": "", + "dev_mode": "proCode", + "npm": { + "package": "element-plus", + "version": "2.4.2", + "script": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.full.mjs", + "css": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.css", + "dependencies": null, + "exportName": "ElInput", + "destructuring": true + }, + "group": "表单组件", + "category": "element-plus", + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "isPopper": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["type", "size"] + }, + "contextMenu": { + "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "disable": [] + }, + "invalidity": [""], + "clickCapture": true, + "framework": "Vue" + }, + "schema": { + "properties": [ + { + "name": "0", + "label": { + "zh_CN": "基础属性" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "modelValue" + } + }, + "description": { + "zh_CN": "绑定值" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaInput", + "props": {} + } + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "size" + } + }, + "description": { + "zh_CN": "尺寸" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "defaultValue": "default", + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "large", + "value": "large" + }, + { + "label": "default", + "value": "default" + }, + { + "label": "small", + "value": "small" + } + ] + } + } + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "type" + } + }, + "description": { + "zh_CN": "类型" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaInput", + "props": {} + } + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "placeholder" + } + }, + "description": { + "zh_CN": "输入框占位文本" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "MetaBindI18n", + "props": {} + }, + "device": [] + }, + { + "property": "maxlength", + "label": { + "text": { + "zh_CN": "maxlength" + } + }, + "description": { + "zh_CN": "最大输入长度" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "number", + "widget": { + "component": "MetaNumberic", + "props": {} + }, + "device": [] + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "disabled" + } + }, + "description": { + "zh_CN": "是否禁用" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "device": [] + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定值改变时触发" + }, + "description": { + "zh_CN": "双向绑定值改变时触发" + } + }, + "onBlur": { + "label": { + "zh_CN": "输入框失去焦点时触发" + }, + "description": { + "zh_CN": "输入框失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + }, + "slots": { + "prefix": { + "label": { + "zh_CN": "头部内容" + }, + "description": { + "zh_CN": "输入框头部内容，只对非 type='textarea' 有效" + } + }, + "suffix": { + "label": { + "zh_CN": "尾部内容" + }, + "description": { + "zh_CN": "输入框尾部内容，只对非 type='textarea' 有效" + } + }, + "prepend": { + "label": { + "zh_CN": "前置内容" + }, + "description": { + "zh_CN": "输入框前置内容，只对非 type='textarea' 有效" + } + }, + "append": { + "label": { + "zh_CN": "后置内容" + }, + "description": { + "zh_CN": "输入框后置内容，只对非 type='textarea' 有效" + } + } + } + }, + "snippets": [ + { + "name": { + "zh_CN": "输入框" + }, + "icon": "input", + "screenshot": "", + "snippetName": "ElInput", + "schema": {} + } + ] +} diff --git a/packages/materials/src/TinyVue/TinyButton.json b/packages/materials/src/TinyVue/TinyButton.json new file mode 100644 index 0000000000..829e3848dd --- /dev/null +++ b/packages/materials/src/TinyVue/TinyButton.json @@ -0,0 +1,357 @@ +{ + "name": { + "zh_CN": "按钮" + }, + "component": "TinyButton", + "icon": "button", + "description": "常用的操作按钮，提供包括默认按钮、图标按钮、图片按钮、下拉按钮等类型", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Button", + "version": "3.14", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "collapse": { + "number": 6, + "text": { + "zh_CN": "显示更多" + } + }, + "content": [ + { + "property": "text", + "type": "string", + "defaultValue": "按钮文案", + "label": { + "text": { + "zh_CN": "按钮文字" + } + }, + "cols": 12, + "hidden": false, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "MetaBindI18n", + "props": {} + }, + "description": { + "zh_CN": "" + } + }, + { + "property": "size", + "type": "select", + "label": { + "text": { + "zh_CN": "大小" + } + }, + "cols": 12, + "rules": [], + "hidden": false, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "large", + "value": "large" + }, + { + "label": "medium", + "value": "medium" + }, + { + "label": "small", + "value": "small" + }, + { + "label": "mini", + "value": "mini" + } + ] + } + }, + "description": { + "zh_CN": "" + } + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否被禁用" + }, + "labelPosition": "left" + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "primary", + "value": "primary" + }, + { + "label": "success", + "value": "success" + }, + { + "label": "info", + "value": "info" + }, + { + "label": "warning", + "value": "warning" + }, + { + "label": "danger", + "value": "danger" + }, + { + "label": "text", + "value": "text" + } + ] + } + }, + "description": { + "zh_CN": "设置不同的主题样式" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "round", + "label": { + "text": { + "zh_CN": "圆角" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否圆角按钮" + }, + "labelPosition": "left" + }, + { + "property": "plain", + "label": { + "text": { + "zh_CN": "朴素按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否为朴素按钮" + }, + "labelPosition": "left" + }, + { + "property": "reset-time", + "label": { + "text": { + "zh_CN": "禁用时间" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaNumber", + "props": {} + }, + "description": { + "zh_CN": "设置禁用时间，防止重复提交，单位毫秒" + } + }, + { + "property": "circle", + "label": { + "text": { + "zh_CN": "圆角" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否圆形按钮" + }, + "labelPosition": "left" + }, + { + "property": "autofocus", + "label": { + "text": { + "zh_CN": "聚焦" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否默认聚焦" + }, + "labelPosition": "left" + }, + { + "property": "loading", + "label": { + "text": { + "zh_CN": "加载中" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否展示位加载中样式" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "点击事件" + }, + "description": { + "zh_CN": "按钮被点击时触发的回调函数" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["text", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "按钮" + }, + "icon": "button", + "screenshot": "", + "snippetName": "TinyButton", + "schema": { + "componentName": "TinyButton", + "props": { + "text": "按钮文案" + } + } + } + ], + "category": "general" +} diff --git a/packages/materials/src/TinyVue/TinyInput.json b/packages/materials/src/TinyVue/TinyInput.json new file mode 100644 index 0000000000..31764bcf2d --- /dev/null +++ b/packages/materials/src/TinyVue/TinyInput.json @@ -0,0 +1,433 @@ +{ + "name": { + "zh_CN": "输入框" + }, + "component": "TinyInput", + "icon": "input", + "description": "通过鼠标或键盘输入字符", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Input", + "version": "3.14", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "collapse": { + "number": 6, + "text": { + "zh_CN": "显示更多" + } + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaBindI18n", + "props": {} + }, + "description": { + "zh_CN": "双向绑定值" + }, + "labelPosition": "left" + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "textarea", + "value": "textarea" + }, + { + "label": "text", + "value": "text" + }, + { + "label": "password", + "value": "password" + } + ] + } + }, + "description": { + "zh_CN": "设置input框的type属性" + } + }, + { + "property": "rows", + "label": { + "text": { + "zh_CN": "行数" + } + }, + "widget": { + "component": "MetaNumber" + }, + "description": { + "zh_CN": "输入框行数，只对 type='textarea' 有效" + } + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaBindI18n", + "props": {} + }, + "description": { + "zh_CN": "输入框占位文本" + }, + "labelPosition": "left" + }, + { + "property": "clearable", + "label": { + "text": { + "zh_CN": "清除按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "是否显示清除按钮" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "是否禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "" + } + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "尺寸" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "medium", + "value": "medium" + }, + { + "label": "small", + "value": "small" + }, + { + "label": "mini", + "value": "mini" + } + ] + } + }, + "description": { + "zh_CN": "输入框尺寸。该属性的可选值为 medium / small / mini" + } + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "maxlength", + "label": { + "text": { + "zh_CN": "最大长度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaNumber", + "props": {} + }, + "description": { + "zh_CN": "设置 input 框的maxLength" + }, + "labelPosition": "left" + }, + { + "property": "autofocus", + "label": { + "text": { + "zh_CN": "聚焦" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSwitch", + "props": {} + }, + "description": { + "zh_CN": "自动获取焦点" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "值改变时触发" + }, + "description": { + "zh_CN": "在 Input 值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框改变后的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onInput": { + "label": { + "zh_CN": "输入值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框输入的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onBlur": { + "label": { + "zh_CN": "失去焦点时触发" + }, + "description": { + "zh_CN": "在 Input 失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onFocus": { + "label": { + "zh_CN": "获取焦点时触发" + }, + "description": { + "zh_CN": "在 Input 获取焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClear": { + "label": { + "zh_CN": "点击清空按钮时触发" + }, + "description": { + "zh_CN": "点击清空按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "slots": { + "prefix": { + "label": { + "zh_CN": "前置内容" + } + }, + "suffix": { + "label": { + "zh_CN": "后置内容" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["value", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "输入框" + }, + "icon": "input", + "screenshot": "", + "snippetName": "TinyInput", + "schema": { + "componentName": "TinyInput", + "props": { + "placeholder": "请输入", + "modelValue": "" + } + } + } + ], + "category": "general" +} diff --git a/packages/materials/src/html/Input.json b/packages/materials/src/html/Input.json new file mode 100644 index 0000000000..e6685316e3 --- /dev/null +++ b/packages/materials/src/html/Input.json @@ -0,0 +1,289 @@ +{ + "name": { + "zh_CN": "输入框" + }, + "component": "input", + "icon": "input", + "description": "输入框", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 40, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "collapse": { + "number": 6, + "text": { + "zh_CN": "显示更多" + } + }, + "content": [ + { + "property": "type", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaSelect", + "props": { + "options": [ + { + "label": "checkbox", + "value": "checkbox" + }, + { + "label": "color", + "value": "color" + }, + { + "label": "date", + "value": "date" + }, + { + "label": "button", + "value": "button" + }, + { + "label": "email", + "value": "email" + }, + { + "label": "file", + "value": "file" + }, + { + "label": "hidden", + "value": "hidden" + }, + { + "label": "image", + "value": "image" + }, + { + "label": "month", + "value": "month" + }, + { + "label": "number", + "value": "number" + }, + { + "label": "password", + "value": "password" + }, + { + "label": "radio", + "value": "radio" + }, + { + "label": "range", + "value": "range" + }, + { + "label": "reset", + "value": "reset" + }, + { + "label": "search", + "value": "search" + }, + { + "label": "submit", + "value": "submit" + }, + { + "label": "text", + "value": "text" + }, + { + "label": "time", + "value": "time" + }, + { + "label": "week", + "value": "week" + }, + { + "label": "url", + "value": "url" + } + ] + } + }, + "description": { + "zh_CN": "" + } + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位符" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaInput", + "props": {} + }, + "description": { + "zh_CN": "" + } + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "MetaHtmlAttributes", + "props": {} + }, + "description": { + "zh_CN": "" + }, + "labelPosition": "none" + } + ] + } + ], + "events": { + "onBlur": { + "label": { + "zh_CN": "失去焦点时触发" + }, + "description": { + "zh_CN": "在 Input 失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onFocus": { + "label": { + "zh_CN": "获取焦点时触发" + }, + "description": { + "zh_CN": "在 Input 获取焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onChange": { + "label": { + "zh_CN": "输入值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "输入框" + }, + "icon": "input", + "screenshot": "", + "snippetName": "input", + "schema": { + "componentName": "input", + "props": { + "type": "text", + "placeholder": "请输入" + } + } + } + ] +} From 7b7a1937ea0f5963e6c54c495853c5afc8fcfc59 Mon Sep 17 00:00:00 2001 From: chilingling Date: Fri, 25 Oct 2024 20:43:01 -0700 Subject: [PATCH 02/11] fix: change by review comment --- packages/materials/README.md | 3 ++- packages/materials/buildMaterials.mjs | 1 - packages/materials/package.json | 4 +++- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/materials/README.md b/packages/materials/README.md index 48146250cd..7aa6a92d8a 100644 --- a/packages/materials/README.md +++ b/packages/materials/README.md @@ -9,6 +9,7 @@ npm run serve ``` 解释： + 1. 会持续监听 src 目录下文件变动，持续构建出来物料产物 2. 会启动静态服务器。 @@ -30,7 +31,7 @@ npm run build:split ## 添加自己的物料 -请先大致了解 TinyEngine 物料协议：https://opentiny.design/tiny-engine#/protocol +请先大致了解 TinyEngine 物料协议：[TinyEngine物料协议](https://opentiny.design/tiny-engine#/protocol) src 目录功能约定结构： diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index cf1466fc32..4b2a4d222b 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -44,7 +44,6 @@ const validateComponent = (file, component) => { const generateComponents = async (entry) => { const files = await fg('*.json', { cwd: entry }) if (!files.length) { - // logger.warn('物料文件夹为空，请先执行`pnpm splitMaterials`命令拆分物料资产包') return } diff --git a/packages/materials/package.json b/packages/materials/package.json index ef7e2518e2..a085eb7f5a 100644 --- a/packages/materials/package.json +++ b/packages/materials/package.json @@ -2,7 +2,9 @@ "name": "@opentiny/tiny-engine-materials", "version": "1.0.0", "description": "", - "main": "index.js", + "main": "dist/all.json", + "module": "dist/all.json", + "type": "module", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "serve": "node buildMaterials.mjs serve", From 4bbdbbde8fed55128752dcc4753aadab6d2256fc Mon Sep 17 00:00:00 2001 From: chilingling Date: Wed, 5 Feb 2025 22:15:14 -0800 Subject: [PATCH 03/11] feat: add meta.json file describe material package --- packages/materials/buildMaterials.mjs | 25 ++++++++++++++++--- .../materials/src/ElementPlus/ElButton.json | 4 --- packages/materials/src/ElementPlus/meta.json | 9 +++++++ packages/materials/src/TinyVue/meta.json | 10 ++++++++ packages/materials/src/html/meta.json | 1 + 5 files changed, 42 insertions(+), 7 deletions(-) create mode 100644 packages/materials/src/ElementPlus/meta.json create mode 100644 packages/materials/src/TinyVue/meta.json create mode 100644 packages/materials/src/html/meta.json diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index 4b2a4d222b..13ef8307fb 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -43,6 +43,7 @@ const validateComponent = (file, component) => { const generateComponents = async (entry) => { const files = await fg('*.json', { cwd: entry }) + if (!files.length) { return } @@ -50,10 +51,26 @@ const generateComponents = async (entry) => { const bundle = { componentsMap: [], components: [], - snippets: [] + snippets: [], + packages: [] + } + + const metaInfo = fsExtra.readJsonSync(path.resolve(entry, 'meta.json'), { throws: false }) + + if (metaInfo?.package) { + bundle.packages.push(metaInfo.package) } - files.forEach((file) => { + const componentFiles = files.filter((fileName) => { + if (fileName === 'meta.json') { + return false + } + + // 下划线开头的组件文件不导出 + return !fileName.startsWith('_') + }) + + componentFiles.forEach((file) => { const material = fsExtra.readJsonSync(path.resolve(entry, file), { throws: false }) if (!material) { @@ -127,7 +144,8 @@ const buildComponents = async (config = {}) => { const allBundles = { components: [], snippets: [], - componentsMap: [] + componentsMap: [], + packages: [] } for (const entry of entries) { @@ -139,6 +157,7 @@ const buildComponents = async (config = {}) => { allBundles.components = allBundles.components.concat(res.components) allBundles.snippets = allBundles.snippets.concat(res.snippets) allBundles.componentsMap = allBundles.componentsMap.concat(res.componentsMap) + allBundles.packages = allBundles.packages.concat(res.packages) } } diff --git a/packages/materials/src/ElementPlus/ElButton.json b/packages/materials/src/ElementPlus/ElButton.json index e57ac4ecf8..29fc31a40f 100644 --- a/packages/materials/src/ElementPlus/ElButton.json +++ b/packages/materials/src/ElementPlus/ElButton.json @@ -14,10 +14,6 @@ "dev_mode": "proCode", "npm": { "package": "element-plus", - "version": "2.4.2", - "script": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.full.mjs", - "css": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.css", - "dependencies": null, "exportName": "ElButton", "destructuring": true }, diff --git a/packages/materials/src/ElementPlus/meta.json b/packages/materials/src/ElementPlus/meta.json new file mode 100644 index 0000000000..18e9ce48ef --- /dev/null +++ b/packages/materials/src/ElementPlus/meta.json @@ -0,0 +1,9 @@ +{ + "package": { + "name": "element-plus组件库", + "package": "element-plus", + "version": "2.4.2", + "script": "https://unpkg.com/element-plus@2.4.2/dist/index.full.mjs", + "css": "https://unpkg.com/element-plus@2.4.2/dist/index.css" + } +} diff --git a/packages/materials/src/TinyVue/meta.json b/packages/materials/src/TinyVue/meta.json new file mode 100644 index 0000000000..a45f778c04 --- /dev/null +++ b/packages/materials/src/TinyVue/meta.json @@ -0,0 +1,10 @@ +{ + "package": { + "name": "TinyVue组件库", + "package": "@opentiny/vue", + "version": "3.20.0", + "destructuring": true, + "script": "https://unpkg.com/@opentiny/vue-runtime@~3.20/dist3/tiny-vue-pc.mjs", + "css": "https://unpkg.com/@opentiny/vue-theme@~3.20/index.css" + } +} diff --git a/packages/materials/src/html/meta.json b/packages/materials/src/html/meta.json new file mode 100644 index 0000000000..0967ef424b --- /dev/null +++ b/packages/materials/src/html/meta.json @@ -0,0 +1 @@ +{} From af3d9458f926e2ac863ec25ed2d61d5680f2076a Mon Sep 17 00:00:00 2001 From: chilingling Date: Wed, 5 Feb 2025 23:57:39 -0800 Subject: [PATCH 04/11] fix: optimize buildMaterial logic --- packages/materials/buildMaterials.mjs | 43 ++++++++++++++++++++------- packages/materials/package.json | 4 +-- 2 files changed, 34 insertions(+), 13 deletions(-) diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index 13ef8307fb..10a2d3eee8 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -60,6 +60,9 @@ const generateComponents = async (entry) => { if (metaInfo?.package) { bundle.packages.push(metaInfo.package) } + if (metaInfo?.snippets) { + bundle.snippets = metaInfo.snippets + } const componentFiles = files.filter((fileName) => { if (fileName === 'meta.json') { @@ -92,8 +95,12 @@ const generateComponents = async (entry) => { const snippet = bundle.snippets.find((item) => item.group === category) if (snippet) { - componentSnippets && snippet.children.push(componentSnippets[0]) - } else if (category && componentInfo) { + if (!snippet.children) { + snippet.children = [] + } + + componentSnippets && snippet.children.push(...componentSnippets) + } else if (category && componentInfo && componentSnippets) { bundle.snippets.push({ group: category, children: componentSnippets || [] @@ -101,12 +108,11 @@ const generateComponents = async (entry) => { } const npmInfo = componentInfo.npm - const { package: packageName = '', version = '', exportName = '' } = npmInfo + const { package: packageName = '', exportName = '' } = npmInfo const mapItem = { componentName: componentInfo.component, package: packageName, - version, exportName } @@ -151,18 +157,33 @@ const buildComponents = async (config = {}) => { for (const entry of entries) { const res = await generateComponents(path.resolve(materialsDir, `${entry}`)) - if (res) { - fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res), { spaces: 2 }) + if (!res) { + continue + } + + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res), { spaces: 2 }) + + allBundles.components = allBundles.components.concat(res.components) + allBundles.componentsMap = allBundles.componentsMap.concat(res.componentsMap) + allBundles.packages = allBundles.packages.concat(res.packages) + + for (const snippetItem of res.snippets) { + const snippet = allBundles.snippets.find((item) => item.group === snippetItem.group) + + if (snippet) { + if (!snippet.children) { + snippet.children = [] + } - allBundles.components = allBundles.components.concat(res.components) - allBundles.snippets = allBundles.snippets.concat(res.snippets) - allBundles.componentsMap = allBundles.componentsMap.concat(res.componentsMap) - allBundles.packages = allBundles.packages.concat(res.packages) + snippet.children.push(...snippetItem.children) + } else { + allBundles.snippets.push(snippetItem) + } } } if (buildCombine) { - fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/all.json`), getFrameworkWithData(allBundles), { spaces: 2 }) + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/index.json`), getFrameworkWithData(allBundles), { spaces: 2 }) } logger.success('物料资产包构建成功') diff --git a/packages/materials/package.json b/packages/materials/package.json index a085eb7f5a..7e45717c5b 100644 --- a/packages/materials/package.json +++ b/packages/materials/package.json @@ -2,8 +2,8 @@ "name": "@opentiny/tiny-engine-materials", "version": "1.0.0", "description": "", - "main": "dist/all.json", - "module": "dist/all.json", + "main": "dist/index.json", + "module": "dist/index.json", "type": "module", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", From 63b7157eafaa3debea0d099a2daa8e0cadbafa23 Mon Sep 17 00:00:00 2001 From: chilingling Date: Wed, 5 Feb 2025 23:58:45 -0800 Subject: [PATCH 05/11] feat: add html material --- packages/materials/src/html/A.json | 159 ++++++++++++++++++++ packages/materials/src/html/Button.json | 75 ++++++++++ packages/materials/src/html/Form.json | 123 +++++++++++++++ packages/materials/src/html/H1.json | 112 ++++++++++++++ packages/materials/src/html/Img.json | 77 ++++++++++ packages/materials/src/html/Input.json | 37 +---- packages/materials/src/html/Label.json | 75 ++++++++++ packages/materials/src/html/P.json | 109 ++++++++++++++ packages/materials/src/html/Table.json | 110 ++++++++++++++ packages/materials/src/html/Td.json | 110 ++++++++++++++ packages/materials/src/html/Video.json | 191 ++++++++++++++++++++++++ packages/materials/src/html/meta.json | 11 +- 12 files changed, 1158 insertions(+), 31 deletions(-) create mode 100644 packages/materials/src/html/A.json create mode 100644 packages/materials/src/html/Button.json create mode 100644 packages/materials/src/html/Form.json create mode 100644 packages/materials/src/html/H1.json create mode 100644 packages/materials/src/html/Img.json create mode 100644 packages/materials/src/html/Label.json create mode 100644 packages/materials/src/html/P.json create mode 100644 packages/materials/src/html/Table.json create mode 100644 packages/materials/src/html/Td.json create mode 100644 packages/materials/src/html/Video.json diff --git a/packages/materials/src/html/A.json b/packages/materials/src/html/A.json new file mode 100644 index 0000000000..303bb53aeb --- /dev/null +++ b/packages/materials/src/html/A.json @@ -0,0 +1,159 @@ +{ + "icon": "link", + "name": { + "zh_CN": "提示框" + }, + "component": "a", + "description": "链接", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "group": "component", + "priority": 7, + "npm": {}, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "children", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlTextConfigurator", + "props": {} + }, + "description": { + "zh_CN": "类型" + }, + "labelPosition": "none" + }, + { + "property": "href", + "label": { + "text": { + "zh_CN": "链接" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "指定链接的 URL" + }, + "labelPosition": "left" + }, + { + "property": "target", + "label": { + "text": { + "zh_CN": "打开方式" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "ButtonGroupConfigurator", + "props": { + "options": [ + { + "label": "当前页面", + "value": "_self" + }, + { + "label": "打开新页面", + "value": "_blank" + } + ] + } + }, + "description": { + "zh_CN": "指定链接的打开方式，例如在当前窗口中打开或在新窗口中打开。" + } + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ] + }, + "configure": { + "loop": true, + "condition": true, + "slots": [], + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": [] + }, + "contextMenu": { + "actions": [], + "disable": [] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "链接" + }, + "icon": "link", + "screenshot": "", + "snippetName": "a", + "schema": { + "componentName": "a", + "children": "链接" + } + } + ], + "category": "basic" +} diff --git a/packages/materials/src/html/Button.json b/packages/materials/src/html/Button.json new file mode 100644 index 0000000000..0d760cac18 --- /dev/null +++ b/packages/materials/src/html/Button.json @@ -0,0 +1,75 @@ +{ + "icon": "button", + "name": { + "zh_CN": "Button" + }, + "component": "button", + "container": false, + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 70, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "点击时触发" + }, + "description": { + "zh_CN": "点击时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "shortcuts": { + "properties": [] + }, + "contentMenu": { + "actions": [] + } + }, + "configure": { + "isContainer": true + } +} diff --git a/packages/materials/src/html/Form.json b/packages/materials/src/html/Form.json new file mode 100644 index 0000000000..fd69ce13e6 --- /dev/null +++ b/packages/materials/src/html/Form.json @@ -0,0 +1,123 @@ +{ + "icon": "form", + "name": { + "zh_CN": "表单" + }, + "component": "form", + "container": false, + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 100, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "name", + "label": { + "text": { + "zh_CN": "名称" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表单的名称" + } + }, + { + "property": "action", + "label": { + "text": { + "zh_CN": "提交地址" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "提交表单时向何处发送表单数据" + } + }, + { + "property": "method", + "label": { + "text": { + "zh_CN": "HTTP方法" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "get", + "value": "get" + }, + { + "label": "post", + "value": "post" + } + ] + } + }, + "description": { + "zh_CN": "用于发送 form-data 的 HTTP 方法" + } + } + ] + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "点击时触发" + }, + "description": { + "zh_CN": "点击时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "shortcuts": { + "properties": [] + }, + "contentMenu": { + "actions": [] + } + }, + "configure": { + "isContainer": true + } +} diff --git a/packages/materials/src/html/H1.json b/packages/materials/src/html/H1.json new file mode 100644 index 0000000000..9772ccaf02 --- /dev/null +++ b/packages/materials/src/html/H1.json @@ -0,0 +1,112 @@ +{ + "name": { + "zh_CN": "标题" + }, + "component": ["h1", "h2", "h3", "h4", "h5", "h6"], + "icon": "h16", + "description": "标题", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "basic", + "priority": 20, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "children", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlTextConfigurator", + "props": { + "showRadioButton": true + } + }, + "description": { + "zh_CN": "" + }, + "labelPosition": "none" + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "" + }, + "labelPosition": "none" + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "标题" + }, + "icon": "h16", + "screenshot": "", + "snippetName": "h1", + "schema": { + "componentName": "h1", + "props": {}, + "children": "Heading" + } + } + ] +} diff --git a/packages/materials/src/html/Img.json b/packages/materials/src/html/Img.json new file mode 100644 index 0000000000..b5651a46ed --- /dev/null +++ b/packages/materials/src/html/Img.json @@ -0,0 +1,77 @@ +{ + "icon": "Image", + "name": { + "zh_CN": "Img" + }, + "component": "Img", + "container": false, + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 60, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "src", + "type": "string", + "defaultValue": "", + "bindState": true, + "label": { + "text": { + "zh_CN": "资源" + } + }, + "cols": 12, + "rules": [], + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "src路径" + } + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ], + "events": {}, + "shortcuts": { + "properties": ["src"] + }, + "contentMenu": { + "actions": [] + } + } +} diff --git a/packages/materials/src/html/Input.json b/packages/materials/src/html/Input.json index e6685316e3..a59aa083fc 100644 --- a/packages/materials/src/html/Input.json +++ b/packages/materials/src/html/Input.json @@ -23,12 +23,6 @@ "description": { "zh_CN": "基础信息" }, - "collapse": { - "number": 6, - "text": { - "zh_CN": "显示更多" - } - }, "content": [ { "property": "type", @@ -42,7 +36,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -129,7 +123,7 @@ } }, "description": { - "zh_CN": "" + "zh_CN": "类型" } }, { @@ -144,11 +138,11 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaInput", + "component": "InputConfigurator", "props": {} }, "description": { - "zh_CN": "" + "zh_CN": "占位符" } }, { @@ -163,11 +157,11 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaHtmlAttributes", + "component": "HtmlAttributesConfigurator", "props": {} }, "description": { - "zh_CN": "" + "zh_CN": "原生属性" }, "labelPosition": "none" } @@ -268,22 +262,5 @@ "actions": ["create symbol"], "disable": ["copy", "remove"] } - }, - "snippets": [ - { - "name": { - "zh_CN": "输入框" - }, - "icon": "input", - "screenshot": "", - "snippetName": "input", - "schema": { - "componentName": "input", - "props": { - "type": "text", - "placeholder": "请输入" - } - } - } - ] + } } diff --git a/packages/materials/src/html/Label.json b/packages/materials/src/html/Label.json new file mode 100644 index 0000000000..f2f9184ed1 --- /dev/null +++ b/packages/materials/src/html/Label.json @@ -0,0 +1,75 @@ +{ + "icon": "label", + "name": { + "zh_CN": "表单标签" + }, + "component": "label", + "container": false, + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 110, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "for", + "label": { + "text": { + "zh_CN": "label绑定表单元素" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "label 绑定到哪个表单元素" + } + }, + { + "property": "form", + "label": { + "text": { + "zh_CN": "label字段所属表单" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "label 字段所属的一个或多个表单" + } + } + ] + } + ], + "events": {}, + "shortcuts": { + "properties": [] + }, + "contentMenu": { + "actions": [] + } + } +} diff --git a/packages/materials/src/html/P.json b/packages/materials/src/html/P.json new file mode 100644 index 0000000000..8f3fce3bb5 --- /dev/null +++ b/packages/materials/src/html/P.json @@ -0,0 +1,109 @@ +{ + "name": { + "zh_CN": "段落" + }, + "component": "p", + "icon": "paragraph", + "description": "段落", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "basic", + "priority": 30, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "children", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlTextConfigurator", + "props": {} + }, + "description": { + "zh_CN": "类型" + }, + "labelPosition": "none" + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": [] + }, + "contextMenu": { + "actions": [], + "disable": [] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "段落" + }, + "icon": "paragraph", + "screenshot": "", + "snippetName": "p", + "schema": { + "componentName": "p", + "children": "TinyEngine 前端可视化设计器致力于通过友好的用户交互提升业务应用的开发效率。" + } + } + ] +} diff --git a/packages/materials/src/html/Table.json b/packages/materials/src/html/Table.json new file mode 100644 index 0000000000..728d176646 --- /dev/null +++ b/packages/materials/src/html/Table.json @@ -0,0 +1,110 @@ +{ + "icon": "table", + "name": { + "zh_CN": "表格" + }, + "component": "table", + "container": false, + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 80, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "width", + "label": { + "text": { + "zh_CN": "宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表格的宽度" + } + }, + { + "property": "border", + "label": { + "text": { + "zh_CN": "边框宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表格边框的宽度" + } + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "点击时触发" + }, + "description": { + "zh_CN": "点击时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "shortcuts": { + "properties": [] + }, + "contentMenu": { + "actions": [] + } + } +} diff --git a/packages/materials/src/html/Td.json b/packages/materials/src/html/Td.json new file mode 100644 index 0000000000..c352657ff8 --- /dev/null +++ b/packages/materials/src/html/Td.json @@ -0,0 +1,110 @@ +{ + "icon": "td", + "name": { + "zh_CN": "表格单元格" + }, + "component": "td", + "container": false, + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "html", + "priority": 90, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "colspan", + "label": { + "text": { + "zh_CN": "合并列" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "单元格可横跨的列数" + } + }, + { + "property": "rowspan", + "label": { + "text": { + "zh_CN": "合并行" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "单元格可横跨的行数" + } + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "点击时触发" + }, + "description": { + "zh_CN": "点击时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "shortcuts": { + "properties": [] + }, + "contentMenu": { + "actions": [] + } + } +} diff --git a/packages/materials/src/html/Video.json b/packages/materials/src/html/Video.json new file mode 100644 index 0000000000..689004bda5 --- /dev/null +++ b/packages/materials/src/html/Video.json @@ -0,0 +1,191 @@ +{ + "name": { + "zh_CN": "视频" + }, + "component": "video", + "icon": "video", + "description": "视频", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": {}, + "group": "component", + "category": "basic", + "priority": 50, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "src", + "label": { + "text": { + "zh_CN": "资源" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "视频的 URL" + } + }, + { + "property": "width", + "label": { + "text": { + "zh_CN": "播放器宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "视频播放器的宽度" + } + }, + { + "property": "height", + "label": { + "text": { + "zh_CN": "播放器高度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "视频播放器的高度" + } + }, + { + "property": "controls", + "label": { + "text": { + "zh_CN": "显示控件" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示控件" + }, + "labelPosition": "left" + }, + { + "property": "autoplay", + "label": { + "text": { + "zh_CN": "马上播放" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否马上播放" + }, + "labelPosition": "left" + }, + { + "property": "attributes3", + "label": { + "text": { + "zh_CN": "原生属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "HtmlAttributesConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生属性" + }, + "labelPosition": "none" + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": [] + }, + "contextMenu": { + "actions": [], + "disable": [] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "视频" + }, + "icon": "video", + "screenshot": "", + "snippetName": "video", + "schema": { + "componentName": "video", + "props": { + "src": "img/webNova.jpg", + "width": "200", + "height": "100", + "style": "border:1px solid #ccc" + } + } + } + ] +} diff --git a/packages/materials/src/html/meta.json b/packages/materials/src/html/meta.json index 0967ef424b..c0f7876640 100644 --- a/packages/materials/src/html/meta.json +++ b/packages/materials/src/html/meta.json @@ -1 +1,10 @@ -{} +{ + "snippets": [ + { + "group": "basic", + "label": { + "zh_CN": "基础元素" + } + } + ] +} From c3312e0aa10337c591f91e345e66ead8ed30ff2a Mon Sep 17 00:00:00 2001 From: chilingling Date: Wed, 5 Feb 2025 23:59:28 -0800 Subject: [PATCH 06/11] feat: add element-plus material --- .../materials/src/ElementPlus/ElButton.json | 60 +- .../materials/src/ElementPlus/ElForm.json | 534 +++++++ .../materials/src/ElementPlus/ElFormItem.json | 346 +++++ .../materials/src/ElementPlus/ElInput.json | 40 +- .../materials/src/ElementPlus/ElTable.json | 1287 +++++++++++++++++ .../src/ElementPlus/ElTableColumn.json | 65 + packages/materials/src/ElementPlus/meta.json | 10 +- 7 files changed, 2289 insertions(+), 53 deletions(-) create mode 100644 packages/materials/src/ElementPlus/ElForm.json create mode 100644 packages/materials/src/ElementPlus/ElFormItem.json create mode 100644 packages/materials/src/ElementPlus/ElTable.json create mode 100644 packages/materials/src/ElementPlus/ElTableColumn.json diff --git a/packages/materials/src/ElementPlus/ElButton.json b/packages/materials/src/ElementPlus/ElButton.json index 29fc31a40f..7753facab3 100644 --- a/packages/materials/src/ElementPlus/ElButton.json +++ b/packages/materials/src/ElementPlus/ElButton.json @@ -58,7 +58,7 @@ "property": "size", "label": { "text": { - "zh_CN": "size" + "zh_CN": "尺寸" } }, "description": { @@ -68,11 +68,11 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "defaultValue": "default", "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -95,7 +95,7 @@ "property": "type", "label": { "text": { - "zh_CN": "type" + "zh_CN": "类型" } }, "description": { @@ -105,10 +105,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaInput", + "component": "InputConfigurator", "props": {} } }, @@ -116,7 +116,7 @@ "property": "plain", "label": { "text": { - "zh_CN": "plain" + "zh_CN": "朴素按钮" } }, "description": { @@ -126,10 +126,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -138,7 +138,7 @@ "property": "text", "label": { "text": { - "zh_CN": "text" + "zh_CN": "文字按钮" } }, "description": { @@ -148,10 +148,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -160,7 +160,7 @@ "property": "bg", "label": { "text": { - "zh_CN": "bg" + "zh_CN": "背景颜色" } }, "description": { @@ -170,10 +170,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -182,7 +182,7 @@ "property": "link", "label": { "text": { - "zh_CN": "link" + "zh_CN": "链接按钮" } }, "description": { @@ -192,10 +192,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -204,7 +204,7 @@ "property": "round", "label": { "text": { - "zh_CN": "round" + "zh_CN": "圆角按钮" } }, "description": { @@ -214,10 +214,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -226,7 +226,7 @@ "property": "circle", "label": { "text": { - "zh_CN": "circle" + "zh_CN": "圆形按钮" } }, "description": { @@ -236,10 +236,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -248,7 +248,7 @@ "property": "loading", "label": { "text": { - "zh_CN": "loading" + "zh_CN": "加载中状态" } }, "description": { @@ -258,10 +258,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] @@ -270,7 +270,7 @@ "property": "disabled", "label": { "text": { - "zh_CN": "disabled" + "zh_CN": "禁用" } }, "description": { @@ -280,11 +280,11 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "defaultValue": false, "type": "boolean", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] diff --git a/packages/materials/src/ElementPlus/ElForm.json b/packages/materials/src/ElementPlus/ElForm.json new file mode 100644 index 0000000000..163e5b8695 --- /dev/null +++ b/packages/materials/src/ElementPlus/ElForm.json @@ -0,0 +1,534 @@ +{ + "id": 1, + "version": "2.4.2", + "name": { + "zh_CN": "表单" + }, + "component": "ElForm", + "icon": "form", + "description": "表单包含 输入框, 单选框, 下拉选择, 多选框 等用户输入的组件。 使用表单，您可以收集、验证和提交数据。", + "doc_url": "", + "screenshot": "", + "tags": "", + "keywords": "", + "dev_mode": "proCode", + "npm": { + "package": "element-plus", + "exportName": "ElForm", + "destructuring": true + }, + "group": "表单组件", + "category": "element-plus", + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "isPopper": false, + "nestingRule": { + "childWhitelist": ["ElFormItem"], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["inline", "label-width"] + }, + "contextMenu": { + "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "disable": [] + }, + "invalidity": [""], + "clickCapture": true, + "framework": "Vue" + }, + "schema": { + "properties": [ + { + "name": "0", + "label": { + "zh_CN": "基础属性" + }, + "content": [ + { + "property": "model", + "label": { + "text": { + "zh_CN": "数据对象" + } + }, + "description": { + "zh_CN": "表单数据对象" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "rules", + "label": { + "text": { + "zh_CN": "验证规则" + } + }, + "description": { + "zh_CN": "表单验证规则" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "inline", + "label": { + "text": { + "zh_CN": "行内模式" + } + }, + "description": { + "zh_CN": "行内表单模式" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "label-position", + "label": { + "text": { + "zh_CN": "标签位置" + } + }, + "description": { + "zh_CN": "表单域标签的位置， 当设置为 left 或 right 时，则也需要设置标签宽度属性" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "defaultValue": "right", + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "left", + "value": "left" + }, + { + "label": "right", + "value": "right" + }, + { + "label": "top", + "value": "top" + } + ] + } + } + }, + { + "property": "label-width", + "label": { + "text": { + "zh_CN": "标签宽度" + } + }, + "description": { + "zh_CN": "标签的长度，例如 '50px'。 作为 Form 直接子元素的 form-item 会继承该值。 可以使用 auto。" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "label-suffix", + "label": { + "text": { + "zh_CN": "标签后缀" + } + }, + "description": { + "zh_CN": "表单域标签的后缀" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "hide-required-asterisk", + "label": { + "text": { + "zh_CN": "隐藏必填星号" + } + }, + "description": { + "zh_CN": "是否隐藏必填字段标签旁边的红色星号" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "require-asterisk-position", + "label": { + "text": { + "zh_CN": "星号位置" + } + }, + "description": { + "zh_CN": "星号的位置" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "defaultValue": "left", + "widget": { + "component": "ButtonGroupConfigurator", + "props": { + "options": [ + { + "label": "left", + "value": "left" + }, + { + "label": "right", + "value": "right" + } + ] + } + } + }, + { + "property": "show-message", + "label": { + "text": { + "zh_CN": "显示校验信息" + } + }, + "description": { + "zh_CN": "是否显示校验错误信息" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": true, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "inline-message", + "label": { + "text": { + "zh_CN": "行内显示校验信息" + } + }, + "description": { + "zh_CN": "是否以行内形式展示校验信息" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "status-icon", + "label": { + "text": { + "zh_CN": "显示校验结果图标" + } + }, + "description": { + "zh_CN": "是否在输入框中显示校验结果反馈图标" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "validate-on-rule-change", + "label": { + "text": { + "zh_CN": "触发验证" + } + }, + "description": { + "zh_CN": "是否在 rules 属性改变后立即触发一次验证" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": true, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "尺寸" + } + }, + "description": { + "zh_CN": "用于控制该表单内组件的尺寸" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "defaultValue": "default", + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "large", + "value": "large" + }, + { + "label": "default", + "value": "default" + }, + { + "label": "small", + "value": "small" + } + ] + } + } + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "description": { + "zh_CN": "是否禁用该表单内的所有组件。 如果设置为 true, 它将覆盖内部组件的 disabled 属性" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "scroll-to-error", + "label": { + "text": { + "zh_CN": "滚动到错误项" + } + }, + "description": { + "zh_CN": "当校验失败时，滚动到第一个错误表单项" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "device": [] + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onValidate": { + "label": { + "zh_CN": "任一表单项被校验后触发" + }, + "description": { + "zh_CN": "任一表单项被校验后触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "slots": {} + }, + "snippets": [ + { + "name": { + "zh_CN": "表单" + }, + "icon": "form", + "screenshot": "", + "snippetName": "ElForm", + "schema": { + "children": [ + { + "componentName": "ElFormItem", + "props": { + "label": "账号", + "prop": "account" + }, + "children": [ + { + "componentName": "ElInput", + "props": { + "modelValue": "", + "placeholder": "请输入账号" + } + } + ] + }, + { + "componentName": "ElFormItem", + "props": { + "label": "密码", + "prop": "password" + }, + "children": [ + { + "componentName": "ElInput", + "props": { + "modelValue": "", + "placeholder": "请输入密码", + "type": "password" + } + } + ] + }, + { + "componentName": "ElFormItem", + "props": {}, + "children": [ + { + "componentName": "ElButton", + "props": { + "type": "primary", + "style": "margin-right: 10px" + }, + "children": [ + { + "componentName": "Text", + "props": { + "text": "提交" + } + } + ] + }, + { + "componentName": "ElButton", + "props": { + "type": "primary" + }, + "children": [ + { + "componentName": "Text", + "props": { + "text": "重置" + } + } + ] + } + ] + } + ] + } + } + ] +} diff --git a/packages/materials/src/ElementPlus/ElFormItem.json b/packages/materials/src/ElementPlus/ElFormItem.json new file mode 100644 index 0000000000..7c42a08757 --- /dev/null +++ b/packages/materials/src/ElementPlus/ElFormItem.json @@ -0,0 +1,346 @@ +{ + "id": 1, + "version": "2.4.2", + "name": { + "zh_CN": "表单子项" + }, + "component": "ElFormItem", + "icon": "formItem", + "description": "表单包含 输入框, 单选框, 下拉选择, 多选框 等用户输入的组件。 使用表单，您可以收集、验证和提交数据。", + "doc_url": "", + "screenshot": "", + "tags": "", + "keywords": "", + "dev_mode": "proCode", + "npm": { + "package": "element-plus", + "exportName": "ElFormItem", + "destructuring": true + }, + "group": "表单组件", + "category": "element-plus", + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "isPopper": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["inline", "label-width"] + }, + "contextMenu": { + "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "disable": [] + }, + "invalidity": [""], + "clickCapture": true, + "framework": "Vue" + }, + "schema": { + "properties": [ + { + "name": "0", + "label": { + "zh_CN": "基础属性" + }, + "content": [ + { + "property": "prop", + "label": { + "text": { + "zh_CN": "键名" + } + }, + "description": { + "zh_CN": "model 的键名。 它可以是一个属性的值(如 a.b.0 或 [a', 'b', '0'])。 在定义了 validate、resetFields 的方法时，该属性是必填的" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "label", + "label": { + "text": { + "zh_CN": "标签文本" + } + }, + "description": { + "zh_CN": "标签文本" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "label-width", + "label": { + "text": { + "zh_CN": "标签宽度" + } + }, + "description": { + "zh_CN": "标签宽度，例如 '50px'。 可以使用 auto" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "required", + "label": { + "text": { + "zh_CN": "必填项" + } + }, + "description": { + "zh_CN": "是否为必填项，如不设置，则会根据校验规则确认" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "rules", + "label": { + "text": { + "zh_CN": "验证规则" + } + }, + "description": { + "zh_CN": "表单验证规则, 更多内容可以参考async-validator" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "error", + "label": { + "text": { + "zh_CN": "错误信息" + } + }, + "description": { + "zh_CN": "表单域验证错误时的提示信息。设置该值会导致表单验证状态变为 error，并显示该错误信息" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "show-message", + "label": { + "text": { + "zh_CN": "显示错误信息" + } + }, + "description": { + "zh_CN": "是否显示校验错误信息" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "inline-message", + "label": { + "text": { + "zh_CN": "行内显示错误信息" + } + }, + "description": { + "zh_CN": "是否在行内显示校验信息" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "尺寸" + } + }, + "description": { + "zh_CN": "用于控制该表单内组件的尺寸" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "defaultValue": "default", + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "large", + "value": "large" + }, + { + "label": "default", + "value": "default" + }, + { + "label": "small", + "value": "small" + } + ] + } + } + }, + { + "property": "for", + "label": { + "text": { + "zh_CN": "for" + } + }, + "description": { + "zh_CN": "和原生标签相同能力" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "validate-status", + "label": { + "text": { + "zh_CN": "校验状态" + } + }, + "description": { + "zh_CN": "formItem 校验的状态" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "error", + "value": "error" + }, + { + "label": "validating", + "value": "validating" + }, + { + "label": "success", + "value": "success" + } + ] + } + } + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": {}, + "slots": { + "label": { + "label": { + "zh_CN": "label" + }, + "description": { + "zh_CN": "标签位置显示的内容" + } + }, + "error": { + "label": { + "zh_CN": "error" + }, + "description": { + "zh_CN": "验证错误信息的显示内容" + } + } + } + } +} diff --git a/packages/materials/src/ElementPlus/ElInput.json b/packages/materials/src/ElementPlus/ElInput.json index 1b0708c1e7..611411cb6c 100644 --- a/packages/materials/src/ElementPlus/ElInput.json +++ b/packages/materials/src/ElementPlus/ElInput.json @@ -14,10 +14,6 @@ "dev_mode": "proCode", "npm": { "package": "element-plus", - "version": "2.4.2", - "script": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.full.mjs", - "css": "https://npm.onmicrosoft.cn/element-plus@2.4.2/dist/index.css", - "dependencies": null, "exportName": "ElInput", "destructuring": true }, @@ -62,7 +58,7 @@ "property": "modelValue", "label": { "text": { - "zh_CN": "modelValue" + "zh_CN": "绑定值" } }, "description": { @@ -72,10 +68,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaInput", + "component": "InputConfigurator", "props": {} } }, @@ -83,7 +79,7 @@ "property": "size", "label": { "text": { - "zh_CN": "size" + "zh_CN": "尺寸" } }, "description": { @@ -93,11 +89,11 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "defaultValue": "default", "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -120,7 +116,7 @@ "property": "type", "label": { "text": { - "zh_CN": "type" + "zh_CN": "类型" } }, "description": { @@ -130,10 +126,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaInput", + "component": "InputConfigurator", "props": {} } }, @@ -141,7 +137,7 @@ "property": "placeholder", "label": { "text": { - "zh_CN": "placeholder" + "zh_CN": "占位文本" } }, "description": { @@ -151,10 +147,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "string", "widget": { - "component": "MetaBindI18n", + "component": "I18nConfigurator", "props": {} }, "device": [] @@ -163,7 +159,7 @@ "property": "maxlength", "label": { "text": { - "zh_CN": "maxlength" + "zh_CN": "最大长度" } }, "description": { @@ -173,10 +169,10 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "type": "number", "widget": { - "component": "MetaNumberic", + "component": "NumberConfigurator", "props": {} }, "device": [] @@ -185,7 +181,7 @@ "property": "disabled", "label": { "text": { - "zh_CN": "disabled" + "zh_CN": "是否禁用" } }, "description": { @@ -195,11 +191,11 @@ "readOnly": false, "disabled": false, "cols": 12, - "labelPosition": "top", + "labelPosition": "left", "defaultValue": false, "type": "boolean", "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "device": [] diff --git a/packages/materials/src/ElementPlus/ElTable.json b/packages/materials/src/ElementPlus/ElTable.json new file mode 100644 index 0000000000..ba30af7add --- /dev/null +++ b/packages/materials/src/ElementPlus/ElTable.json @@ -0,0 +1,1287 @@ +{ + "id": 1, + "version": "2.4.2", + "name": { + "zh_CN": "表单" + }, + "component": "ElTable", + "icon": "table", + "description": "用于展示多条结构类似的数据， 可对数据进行排序、筛选、对比或其他自定义操作", + "doc_url": "", + "screenshot": "", + "tags": "", + "keywords": "", + "dev_mode": "proCode", + "npm": { + "package": "element-plus", + "exportName": "ElTable", + "destructuring": true + }, + "group": "数据展示", + "category": "element-plus", + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "isPopper": false, + "nestingRule": { + "childWhitelist": ["ElTableColumn"], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["inline", "label-width"] + }, + "contextMenu": { + "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "disable": [] + }, + "invalidity": [""], + "clickCapture": true, + "framework": "Vue" + }, + "schema": { + "properties": [ + { + "name": "0", + "label": { + "zh_CN": "基础属性" + }, + "content": [ + { + "property": "data", + "label": { + "text": { + "zh_CN": "数据" + } + }, + "description": { + "zh_CN": "显示的数据" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "columns", + "label": { + "text": { + "zh_CN": "表格列配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "properties": [ + { + "label": { + "zh_CN": "默认分组" + }, + "content": [ + { + "property": "type", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "type" + } + }, + "description": { + "text": { + "zh_CN": "对应列的类型。 如果设置了selection则显示多选框； 如果设置了 index 则显示该行的索引（从 1 开始计算）； 如果设置了 expand 则显示为一个可展开的按钮" + } + }, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "selection", + "value": "selection" + }, + { + "label": "index", + "value": "index" + }, + { + "label": "expand", + "value": "expand" + } + ] + } + } + }, + { + "property": "index", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "index" + } + }, + "description": { + "text": { + "zh_CN": "如果设置了 type=index，可以通过传递 index 属性来自定义索引" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": {} + } + }, + { + "property": "label", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "label" + } + }, + "description": { + "text": { + "zh_CN": "显示的标题" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "column-key", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "column-key" + } + }, + "description": { + "text": { + "zh_CN": "column 的 key， column 的 key， 如果需要使用 filter-change 事件，则需要此属性标识是哪个 column 的筛选条件" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "prop", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "prop" + } + }, + "description": { + "text": { + "zh_CN": "字段名称 对应列内容的字段名， 也可以使用 property属性" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "width", + "type": "number", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "width" + } + }, + "description": { + "text": { + "zh_CN": "对应列的宽度" + } + }, + "widget": { + "component": "NumberConfigurator", + "props": {} + } + }, + { + "property": "min-width", + "type": "number", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "min-width" + } + }, + "description": { + "text": { + "zh_CN": "对应列的最小宽度， 对应列的最小宽度， 与 width 的区别是 width 是固定的，min-width 会把剩余宽度按比例分配给设置了 min-width 的列" + } + }, + "widget": { + "component": "NumberConfigurator", + "props": {} + } + }, + { + "property": "fixed", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "fixed" + } + }, + "description": { + "text": { + "zh_CN": "列是否固定在左侧或者右侧。 true 表示固定在左侧" + } + }, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "left", + "value": "left" + }, + { + "label": "right", + "value": "right" + } + ] + } + } + }, + { + "property": "sortable", + "type": "boolean", + "labelPosition": "left", + "label": { + "text": { + "zh_CN": "sortable" + } + }, + "description": { + "text": { + "zh_CN": "对应列是否可以排序" + } + }, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "sort-method", + "type": "function", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "sort-method" + } + }, + "description": { + "text": { + "zh_CN": "指定数据按照哪个属性进行排序，仅当sortable设置为true的时候有效。 应该如同 Array.sort 那样返回一个 Number" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": {} + } + }, + { + "property": "sort-by", + "type": "array", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "sort-by" + } + }, + "description": { + "text": { + "zh_CN": "指定数据按照哪个属性进行排序，仅当 sortable 设置为 true 且没有设置 sort-method 的时候有效。 如果 sort-by 为数组，则先按照第 1 个属性排序，如果第 1 个相等，再按照第 2 个排序，以此类推" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "sort-orders", + "type": "array", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "sort-orders" + } + }, + "description": { + "text": { + "zh_CN": "数据在排序时所使用排序策略的轮转顺序，仅当 sortable 为 true 时有效。 需传入一个数组，随着用户点击表头，该列依次按照数组中元素的顺序进行排序" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "resizable", + "type": "boolean", + "labelPosition": "left", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "resizable" + } + }, + "description": { + "text": { + "zh_CN": "对应列是否可以通过拖动改变宽度（需要在 el-table 上设置 border 属性为真）" + } + }, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "formatter", + "type": "function", + "labelPosition": "top", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "formatter" + } + }, + "description": { + "text": { + "zh_CN": "用来格式化内容" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "dataType": "JSFunction" + } + } + }, + { + "property": "show-overflow-tooltip", + "type": "boolean", + "labelPosition": "left", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "show-overflow-tooltip" + } + }, + "description": { + "text": { + "zh_CN": "当内容过长被隐藏时显示 tooltip" + } + }, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "align", + "type": "string", + "labelPosition": "top", + "defaultValue": "left", + "label": { + "text": { + "zh_CN": "align" + } + }, + "description": { + "text": { + "zh_CN": "对齐方式" + } + }, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "left", + "value": "left" + }, + { + "label": "center", + "value": "center" + }, + { + "label": "right", + "value": "right" + } + ] + } + } + }, + { + "property": "header-align", + "type": "string", + "labelPosition": "top", + "defaultValue": "left", + "label": { + "text": { + "zh_CN": "header-align" + } + }, + "description": { + "text": { + "zh_CN": "表头对齐方式， 若不设置该项，则使用表格的对齐方式" + } + }, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "left", + "value": "left" + }, + { + "label": "center", + "value": "center" + }, + { + "label": "right", + "value": "right" + } + ] + } + } + }, + { + "property": "class-name", + "type": "string", + "labelPosition": "top", + "defaultValue": "left", + "label": { + "text": { + "zh_CN": "class-name" + } + }, + "description": { + "text": { + "zh_CN": "列的 className" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "label-class-name", + "type": "string", + "labelPosition": "top", + "defaultValue": "left", + "label": { + "text": { + "zh_CN": "label-class-name" + } + }, + "description": { + "text": { + "zh_CN": "当前列标题的自定义类名" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "selectable", + "type": "function", + "labelPosition": "top", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "selectable" + } + }, + "description": { + "text": { + "zh_CN": "仅对 type=selection 的列有效，类型为 Function，Function 的返回值用来决定这一行的 CheckBox 是否可以勾选" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": {} + } + }, + { + "property": "reserve-selection", + "type": "boolean", + "labelPosition": "left", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "reserve-selection" + } + }, + "description": { + "text": { + "zh_CN": "数据刷新后是否保留选项，仅对 type=selection 的列有效， 请注意， 需指定 row-key 来让这个功能生效。" + } + }, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "filters", + "type": "array", + "labelPosition": "top", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "filters" + } + }, + "description": { + "text": { + "zh_CN": "数据刷新后是否保留选项，仅对 type=selection 的列有效， 请注意， 需指定 row-key 来让这个功能生效。" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + }, + { + "property": "filter-placement", + "type": "string", + "labelPosition": "top", + "label": { + "text": { + "zh_CN": "filter-placement" + } + }, + "description": { + "text": { + "zh_CN": "过滤弹出框的定位" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "filter-multiple", + "type": "string", + "labelPosition": "left", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "filter-multiple" + } + }, + "description": { + "text": { + "zh_CN": "数据过滤的选项是否多选" + } + }, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "filter-method", + "type": "function", + "labelPosition": "top", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "filter-method" + } + }, + "description": { + "text": { + "zh_CN": "数据过滤使用的方法， 如果是多选的筛选项，对每一条数据会执行多次，任意一次返回 true 就会显示" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": {} + } + }, + { + "property": "filtered-value", + "type": "array", + "labelPosition": "top", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "filtered-value" + } + }, + "description": { + "text": { + "zh_CN": "选中的数据过滤项，如果需要自定义表头过滤的渲染方式，可能会需要此属性" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + } + } + ] + } + ], + "widget": { + "component": "TableColumnsConfigurator", + "props": { + "type": "object", + "textField": "label", + "language": "json", + "buttonText": "编辑列配置", + "title": "编辑列配置", + "expand": true + } + }, + "description": { + "zh_CN": "表格列的配置信息" + }, + "labelPosition": "top" + }, + { + "property": "max-height", + "label": { + "text": { + "zh_CN": "最大高度" + } + }, + "description": { + "zh_CN": "Table 的最大高度。" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "number", + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "height", + "label": { + "text": { + "zh_CN": "表格高度" + } + }, + "description": { + "zh_CN": "Table 的高度， 默认为自动高度。 这个高度会设置为 Table 的 style.height 的值，Table 的高度会受控于外部样式。" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "stripe", + "label": { + "text": { + "zh_CN": "斑马纹" + } + }, + "description": { + "zh_CN": "是否为斑马纹 table" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "border", + "label": { + "text": { + "zh_CN": "纵向边框" + } + }, + "description": { + "zh_CN": "是否带有纵向边框" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "表格尺寸" + } + }, + "description": { + "zh_CN": "Table 的尺寸" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "type": "string", + "defaultValue": "default", + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "large", + "value": "large" + }, + { + "label": "default", + "value": "default" + }, + { + "label": "small", + "value": "small" + } + ] + } + } + }, + { + "property": "fit", + "label": { + "text": { + "zh_CN": "列宽自撑开" + } + }, + "description": { + "zh_CN": "列的宽度是否自撑开" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": true, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "show-header", + "label": { + "text": { + "zh_CN": "显示表头" + } + }, + "description": { + "zh_CN": "是否显示表头" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": true, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "highlight-current-row", + "label": { + "text": { + "zh_CN": "高亮当前行" + } + }, + "description": { + "zh_CN": "是否要高亮当前行" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "current-row-key", + "label": { + "text": { + "zh_CN": "当前行的 key" + } + }, + "description": { + "zh_CN": "当前行的 key，只写属性" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "type": "string", + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "row-class-name", + "label": { + "text": { + "zh_CN": "行的类名" + } + }, + "description": { + "zh_CN": "行的 className" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "row-key", + "label": { + "text": { + "zh_CN": "行数据的 Key" + } + }, + "description": { + "zh_CN": "行数据的 Key，用来优化 Table 的渲染； 在使用reserve-selection功能与显示树形数据时，该属性是必填的。 类型为 String 时，支持多层访问：user.info.id，但不支持 user.info[0].id，此种情况请使用 Function" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "empty-text", + "label": { + "text": { + "zh_CN": "空数据文本" + } + }, + "description": { + "zh_CN": "空数据时显示的文本内容" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "device": [] + }, + { + "property": "table-layout", + "label": { + "text": { + "zh_CN": "表格布局方式" + } + }, + "description": { + "zh_CN": "设置表格单元、行和列的布局方式" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "top", + "defaultValue": "fixed", + "widget": { + "component": "InputConfigurator", + "props": { + "options": [ + { + "label": "fixed", + "value": "fixed" + }, + { + "label": "auto", + "value": "auto" + } + ] + } + }, + "device": [] + }, + { + "property": "scrollbar-always-on", + "label": { + "text": { + "zh_CN": "显示滚动条" + } + }, + "description": { + "zh_CN": "总是显示滚动条" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + }, + { + "property": "flexible", + "label": { + "text": { + "zh_CN": "主轴最小尺寸" + } + }, + "description": { + "zh_CN": "确保主轴的最小尺寸，以便不超过内容" + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "labelPosition": "left", + "defaultValue": false, + "type": "boolean", + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + } + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onSelect": { + "label": { + "zh_CN": "勾选数据行的 Checkbox 时触发" + }, + "description": { + "zh_CN": "当用户手动勾选数据行的 Checkbox 时触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "selection", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前选中项" + } + }, + { + "name": "row", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前行" + } + } + ], + "returns": {} + } + }, + "onSelectAll": { + "label": { + "zh_CN": "勾选全选时触发" + }, + "description": { + "zh_CN": "当用户手动勾选全选 Checkbox 时触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "selection", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前选中项" + } + } + ], + "returns": {} + } + }, + "onSelectionChange": { + "label": { + "zh_CN": "选择项发生变化时会触发" + }, + "description": { + "zh_CN": "当选择项发生变化时会触发该事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "selection", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前选中项" + } + } + ], + "returns": {} + } + }, + "onCellMouseEnter": { + "label": { + "zh_CN": "单元格 hover 时会触发" + }, + "description": { + "zh_CN": "当单元格 hover 进入时会触发该事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "row", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前行" + } + }, + { + "name": "column", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前列" + } + }, + { + "name": "cell", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前单元格" + } + }, + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生事件 event" + } + } + ], + "returns": {} + } + }, + "onCellMouseLeave": { + "label": { + "zh_CN": "单元格 hover 退出时会触发" + }, + "description": { + "zh_CN": "当单元格 hover 退出时会触发该事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "row", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前行" + } + }, + { + "name": "column", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前列" + } + }, + { + "name": "cell", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前单元格" + } + }, + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生事件 event" + } + } + ], + "returns": {} + } + } + }, + "slots": { + "empty": { + "label": { + "zh_CN": "empty" + }, + "description": { + "zh_CN": "当数据为空时自定义的内容" + } + }, + "append": { + "label": { + "zh_CN": "append" + }, + "description": { + "zh_CN": "插入至表格最后一行之后的内容， 如果需要对表格的内容进行无限滚动操作，可能需要用到这个 slot。 若表格有合计行，该 slot 会位于合计行之上。" + } + } + } + }, + "snippets": [ + { + "name": { + "zh_CN": "表格" + }, + "icon": "grid", + "screenshot": "", + "snippetName": "ElTable", + "schema": { + "props": { + "data": [ + { + "date": "2016-05-03", + "name": "Tom", + "address": "No. 189, Grove St, Los Angeles" + }, + { + "date": "2016-05-02", + "name": "Tom", + "address": "No. 189, Grove St, Los Angeles" + }, + { + "date": "2016-05-04", + "name": "Tom", + "address": "No. 189, Grove St, Los Angeles" + }, + { + "date": "2016-05-01", + "name": "Tom", + "address": "No. 189, Grove St, Los Angeles" + } + ], + "columns": [ + { + "type": "index" + }, + { + "label": "Date", + "prop": "date" + }, + { + "label": "Name", + "prop": "name" + }, + { + "label": "Address", + "prop": "address" + } + ] + } + } + } + ] +} diff --git a/packages/materials/src/ElementPlus/ElTableColumn.json b/packages/materials/src/ElementPlus/ElTableColumn.json new file mode 100644 index 0000000000..cf0256a826 --- /dev/null +++ b/packages/materials/src/ElementPlus/ElTableColumn.json @@ -0,0 +1,65 @@ +{ + "id": 1, + "version": "2.4.2", + "name": { + "zh_CN": "表单" + }, + "component": "ElTableColumn", + "icon": "table", + "description": "用于展示多条结构类似的数据， 可对数据进行排序、筛选、对比或其他自定义操作", + "doc_url": "", + "screenshot": "", + "tags": "", + "keywords": "", + "dev_mode": "proCode", + "npm": { + "package": "element-plus", + "exportName": "ElTableColumn", + "destructuring": true + }, + "group": "表单组件", + "category": "element-plus", + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "isPopper": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["inline", "label-width"] + }, + "contextMenu": { + "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "disable": [] + }, + "invalidity": [""], + "clickCapture": true, + "framework": "Vue" + }, + "schema": { + "properties": [ + { + "name": "0", + "label": { + "zh_CN": "基础属性" + }, + "content": [], + "description": { + "zh_CN": "" + } + } + ], + "events": {}, + "slots": {} + } +} diff --git a/packages/materials/src/ElementPlus/meta.json b/packages/materials/src/ElementPlus/meta.json index 18e9ce48ef..cdabd2b7d5 100644 --- a/packages/materials/src/ElementPlus/meta.json +++ b/packages/materials/src/ElementPlus/meta.json @@ -5,5 +5,13 @@ "version": "2.4.2", "script": "https://unpkg.com/element-plus@2.4.2/dist/index.full.mjs", "css": "https://unpkg.com/element-plus@2.4.2/dist/index.css" - } + }, + "snippets": [ + { + "group": "element-plus", + "label": { + "zh_CN": "Element Plus组件" + } + } + ] } From 3f756ecd8ba226fc2d64ba86a083eadb06f103f2 Mon Sep 17 00:00:00 2001 From: chilingling Date: Wed, 5 Feb 2025 23:59:52 -0800 Subject: [PATCH 07/11] feat: add tiny-vue material --- .../materials/src/TinyVue/TinyBreadcrumb.json | 166 +++ .../src/TinyVue/TinyBreadcrumbItem.json | 86 ++ .../materials/src/TinyVue/TinyButton.json | 48 +- .../src/TinyVue/TinyButtonGroup.json | 185 ++++ .../materials/src/TinyVue/TinyCarousel.json | 373 +++++++ .../src/TinyVue/TinyCarouselItem.json | 130 +++ .../materials/src/TinyVue/TinyCheckbox.json | 273 +++++ .../src/TinyVue/TinyCheckboxButton.json | 185 ++++ .../src/TinyVue/TinyCheckboxGroup.json | 238 +++++ packages/materials/src/TinyVue/TinyCol.json | 275 +++++ .../materials/src/TinyVue/TinyCollapse.json | 179 ++++ .../src/TinyVue/TinyCollapseItem.json | 108 ++ .../materials/src/TinyVue/TinyDatePicker.json | 430 ++++++++ .../materials/src/TinyVue/TinyDialogBox.json | 299 ++++++ packages/materials/src/TinyVue/TinyForm.json | 425 ++++++++ .../materials/src/TinyVue/TinyFormItem.json | 129 +++ packages/materials/src/TinyVue/TinyGrid.json | 972 ++++++++++++++++++ packages/materials/src/TinyVue/TinyInput.json | 50 +- .../materials/src/TinyVue/TinyLayout.json | 185 ++++ .../materials/src/TinyVue/TinyNumeric.json | 460 +++++++++ packages/materials/src/TinyVue/TinyPager.json | 250 +++++ .../materials/src/TinyVue/TinyPopeditor.json | 440 ++++++++ .../materials/src/TinyVue/TinyPopover.json | 542 ++++++++++ packages/materials/src/TinyVue/TinyRadio.json | 252 +++++ packages/materials/src/TinyVue/TinyRow.json | 147 +++ .../materials/src/TinyVue/TinySearch.json | 290 ++++++ .../materials/src/TinyVue/TinySelect.json | 430 ++++++++ .../materials/src/TinyVue/TinySwitch.json | 213 ++++ .../materials/src/TinyVue/TinyTabItem.json | 106 ++ packages/materials/src/TinyVue/TinyTabs.json | 328 ++++++ .../materials/src/TinyVue/TinyTimeLine.json | 232 +++++ .../materials/src/TinyVue/TinyTooltip.json | 268 +++++ packages/materials/src/TinyVue/TinyTree.json | 384 +++++++ packages/materials/src/TinyVue/meta.json | 40 +- 34 files changed, 9064 insertions(+), 54 deletions(-) create mode 100644 packages/materials/src/TinyVue/TinyBreadcrumb.json create mode 100644 packages/materials/src/TinyVue/TinyBreadcrumbItem.json create mode 100644 packages/materials/src/TinyVue/TinyButtonGroup.json create mode 100644 packages/materials/src/TinyVue/TinyCarousel.json create mode 100644 packages/materials/src/TinyVue/TinyCarouselItem.json create mode 100644 packages/materials/src/TinyVue/TinyCheckbox.json create mode 100644 packages/materials/src/TinyVue/TinyCheckboxButton.json create mode 100644 packages/materials/src/TinyVue/TinyCheckboxGroup.json create mode 100644 packages/materials/src/TinyVue/TinyCol.json create mode 100644 packages/materials/src/TinyVue/TinyCollapse.json create mode 100644 packages/materials/src/TinyVue/TinyCollapseItem.json create mode 100644 packages/materials/src/TinyVue/TinyDatePicker.json create mode 100644 packages/materials/src/TinyVue/TinyDialogBox.json create mode 100644 packages/materials/src/TinyVue/TinyForm.json create mode 100644 packages/materials/src/TinyVue/TinyFormItem.json create mode 100644 packages/materials/src/TinyVue/TinyGrid.json create mode 100644 packages/materials/src/TinyVue/TinyLayout.json create mode 100644 packages/materials/src/TinyVue/TinyNumeric.json create mode 100644 packages/materials/src/TinyVue/TinyPager.json create mode 100644 packages/materials/src/TinyVue/TinyPopeditor.json create mode 100644 packages/materials/src/TinyVue/TinyPopover.json create mode 100644 packages/materials/src/TinyVue/TinyRadio.json create mode 100644 packages/materials/src/TinyVue/TinyRow.json create mode 100644 packages/materials/src/TinyVue/TinySearch.json create mode 100644 packages/materials/src/TinyVue/TinySelect.json create mode 100644 packages/materials/src/TinyVue/TinySwitch.json create mode 100644 packages/materials/src/TinyVue/TinyTabItem.json create mode 100644 packages/materials/src/TinyVue/TinyTabs.json create mode 100644 packages/materials/src/TinyVue/TinyTimeLine.json create mode 100644 packages/materials/src/TinyVue/TinyTooltip.json create mode 100644 packages/materials/src/TinyVue/TinyTree.json diff --git a/packages/materials/src/TinyVue/TinyBreadcrumb.json b/packages/materials/src/TinyVue/TinyBreadcrumb.json new file mode 100644 index 0000000000..3b8470a7ac --- /dev/null +++ b/packages/materials/src/TinyVue/TinyBreadcrumb.json @@ -0,0 +1,166 @@ +{ + "icon": "breadcrumb", + "name": { + "zh_CN": "面包屑" + }, + "component": "TinyBreadcrumb", + "description": "告诉访问者他们目前在网站中的位置以及如何返回", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Breadcrumb", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "separator", + "label": { + "text": { + "zh_CN": "分隔符" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "自定义分隔符" + }, + "labelPosition": "left" + }, + { + "property": "options", + "label": { + "text": { + "zh_CN": "配置数据" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "单独使用 Breadcrumb，通过 option 配置生成面包屑" + }, + "labelPosition": "top" + }, + { + "property": "textField", + "label": { + "text": { + "zh_CN": "键值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "指定面包屑的显示键值，结合 options 使用" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onSelect": { + "label": { + "zh_CN": "选择 breadcrumb 时触发" + }, + "description": { + "zh_CN": "选择 breadcrumb 时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "clickCapture": false, + "isModal": false, + "nestingRule": { + "childWhitelist": ["TinyBreadcrumbItem"], + "parentWhitelist": [], + "descendantBlacklist": [], + "ancestorWhitelist": [] + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["separator"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "面包屑" + }, + "icon": "breadcrumb", + "screenshot": "", + "snippetName": "TinyBreadcrumb", + "schema": { + "componentName": "TinyBreadcrumb", + "props": { + "options": [ + { + "to": "{ path: '/' }", + "label": "首页" + }, + { + "to": "{ path: '/breadcrumb' }", + "label": "产品" + }, + { + "replace": "true", + "label": "软件" + } + ] + } + } + } + ], + "category": "navigation" +} diff --git a/packages/materials/src/TinyVue/TinyBreadcrumbItem.json b/packages/materials/src/TinyVue/TinyBreadcrumbItem.json new file mode 100644 index 0000000000..b0ae0d5878 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyBreadcrumbItem.json @@ -0,0 +1,86 @@ +{ + "icon": "breadcrumb", + "name": { + "zh_CN": "面包屑项" + }, + "component": "TinyBreadcrumbItem", + "description": "", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "BreadcrumbItem", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "to", + "label": { + "text": { + "zh_CN": "路由跳转" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "路由跳转对象，同 vue-router 的 to" + } + } + ] + } + ], + "slots": { + "default": { + "label": { + "zh_CN": "面包屑项标签" + }, + "description": { + "zh_CN": "面包屑项" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": ["TinyBreadcrumb"], + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["to"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyButton.json b/packages/materials/src/TinyVue/TinyButton.json index 829e3848dd..68f13d1c45 100644 --- a/packages/materials/src/TinyVue/TinyButton.json +++ b/packages/materials/src/TinyVue/TinyButton.json @@ -13,7 +13,6 @@ "npm": { "package": "@opentiny/vue", "exportName": "Button", - "version": "3.14", "destructuring": true }, "group": "component", @@ -27,12 +26,6 @@ "description": { "zh_CN": "基础信息" }, - "collapse": { - "number": 6, - "text": { - "zh_CN": "显示更多" - } - }, "content": [ { "property": "text", @@ -49,12 +42,13 @@ "readOnly": false, "disabled": false, "widget": { - "component": "MetaBindI18n", + "component": "I18nConfigurator", "props": {} }, "description": { - "zh_CN": "" - } + "zh_CN": "按钮文字" + }, + "labelPosition": "left" }, { "property": "size", @@ -71,7 +65,7 @@ "readOnly": false, "disabled": false, "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -94,8 +88,9 @@ } }, "description": { - "zh_CN": "" - } + "zh_CN": "按钮大小" + }, + "labelPosition": "left" }, { "property": "disabled", @@ -109,7 +104,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -129,7 +124,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -184,7 +179,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -204,7 +199,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -224,18 +219,19 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaNumber", + "component": "NumberConfigurator", "props": {} }, "description": { "zh_CN": "设置禁用时间，防止重复提交，单位毫秒" - } + }, + "labelPosition": "left" }, { "property": "circle", "label": { "text": { - "zh_CN": "圆角" + "zh_CN": "圆形按钮" } }, "required": true, @@ -243,7 +239,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -255,7 +251,7 @@ "property": "autofocus", "label": { "text": { - "zh_CN": "聚焦" + "zh_CN": "自动聚焦" } }, "required": true, @@ -263,7 +259,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -275,7 +271,7 @@ "property": "loading", "label": { "text": { - "zh_CN": "加载中" + "zh_CN": "加载中样式" } }, "required": true, @@ -283,7 +279,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -353,5 +349,5 @@ } } ], - "category": "general" + "category": "basic" } diff --git a/packages/materials/src/TinyVue/TinyButtonGroup.json b/packages/materials/src/TinyVue/TinyButtonGroup.json new file mode 100644 index 0000000000..a8de602300 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyButtonGroup.json @@ -0,0 +1,185 @@ +{ + "name": { + "zh_CN": "按钮组" + }, + "component": "TinyButtonGroup", + "icon": "buttonGroup", + "description": "以按钮组的方式出现，常用于多项类似操作", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "ButtonGroup", + "destructuring": true + }, + "group": "component", + "category": "basic", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "data", + "label": { + "text": { + "zh_CN": "数据" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "配置按钮组数据" + } + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "大小" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "mini", + "value": "mini" + }, + { + "label": "small", + "value": "small" + }, + { + "label": "medium", + "value": "medium" + } + ] + } + }, + "description": { + "zh_CN": "组件大小" + }, + "labelPosition": "left" + }, + { + "property": "plain", + "label": { + "text": { + "zh_CN": "朴素按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否是朴素按钮" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "互斥按钮组" + }, + "icon": "buttons", + "snippetName": "TinyButtonGroup", + "screenshot": "", + "schema": { + "componentName": "TinyButtonGroup", + "props": { + "data": [ + { + "text": "Button1", + "value": "1" + }, + { + "text": "Button2", + "value": "2" + }, + { + "text": "Button3", + "value": "3" + } + ], + "modelValue": "1" + } + } + } + ] +} diff --git a/packages/materials/src/TinyVue/TinyCarousel.json b/packages/materials/src/TinyVue/TinyCarousel.json new file mode 100644 index 0000000000..422ca864b9 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCarousel.json @@ -0,0 +1,373 @@ +{ + "name": { + "zh_CN": "走马灯" + }, + "component": "TinyCarousel", + "icon": "carousel", + "description": "常用于一组图片或卡片轮播，当内容空间不足时，可以用走马灯的形式进行收纳，进行轮播展现。", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Carousel", + "destructuring": true + }, + "group": "component", + "category": "data-display", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "arrow", + "label": { + "text": { + "zh_CN": "箭头显示时机" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "options": [ + { + "label": "总是显示", + "value": "always" + }, + { + "label": "鼠标悬停时显示", + "value": "hover" + }, + { + "label": "从不显示", + "value": "never" + } + ] + } + }, + "description": { + "zh_CN": "切换箭头的显示时机" + } + }, + { + "property": "autoplay", + "label": { + "text": { + "zh_CN": "自动切换" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否自动切换" + }, + "labelPosition": "left" + }, + { + "property": "tabs", + "label": { + "text": { + "zh_CN": "选项卡" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "defaultValue": "", + "cols": 12, + "bindState": false, + "widget": { + "component": "ContainerConfigurator", + "props": {} + }, + "description": { + "zh_CN": "tabs 选项卡" + }, + "labelPosition": "none" + }, + { + "property": "height", + "label": { + "text": { + "zh_CN": "高度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "走马灯的高度" + } + }, + { + "property": "indicator-position", + "label": { + "text": { + "zh_CN": "位置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "options": [ + { + "label": "走马灯外部", + "value": "outside" + }, + { + "label": "不显示", + "value": "none" + } + ] + } + }, + "description": { + "zh_CN": "指示器的位置" + } + }, + { + "property": "initial-index", + "label": { + "text": { + "zh_CN": "初始索引" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "初始状态激活的幻灯片的索引，从 0 开始 " + } + }, + { + "property": "interval", + "label": { + "text": { + "zh_CN": "自动切换间隔" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "自动切换的时间间隔，单位为毫秒" + } + }, + { + "property": "loop", + "label": { + "text": { + "zh_CN": "循环显示" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否循环显示" + }, + "labelPosition": "left" + }, + { + "property": "show-title", + "label": { + "text": { + "zh_CN": "显示标题" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示标题" + }, + "labelPosition": "left" + }, + { + "property": "trigger", + "label": { + "text": { + "zh_CN": "触发方式" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "options": [ + { + "label": "点击", + "value": "click" + }, + { + "label": "悬停", + "value": "hover" + } + ] + } + }, + "description": { + "zh_CN": "指示器的触发方式，默认为 hover" + } + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "options": [ + { + "label": "水平", + "value": "horizontal" + }, + { + "label": "垂直", + "value": "vertical" + }, + { + "label": "卡片", + "value": "card" + } + ] + } + }, + "description": { + "zh_CN": "走马灯的类型" + } + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "clickCapture": false, + "isModal": false, + "nestingRule": { + "childWhitelist": ["TinyCarouselItem"], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "走马灯" + }, + "screenshot": "", + "snippetName": "tiny-carousel", + "icon": "carousel", + "schema": { + "componentName": "TinyCarousel", + "props": { + "height": "180px" + }, + "children": [ + { + "componentName": "TinyCarouselItem", + "props": { + "title": "carousel-item-a" + }, + "children": [ + { + "componentName": "div", + "props": { + "style": "margin:10px 0 0 30px" + } + } + ] + }, + { + "componentName": "TinyCarouselItem", + "props": { + "title": "carousel-item-b" + }, + "children": [ + { + "componentName": "div", + "props": { + "style": "margin:10px 0 0 30px" + } + } + ] + } + ] + } + } + ] +} diff --git a/packages/materials/src/TinyVue/TinyCarouselItem.json b/packages/materials/src/TinyVue/TinyCarouselItem.json new file mode 100644 index 0000000000..32ad655cbe --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCarouselItem.json @@ -0,0 +1,130 @@ +{ + "name": { + "zh_CN": "走马灯子项" + }, + "component": "TinyCarouselItem", + "icon": "carouselitem", + "description": "常用于一组图片或卡片轮播，当内容空间不足时，可以用走马灯的形式进行收纳，进行轮播展现。", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "CarouselItem", + "destructuring": true + }, + "group": "component", + "category": "容器组件", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "name", + "label": { + "text": { + "zh_CN": "名称" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "幻灯片的名字，可用作 setActiveItem 的参数" + }, + "labelPosition": "left" + }, + { + "property": "title", + "label": { + "text": { + "zh_CN": "标题" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "幻灯片的标题" + }, + "labelPosition": "left" + }, + { + "property": "indicator-position", + "label": { + "text": { + "zh_CN": "指示器位置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "ButtonGroupConfigurator", + "props": { + "options": [ + { + "label": "outside", + "value": "outside" + }, + { + "label": "none", + "value": "none" + } + ] + } + }, + "description": { + "zh_CN": "指示器的位置" + }, + "labelPosition": "left" + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyCheckbox.json b/packages/materials/src/TinyVue/TinyCheckbox.json new file mode 100644 index 0000000000..05e56ac6be --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCheckbox.json @@ -0,0 +1,273 @@ +{ + "icon": "checkbox", + "name": { + "zh_CN": "复选框" + }, + "component": "TinyCheckbox", + "description": "用于配置不同场景的选项，提供用户可在一组选项中进行多选", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Checkbox", + "destructuring": true + }, + "group": "component", + "priority": 4, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定值" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "checked", + "label": { + "text": { + "zh_CN": "勾选" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "当前是否勾选" + }, + "labelPosition": "left" + }, + { + "property": "text", + "label": { + "text": { + "zh_CN": "文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "复选框的文本" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "border", + "label": { + "text": { + "zh_CN": "边框" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示边框" + }, + "labelPosition": "left" + }, + { + "property": "false-label", + "label": { + "text": { + "zh_CN": "未选中的值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "没有选中时的值" + }, + "labelPosition": "left" + }, + { + "property": "true-label", + "label": { + "text": { + "zh_CN": "选择时的值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "选中时的值" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "勾选值改变后将触发" + }, + "description": { + "zh_CN": "勾选值改变后将触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "选中项的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前选中的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的当前选中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["border", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "复选框" + }, + "icon": "checkbox", + "screenshot": "", + "snippetName": "TinyCheckbox", + "schema": { + "componentName": "TinyCheckbox", + "props": { + "text": "复选框文案" + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyCheckboxButton.json b/packages/materials/src/TinyVue/TinyCheckboxButton.json new file mode 100644 index 0000000000..877ad19761 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCheckboxButton.json @@ -0,0 +1,185 @@ +{ + "icon": "checkboxbutton", + "name": { + "zh_CN": "复选按钮" + }, + "component": "TinyCheckboxButton", + "description": "用于配置不同场景的选项，提供用户可在一组选项中进行多选", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "CheckboxButton", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定的当前选中值" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "checked", + "label": { + "text": { + "zh_CN": "勾选" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "当前是否勾选" + }, + "labelPosition": "left" + }, + { + "property": "text", + "label": { + "text": { + "zh_CN": "文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "按钮文本" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "勾选值改变后将触发" + }, + "description": { + "zh_CN": "勾选值改变后将触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "选中项的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前选中的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "array", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的当前选中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["text", "size"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyCheckboxGroup.json b/packages/materials/src/TinyVue/TinyCheckboxGroup.json new file mode 100644 index 0000000000..d416f059de --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCheckboxGroup.json @@ -0,0 +1,238 @@ +{ + "icon": "checkboxgroup", + "name": { + "zh_CN": "复选按钮组" + }, + "component": "TinyCheckboxGroup", + "description": "用于配置不同场景的选项，提供用户可在一组选项中进行多选", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "CheckboxGroup", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "dataType": "Array" + } + }, + "description": { + "zh_CN": "双向绑定的当前选中值" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "options", + "label": { + "text": { + "zh_CN": "选项列表" + } + }, + "defaultValue": [ + { + "label": "标签2" + }, + { + "label": "标签2" + } + ], + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "checkbox组件列表" + }, + "labelPosition": "top" + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "ButtonGroupConfigurator", + "props": { + "options": [ + { + "label": "button", + "value": "button" + }, + { + "label": "checkbox", + "value": "checkbox" + } + ] + } + }, + "description": { + "zh_CN": "checkbox组件类型（button/checkbox），该属性的默认值为 checkbox,配合 options 属性一起使用" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "勾选值改变后将触发" + }, + "description": { + "zh_CN": "勾选值改变后将触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "选中项的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前选中的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "array", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的当前选中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "type"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "复选框组" + }, + "icon": "checkboxs", + "screenshot": "", + "snippetName": "TinyCheckboxGroup", + "schema": { + "componentName": "TinyCheckboxGroup", + "props": { + "modelValue": ["name1", "name2"], + "type": "checkbox", + "options": [ + { + "text": "复选框1", + "label": "name1" + }, + { + "text": "复选框2", + "label": "name2" + }, + { + "text": "复选框3", + "label": "name3" + } + ] + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyCol.json b/packages/materials/src/TinyVue/TinyCol.json new file mode 100644 index 0000000000..0d9333b2c1 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCol.json @@ -0,0 +1,275 @@ +{ + "icon": "col", + "name": { + "zh_CN": "col" + }, + "component": "TinyCol", + "description": "列配置信息", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Col", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "span", + "label": { + "text": { + "zh_CN": "栅格列格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "整行", + "value": 12 + }, + { + "label": "6格", + "value": 6 + }, + { + "label": "4格", + "value": 4 + }, + { + "label": "3格", + "value": 3 + }, + { + "label": "1格", + "value": 1 + } + ] + } + }, + "description": { + "zh_CN": "当一行分为12格时，一列可占位多少格" + } + }, + { + "property": "move", + "label": { + "text": { + "zh_CN": "栅格移动格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": -12, + "max": 12 + } + }, + "description": { + "zh_CN": "栅格左右移动格数（正数向右，负数向左）" + } + }, + { + "property": "no", + "label": { + "text": { + "zh_CN": "排序编号" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "max": 12 + } + }, + "description": { + "zh_CN": "排序编号（row中启用order生效）" + } + }, + { + "property": "offset", + "label": { + "text": { + "zh_CN": "间隔格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": 0, + "max": 12 + } + }, + "description": { + "zh_CN": "栅格左侧的间隔格数" + } + }, + { + "property": "xs", + "label": { + "text": { + "zh_CN": "超小屏格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": 1, + "max": 12 + } + }, + "description": { + "zh_CN": "<768px 响应式栅格数" + } + }, + { + "property": "sm", + "label": { + "text": { + "zh_CN": "小屏格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": 1, + "max": 12 + } + }, + "description": { + "zh_CN": "≥768px 响应式栅格数" + } + }, + { + "property": "md", + "label": { + "text": { + "zh_CN": "中屏格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": 1, + "max": 12 + } + }, + "description": { + "zh_CN": "≥992px 响应式栅格数" + } + }, + { + "property": "lg", + "label": { + "text": { + "zh_CN": "大屏格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": 1, + "max": 12 + } + }, + "description": { + "zh_CN": "≥1200px 响应式栅格数" + } + }, + { + "property": "xl", + "label": { + "text": { + "zh_CN": "超大屏格数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "min": 1, + "max": 12 + } + }, + "description": { + "zh_CN": "≥1920px 响应式栅格数" + } + } + ] + } + ], + "events": {} + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["label", "rules"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyCollapse.json b/packages/materials/src/TinyVue/TinyCollapse.json new file mode 100644 index 0000000000..7bfddf45ad --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCollapse.json @@ -0,0 +1,179 @@ +{ + "icon": "collapse", + "name": { + "zh_CN": "折叠面板" + }, + "component": "TinyCollapse", + "description": "内容区可指定动态页面或自定义 html 等，支持展开收起操作", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Collapse", + "destructuring": true + }, + "group": "component", + "priority": 3, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "当前激活面板" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定当前激活的面板" + } + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "激活面板改变时触发" + }, + "description": { + "zh_CN": "当前激活面板改变时触发(如果是手风琴模式，参数 activeNames 类型为string，否则为array)" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "data", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "当前激活面板的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前激活面板的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["label-width", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "折叠面板" + }, + "screenshot": "", + "snippetName": "TinyCollapse", + "icon": "collapse", + "schema": { + "componentName": "TinyCollapse", + "props": { + "modelValue": "collapse1" + }, + "children": [ + { + "componentName": "TinyCollapseItem", + "props": { + "name": "collapse1", + "title": "折叠项1" + }, + "children": [ + { + "componentName": "div" + } + ] + }, + { + "componentName": "TinyCollapseItem", + "props": { + "name": "collapse2", + "title": "折叠项2" + }, + "children": [ + { + "componentName": "div" + } + ] + }, + { + "componentName": "TinyCollapseItem", + "props": { + "name": "collapse3", + "title": "折叠项3" + }, + "children": [ + { + "componentName": "div" + } + ] + } + ] + } + } + ], + "category": "data-display" +} diff --git a/packages/materials/src/TinyVue/TinyCollapseItem.json b/packages/materials/src/TinyVue/TinyCollapseItem.json new file mode 100644 index 0000000000..965c147a72 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyCollapseItem.json @@ -0,0 +1,108 @@ +{ + "icon": "collapseitem", + "name": { + "zh_CN": "折叠面板项" + }, + "component": "TinyCollapseItem", + "description": "内容区可指定动态页面或自定义 html 等，支持展开收起操作", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "CollapseItem", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "name", + "label": { + "text": { + "zh_CN": "唯一标识符" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "唯一标识符： String | Number" + }, + "labelPosition": "left" + }, + { + "property": "title", + "label": { + "text": { + "zh_CN": "标题" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "面板标题" + }, + "labelPosition": "left" + } + ] + } + ], + "events": {}, + "slots": { + "title": { + "label": { + "zh_CN": "标题" + }, + "description": { + "zh_CN": "自定义标题" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["label-width", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyDatePicker.json b/packages/materials/src/TinyVue/TinyDatePicker.json new file mode 100644 index 0000000000..c6b9a8ddda --- /dev/null +++ b/packages/materials/src/TinyVue/TinyDatePicker.json @@ -0,0 +1,430 @@ +{ + "name": { + "zh_CN": "日期选择" + }, + "component": "TinyDatePicker", + "icon": "datepick", + "description": "用于输入或选择日期", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "DatePicker", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "I18nConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定值" + }, + "labelPosition": "left" + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "类型" + } + }, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "日期", + "value": "date" + }, + { + "label": "日期时间", + "value": "datetime" + }, + { + "label": "周", + "value": "week" + }, + { + "label": "月份", + "value": "month" + }, + { + "label": "年份", + "value": "year" + } + ] + } + }, + "description": { + "zh_CN": "设置日期框的type属性" + }, + "labelPosition": "left" + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "I18nConfigurator", + "props": {} + }, + "description": { + "zh_CN": "输入框占位文本" + }, + "labelPosition": "left" + }, + { + "property": "clearable", + "label": { + "text": { + "zh_CN": "清除按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示清除按钮" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "readonly", + "label": { + "text": { + "zh_CN": "只读" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否只读" + }, + "labelPosition": "left" + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "尺寸" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "medium", + "value": "medium" + }, + { + "label": "small", + "value": "small" + }, + { + "label": "mini", + "value": "mini" + } + ] + } + }, + "description": { + "zh_CN": "日期框尺寸。该属性的可选值为 medium / small / mini" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "maxlength", + "label": { + "text": { + "zh_CN": "输入最大长度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置 input 框的maxLength" + } + }, + { + "property": "autofocus", + "label": { + "text": { + "zh_CN": "聚焦" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "自动获取焦点" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "值改变时触发" + }, + "description": { + "zh_CN": "在 Input 值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框改变后的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onInput": { + "label": { + "zh_CN": "输入值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框输入的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onBlur": { + "label": { + "zh_CN": "失去焦点时触发" + }, + "description": { + "zh_CN": "在 Input 失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onFocus": { + "label": { + "zh_CN": "获取焦点时触发" + }, + "description": { + "zh_CN": "在 Input 获取焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClear": { + "label": { + "zh_CN": "点击清空按钮时触发" + }, + "description": { + "zh_CN": "点击清空按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["value", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "日期选择" + }, + "icon": "datepick", + "screenshot": "", + "snippetName": "TinyDatePicker", + "schema": { + "componentName": "TinyDatePicker", + "props": { + "placeholder": "请输入", + "modelValue": "" + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyDialogBox.json b/packages/materials/src/TinyVue/TinyDialogBox.json new file mode 100644 index 0000000000..e373142ee7 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyDialogBox.json @@ -0,0 +1,299 @@ +{ + "icon": "dialogbox", + "name": { + "zh_CN": "对话框" + }, + "component": "TinyDialogBox", + "description": "模态对话框，在浮层中显示，引导用户进行相关操作。", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "DialogBox", + "destructuring": true + }, + "group": "component", + "priority": 4, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "title", + "label": { + "text": { + "zh_CN": "标题" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "弹出框标题" + }, + "labelPosition": "left" + }, + { + "property": "visible", + "label": { + "text": { + "zh_CN": "显示与隐藏" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "控制弹出框显示与关闭" + }, + "labelPosition": "left" + }, + { + "property": "width", + "label": { + "text": { + "zh_CN": "宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "弹出框的宽度" + }, + "labelPosition": "left" + }, + { + "property": "draggable", + "label": { + "text": { + "zh_CN": "可拖拽" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否开启弹窗的拖拽功能，默认值为 false 。" + }, + "labelPosition": "left" + }, + { + "property": "center", + "label": { + "text": { + "zh_CN": "居中" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "弹出框的头部与底部内容会自动居中" + }, + "labelPosition": "left" + }, + { + "property": "dialog-class", + "label": { + "text": { + "zh_CN": "自定义类名" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "自定义配置弹窗类名" + }, + "labelPosition": "left" + }, + { + "property": "append-to-body", + "label": { + "text": { + "zh_CN": "插入到Body" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "DialogBox 本身是否插入到 body 上，嵌套的 Dialog 必须指定该属性并赋值为 true" + }, + "labelPosition": "left" + }, + { + "property": "show-close", + "label": { + "text": { + "zh_CN": "关闭按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示关闭按钮，默认值为 true 。" + }, + "labelPosition": "left" + } + ] + } + ], + "selector": ".TinyDialogBox", + "events": { + "onClose": { + "label": { + "zh_CN": "关闭弹窗时触发" + }, + "description": { + "zh_CN": "Dialog 关闭的回调" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:visible": { + "label": { + "zh_CN": "双向绑定的状态改变时触发" + }, + "description": { + "zh_CN": "显示或隐藏的状态值，发生改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "boolean", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的显示或隐藏的状态值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + }, + "slots": { + "title": { + "label": { + "zh_CN": "标题区" + }, + "description": { + "zh_CN": "Dialog 标题区的内容" + } + }, + "footer": { + "label": { + "zh_CN": "按钮操作区" + }, + "description": { + "zh_CN": "Dialog 按钮操作区的内容" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": true, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": ".tiny-dialog-box", + "shortcuts": { + "properties": ["visible", "width"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "对话框" + }, + "screenshot": "", + "snippetName": "TinyDialogBox", + "icon": "dialogbox", + "schema": { + "componentName": "TinyDialogBox", + "props": { + "visible": true, + "show-close": true, + "title": "dialogBox title" + }, + "children": [ + { + "componentName": "div" + } + ] + } + } + ], + "category": "data-display" +} diff --git a/packages/materials/src/TinyVue/TinyForm.json b/packages/materials/src/TinyVue/TinyForm.json new file mode 100644 index 0000000000..3c43e44bf4 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyForm.json @@ -0,0 +1,425 @@ +{ + "icon": "form", + "name": { + "zh_CN": "表单" + }, + "component": "TinyForm", + "description": "由按钮、输入框、选择器、单选框、多选框等控件组成，用以收集、校验、提交数据", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Form", + "destructuring": true + }, + "group": "component", + "priority": 5, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "label-width", + "label": { + "text": { + "zh_CN": "标签宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表单中标签占位宽度，默认为 80px" + }, + "labelPosition": "left" + }, + { + "property": "inline", + "label": { + "text": { + "zh_CN": "行内布局" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "行内布局模式，默认为 false" + }, + "labelPosition": "left" + }, + { + "property": "label-align", + "label": { + "text": { + "zh_CN": "必填标识占位" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "必填标识 * 是否占位" + }, + "labelPosition": "left" + }, + { + "property": "label-suffix", + "label": { + "text": { + "zh_CN": "标签后缀" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表单中标签后缀" + }, + "labelPosition": "left" + }, + { + "property": "label-position", + "label": { + "text": { + "zh_CN": "标签位置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "right", + "value": "right" + }, + { + "label": "left ", + "value": "left " + }, + { + "label": "top", + "value": "top" + } + ] + } + }, + "description": { + "zh_CN": "表单中标签的布局位置" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "校验属性" + }, + "content": [ + { + "property": "model", + "label": { + "text": { + "zh_CN": "数据对象" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表单数据对象" + }, + "labelPosition": "top" + }, + { + "property": "rules", + "label": { + "text": { + "zh_CN": "校验规则" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表单验证规则" + }, + "labelPosition": "top" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onValidate": { + "label": { + "zh_CN": "表单项被校验后触发" + }, + "description": { + "zh_CN": "表单项被校验后触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "function", + "type": "Function", + "defaultValue": "(valid) => {}", + "description": { + "zh_CN": "校验回调函数" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onInput": { + "label": { + "zh_CN": "输入值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框输入的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onBlur": { + "label": { + "zh_CN": "失去焦点时触发" + }, + "description": { + "zh_CN": "在 Input 失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onFocus": { + "label": { + "zh_CN": "获取焦点时触发" + }, + "description": { + "zh_CN": "在 Input 获取焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClear": { + "label": { + "zh_CN": "点击清空按钮时触发" + }, + "description": { + "zh_CN": "点击清空按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["label-width", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "表单" + }, + "screenshot": "", + "snippetName": "tiny-form", + "icon": "form", + "schema": { + "componentName": "TinyForm", + "props": { + "labelWidth": "80px", + "labelPosition": "top" + }, + "children": [ + { + "componentName": "TinyFormItem", + "props": { + "label": "人员" + }, + "children": [ + { + "componentName": "TinyInput", + "props": { + "placeholder": "请输入", + "modelValue": "" + } + } + ] + }, + { + "componentName": "TinyFormItem", + "props": { + "label": "密码" + }, + "children": [ + { + "componentName": "TinyInput", + "props": { + "placeholder": "请输入", + "modelValue": "", + "type": "password" + } + } + ] + }, + { + "componentName": "TinyFormItem", + "props": { + "label": "" + }, + "children": [ + { + "componentName": "TinyButton", + "props": { + "text": "提交", + "type": "primary", + "style": "margin-right: 10px" + } + }, + { + "componentName": "TinyButton", + "props": { + "text": "重置", + "type": "primary" + } + } + ] + } + ] + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyFormItem.json b/packages/materials/src/TinyVue/TinyFormItem.json new file mode 100644 index 0000000000..58605fb052 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyFormItem.json @@ -0,0 +1,129 @@ +{ + "icon": "formitem", + "name": { + "zh_CN": "表单项" + }, + "component": "TinyFormItem", + "description": "由按钮、输入框、选择器、单选框、多选框等控件组成，用以收集、校验、提交数据", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "FormItem", + "destructuring": true + }, + "group": "component", + "priority": 12, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "label", + "label": { + "text": { + "zh_CN": "标签文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "defaultValue": "标签", + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "标签文本" + }, + "labelPosition": "left" + }, + { + "property": "prop", + "label": { + "text": { + "zh_CN": "校验字段" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表单域 model 字段，在使用 validate、resetFields 方法的情况下，该属性是必填的" + }, + "labelPosition": "left" + }, + { + "property": "required", + "label": { + "text": { + "zh_CN": "必填" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否必填" + }, + "labelPosition": "left" + } + ] + } + ], + "events": {}, + "slots": { + "label": { + "label": { + "zh_CN": "字段名" + }, + "description": { + "zh_CN": "自定义显示字段名称" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": ["TinyForm"], + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["label", "rules"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyGrid.json b/packages/materials/src/TinyVue/TinyGrid.json new file mode 100644 index 0000000000..420e8e6b05 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyGrid.json @@ -0,0 +1,972 @@ +{ + "icon": "grid", + "name": { + "zh_CN": "表格" + }, + "component": "TinyGrid", + "description": "提供了非常强大数据表格功能，可以展示数据列表，可以对数据列表进行选择、编辑等", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Grid", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础属性" + }, + "description": { + "zh_CN": "基础属性" + }, + "content": [ + { + "property": "data", + "label": { + "text": { + "zh_CN": "表格数据" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "onChange": "this.delProp('fetchData')", + "description": { + "zh_CN": "设置表格的数据" + }, + "labelPosition": "top" + }, + { + "property": "columns", + "label": { + "text": { + "zh_CN": "表格列" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "properties": [ + { + "label": { + "zh_CN": "默认分组" + }, + "content": [ + { + "property": "title", + "type": "string", + "defaultValue": "", + "label": { + "text": { + "zh_CN": "列标题" + } + }, + "widget": { + "component": "I18nConfigurator", + "props": {} + } + }, + { + "property": "field", + "type": "string", + "defaultValue": "", + "label": { + "text": { + "zh_CN": "列键值" + } + }, + "widget": { + "component": "InputConfigurator", + "props": {} + } + }, + { + "property": "sortable", + "type": "boolean", + "defaultValue": true, + "label": { + "text": { + "zh_CN": "是否排序" + } + }, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "labelPosition": "left" + }, + { + "property": "width", + "type": "string", + "defaultValue": "", + "label": { + "text": { + "zh_CN": "列宽" + } + }, + "widget": { + "component": "NumberConfigurator", + "props": {} + } + }, + { + "property": "formatText", + "type": "string", + "defaultValue": "", + "label": { + "text": { + "zh_CN": "内置渲染器" + } + }, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "整数", + "value": "integer" + }, + { + "label": "小数", + "value": "number" + }, + { + "label": "金额", + "value": "money" + }, + { + "label": "百分比", + "value": "rate" + }, + { + "label": "布尔", + "value": "boole" + }, + { + "label": "年月日", + "value": "date" + }, + { + "label": "年月日时分", + "value": "dateTime" + }, + { + "label": "时间", + "value": "time" + }, + { + "label": "省略", + "value": "ellipsis" + } + ] + } + } + }, + { + "property": "renderer", + "type": "object", + "defaultValue": "", + "label": { + "text": { + "zh_CN": "渲染函数" + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "dataType": "JSFunction" + } + } + }, + { + "property": "slots", + "type": "object", + "defaultValue": "", + "label": { + "text": { + "zh_CN": "插槽" + } + }, + "labelPosition": "none", + "widget": { + "component": "JsSlotConfigurator", + "props": { + "slots": ["header", "default"] + } + } + }, + { + "property": "type", + "label": { + "text": { + "zh_CN": "列类型" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "索引列", + "value": "index" + }, + { + "label": "单选列", + "value": "radio" + }, + { + "label": "多选列", + "value": "selection" + }, + { + "label": "展开列", + "value": "expand" + } + ], + "clearable": true + } + }, + "description": { + "zh_CN": "设置内置列的类型，该属性的可选值为 index（序号）/ selection（复选框）/ radio（单选框）/ expand（展开行）" + }, + "labelPosition": "left" + }, + { + "property": "editor", + "label": { + "text": { + "zh_CN": "编辑配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "单元格编辑渲染配置项，也可以是函数 Function(h, params)" + } + }, + { + "property": "filter", + "label": { + "text": { + "zh_CN": "筛选配置" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "设置表格列的筛选配置信息。默认值为 false 不配置筛选信息" + } + }, + { + "property": "showOverflow", + "label": { + "text": { + "zh_CN": "内容超出部分省略号配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "只显示省略号", + "value": "ellipsis" + }, + { + "label": "显示为原生 title", + "value": "title" + }, + { + "label": "显示为 tooltip 提示", + "value": "tooltip" + } + ], + "clearable": true + } + }, + "description": { + "zh_CN": "设置内置列的内容超出部分显示省略号配置，该属性的可选值为 ellipsis（只显示省略号）/ title（显示为原生 title）/ tooltip（显示为 tooltip 提示）" + }, + "labelPosition": "top" + } + ] + } + ], + "widget": { + "component": "ArrayItemConfigurator", + "props": { + "type": "object", + "textField": "title", + "language": "json", + "buttonText": "编辑列配置", + "title": "编辑列配置", + "expand": true + } + }, + "description": { + "zh_CN": "表格列的配置信息" + }, + "labelPosition": "left" + }, + { + "property": "fetchData", + "label": { + "text": { + "zh_CN": "服务端查询" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "onChange": "function () { this.delProp('data') } ", + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "name": "fetchData", + "dataType": "JSExpression" + } + }, + "description": { + "zh_CN": "服务端数据查询方法" + }, + "labelPosition": "top" + }, + { + "property": "pager", + "label": { + "text": { + "zh_CN": "分页配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "defaultValue": { + "attrs": { + "currentPage": 1 + } + }, + "widget": { + "component": "CodeConfigurator", + "props": { + "name": "pager", + "dataType": "JSExpression" + } + }, + "description": { + "zh_CN": "分页配置，需结合fetchData使用" + }, + "labelPosition": "top" + }, + { + "property": "resizable", + "label": { + "text": { + "zh_CN": "调整列宽" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否允许调整列宽" + }, + "labelPosition": "left" + }, + { + "property": "row-id", + "label": { + "text": { + "zh_CN": "行数据主键" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "placeholder": "比如：id" + } + }, + "description": { + "zh_CN": "自定义行数据唯一主键的字段名（行数据必须要有唯一主键，默认自动生成）" + }, + "labelPosition": "left" + }, + { + "property": "select-config", + "label": { + "text": { + "zh_CN": "行复选框配置" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "dataType": "JSExpression" + } + }, + "description": { + "zh_CN": "表格行数据复选框配置项" + } + }, + { + "property": "edit-rules", + "label": { + "text": { + "zh_CN": "校验规则" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表格校验规则配置项" + }, + "labelPosition": "top" + }, + { + "property": "edit-config", + "label": { + "text": { + "zh_CN": "编辑配置项" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表格编辑配置项" + }, + "labelPosition": "top" + }, + { + "property": "expand-config", + "label": { + "text": { + "zh_CN": "展开行配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "展开行配置项" + }, + "labelPosition": "top" + }, + { + "property": "sortable", + "label": { + "text": { + "zh_CN": "可排序" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否允许列数据排序。默认为 true 可排序" + }, + "labelPosition": "left" + } + ] + }, + { + "label": { + "zh_CN": "其他" + }, + "description": { + "zh_CN": "其他属性" + }, + "content": [ + { + "property": "auto-resize", + "label": { + "text": { + "zh_CN": "响应式监听" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "表格属性设置 autoResize 属性开启响应式表格宽高的同时，将高度height设置为auto就可以自动跟随父容器高度。" + }, + "labelPosition": "left" + }, + { + "property": "border", + "label": { + "text": { + "zh_CN": "边框" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否带有纵向边框" + }, + "labelPosition": "left" + }, + { + "property": "seq-serial", + "label": { + "text": { + "zh_CN": "行号连续" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置行序号是否连续，开启分页时有效，该属性的默认值为 false" + }, + "labelPosition": "left" + }, + { + "property": "highlight-current-row", + "label": { + "text": { + "zh_CN": "高亮当前行" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "高亮当前行" + }, + "labelPosition": "left" + }, + { + "property": "highlight-hover-row", + "label": { + "text": { + "zh_CN": "移入行高亮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "鼠标移到行是否要高亮显示" + }, + "labelPosition": "left" + }, + { + "property": "row-class-name", + "label": { + "text": { + "zh_CN": "设置行高亮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "给行附加 className，也可以是函数 Function({seq, row, rowIndex, $rowIndex})" + }, + "labelPosition": "top" + }, + { + "property": "max-height", + "label": { + "text": { + "zh_CN": "内容最大高度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置表格内容区域（不含表格头部，底部）的最大高度。" + } + }, + { + "property": "row-span", + "label": { + "text": { + "zh_CN": "行合并" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置行合并,该属性仅适用于普通表格，不可与 tree-config 同时使用" + }, + "labelPosition": "top" + } + ] + } + ], + "events": { + "onFilterChange": { + "label": { + "zh_CN": "筛选条件改变时触发改事件" + }, + "description": { + "zh_CN": "配置 remote-filter 开启服务端过滤，服务端过滤会调用表格 fetch-data 进行查询，filter-change 服务端过滤后触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "table", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "{$table,filters} 包含 table 实例对象和过滤条件的对象" + } + } + ], + "returns": {} + }, + "defaultValue": "function onClick(e) {}" + }, + "onSortChange": { + "label": { + "zh_CN": "点击列头，执行数据排序前触发的事件" + }, + "description": { + "zh_CN": "配置 remote-filter 开启服务端过滤，服务端过滤会调用表格 fetch-data 进行查询，filter-change 服务端过滤后触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "table", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "{$table,filters} 包含 table 实例对象和过滤条件的对象" + } + } + ], + "returns": {} + }, + "defaultValue": "function onClick(e) {}" + }, + "onSelectAll": { + "label": { + "zh_CN": "当手动勾选全选时触发的事件" + }, + "description": { + "zh_CN": "只对 type=selection 有效，当手动勾选全选时触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "table", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": " 包含 table 实例对象" + } + }, + { + "name": "checked", + "type": "boolean", + "defaultValue": "", + "description": { + "zh_CN": "勾选状态" + } + }, + { + "name": "selction", + "type": "Array", + "defaultValue": "", + "description": { + "zh_CN": "选中的表格数据数组" + } + } + ], + "returns": {} + }, + "defaultValue": "function onClick(e) {}" + }, + "onSelectChange": { + "label": { + "zh_CN": "手动勾选并且值发生改变时触发的事件" + }, + "description": { + "zh_CN": "只对 type=selection 有效，当手动勾选并且值发生改变时触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "table", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": " table 实例对象" + } + }, + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": " 原生 Event" + } + } + ], + "returns": {} + }, + "defaultValue": "function onClick(e) {}" + }, + "onToggleExpandChange": { + "label": { + "zh_CN": "当行展开或收起时会触发该事件" + }, + "description": { + "zh_CN": "当行展开或收起时会触发该事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "table", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "{$table,row,rowIndex} 包含 table 实例对象和当前行数据的对象" + } + }, + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": " 原生 Event" + } + } + ], + "returns": {} + }, + "defaultValue": "function onClick(e) {}" + }, + "onCurrentChange": { + "label": { + "zh_CN": "行点击时触发" + }, + "description": { + "zh_CN": "行点击时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + }, + "shortcuts": { + "properties": ["sortable", "columns"] + }, + "contentMenu": { + "actions": ["create symbol"] + }, + "onBeforeMount": "console.log('table on load'); this.pager = source.pager; this.fetchData = source.fetchData; this.data = source.data ;this.columns = source.columns" + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["sortable", "columns"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "表格" + }, + "icon": "grid", + "screenshot": "", + "snippetName": "tinyGrid", + "schema": { + "componentName": "TinyGrid", + "props": { + "editConfig": { + "trigger": "click", + "mode": "cell", + "showStatus": true + }, + "columns": [ + { + "type": "index", + "width": 60 + }, + { + "type": "selection", + "width": 60 + }, + { + "field": "employees", + "title": "员工数" + }, + { + "field": "created_date", + "title": "创建日期" + }, + { + "field": "city", + "title": "城市" + } + ], + "data": [ + { + "id": "1", + "name": "GFD科技有限公司", + "city": "福州", + "employees": 800, + "created_date": "2014-04-30 00:56:00", + "boole": false + }, + { + "id": "2", + "name": "WWW科技有限公司", + "city": "深圳", + "employees": 300, + "created_date": "2016-07-08 12:36:22", + "boole": true + } + ] + } + } + } + ], + "category": "table" +} diff --git a/packages/materials/src/TinyVue/TinyInput.json b/packages/materials/src/TinyVue/TinyInput.json index 31764bcf2d..35bb278af7 100644 --- a/packages/materials/src/TinyVue/TinyInput.json +++ b/packages/materials/src/TinyVue/TinyInput.json @@ -13,7 +13,6 @@ "npm": { "package": "@opentiny/vue", "exportName": "Input", - "version": "3.14", "destructuring": true }, "group": "component", @@ -27,12 +26,6 @@ "description": { "zh_CN": "基础信息" }, - "collapse": { - "number": 6, - "text": { - "zh_CN": "显示更多" - } - }, "content": [ { "property": "modelValue", @@ -46,7 +39,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaBindI18n", + "component": "I18nConfigurator", "props": {} }, "description": { @@ -62,7 +55,7 @@ } }, "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -82,7 +75,8 @@ }, "description": { "zh_CN": "设置input框的type属性" - } + }, + "labelPosition": "left" }, { "property": "rows", @@ -92,11 +86,12 @@ } }, "widget": { - "component": "MetaNumber" + "component": "NumberConfigurator" }, "description": { "zh_CN": "输入框行数，只对 type='textarea' 有效" - } + }, + "labelPosition": "left" }, { "property": "placeholder", @@ -110,7 +105,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaBindI18n", + "component": "I18nConfigurator", "props": {} }, "description": { @@ -130,7 +125,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -142,7 +137,7 @@ "property": "disabled", "label": { "text": { - "zh_CN": "是否禁用" + "zh_CN": "禁用" } }, "required": true, @@ -150,12 +145,13 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { - "zh_CN": "" - } + "zh_CN": "是否禁用" + }, + "labelPosition": "left" }, { "property": "size", @@ -169,7 +165,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSelect", + "component": "SelectConfigurator", "props": { "options": [ { @@ -189,7 +185,8 @@ }, "description": { "zh_CN": "输入框尺寸。该属性的可选值为 medium / small / mini" - } + }, + "labelPosition": "left" } ] }, @@ -203,7 +200,7 @@ "property": "maxlength", "label": { "text": { - "zh_CN": "最大长度" + "zh_CN": "最大输入长度" } }, "required": true, @@ -211,19 +208,18 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaNumber", + "component": "NumberConfigurator", "props": {} }, "description": { "zh_CN": "设置 input 框的maxLength" - }, - "labelPosition": "left" + } }, { "property": "autofocus", "label": { "text": { - "zh_CN": "聚焦" + "zh_CN": "自动聚焦" } }, "required": true, @@ -231,7 +227,7 @@ "disabled": false, "cols": 12, "widget": { - "component": "MetaSwitch", + "component": "CheckBoxConfigurator", "props": {} }, "description": { @@ -429,5 +425,5 @@ } } ], - "category": "general" + "category": "form" } diff --git a/packages/materials/src/TinyVue/TinyLayout.json b/packages/materials/src/TinyVue/TinyLayout.json new file mode 100644 index 0000000000..33801dfad2 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyLayout.json @@ -0,0 +1,185 @@ +{ + "icon": "row", + "name": { + "zh_CN": "row" + }, + "component": "TinyLayout", + "description": "定义 Layout 的行配置信息", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Layout", + "destructuring": true + }, + "group": "component", + "priority": 5, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "cols", + "label": { + "text": { + "zh_CN": "总栅格数" + } + }, + "cols": 12, + "widget": { + "component": "ButtonGroupConfigurator", + "props": { + "options": [ + { + "label": "12", + "value": 12 + }, + { + "label": "24", + "value": 24 + } + ] + } + }, + "description": { + "zh_CN": "选择总栅格数" + }, + "labelPosition": "none" + }, + { + "property": "tag", + "label": { + "text": { + "zh_CN": "layout渲染的标签" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "定义Layout元素渲染后的标签，默认为 div" + } + } + ] + } + ] + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": ["TinyRow", "TinyCol"], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "栅格布局" + }, + "icon": "row", + "screenshot": "", + "snippetName": "TinyLayout", + "schema": { + "componentName": "TinyLayout", + "props": {}, + "children": [ + { + "componentName": "TinyRow", + "props": { + "style": "padding: 10px;" + }, + "children": [ + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + }, + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + }, + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + }, + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + } + ] + }, + { + "componentName": "TinyRow", + "props": { + "style": "padding: 10px;" + }, + "children": [ + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + }, + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + }, + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + }, + { + "componentName": "TinyCol", + "props": { + "span": 3 + } + } + ] + } + ] + } + } + ], + "category": "layout" +} diff --git a/packages/materials/src/TinyVue/TinyNumeric.json b/packages/materials/src/TinyVue/TinyNumeric.json new file mode 100644 index 0000000000..7032dbc9af --- /dev/null +++ b/packages/materials/src/TinyVue/TinyNumeric.json @@ -0,0 +1,460 @@ +{ + "name": { + "zh_CN": "数字输入框" + }, + "component": "TinyNumeric", + "icon": "numeric", + "description": "通过鼠标或键盘输入字符", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Numeric", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "I18nConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定值" + }, + "labelPosition": "left" + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "I18nConfigurator", + "props": {} + }, + "description": { + "zh_CN": "输入框占位文本" + }, + "labelPosition": "left" + }, + { + "property": "allow-empty", + "label": { + "text": { + "zh_CN": "内容可清空" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否内容可清空" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "尺寸" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "medium", + "value": "medium" + }, + { + "label": "small", + "value": "small" + }, + { + "label": "mini", + "value": "mini" + } + ] + } + }, + "description": { + "zh_CN": "输入框尺寸。该属性的可选值为 medium / small / mini" + }, + "labelPosition": "left" + }, + { + "property": "controls", + "label": { + "text": { + "zh_CN": "加减按钮" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否使用加减按钮" + }, + "labelPosition": "left" + }, + { + "property": "controls-position", + "label": { + "text": { + "zh_CN": "加减按钮位置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "左右两侧", + "value": "" + }, + { + "label": "只在右侧", + "value": "right" + } + ] + } + }, + "description": { + "zh_CN": "加减按钮位置" + } + }, + { + "property": "precision", + "label": { + "text": { + "zh_CN": "精度" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "allowEmpty": true + } + }, + "description": { + "zh_CN": "数值精度" + }, + "labelPosition": "left" + }, + { + "property": "step", + "label": { + "text": { + "zh_CN": "步长" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "allowEmpty": true + } + }, + "description": { + "zh_CN": "步长" + }, + "labelPosition": "left" + }, + { + "property": "max", + "label": { + "text": { + "zh_CN": "最大数值" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "allowEmpty": true + } + }, + "description": { + "zh_CN": "可输入的最大数值" + }, + "labelPosition": "left" + }, + { + "property": "min", + "label": { + "text": { + "zh_CN": "最小数值" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": { + "allowEmpty": true + } + }, + "description": { + "zh_CN": "可输入的最大数值" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "值改变时触发" + }, + "description": { + "zh_CN": "在 Input 值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框改变后的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onInput": { + "label": { + "zh_CN": "输入值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "输入框输入的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "在 Input 输入值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onBlur": { + "label": { + "zh_CN": "失去焦点时触发" + }, + "description": { + "zh_CN": "在 Input 失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onFocus": { + "label": { + "zh_CN": "获取焦点时触发" + }, + "description": { + "zh_CN": "在 Input 获取焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClear": { + "label": { + "zh_CN": "点击清空按钮时触发" + }, + "description": { + "zh_CN": "点击清空按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["value", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "数字输入框" + }, + "icon": "numeric", + "screenshot": "", + "snippetName": "TinyNumeric", + "schema": { + "componentName": "TinyNumeric", + "props": { + "allow-empty": true, + "placeholder": "请输入", + "controlsPosition": "right", + "step": 1 + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyPager.json b/packages/materials/src/TinyVue/TinyPager.json new file mode 100644 index 0000000000..c8732fdc82 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyPager.json @@ -0,0 +1,250 @@ +{ + "name": { + "zh_CN": "分页" + }, + "component": "TinyPager", + "icon": "pager", + "description": "当数据量过多时，使用分页分解数据，常用于 Grid 和 Repeater 组件", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Pager", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "currentPage", + "label": { + "text": { + "zh_CN": "当前页数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "当前页数，支持 .sync 修饰符" + }, + "labelPosition": "left" + }, + { + "property": "pageSize", + "label": { + "text": { + "zh_CN": "每页条数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "每页显示条目个数" + }, + "labelPosition": "left" + }, + { + "property": "pageSizes", + "label": { + "text": { + "zh_CN": "可选每页条数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置可选择的每页显示条数" + } + }, + { + "property": "total", + "label": { + "text": { + "zh_CN": "总条数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "数据总条数" + }, + "labelPosition": "left" + }, + { + "property": "layout", + "label": { + "text": { + "zh_CN": "布局" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "defaultValue": "total,sizes,prev, pager, next", + "widget": { + "component": "InputConfigurator", + "props": { + "type": "textarea" + } + }, + "description": { + "zh_CN": "组件布局，子组件名用逗号分隔" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onCurrentChange ": { + "label": { + "zh_CN": "切换页码时触发" + }, + "description": { + "zh_CN": "切换页码时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "当前页的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onPrevClick ": { + "label": { + "zh_CN": "点击上一页按钮时触发" + }, + "description": { + "zh_CN": "点击上一页按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "page", + "type": "String", + "defaultValue": "", + "description": { + "zh_CN": "当前页的页码值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onNextClick": { + "label": { + "zh_CN": "点击下一页按钮时触发" + }, + "description": { + "zh_CN": "点击上一页按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "page", + "type": "String", + "defaultValue": "", + "description": { + "zh_CN": "当前页的页码值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["currentPage", "total"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "分页" + }, + "icon": "pager", + "screenshot": "", + "snippetName": "TinyPager", + "schema": { + "componentName": "TinyPager", + "props": { + "layout": "total, sizes, prev, pager, next", + "total": 100, + "pageSize": 10, + "currentPage": 1 + } + } + } + ], + "category": "table" +} diff --git a/packages/materials/src/TinyVue/TinyPopeditor.json b/packages/materials/src/TinyVue/TinyPopeditor.json new file mode 100644 index 0000000000..bcf0230fa0 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyPopeditor.json @@ -0,0 +1,440 @@ +{ + "name": { + "zh_CN": "弹出编辑" + }, + "component": "TinyPopeditor", + "icon": "popEditor", + "description": "该组件只能在弹出的面板中选择数据，不能手动输入数据；弹出面板中显示为 Tree 组件或者 Grid 组件", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Popeditor", + "destructuring": true + }, + "group": "component", + "priority": 6, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定值" + }, + "labelPosition": "left" + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "输入框占位文本" + }, + "labelPosition": "left" + }, + { + "property": "show-clear-btn", + "label": { + "text": { + "zh_CN": "清除按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示清除按钮" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "width", + "label": { + "text": { + "zh_CN": "宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置弹出面板的宽度（单位像素）" + }, + "labelPosition": "left" + }, + { + "property": "conditions", + "label": { + "text": { + "zh_CN": "过滤条件" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "当弹出面板配置的是表格时，设置弹出面板中的过滤条件" + }, + "labelPosition": "top" + }, + { + "property": "grid-op", + "label": { + "text": { + "zh_CN": "面板表格配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置弹出面板中表格组件的配置信息" + } + }, + { + "property": "pager-op", + "label": { + "text": { + "zh_CN": "分页配置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置弹出编辑框中分页配置" + }, + "labelPosition": "top" + }, + { + "property": "multi", + "label": { + "text": { + "zh_CN": "多选" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置弹出面板中的数据是否可多选" + }, + "labelPosition": "left" + }, + { + "property": "show-pager", + "label": { + "text": { + "zh_CN": "启用分页" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "当 popseletor 为 grid 时才能生效，配置为 true 后还需配置 pagerOp 属性" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "选中值改变时触发" + }, + "description": { + "zh_CN": "在 Input 值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "当前选中项的值" + } + }, + { + "name": "value", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前选中对象" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前选中的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的当前选中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClose": { + "label": { + "zh_CN": "弹框关闭时触发的事件" + }, + "description": { + "zh_CN": "弹框关闭时触发的事件" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + }, + "onPageChange": { + "label": { + "zh_CN": "分页切换事件" + }, + "description": { + "zh_CN": "表格模式下分页切换事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "String", + "defaultValue": "", + "description": { + "zh_CN": "当前页码数" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["modelValue", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "弹出编辑" + }, + "icon": "popeditor", + "screenshot": "", + "snippetName": "TinyPopeditor", + "schema": { + "componentName": "TinyPopeditor", + "props": { + "modelValue": "", + "placeholder": "请选择", + "gridOp": { + "columns": [ + { + "field": "id", + "title": "ID", + "width": 40 + }, + { + "field": "name", + "title": "名称", + "showOverflow": "tooltip" + }, + { + "field": "province", + "title": "省份", + "width": 80 + }, + { + "field": "city", + "title": "城市", + "width": 80 + } + ], + "data": [ + { + "id": "1", + "name": "GFD科技有限公司GFD科技有限公司GFD科技有限公司GFD科技有限公司GFD科技有限公司GFD科技有限公司GFD科技有限公司", + "city": "福州", + "province": "福建" + }, + { + "id": "2", + "name": "WWW科技有限公司", + "city": "深圳", + "province": "广东" + }, + { + "id": "3", + "name": "RFV有限责任公司", + "city": "中山", + "province": "广东" + }, + { + "id": "4", + "name": "TGB科技有限公司", + "city": "龙岩", + "province": "福建" + }, + { + "id": "5", + "name": "YHN科技有限公司", + "city": "韶关", + "province": "广东" + }, + { + "id": "6", + "name": "WSX科技有限公司", + "city": "黄冈", + "province": "武汉" + } + ] + } + } + } + } + ], + "category": "data-display" +} diff --git a/packages/materials/src/TinyVue/TinyPopover.json b/packages/materials/src/TinyVue/TinyPopover.json new file mode 100644 index 0000000000..517490d18e --- /dev/null +++ b/packages/materials/src/TinyVue/TinyPopover.json @@ -0,0 +1,542 @@ +{ + "icon": "popover", + "name": { + "zh_CN": "提示框" + }, + "component": "TinyPopover", + "description": "Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容，延迟触发和渐变动画", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Popover", + "destructuring": true + }, + "group": "component", + "priority": 7, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定，手动控制是否可见的状态值" + }, + "labelPosition": "left" + }, + { + "property": "placement", + "label": { + "text": { + "zh_CN": "位置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "top", + "value": "top" + }, + { + "label": "top-start", + "value": "top-start" + }, + { + "label": "top-end", + "value": "top-end" + }, + { + "label": "bottom", + "value": "bottom" + }, + { + "label": "bottom-start", + "value": "bottom-start" + }, + { + "label": "bottom-end", + "value": "bottom-end" + }, + { + "label": "left", + "value": "left" + }, + { + "label": "left-start", + "value": "left-start" + }, + { + "label": "left-end", + "value": "left-end" + }, + { + "label": "right", + "value": "right" + }, + { + "label": "right-start", + "value": "right-start" + }, + { + "label": "right-end", + "value": "right-end" + } + ] + } + }, + "description": { + "zh_CN": "提示框位置" + }, + "labelPosition": "left" + }, + { + "property": "trigger", + "label": { + "text": { + "zh_CN": "触发方式" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "click", + "value": "click" + }, + { + "label": "focus", + "value": "focus" + }, + { + "label": "hover", + "value": "hover" + }, + { + "label": "manual", + "value": "manual" + } + ] + } + }, + "description": { + "zh_CN": "触发方式，该属性的可选值为 click / focus / hover / manual，该属性的默认值为 click" + }, + "labelPosition": "left" + }, + { + "property": "popper-class", + "label": { + "text": { + "zh_CN": "自定义类" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "为 popper 添加类名" + }, + "labelPosition": "left" + }, + { + "property": "visible-arrow", + "label": { + "text": { + "zh_CN": "显示箭头" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示 Tooltip 箭头" + }, + "labelPosition": "left" + }, + { + "property": "append-to-body", + "label": { + "text": { + "zh_CN": "添加到body上" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "Popover弹窗是否添加到body上" + }, + "labelPosition": "left" + }, + { + "property": "arrow-offset", + "label": { + "text": { + "zh_CN": "箭头的位置偏移" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "箭头的位置偏移，该属性的默认值为 0" + } + }, + { + "property": "close-delay", + "label": { + "text": { + "zh_CN": "延迟隐藏" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "触发方式为 hover 时的隐藏延迟，单位为毫秒" + }, + "labelPosition": "left" + }, + { + "property": "content", + "label": { + "text": { + "zh_CN": "显示的内容" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "显示的内容，也可以通过 slot 传入 DOM" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "Popover 是否可用" + }, + "labelPosition": "left" + }, + { + "property": "offset", + "label": { + "text": { + "zh_CN": "位置偏移量" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "出现位置的偏移量" + }, + "labelPosition": "left" + }, + { + "property": "open-delay", + "label": { + "text": { + "zh_CN": "显示延迟" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "触发方式为 hover 时的显示延迟，单位为毫秒" + }, + "labelPosition": "left" + }, + { + "property": "popper-options", + "label": { + "text": { + "zh_CN": "弹出层参数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "popper.js 的参数" + }, + "labelPosition": "top" + }, + { + "property": "title", + "label": { + "text": { + "zh_CN": "标题" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "提示内容标题" + }, + "labelPosition": "left" + }, + { + "property": "transform-origin", + "label": { + "text": { + "zh_CN": "旋转中心点" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "组件的旋转中心点,组件的旋转中心点" + }, + "labelPosition": "left" + }, + { + "property": "transition", + "label": { + "text": { + "zh_CN": "渐变动画" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "该属性的默认值为 fade-in-linear" + }, + "labelPosition": "left" + }, + { + "property": "width", + "label": { + "text": { + "zh_CN": "宽度" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "宽度" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "手动控制是否可见的状态值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "boolean", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的可见状态值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "isPopper": true, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["visible", "width"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "提示框" + }, + "icon": "popover", + "screenshot": "", + "snippetName": "TinyPopover", + "schema": { + "componentName": "TinyPopover", + "props": { + "width": 200, + "title": "弹框标题", + "trigger": "manual", + "modelValue": true + }, + "children": [ + { + "componentName": "Template", + "props": { + "slot": "reference" + }, + "children": [ + { + "componentName": "div", + "props": { + "placeholder": "触发源" + } + } + ] + }, + { + "componentName": "Template", + "props": { + "slot": "default" + }, + "children": [ + { + "componentName": "div", + "props": { + "placeholder": "提示内容" + } + } + ] + } + ] + } + } + ], + "category": "data-display" +} diff --git a/packages/materials/src/TinyVue/TinyRadio.json b/packages/materials/src/TinyVue/TinyRadio.json new file mode 100644 index 0000000000..15208e47ac --- /dev/null +++ b/packages/materials/src/TinyVue/TinyRadio.json @@ -0,0 +1,252 @@ +{ + "icon": "radio", + "name": { + "zh_CN": "单选" + }, + "component": "TinyRadio", + "description": "用于配置不同场景的选项，在一组备选项中进行单选", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Radio", + "destructuring": true + }, + "group": "component", + "priority": 3, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "text", + "label": { + "text": { + "zh_CN": "文本内容" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "单选框文本内容" + } + }, + { + "property": "label", + "label": { + "text": { + "zh_CN": "选中值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "props": {} + }, + "description": { + "zh_CN": "radio 选中时的值" + } + }, + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定的当前选中值" + } + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + } + ] + }, + { + "label": { + "zh_CN": "其他" + }, + "description": { + "zh_CN": "" + }, + "content": [ + { + "property": "border", + "label": { + "text": { + "zh_CN": "显示边框" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示边框" + }, + "labelPosition": "left" + }, + { + "property": "size", + "label": { + "text": { + "zh_CN": "尺寸" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "单选框的尺寸，仅在 border 为true时有效" + } + }, + { + "property": "name", + "label": { + "text": { + "zh_CN": "原生name属性" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "原生 name 属性" + } + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "值变化事件" + }, + "description": { + "zh_CN": "绑定值变化时触发的事件" + } + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前选中的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的当前选中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["visible", "width"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "单选" + }, + "icon": "radio", + "screenshot": "", + "snippetName": "TinyRadio", + "schema": { + "componentName": "TinyRadio", + "props": { + "label": "1", + "text": "单选文本" + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyRow.json b/packages/materials/src/TinyVue/TinyRow.json new file mode 100644 index 0000000000..a27feec072 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyRow.json @@ -0,0 +1,147 @@ +{ + "icon": "row", + "name": { + "zh_CN": "row" + }, + "component": "TinyRow", + "description": "定义 Layout 的行配置信息", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Row", + "destructuring": true + }, + "group": "component", + "priority": 5, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "layout", + "label": { + "text": { + "zh_CN": "布局" + } + }, + "cols": 12, + "widget": { + "component": "LayoutGridConfigurator", + "props": {} + }, + "description": { + "zh_CN": "选择布局方式" + }, + "labelPosition": "none" + }, + { + "property": "align", + "label": { + "text": { + "zh_CN": "子项对齐方式" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "top", + "value": "top" + }, + { + "label": "middle", + "value": "middle" + }, + { + "label": "bottom", + "value": "bottom" + } + ] + } + }, + "description": { + "zh_CN": "子项的副轴对齐方向，可取值：top, middle, bottom" + } + }, + { + "property": "flex", + "label": { + "text": { + "zh_CN": "flex容器" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否为flex容器" + }, + "labelPosition": "left" + }, + { + "property": "gutter", + "label": { + "text": { + "zh_CN": "子项间隔" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "子项的间隔的像素" + } + } + ] + } + ] + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": [], + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["label-width", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinySearch.json b/packages/materials/src/TinyVue/TinySearch.json new file mode 100644 index 0000000000..f22de1b153 --- /dev/null +++ b/packages/materials/src/TinyVue/TinySearch.json @@ -0,0 +1,290 @@ +{ + "icon": "search", + "name": { + "zh_CN": "搜索框" + }, + "component": "TinySearch", + "description": "指定条件对象进行搜索数据", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Search", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "默认值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "输入框内的默认搜索值" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否被禁用" + }, + "labelPosition": "left" + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "输入框内的提示占位文本" + }, + "labelPosition": "left" + }, + { + "property": "clearable", + "label": { + "text": { + "zh_CN": "清空按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置显示清空图标按钮" + }, + "labelPosition": "left" + }, + { + "property": "isEnterSearch", + "label": { + "text": { + "zh_CN": "Enter键触发" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否在按下键盘Enter键的时候触发search事件" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "mini", + "label": { + "text": { + "zh_CN": "迷你尺寸" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "迷你模式，配置为true时，搜索默认显示为一个带图标的圆形按钮，点击后展开" + }, + "labelPosition": "left" + }, + { + "property": "transparent", + "label": { + "text": { + "zh_CN": "透明模式" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "配置为true时，边框变为透明且收缩后半透明显示，一般用在带有背景的场景，默认 false" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "输入完成时触发" + }, + "description": { + "zh_CN": "在 input 框中输入完成时触发的回调函数" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "type", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "搜索类型,默认值为 {} " + } + }, + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "当前input框中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onSearch": { + "label": { + "zh_CN": "点击搜索按钮时触发" + }, + "description": { + "zh_CN": "展开状态点击搜索按钮时触发的回调函数" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "type", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "搜索类型,默认值为 {} " + } + }, + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "当前input框中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["clearable", "mini"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "搜索框" + }, + "icon": "search", + "screenshot": "", + "snippetName": "TinySearch", + "schema": { + "componentName": "TinySearch", + "props": { + "modelValue": "", + "placeholder": "输入关键词" + } + } + } + ], + "category": "basic" +} diff --git a/packages/materials/src/TinyVue/TinySelect.json b/packages/materials/src/TinyVue/TinySelect.json new file mode 100644 index 0000000000..865c442110 --- /dev/null +++ b/packages/materials/src/TinyVue/TinySelect.json @@ -0,0 +1,430 @@ +{ + "icon": "select", + "name": { + "zh_CN": "下拉框" + }, + "component": "TinySelect", + "description": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Select", + "destructuring": true + }, + "group": "component", + "priority": 8, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定的当前选中值" + }, + "labelPosition": "left" + }, + { + "property": "placeholder", + "label": { + "text": { + "zh_CN": "占位文本" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "输入框占位文本" + }, + "labelPosition": "left" + }, + { + "property": "clearable", + "label": { + "text": { + "zh_CN": "清除按钮" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示清除按钮" + }, + "labelPosition": "left" + }, + { + "property": "searchable", + "label": { + "text": { + "zh_CN": "下拉可搜索" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "下拉面板是否可搜索" + }, + "labelPosition": "left" + }, + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否禁用" + }, + "labelPosition": "left" + }, + { + "property": "options", + "label": { + "text": { + "zh_CN": "选项数据" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "配置 Select 下拉数据项" + }, + "labelPosition": "top" + }, + { + "property": "multiple", + "label": { + "text": { + "zh_CN": "多选" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否允许输入框输入或选择多个项" + }, + "labelPosition": "left" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "multiple-limit", + "label": { + "text": { + "zh_CN": "最大可选值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "多选时用户最多可以选择的项目数，为 0 则不限制" + }, + "labelPosition": "left" + }, + { + "property": "popper-class", + "label": { + "text": { + "zh_CN": "下拉框类名" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置下拉框自定义的类名" + }, + "labelPosition": "left" + }, + { + "property": "collapse-tags", + "label": { + "text": { + "zh_CN": "多选展示" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "多选时是否将选中值按文字的形式展示" + }, + "labelPosition": "left" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "值改变时触发" + }, + "description": { + "zh_CN": "在下拉框值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "下拉框选中项的值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "当前选中的值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的当前选中值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onBlur": { + "label": { + "zh_CN": "失去焦点时触发" + }, + "description": { + "zh_CN": "在 Input 失去焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onFocus": { + "label": { + "zh_CN": "获取焦点时触发" + }, + "description": { + "zh_CN": "在 Input 获取焦点时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClear": { + "label": { + "zh_CN": "点击清空按钮时触发" + }, + "description": { + "zh_CN": "点击清空按钮时触发" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + }, + "onRemoveTag": { + "label": { + "zh_CN": "多选模式下移除tag时触发" + }, + "description": { + "zh_CN": "多选模式下移除tag时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "被移除Tag对应数据项的值字段" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + }, + "onBeforeMount": "console.log('table on load'); this.options = source.data" + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["multiple", "options"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "下拉框" + }, + "icon": "select", + "screenshot": "", + "snippetName": "TinySelect", + "schema": { + "componentName": "TinySelect", + "props": { + "modelValue": "", + "placeholder": "请选择", + "options": [ + { + "value": "1", + "label": "黄金糕" + }, + { + "value": "2", + "label": "双皮奶" + } + ] + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinySwitch.json b/packages/materials/src/TinyVue/TinySwitch.json new file mode 100644 index 0000000000..adf7534160 --- /dev/null +++ b/packages/materials/src/TinyVue/TinySwitch.json @@ -0,0 +1,213 @@ +{ + "icon": "switch", + "name": { + "zh_CN": "开关" + }, + "component": "TinySwitch", + "description": "Switch 在两种状态间切换选择", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Switch", + "destructuring": true + }, + "group": "component", + "priority": 9, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "disabled", + "label": { + "text": { + "zh_CN": "禁用" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否被禁用" + }, + "labelPosition": "left" + }, + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "绑定默认值" + }, + "labelPosition": "left" + }, + { + "property": "true-value", + "label": { + "text": { + "zh_CN": "设置打开值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置打开时的值(Boolean / String / Number)" + }, + "labelPosition": "left" + }, + { + "property": "false-value", + "label": { + "text": { + "zh_CN": "设置关闭值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置关闭时的值(Boolean / String / Number)" + }, + "labelPosition": "left" + }, + { + "property": "mini", + "label": { + "text": { + "zh_CN": "迷你尺寸" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示为 mini 模式" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "点击事件" + }, + "description": { + "zh_CN": "按钮被点击时触发的回调函数" + }, + "type": "event", + "functionInfo": { + "params": [], + "returns": {} + }, + "defaultValue": "" + }, + "onUpdate:modelValue": { + "label": { + "zh_CN": "双向绑定的值改变时触发" + }, + "description": { + "zh_CN": "开关的状态值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "双向绑定的开关状态值" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "mini"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "开关" + }, + "icon": "switch", + "screenshot": "", + "snippetName": "TinySwitch", + "schema": { + "componentName": "TinySwitch", + "props": { + "modelValue": "" + } + } + } + ], + "category": "form" +} diff --git a/packages/materials/src/TinyVue/TinyTabItem.json b/packages/materials/src/TinyVue/TinyTabItem.json new file mode 100644 index 0000000000..785020b4ea --- /dev/null +++ b/packages/materials/src/TinyVue/TinyTabItem.json @@ -0,0 +1,106 @@ +{ + "icon": "tabitem", + "name": { + "zh_CN": "tab页签" + }, + "component": "TinyTabItem", + "description": "tab 标签页", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "TabItem", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "name", + "label": { + "text": { + "zh_CN": "唯一标识" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "唯一标识" + } + }, + { + "property": "title", + "label": { + "text": { + "zh_CN": "标题" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "标题" + } + } + ] + } + ], + "events": {}, + "slots": { + "title": { + "label": { + "zh_CN": "标题" + }, + "description": { + "zh_CN": "自定义标题" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": ["TinyTab"], + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["name", "title"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyTabs.json b/packages/materials/src/TinyVue/TinyTabs.json new file mode 100644 index 0000000000..15fffc8c21 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyTabs.json @@ -0,0 +1,328 @@ +{ + "icon": "tabs", + "name": { + "zh_CN": "标签页" + }, + "component": "TinyTabs", + "description": "分隔内容上有关联但属于不同类别的数据集合", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Tabs", + "destructuring": true + }, + "group": "component", + "priority": 10, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "showEditIcon", + "label": { + "text": { + "zh_CN": "显示编辑图标" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示标题后编辑 ICON" + }, + "labelPosition": "left" + }, + { + "property": "tabs", + "label": { + "text": { + "zh_CN": "选项卡" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "defaultValue": "", + "cols": 12, + "bindState": false, + "widget": { + "component": "ContainerConfigurator", + "props": {} + }, + "description": { + "zh_CN": "tabs 选项卡" + }, + "labelPosition": "none" + }, + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "绑定值，选中选项卡的 name" + }, + "labelPosition": "left" + }, + { + "property": "with-add", + "label": { + "text": { + "zh_CN": "标签新增" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "标签是否可增加" + }, + "labelPosition": "left" + }, + { + "property": "with-close", + "label": { + "text": { + "zh_CN": "可关闭" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "标签是否可关闭" + }, + "labelPosition": "left" + }, + { + "property": "tab-style", + "label": { + "text": { + "zh_CN": "标签页样式" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "card", + "value": "card" + }, + { + "label": "border-card", + "value": "border-card" + } + ] + } + }, + "description": { + "zh_CN": "标签页样式" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "点击页签时触发事件" + }, + "description": { + "zh_CN": "在 Input 值改变时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "component", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前点击的页签对象" + } + }, + { + "name": "event", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "原生 event" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onEdit": { + "label": { + "zh_CN": "点击新增按钮或关闭按钮或者编辑按钮后触发" + }, + "description": { + "zh_CN": "点击新增按钮或关闭按钮或者编辑按钮后触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "tab", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前操作的页签对象" + } + }, + { + "name": "type", + "type": "String", + "defaultValue": "", + "description": { + "zh_CN": "当前操作的类型（remove || add || edit）" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onClose": { + "label": { + "zh_CN": "关闭页签时触发" + }, + "description": { + "zh_CN": "关闭页签时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "name", + "type": "String", + "defaultValue": "", + "description": { + "zh_CN": "页签名称" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "clickCapture": false, + "isModal": false, + "nestingRule": { + "childWhitelist": ["TinyTabItem"], + "parentWhitelist": [], + "descendantBlacklist": [], + "ancestorWhitelist": [] + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["size", "tab-style"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "标签页" + }, + "icon": "tabs", + "screenshot": "", + "group": true, + "snippetName": "TinyTabs", + "schema": { + "componentName": "TinyTabs", + "props": { + "modelValue": "first" + }, + "children": [ + { + "componentName": "TinyTabItem", + "props": { + "title": "标签页1", + "name": "first" + }, + "children": [ + { + "componentName": "div", + "props": { + "style": "margin:10px 0 0 30px" + } + } + ] + }, + { + "componentName": "TinyTabItem", + "props": { + "title": "标签页2", + "name": "second" + }, + "children": [ + { + "componentName": "div", + "props": { + "style": "margin:10px 0 0 30px" + } + } + ] + } + ] + } + } + ], + "category": "navigation" +} diff --git a/packages/materials/src/TinyVue/TinyTimeLine.json b/packages/materials/src/TinyVue/TinyTimeLine.json new file mode 100644 index 0000000000..f32fba89a6 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyTimeLine.json @@ -0,0 +1,232 @@ +{ + "icon": "timeline", + "name": { + "zh_CN": "时间线" + }, + "component": "TinyTimeLine", + "description": "TimeLine 时间线", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "TimeLine", + "destructuring": true + }, + "group": "component", + "priority": 3, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "horizontal", + "type": "Boolean", + "defaultValue": { + "type": "i18n", + "zh_CN": "布局", + "en_US": "layout", + "key": "" + }, + "label": { + "text": { + "zh_CN": "水平布局" + } + }, + "cols": 12, + "rules": [], + "hidden": false, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "节点和文字横向布局" + }, + "labelPosition": "left" + }, + { + "property": "vertical", + "type": "Boolean", + "defaultValue": { + "type": "i18n", + "zh_CN": "垂直布局", + "en_US": "layout", + "key": "" + }, + "label": { + "text": { + "zh_CN": "垂直布局" + } + }, + "cols": 12, + "rules": [], + "hidden": false, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "节点和文字垂直布局" + }, + "labelPosition": "left" + }, + { + "property": "active", + "label": { + "text": { + "zh_CN": "选中值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "NumberConfigurator", + "props": {} + }, + "description": { + "zh_CN": "步骤条的选中步骤值" + }, + "labelPosition": "left" + }, + { + "property": "data", + "label": { + "text": { + "zh_CN": "步骤条数据" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "defaultValue": [ + { + "name": "配置基本信息", + "status": "ready" + }, + { + "name": "配置报价", + "status": "wait" + }, + { + "name": "完成报价", + "status": "wait" + } + ], + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "时间线步骤条数据" + }, + "labelPosition": "top" + } + ] + } + ], + "events": { + "onClick": { + "label": { + "zh_CN": "节点的点击时触发" + }, + "description": { + "zh_CN": "节点的点击时触发的回调函数" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "type", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "点击节点的下标" + } + }, + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "当前节点对象：{ name: 节点名称, time: 时间 }" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["active", "data"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "时间线" + }, + "icon": "timeline", + "screenshot": "", + "snippetName": "TinyTimeLine", + "schema": { + "componentName": "TinyTimeLine", + "props": { + "active": "2", + "data": [ + { + "name": "已下单" + }, + { + "name": "运输中" + }, + { + "name": "已签收" + } + ] + } + } + } + ], + "category": "navigation" +} diff --git a/packages/materials/src/TinyVue/TinyTooltip.json b/packages/materials/src/TinyVue/TinyTooltip.json new file mode 100644 index 0000000000..963711f436 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyTooltip.json @@ -0,0 +1,268 @@ +{ + "icon": "tooltip", + "name": { + "zh_CN": "文字提示框" + }, + "component": "TinyTooltip", + "description": "动态显示提示信息，一般通过鼠标事件进行响应；提供 warning、error、info、success 四种类型显示不同类别的信", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Tooltip", + "destructuring": true + }, + "group": "component", + "priority": 11, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "placement", + "label": { + "text": { + "zh_CN": "提示位置" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "SelectConfigurator", + "props": { + "options": [ + { + "label": "top", + "value": "top" + }, + { + "label": "top-start", + "value": "top-start" + }, + { + "label": "top-end", + "value": "top-end" + }, + { + "label": "bottom", + "value": "bottom" + }, + { + "label": "bottom-start", + "value": "bottom-start" + }, + { + "label": "bottom-end", + "value": "bottom-end" + }, + { + "label": "left", + "value": "left" + }, + { + "label": "left-start", + "value": "left-start" + }, + { + "label": "left-end", + "value": "left-end" + }, + { + "label": "right", + "value": "right" + }, + { + "label": "right-start", + "value": "right-start" + }, + { + "label": "right-end", + "value": "right-end" + } + ] + } + }, + "description": { + "zh_CN": "Tooltip 的出现位置" + }, + "labelPosition": "left" + }, + { + "property": "content", + "label": { + "text": { + "zh_CN": "内容" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "defaultValue": "提示信息", + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "显示的内容，也可以通过 slot#content 传入 DOM" + }, + "labelPosition": "left" + }, + { + "property": "render-content", + "label": { + "text": { + "zh_CN": "渲染函数" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "disabled": true, + "placeholder": "请使用变量绑定来绑定函数" + } + }, + "description": { + "zh_CN": "自定义渲染函数，返回需要渲染的节点内容" + } + }, + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "是否可见" + } + }, + "defaultValue": true, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "状态是否可见" + }, + "labelPosition": "left" + }, + { + "property": "manual", + "label": { + "text": { + "zh_CN": "手动控制" + } + }, + "defaultValue": true, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "手动控制模式，设置为 true 后，mouseenter 和 mouseleave 事件将不会生效" + }, + "labelPosition": "left" + } + ] + } + ], + "events": {}, + "slots": { + "content": { + "label": { + "zh_CN": "提示内容" + }, + "description": { + "zh_CN": "自定义提示内容" + } + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": true, + "isModal": false, + "isPopper": true, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["disabled", "content"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "文字提示框" + }, + "icon": "tooltip", + "screenshot": "", + "snippetName": "TinyTooltip", + "schema": { + "componentName": "TinyTooltip", + "props": { + "content": "Top Left 提示文字", + "placement": "top-start", + "manual": true, + "modelValue": true + }, + "children": [ + { + "componentName": "span", + "children": [ + { + "componentName": "div", + "props": {} + } + ] + }, + { + "componentName": "Template", + "props": { + "slot": "content" + }, + "children": [ + { + "componentName": "span", + "children": [ + { + "componentName": "div", + "props": { + "placeholder": "提示内容" + } + } + ] + } + ] + } + ] + } + } + ], + "category": "data-display" +} diff --git a/packages/materials/src/TinyVue/TinyTree.json b/packages/materials/src/TinyVue/TinyTree.json new file mode 100644 index 0000000000..b49bdc50e1 --- /dev/null +++ b/packages/materials/src/TinyVue/TinyTree.json @@ -0,0 +1,384 @@ +{ + "icon": "tree", + "name": { + "zh_CN": "树" + }, + "component": "TinyTree", + "description": "可进行展示有父子层级的数据，支持选择，异步加载等功能。但不推荐用它来展示菜单，展示菜单推荐使用树菜单", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "Tree", + "destructuring": true + }, + "group": "component", + "priority": 12, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "show-checkbox", + "label": { + "text": { + "zh_CN": "多选" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "设置接口是否可以多选" + }, + "labelPosition": "left" + }, + { + "property": "data", + "label": { + "text": { + "zh_CN": "数据源" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "defaultValue": [ + { + "label": "一级 1", + "children": [ + { + "label": "二级 1-1" + } + ] + } + ], + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "可配置静态数据源和动态数据源" + }, + "labelPosition": "top" + }, + { + "property": "node-key", + "label": { + "text": { + "zh_CN": "唯一标识" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": {} + }, + "description": { + "zh_CN": "节点唯一标识属性名称" + }, + "labelPosition": "left" + }, + { + "property": "render-content", + "label": { + "text": { + "zh_CN": "渲染函数" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "InputConfigurator", + "props": { + "disabled": true, + "placeholder": "请使用变量绑定来绑定函数" + } + }, + "description": { + "zh_CN": "树节点的内容区的渲染函数" + } + }, + { + "property": "icon-trigger-click-node", + "label": { + "text": { + "zh_CN": "触发NodeClick事件" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "点击图标展开节点时是否触发 node-click 事件" + }, + "labelPosition": "left" + }, + { + "property": "expand-icon", + "label": { + "text": { + "zh_CN": "展开图标" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "节点展开图标" + }, + "labelPosition": "top" + }, + { + "property": "shrink-icon", + "label": { + "text": { + "zh_CN": "收缩图标" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "节点收缩的图标" + }, + "labelPosition": "top" + } + ] + }, + { + "name": "1", + "label": { + "zh_CN": "其他" + }, + "content": [ + { + "property": "check-on-click-node", + "label": { + "text": { + "zh_CN": "点击节点选中" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否在点击节点的时候选中节点，默认值为 false，即只有在点击复选框时才会选中节点" + }, + "labelPosition": "left" + }, + { + "property": "filter-node-method", + "label": { + "text": { + "zh_CN": "筛选函数" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "cols": 12, + "widget": { + "component": "CodeConfigurator", + "props": {} + }, + "description": { + "zh_CN": "节点筛选函数" + }, + "labelPosition": "top" + } + ], + "description": { + "zh_CN": "" + } + } + ], + "events": { + "onCheck": { + "label": { + "zh_CN": "勾选节点后的事件" + }, + "description": { + "zh_CN": "勾选节点后的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "data", + "type": "object", + "defaultValue": "", + "description": { + "zh_CN": "当前选中节点信息" + } + }, + { + "name": "currentNode", + "type": "object", + "defaultValue": "", + "description": { + "zh_CN": "树组件目前的选中状态信息，包含 checkedNodes、checkedKeys、halfCheckedNodes、halfCheckedKeys 四个属性" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onNodeClick": { + "label": { + "zh_CN": "点击节点后的事件" + }, + "description": { + "zh_CN": "点击节点后的事件" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "data", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "当前选中节点信息" + } + }, + { + "name": "node", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "树组件目前的选中状态信息，包含 checkedNodes、checkedKeys、halfCheckedNodes、halfCheckedKeys 四个属性" + } + }, + { + "name": "vm", + "type": "Object", + "defaultValue": "", + "description": { + "zh_CN": "树组件实例" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["data", "show-checkbox"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "树" + }, + "icon": "tree", + "screenshot": "", + "snippetName": "TinyTree", + "schema": { + "componentName": "TinyTree", + "props": { + "data": [ + { + "label": "一级 1", + "children": [ + { + "label": "二级 1-1", + "children": [ + { + "label": "三级 1-1-1" + } + ] + } + ] + }, + { + "label": "一级 2", + "children": [ + { + "label": "二级 2-1", + "children": [ + { + "label": "三级 2-1-1" + } + ] + }, + { + "label": "二级 2-2", + "children": [ + { + "label": "三级 2-2-1" + } + ] + } + ] + } + ] + } + } + } + ], + "category": "data-display" +} diff --git a/packages/materials/src/TinyVue/meta.json b/packages/materials/src/TinyVue/meta.json index a45f778c04..0320022291 100644 --- a/packages/materials/src/TinyVue/meta.json +++ b/packages/materials/src/TinyVue/meta.json @@ -6,5 +6,43 @@ "destructuring": true, "script": "https://unpkg.com/@opentiny/vue-runtime@~3.20/dist3/tiny-vue-pc.mjs", "css": "https://unpkg.com/@opentiny/vue-theme@~3.20/index.css" - } + }, + "snippets": [ + { + "group": "layout", + "label": { + "zh_CN": "布局与容器" + } + }, + { + "group": "basic", + "label": { + "zh_CN": "基础元素" + } + }, + { + "group": "form", + "label": { + "zh_CN": "表单类型" + } + }, + { + "group": "table", + "label": { + "zh_CN": "表格类型" + } + }, + { + "group": "data-display", + "label": { + "zh_CN": "数据展示类" + } + }, + { + "group": "navigation", + "label": { + "zh_CN": "导航类型" + } + } + ] } From 2db85584e899f80b6db20b8071cb94473832fd2a Mon Sep 17 00:00:00 2001 From: chilingling Date: Thu, 6 Feb 2025 00:34:27 -0800 Subject: [PATCH 08/11] feat: seperate componentsMap to a stand alone file --- packages/materials/buildMaterials.mjs | 23 ++++++++++++++--------- 1 file changed, 14 insertions(+), 9 deletions(-) diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index 10a2d3eee8..d0c4118ea8 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -49,11 +49,11 @@ const generateComponents = async (entry) => { } const bundle = { - componentsMap: [], components: [], snippets: [], packages: [] } + const componentsMap = [] const metaInfo = fsExtra.readJsonSync(path.resolve(entry, 'meta.json'), { throws: false }) @@ -121,11 +121,14 @@ const generateComponents = async (entry) => { } if (npmInfo.package) { - bundle.componentsMap.push(mapItem) + componentsMap.push(mapItem) } }) - return bundle + return { + bundle, + componentsMap + } } const getFrameworkWithData = (data) => { @@ -150,9 +153,9 @@ const buildComponents = async (config = {}) => { const allBundles = { components: [], snippets: [], - componentsMap: [], packages: [] } + let allComponentsMap = [] for (const entry of entries) { const res = await generateComponents(path.resolve(materialsDir, `${entry}`)) @@ -161,13 +164,14 @@ const buildComponents = async (config = {}) => { continue } - fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res), { spaces: 2 }) + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res.bundle), { spaces: 2 }) + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.compsMap.json`), res.componentsMap, { spaces: 2 }) - allBundles.components = allBundles.components.concat(res.components) - allBundles.componentsMap = allBundles.componentsMap.concat(res.componentsMap) - allBundles.packages = allBundles.packages.concat(res.packages) + allBundles.components = allBundles.components.concat(res.bundle.components) + allComponentsMap = allComponentsMap.concat(res.componentsMap) + allBundles.packages = allBundles.packages.concat(res.bundle.packages) - for (const snippetItem of res.snippets) { + for (const snippetItem of res.bundle.snippets) { const snippet = allBundles.snippets.find((item) => item.group === snippetItem.group) if (snippet) { @@ -184,6 +188,7 @@ const buildComponents = async (config = {}) => { if (buildCombine) { fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/index.json`), getFrameworkWithData(allBundles), { spaces: 2 }) + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/index.compsMap.json`), allComponentsMap, { spaces: 2 }) } logger.success('物料资产包构建成功') From 4adb84af9cb32b178a0d2fe0b9723ede15d39809 Mon Sep 17 00:00:00 2001 From: chilingling Date: Thu, 6 Feb 2025 23:55:43 -0800 Subject: [PATCH 09/11] fix: material config compact data and url --- designer-demo/engine.config.js | 4 +++- designer-demo/package.json | 1 + packages/materials/buildMaterials.mjs | 6 ++---- 3 files changed, 6 insertions(+), 5 deletions(-) diff --git a/designer-demo/engine.config.js b/designer-demo/engine.config.js index fa308f9bc2..09b46bf472 100644 --- a/designer-demo/engine.config.js +++ b/designer-demo/engine.config.js @@ -1,7 +1,9 @@ +import material from '@opentiny/tiny-engine-materials' + export default { id: 'engine.config', theme: 'light', - material: ['/mock/bundle.json'], + material: [material], scripts: [], styles: [] } diff --git a/designer-demo/package.json b/designer-demo/package.json index be5e7ae796..2069097d50 100644 --- a/designer-demo/package.json +++ b/designer-demo/package.json @@ -12,6 +12,7 @@ }, "dependencies": { "@opentiny/tiny-engine": "workspace:^", + "@opentiny/tiny-engine-materials": "workspace:*", "@opentiny/tiny-engine-meta-register": "workspace:^", "@opentiny/tiny-engine-utils": "workspace:*", "@opentiny/vue": "~3.20.0", diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index d0c4118ea8..fcb9bc300d 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -133,10 +133,8 @@ const generateComponents = async (entry) => { const getFrameworkWithData = (data) => { return { - data: { - framework: 'Vue', - materials: data - } + framework: 'Vue', + materials: data } } From 79adeb4171061275f47acaafdee61a833272dbef Mon Sep 17 00:00:00 2001 From: chilingling Date: Mon, 18 Aug 2025 21:42:52 +0800 Subject: [PATCH 10/11] chore: sync with upstream material --- packages/materials/buildMaterials.mjs | 27 +- .../materials/src/ElementPlus/ElButton.json | 5 +- .../materials/src/ElementPlus/ElForm.json | 5 +- .../materials/src/ElementPlus/ElFormItem.json | 2 +- .../materials/src/ElementPlus/ElInput.json | 5 +- .../materials/src/ElementPlus/ElTable.json | 5 +- .../src/ElementPlus/ElTableColumn.json | 2 +- .../materials/src/TinyVue/TinyBreadcrumb.json | 7 +- .../src/TinyVue/TinyBreadcrumbItem.json | 1 + .../materials/src/TinyVue/TinyButton.json | 7 +- .../src/TinyVue/TinyButtonGroup.json | 8 +- .../materials/src/TinyVue/TinyCarousel.json | 6 +- .../src/TinyVue/TinyCarouselItem.json | 1 + .../materials/src/TinyVue/TinyCheckbox.json | 7 +- .../src/TinyVue/TinyCheckboxButton.json | 1 + .../src/TinyVue/TinyCheckboxGroup.json | 36 ++- packages/materials/src/TinyVue/TinyCol.json | 1 + .../materials/src/TinyVue/TinyCollapse.json | 7 +- .../src/TinyVue/TinyCollapseItem.json | 1 + .../materials/src/TinyVue/TinyDatePicker.json | 7 +- .../materials/src/TinyVue/TinyDialogBox.json | 7 +- packages/materials/src/TinyVue/TinyForm.json | 7 +- .../materials/src/TinyVue/TinyFormItem.json | 1 + packages/materials/src/TinyVue/TinyGrid.json | 7 +- .../materials/src/TinyVue/TinyGridColumn.json | 50 +++ packages/materials/src/TinyVue/TinyInput.json | 7 +- .../materials/src/TinyVue/TinyLayout.json | 8 +- .../materials/src/TinyVue/TinyNumeric.json | 11 +- packages/materials/src/TinyVue/TinyPager.json | 7 +- .../materials/src/TinyVue/TinyPopeditor.json | 30 +- .../materials/src/TinyVue/TinyPopover.json | 7 +- packages/materials/src/TinyVue/TinyRadio.json | 7 +- packages/materials/src/TinyVue/TinyRow.json | 1 + .../materials/src/TinyVue/TinySearch.json | 7 +- .../materials/src/TinyVue/TinySelect.json | 7 +- .../materials/src/TinyVue/TinySwitch.json | 7 +- .../materials/src/TinyVue/TinyTabItem.json | 1 + packages/materials/src/TinyVue/TinyTabs.json | 27 +- .../materials/src/TinyVue/TinyTimeLine.json | 36 +-- .../materials/src/TinyVue/TinyTooltip.json | 7 +- .../materials/src/TinyVue/TinyTransfer.json | 305 ++++++++++++++++++ packages/materials/src/TinyVue/TinyTree.json | 7 +- packages/materials/src/html/A.json | 7 +- packages/materials/src/html/Button.json | 1 + packages/materials/src/html/Form.json | 1 + packages/materials/src/html/H1.json | 6 +- packages/materials/src/html/Img.json | 1 + packages/materials/src/html/Input.json | 1 + packages/materials/src/html/Label.json | 1 + packages/materials/src/html/P.json | 6 +- packages/materials/src/html/Table.json | 1 + packages/materials/src/html/Td.json | 1 + packages/materials/src/html/Video.json | 8 +- 53 files changed, 570 insertions(+), 159 deletions(-) create mode 100644 packages/materials/src/TinyVue/TinyGridColumn.json create mode 100644 packages/materials/src/TinyVue/TinyTransfer.json diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index fcb9bc300d..2704d1b80d 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -99,7 +99,9 @@ const generateComponents = async (entry) => { snippet.children = [] } - componentSnippets && snippet.children.push(...componentSnippets) + if (componentSnippets) { + snippet.children.push(...componentSnippets) + } } else if (category && componentInfo && componentSnippets) { bundle.snippets.push({ group: category, @@ -162,7 +164,9 @@ const buildComponents = async (config = {}) => { continue } - fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res.bundle), { spaces: 2 }) + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.json`), getFrameworkWithData(res.bundle), { + spaces: 2 + }) fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/${entry}.compsMap.json`), res.componentsMap, { spaces: 2 }) allBundles.components = allBundles.components.concat(res.bundle.components) @@ -185,7 +189,9 @@ const buildComponents = async (config = {}) => { } if (buildCombine) { - fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/index.json`), getFrameworkWithData(allBundles), { spaces: 2 }) + fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/index.json`), getFrameworkWithData(allBundles), { + spaces: 2 + }) fsExtra.outputJSONSync(path.resolve(__dirname, `./dist/index.compsMap.json`), allComponentsMap, { spaces: 2 }) } @@ -199,7 +205,7 @@ const buildComponents = async (config = {}) => { async function serve() { // 监听materials下json文件的变化 const watcher = chokidar.watch(`${materialsDir}/**/*.json`, { ignoreInitial: true }) - + watcher.on('all', (event, file) => { const eventMap = { add: '新增', @@ -207,9 +213,9 @@ async function serve() { unlink: '删除' } const fileFullPath = path.join(process.cwd(), file) - + logger.info(`${eventMap[event]}组件文件 (${fileFullPath})`) - + // 监听物料文件变化，更新物料资产包 buildComponents() }) @@ -228,7 +234,6 @@ async function serve() { server.listen(staticServerPort, () => { logger.success(`物料服务已启动 http://127.0.0.1:${staticServerPort}`) }) - } // 单次构建，分组件库 @@ -241,24 +246,22 @@ function build() { buildComponents() } - function start() { const commandsMap = { serve: serve, build: build, 'build:split': buildSplit } - + const command = process.argv.slice(2) - + if (!commandsMap[command]) { logger.error(`[@opentiny/tiny-engine-materials] 不支持${command}命令`) return } - + commandsMap[command]() } - start() diff --git a/packages/materials/src/ElementPlus/ElButton.json b/packages/materials/src/ElementPlus/ElButton.json index 7753facab3..d38e786f62 100644 --- a/packages/materials/src/ElementPlus/ElButton.json +++ b/packages/materials/src/ElementPlus/ElButton.json @@ -39,7 +39,7 @@ "properties": ["type", "size"] }, "contextMenu": { - "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "actions": ["copy", "remove", "insert", "updateAttr", "bindEvent", "createBlock"], "disable": [] }, "invalidity": [""], @@ -332,7 +332,8 @@ } } ] - } + }, + "category": "element-plus" } ] } diff --git a/packages/materials/src/ElementPlus/ElForm.json b/packages/materials/src/ElementPlus/ElForm.json index 163e5b8695..3dfc423557 100644 --- a/packages/materials/src/ElementPlus/ElForm.json +++ b/packages/materials/src/ElementPlus/ElForm.json @@ -39,7 +39,7 @@ "properties": ["inline", "label-width"] }, "contextMenu": { - "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "actions": ["copy", "remove", "insert", "updateAttr", "bindEvent", "createBlock"], "disable": [] }, "invalidity": [""], @@ -528,7 +528,8 @@ ] } ] - } + }, + "category": "element-plus" } ] } diff --git a/packages/materials/src/ElementPlus/ElFormItem.json b/packages/materials/src/ElementPlus/ElFormItem.json index 7c42a08757..52eaeee233 100644 --- a/packages/materials/src/ElementPlus/ElFormItem.json +++ b/packages/materials/src/ElementPlus/ElFormItem.json @@ -39,7 +39,7 @@ "properties": ["inline", "label-width"] }, "contextMenu": { - "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "actions": ["copy", "remove", "insert", "updateAttr", "bindEvent", "createBlock"], "disable": [] }, "invalidity": [""], diff --git a/packages/materials/src/ElementPlus/ElInput.json b/packages/materials/src/ElementPlus/ElInput.json index 611411cb6c..d21386cfef 100644 --- a/packages/materials/src/ElementPlus/ElInput.json +++ b/packages/materials/src/ElementPlus/ElInput.json @@ -39,7 +39,7 @@ "properties": ["type", "size"] }, "contextMenu": { - "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "actions": ["copy", "remove", "insert", "updateAttr", "bindEvent", "createBlock"], "disable": [] }, "invalidity": [""], @@ -282,7 +282,8 @@ "icon": "input", "screenshot": "", "snippetName": "ElInput", - "schema": {} + "schema": {}, + "category": "element-plus" } ] } diff --git a/packages/materials/src/ElementPlus/ElTable.json b/packages/materials/src/ElementPlus/ElTable.json index ba30af7add..0c77634f3f 100644 --- a/packages/materials/src/ElementPlus/ElTable.json +++ b/packages/materials/src/ElementPlus/ElTable.json @@ -39,7 +39,7 @@ "properties": ["inline", "label-width"] }, "contextMenu": { - "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "actions": ["copy", "remove", "insert", "updateAttr", "bindEvent", "createBlock"], "disable": [] }, "invalidity": [""], @@ -1281,7 +1281,8 @@ } ] } - } + }, + "category": "element-plus" } ] } diff --git a/packages/materials/src/ElementPlus/ElTableColumn.json b/packages/materials/src/ElementPlus/ElTableColumn.json index cf0256a826..a1bc60e2c2 100644 --- a/packages/materials/src/ElementPlus/ElTableColumn.json +++ b/packages/materials/src/ElementPlus/ElTableColumn.json @@ -39,7 +39,7 @@ "properties": ["inline", "label-width"] }, "contextMenu": { - "actions": ["copy", "remove", "insert", "updateAttr", "bindEevent", "createBlock"], + "actions": ["copy", "remove", "insert", "updateAttr", "bindEvent", "createBlock"], "disable": [] }, "invalidity": [""], diff --git a/packages/materials/src/TinyVue/TinyBreadcrumb.json b/packages/materials/src/TinyVue/TinyBreadcrumb.json index 3b8470a7ac..170cac9b03 100644 --- a/packages/materials/src/TinyVue/TinyBreadcrumb.json +++ b/packages/materials/src/TinyVue/TinyBreadcrumb.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "breadcrumb", "name": { "zh_CN": "面包屑" @@ -159,8 +160,8 @@ } ] } - } + }, + "category": "navigation" } - ], - "category": "navigation" + ] } diff --git a/packages/materials/src/TinyVue/TinyBreadcrumbItem.json b/packages/materials/src/TinyVue/TinyBreadcrumbItem.json index b0ae0d5878..2906b8df26 100644 --- a/packages/materials/src/TinyVue/TinyBreadcrumbItem.json +++ b/packages/materials/src/TinyVue/TinyBreadcrumbItem.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "breadcrumb", "name": { "zh_CN": "面包屑项" diff --git a/packages/materials/src/TinyVue/TinyButton.json b/packages/materials/src/TinyVue/TinyButton.json index 68f13d1c45..381aba7018 100644 --- a/packages/materials/src/TinyVue/TinyButton.json +++ b/packages/materials/src/TinyVue/TinyButton.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "按钮" }, @@ -346,8 +347,8 @@ "props": { "text": "按钮文案" } - } + }, + "category": "basic" } - ], - "category": "basic" + ] } diff --git a/packages/materials/src/TinyVue/TinyButtonGroup.json b/packages/materials/src/TinyVue/TinyButtonGroup.json index a8de602300..27009d4e1d 100644 --- a/packages/materials/src/TinyVue/TinyButtonGroup.json +++ b/packages/materials/src/TinyVue/TinyButtonGroup.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "按钮组" }, @@ -16,7 +17,7 @@ "destructuring": true }, "group": "component", - "category": "basic", + "category": "general", "priority": 2, "schema": { "properties": [ @@ -157,7 +158,7 @@ "name": { "zh_CN": "互斥按钮组" }, - "icon": "buttons", + "icon": "MutexButtons", "snippetName": "TinyButtonGroup", "screenshot": "", "schema": { @@ -179,7 +180,8 @@ ], "modelValue": "1" } - } + }, + "category": "basic" } ] } diff --git a/packages/materials/src/TinyVue/TinyCarousel.json b/packages/materials/src/TinyVue/TinyCarousel.json index 422ca864b9..91d08c288e 100644 --- a/packages/materials/src/TinyVue/TinyCarousel.json +++ b/packages/materials/src/TinyVue/TinyCarousel.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "走马灯" }, @@ -16,7 +17,7 @@ "destructuring": true }, "group": "component", - "category": "data-display", + "category": "容器组件", "priority": 2, "schema": { "properties": [ @@ -367,7 +368,8 @@ ] } ] - } + }, + "category": "data-display" } ] } diff --git a/packages/materials/src/TinyVue/TinyCarouselItem.json b/packages/materials/src/TinyVue/TinyCarouselItem.json index 32ad655cbe..c2621b7c7b 100644 --- a/packages/materials/src/TinyVue/TinyCarouselItem.json +++ b/packages/materials/src/TinyVue/TinyCarouselItem.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "走马灯子项" }, diff --git a/packages/materials/src/TinyVue/TinyCheckbox.json b/packages/materials/src/TinyVue/TinyCheckbox.json index 05e56ac6be..e5deb9517b 100644 --- a/packages/materials/src/TinyVue/TinyCheckbox.json +++ b/packages/materials/src/TinyVue/TinyCheckbox.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "checkbox", "name": { "zh_CN": "复选框" @@ -266,8 +267,8 @@ "props": { "text": "复选框文案" } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyCheckboxButton.json b/packages/materials/src/TinyVue/TinyCheckboxButton.json index 877ad19761..f6f9b8d4f8 100644 --- a/packages/materials/src/TinyVue/TinyCheckboxButton.json +++ b/packages/materials/src/TinyVue/TinyCheckboxButton.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "checkboxbutton", "name": { "zh_CN": "复选按钮" diff --git a/packages/materials/src/TinyVue/TinyCheckboxGroup.json b/packages/materials/src/TinyVue/TinyCheckboxGroup.json index d416f059de..49b8cc9088 100644 --- a/packages/materials/src/TinyVue/TinyCheckboxGroup.json +++ b/packages/materials/src/TinyVue/TinyCheckboxGroup.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "checkboxgroup", "name": { "zh_CN": "复选按钮组" @@ -90,7 +91,9 @@ "cols": 12, "widget": { "component": "CodeConfigurator", - "props": {} + "props": { + "language": "json" + } }, "description": { "zh_CN": "checkbox组件列表" @@ -231,8 +234,33 @@ } ] } - } + }, + "category": "form" + }, + { + "name": { + "zh_CN": "复选框拖拽按钮组" + }, + "icon": "checkboxgroup", + "screenshot": "", + "snippetName": "TinyCheckboxbuttonGroup", + "schema": { + "componentName": "TinyCheckboxGroup", + "props": { + "modelValue": [] + }, + "children": [ + { + "componentName": "TinyCheckboxButton", + "children": [ + { + "componentName": "div" + } + ] + } + ] + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyCol.json b/packages/materials/src/TinyVue/TinyCol.json index 0d9333b2c1..112f2865df 100644 --- a/packages/materials/src/TinyVue/TinyCol.json +++ b/packages/materials/src/TinyVue/TinyCol.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "col", "name": { "zh_CN": "col" diff --git a/packages/materials/src/TinyVue/TinyCollapse.json b/packages/materials/src/TinyVue/TinyCollapse.json index 7bfddf45ad..ed7e9e2062 100644 --- a/packages/materials/src/TinyVue/TinyCollapse.json +++ b/packages/materials/src/TinyVue/TinyCollapse.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "collapse", "name": { "zh_CN": "折叠面板" @@ -172,8 +173,8 @@ ] } ] - } + }, + "category": "data-display" } - ], - "category": "data-display" + ] } diff --git a/packages/materials/src/TinyVue/TinyCollapseItem.json b/packages/materials/src/TinyVue/TinyCollapseItem.json index 965c147a72..6204b5b1ea 100644 --- a/packages/materials/src/TinyVue/TinyCollapseItem.json +++ b/packages/materials/src/TinyVue/TinyCollapseItem.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "collapseitem", "name": { "zh_CN": "折叠面板项" diff --git a/packages/materials/src/TinyVue/TinyDatePicker.json b/packages/materials/src/TinyVue/TinyDatePicker.json index c6b9a8ddda..cb1696d310 100644 --- a/packages/materials/src/TinyVue/TinyDatePicker.json +++ b/packages/materials/src/TinyVue/TinyDatePicker.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "日期选择" }, @@ -423,8 +424,8 @@ "placeholder": "请输入", "modelValue": "" } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyDialogBox.json b/packages/materials/src/TinyVue/TinyDialogBox.json index e373142ee7..da45a163c5 100644 --- a/packages/materials/src/TinyVue/TinyDialogBox.json +++ b/packages/materials/src/TinyVue/TinyDialogBox.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "dialogbox", "name": { "zh_CN": "对话框" @@ -292,8 +293,8 @@ "componentName": "div" } ] - } + }, + "category": "data-display" } - ], - "category": "data-display" + ] } diff --git a/packages/materials/src/TinyVue/TinyForm.json b/packages/materials/src/TinyVue/TinyForm.json index 3c43e44bf4..8188540220 100644 --- a/packages/materials/src/TinyVue/TinyForm.json +++ b/packages/materials/src/TinyVue/TinyForm.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "form", "name": { "zh_CN": "表单" @@ -418,8 +419,8 @@ ] } ] - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyFormItem.json b/packages/materials/src/TinyVue/TinyFormItem.json index 58605fb052..f8fae34497 100644 --- a/packages/materials/src/TinyVue/TinyFormItem.json +++ b/packages/materials/src/TinyVue/TinyFormItem.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "formitem", "name": { "zh_CN": "表单项" diff --git a/packages/materials/src/TinyVue/TinyGrid.json b/packages/materials/src/TinyVue/TinyGrid.json index 420e8e6b05..62c4ef5d8d 100644 --- a/packages/materials/src/TinyVue/TinyGrid.json +++ b/packages/materials/src/TinyVue/TinyGrid.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "grid", "name": { "zh_CN": "表格" @@ -965,8 +966,8 @@ } ] } - } + }, + "category": "table" } - ], - "category": "table" + ] } diff --git a/packages/materials/src/TinyVue/TinyGridColumn.json b/packages/materials/src/TinyVue/TinyGridColumn.json new file mode 100644 index 0000000000..5a55adb5fc --- /dev/null +++ b/packages/materials/src/TinyVue/TinyGridColumn.json @@ -0,0 +1,50 @@ +{ + "version": "3.20.0", + "icon": "grid", + "name": { + "zh_CN": "表格行" + }, + "component": "TinyGridColumn", + "description": "提供了非常强大数据表格功能，可以展示数据列表，可以对数据列表进行选择、编辑等", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "TinyGridColumn", + "destructuring": true + }, + "group": "component", + "priority": 2, + "schema": { + "properties": [], + "events": {}, + "shortcuts": {}, + "contentMenu": { + "actions": ["create symbol"] + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": {}, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + } +} diff --git a/packages/materials/src/TinyVue/TinyInput.json b/packages/materials/src/TinyVue/TinyInput.json index 35bb278af7..14da12fa69 100644 --- a/packages/materials/src/TinyVue/TinyInput.json +++ b/packages/materials/src/TinyVue/TinyInput.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "输入框" }, @@ -422,8 +423,8 @@ "placeholder": "请输入", "modelValue": "" } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyLayout.json b/packages/materials/src/TinyVue/TinyLayout.json index 33801dfad2..5fbd428a5a 100644 --- a/packages/materials/src/TinyVue/TinyLayout.json +++ b/packages/materials/src/TinyVue/TinyLayout.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "row", "name": { "zh_CN": "row" @@ -13,6 +14,7 @@ "npm": { "package": "@opentiny/vue", "exportName": "Layout", + "version": "3.20.0", "destructuring": true }, "group": "component", @@ -178,8 +180,8 @@ ] } ] - } + }, + "category": "layout" } - ], - "category": "layout" + ] } diff --git a/packages/materials/src/TinyVue/TinyNumeric.json b/packages/materials/src/TinyVue/TinyNumeric.json index 7032dbc9af..5708147cd0 100644 --- a/packages/materials/src/TinyVue/TinyNumeric.json +++ b/packages/materials/src/TinyVue/TinyNumeric.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "数字输入框" }, @@ -168,7 +169,7 @@ "zh_CN": "加减按钮位置" } }, - "required": true, + "required": false, "readOnly": false, "disabled": false, "cols": 12, @@ -450,11 +451,11 @@ "props": { "allow-empty": true, "placeholder": "请输入", - "controlsPosition": "right", + "controls-position": "right", "step": 1 } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyPager.json b/packages/materials/src/TinyVue/TinyPager.json index c8732fdc82..a12977cea0 100644 --- a/packages/materials/src/TinyVue/TinyPager.json +++ b/packages/materials/src/TinyVue/TinyPager.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "分页" }, @@ -243,8 +244,8 @@ "pageSize": 10, "currentPage": 1 } - } + }, + "category": "table" } - ], - "category": "table" + ] } diff --git a/packages/materials/src/TinyVue/TinyPopeditor.json b/packages/materials/src/TinyVue/TinyPopeditor.json index bcf0230fa0..235218fc1f 100644 --- a/packages/materials/src/TinyVue/TinyPopeditor.json +++ b/packages/materials/src/TinyVue/TinyPopeditor.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "name": { "zh_CN": "弹出编辑" }, @@ -106,6 +107,27 @@ "zh_CN": "是否禁用" }, "labelPosition": "left" + }, + { + "property": "auto-lookup", + "label": { + "text": { + "zh_CN": "自动请求数据" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "cols": 12, + "defaultValue": true, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "初始化时是否自动请求数据,默认 true" + }, + "labelPosition": "left" } ] }, @@ -370,7 +392,7 @@ "props": { "modelValue": "", "placeholder": "请选择", - "gridOp": { + "grid-op": { "columns": [ { "field": "id", @@ -433,8 +455,8 @@ ] } } - } + }, + "category": "data-display" } - ], - "category": "data-display" + ] } diff --git a/packages/materials/src/TinyVue/TinyPopover.json b/packages/materials/src/TinyVue/TinyPopover.json index 517490d18e..b32b968e23 100644 --- a/packages/materials/src/TinyVue/TinyPopover.json +++ b/packages/materials/src/TinyVue/TinyPopover.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "popover", "name": { "zh_CN": "提示框" @@ -535,8 +536,8 @@ ] } ] - } + }, + "category": "data-display" } - ], - "category": "data-display" + ] } diff --git a/packages/materials/src/TinyVue/TinyRadio.json b/packages/materials/src/TinyVue/TinyRadio.json index 15208e47ac..a95360fd5b 100644 --- a/packages/materials/src/TinyVue/TinyRadio.json +++ b/packages/materials/src/TinyVue/TinyRadio.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "radio", "name": { "zh_CN": "单选" @@ -245,8 +246,8 @@ "label": "1", "text": "单选文本" } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyRow.json b/packages/materials/src/TinyVue/TinyRow.json index a27feec072..8cf814e58b 100644 --- a/packages/materials/src/TinyVue/TinyRow.json +++ b/packages/materials/src/TinyVue/TinyRow.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "row", "name": { "zh_CN": "row" diff --git a/packages/materials/src/TinyVue/TinySearch.json b/packages/materials/src/TinyVue/TinySearch.json index f22de1b153..3f1366cccb 100644 --- a/packages/materials/src/TinyVue/TinySearch.json +++ b/packages/materials/src/TinyVue/TinySearch.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "search", "name": { "zh_CN": "搜索框" @@ -283,8 +284,8 @@ "modelValue": "", "placeholder": "输入关键词" } - } + }, + "category": "basic" } - ], - "category": "basic" + ] } diff --git a/packages/materials/src/TinyVue/TinySelect.json b/packages/materials/src/TinyVue/TinySelect.json index 865c442110..358a7b67e2 100644 --- a/packages/materials/src/TinyVue/TinySelect.json +++ b/packages/materials/src/TinyVue/TinySelect.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "select", "name": { "zh_CN": "下拉框" @@ -423,8 +424,8 @@ } ] } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinySwitch.json b/packages/materials/src/TinyVue/TinySwitch.json index adf7534160..376ddeba9a 100644 --- a/packages/materials/src/TinyVue/TinySwitch.json +++ b/packages/materials/src/TinyVue/TinySwitch.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "switch", "name": { "zh_CN": "开关" @@ -206,8 +207,8 @@ "props": { "modelValue": "" } - } + }, + "category": "form" } - ], - "category": "form" + ] } diff --git a/packages/materials/src/TinyVue/TinyTabItem.json b/packages/materials/src/TinyVue/TinyTabItem.json index 785020b4ea..a90d58fe67 100644 --- a/packages/materials/src/TinyVue/TinyTabItem.json +++ b/packages/materials/src/TinyVue/TinyTabItem.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "tabitem", "name": { "zh_CN": "tab页签" diff --git a/packages/materials/src/TinyVue/TinyTabs.json b/packages/materials/src/TinyVue/TinyTabs.json index 15fffc8c21..d149803b1f 100644 --- a/packages/materials/src/TinyVue/TinyTabs.json +++ b/packages/materials/src/TinyVue/TinyTabs.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "tabs", "name": { "zh_CN": "标签页" @@ -27,26 +28,6 @@ "zh_CN": "基础信息" }, "content": [ - { - "property": "showEditIcon", - "label": { - "text": { - "zh_CN": "显示编辑图标" - } - }, - "required": true, - "readOnly": false, - "disabled": false, - "cols": 12, - "widget": { - "component": "CheckBoxConfigurator", - "props": {} - }, - "description": { - "zh_CN": "是否显示标题后编辑 ICON" - }, - "labelPosition": "left" - }, { "property": "tabs", "label": { @@ -321,8 +302,8 @@ ] } ] - } + }, + "category": "navigation" } - ], - "category": "navigation" + ] } diff --git a/packages/materials/src/TinyVue/TinyTimeLine.json b/packages/materials/src/TinyVue/TinyTimeLine.json index f32fba89a6..e418ccfd7f 100644 --- a/packages/materials/src/TinyVue/TinyTimeLine.json +++ b/packages/materials/src/TinyVue/TinyTimeLine.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "timeline", "name": { "zh_CN": "时间线" @@ -27,35 +28,6 @@ "zh_CN": "基础信息" }, "content": [ - { - "property": "horizontal", - "type": "Boolean", - "defaultValue": { - "type": "i18n", - "zh_CN": "布局", - "en_US": "layout", - "key": "" - }, - "label": { - "text": { - "zh_CN": "水平布局" - } - }, - "cols": 12, - "rules": [], - "hidden": false, - "required": true, - "readOnly": false, - "disabled": false, - "widget": { - "component": "CheckBoxConfigurator", - "props": {} - }, - "description": { - "zh_CN": "节点和文字横向布局" - }, - "labelPosition": "left" - }, { "property": "vertical", "type": "Boolean", @@ -225,8 +197,8 @@ } ] } - } + }, + "category": "navigation" } - ], - "category": "navigation" + ] } diff --git a/packages/materials/src/TinyVue/TinyTooltip.json b/packages/materials/src/TinyVue/TinyTooltip.json index 963711f436..0fd899c928 100644 --- a/packages/materials/src/TinyVue/TinyTooltip.json +++ b/packages/materials/src/TinyVue/TinyTooltip.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "tooltip", "name": { "zh_CN": "文字提示框" @@ -261,8 +262,8 @@ ] } ] - } + }, + "category": "data-display" } - ], - "category": "data-display" + ] } diff --git a/packages/materials/src/TinyVue/TinyTransfer.json b/packages/materials/src/TinyVue/TinyTransfer.json new file mode 100644 index 0000000000..26db591c2d --- /dev/null +++ b/packages/materials/src/TinyVue/TinyTransfer.json @@ -0,0 +1,305 @@ +{ + "version": "3.20.0", + "name": { + "zh_CN": "穿梭框" + }, + "component": "TinyTransfer", + "icon": "transfer", + "description": "穿梭框，实现左右表格数据的双向交换的组件", + "docUrl": "", + "screenshot": "", + "tags": "", + "keywords": "", + "devMode": "proCode", + "npm": { + "package": "@opentiny/vue", + "exportName": "TinyTransfer", + "destructuring": true + }, + "group": "component", + "priority": 1, + "schema": { + "properties": [ + { + "label": { + "zh_CN": "基础信息" + }, + "description": { + "zh_CN": "基础信息" + }, + "content": [ + { + "property": "modelValue", + "label": { + "text": { + "zh_CN": "绑定值" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "I18nConfigurator", + "props": {} + }, + "description": { + "zh_CN": "双向绑定值" + }, + "labelPosition": "left" + }, + { + "property": "data", + "label": { + "text": { + "zh_CN": "左右列表的全量数据源" + } + }, + "required": true, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "左右列表的全量数据源" + }, + "labelPosition": "left" + }, + { + "property": "filterable", + "label": { + "text": { + "zh_CN": "是否启用搜索的功能" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否启用搜索的功能" + }, + "labelPosition": "left" + }, + { + "property": "showAllBtn", + "label": { + "text": { + "zh_CN": "是否显示全部移动按钮" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "是否显示全部移动按钮" + }, + "labelPosition": "left" + }, + { + "property": "toLeftDisable", + "label": { + "text": { + "zh_CN": "组件初始化状态下未选中时，默认按钮显示禁用状态" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "组件初始化状态下未选中时，默认按钮显示禁用状态" + }, + "labelPosition": "left" + }, + { + "property": "toRightDisable", + "label": { + "text": { + "zh_CN": "组件初始化状态下未选中时，默认按钮显示禁用状态" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CheckBoxConfigurator", + "props": {} + }, + "description": { + "zh_CN": "组件初始化状态下未选中时，默认按钮显示禁用状态" + }, + "labelPosition": "left" + }, + { + "property": "titles", + "label": { + "text": { + "zh_CN": "自定义列表的标题" + } + }, + "required": false, + "readOnly": false, + "disabled": false, + "widget": { + "component": "CodeConfigurator", + "props": { + "language": "json" + } + }, + "description": { + "zh_CN": "自定义列表的标题；不设置titles时，左右列表的标题默认显示为： 列表 1， 列表 2" + }, + "labelPosition": "left" + } + ] + } + ], + "events": { + "onChange": { + "label": { + "zh_CN": "右侧列表元素变化时触发" + }, + "description": { + "zh_CN": "右侧列表元素变化时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "右侧列表元素变化时触发" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onLeftCheckChange": { + "label": { + "zh_CN": "左侧列表元素被用户选中 / 取消选中时触发;" + }, + "description": { + "zh_CN": "左侧列表元素被用户选中 / 取消选中时触发;" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "左侧列表元素被用户选中 / 取消选中时触发;" + } + } + ], + "returns": {} + }, + "defaultValue": "" + }, + "onRightCheckChange": { + "label": { + "zh_CN": "右侧列表元素被用户选中 / 取消选中时触发" + }, + "description": { + "zh_CN": "右侧列表元素被用户选中 / 取消选中时触发" + }, + "type": "event", + "functionInfo": { + "params": [ + { + "name": "value", + "type": "string", + "defaultValue": "", + "description": { + "zh_CN": "右侧列表元素被用户选中 / 取消选中时触发" + } + } + ], + "returns": {} + }, + "defaultValue": "" + } + } + }, + "configure": { + "loop": true, + "condition": true, + "styles": true, + "isContainer": false, + "isModal": false, + "nestingRule": { + "childWhitelist": "", + "parentWhitelist": "", + "descendantBlacklist": "", + "ancestorWhitelist": "" + }, + "isNullNode": false, + "isLayout": false, + "rootSelector": "", + "shortcuts": { + "properties": ["value", "disabled"] + }, + "contextMenu": { + "actions": ["create symbol"], + "disable": ["copy", "remove"] + } + }, + "snippets": [ + { + "name": { + "zh_CN": "穿梭框" + }, + "icon": "transfer", + "screenshot": "", + "snippetName": "TinyTransfer", + "schema": { + "componentName": "TinyTransfer", + "props": { + "modelValue": [3], + "data": [ + { + "key": 1, + "label": "备选项1", + "disabled": false + }, + { + "key": 2, + "label": "备选项2", + "disabled": false + }, + { + "key": 3, + "label": "备选项3", + "disabled": false + }, + { + "key": 4, + "label": "备选项4", + "disabled": false + } + ] + } + }, + "category": "form" + } + ] +} diff --git a/packages/materials/src/TinyVue/TinyTree.json b/packages/materials/src/TinyVue/TinyTree.json index b49bdc50e1..032439b4e8 100644 --- a/packages/materials/src/TinyVue/TinyTree.json +++ b/packages/materials/src/TinyVue/TinyTree.json @@ -1,4 +1,5 @@ { + "version": "3.20.0", "icon": "tree", "name": { "zh_CN": "树" @@ -377,8 +378,8 @@ } ] } - } + }, + "category": "data-display" } - ], - "category": "data-display" + ] } diff --git a/packages/materials/src/html/A.json b/packages/materials/src/html/A.json index 303bb53aeb..63faf986c5 100644 --- a/packages/materials/src/html/A.json +++ b/packages/materials/src/html/A.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "link", "name": { "zh_CN": "提示框" @@ -152,8 +153,8 @@ "schema": { "componentName": "a", "children": "链接" - } + }, + "category": "basic" } - ], - "category": "basic" + ] } diff --git a/packages/materials/src/html/Button.json b/packages/materials/src/html/Button.json index 0d760cac18..ded79cc351 100644 --- a/packages/materials/src/html/Button.json +++ b/packages/materials/src/html/Button.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "button", "name": { "zh_CN": "Button" diff --git a/packages/materials/src/html/Form.json b/packages/materials/src/html/Form.json index fd69ce13e6..c204f4dd3c 100644 --- a/packages/materials/src/html/Form.json +++ b/packages/materials/src/html/Form.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "form", "name": { "zh_CN": "表单" diff --git a/packages/materials/src/html/H1.json b/packages/materials/src/html/H1.json index 9772ccaf02..b140ed9e5f 100644 --- a/packages/materials/src/html/H1.json +++ b/packages/materials/src/html/H1.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "name": { "zh_CN": "标题" }, @@ -12,7 +13,7 @@ "devMode": "proCode", "npm": {}, "group": "component", - "category": "basic", + "category": "html", "priority": 20, "schema": { "properties": [ @@ -106,7 +107,8 @@ "componentName": "h1", "props": {}, "children": "Heading" - } + }, + "category": "basic" } ] } diff --git a/packages/materials/src/html/Img.json b/packages/materials/src/html/Img.json index b5651a46ed..c7236dcce9 100644 --- a/packages/materials/src/html/Img.json +++ b/packages/materials/src/html/Img.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "Image", "name": { "zh_CN": "Img" diff --git a/packages/materials/src/html/Input.json b/packages/materials/src/html/Input.json index a59aa083fc..5f0e2e7275 100644 --- a/packages/materials/src/html/Input.json +++ b/packages/materials/src/html/Input.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "name": { "zh_CN": "输入框" }, diff --git a/packages/materials/src/html/Label.json b/packages/materials/src/html/Label.json index f2f9184ed1..101a1f6eab 100644 --- a/packages/materials/src/html/Label.json +++ b/packages/materials/src/html/Label.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "label", "name": { "zh_CN": "表单标签" diff --git a/packages/materials/src/html/P.json b/packages/materials/src/html/P.json index 8f3fce3bb5..dcc5b92690 100644 --- a/packages/materials/src/html/P.json +++ b/packages/materials/src/html/P.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "name": { "zh_CN": "段落" }, @@ -12,7 +13,7 @@ "devMode": "proCode", "npm": {}, "group": "component", - "category": "basic", + "category": "html", "priority": 30, "schema": { "properties": [ @@ -103,7 +104,8 @@ "schema": { "componentName": "p", "children": "TinyEngine 前端可视化设计器致力于通过友好的用户交互提升业务应用的开发效率。" - } + }, + "category": "basic" } ] } diff --git a/packages/materials/src/html/Table.json b/packages/materials/src/html/Table.json index 728d176646..61545ecf9e 100644 --- a/packages/materials/src/html/Table.json +++ b/packages/materials/src/html/Table.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "table", "name": { "zh_CN": "表格" diff --git a/packages/materials/src/html/Td.json b/packages/materials/src/html/Td.json index c352657ff8..b0722e568a 100644 --- a/packages/materials/src/html/Td.json +++ b/packages/materials/src/html/Td.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "icon": "td", "name": { "zh_CN": "表格单元格" diff --git a/packages/materials/src/html/Video.json b/packages/materials/src/html/Video.json index 689004bda5..d01661d4e4 100644 --- a/packages/materials/src/html/Video.json +++ b/packages/materials/src/html/Video.json @@ -1,4 +1,5 @@ { + "version": "1.0.0", "name": { "zh_CN": "视频" }, @@ -12,7 +13,7 @@ "devMode": "proCode", "npm": {}, "group": "component", - "category": "basic", + "category": "html", "priority": 50, "schema": { "properties": [ @@ -180,12 +181,13 @@ "schema": { "componentName": "video", "props": { - "src": "img/webNova.jpg", + "src": "https://tinyengine-assets.obs.myhuaweicloud.com/files/in-action.mp4#t=1.5", "width": "200", "height": "100", "style": "border:1px solid #ccc" } - } + }, + "category": "basic" } ] } From 74a7abdf1010a537187fd4e19571065a5db5ebb2 Mon Sep 17 00:00:00 2001 From: chilingling Date: Tue, 28 Oct 2025 20:41:42 +0800 Subject: [PATCH 11/11] fix: snippetItem.children may be undefined --- packages/materials/buildMaterials.mjs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/materials/buildMaterials.mjs b/packages/materials/buildMaterials.mjs index 2704d1b80d..19093290d1 100644 --- a/packages/materials/buildMaterials.mjs +++ b/packages/materials/buildMaterials.mjs @@ -181,7 +181,7 @@ const buildComponents = async (config = {}) => { snippet.children = [] } - snippet.children.push(...snippetItem.children) + snippet.children.push(...(snippetItem.children || [])) } else { allBundles.snippets.push(snippetItem) }